首页 > 代码库 > jQuery创建DOM的方法
jQuery创建DOM的方法
jQuery1.4带来了一个全新的便捷地清晰的DOM对象创建方法，在 jQuery 1.4中，我们可以传递一个对象作为第二个参数。 这个参数接受一个属性的集合，这些可以传递给.attr() 方法。此外，一些event type（事件类型）能通过， 而且后面的jQuery方法能够调用： val, css, html, text, data, width, height, or offset。
?1. [代码][JavaScript]代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>jQuery创建dom的几种方法</title>
<script src="http://www.173it.cn/css/jquery.js" kesrc="http://www.173it.cn/css/jquery.js"></script>
<style type="text/css">
.red{ color:#FF3300}
.bg-yellow{ background-color:#FFEE00; color:#00FFEE}
</style>
</head>
<body>
<div id="target"></div>
<script type="text/javascript">
$(function(){
var oNewp = $("<p>我测试成功了</P>");
oNewp.addClass("red").appendTo("#target");
});
$(function(){
$("<div>")
.attr("id","css")
.height(90)
.css("border","1px solid #000")
.html("fuck world!")
.appendTo(document.body);
});
$(function(){
$("<input>",{
"class":"bg-yellow",
"id":"fuck",
css:{
"border":"1px solid #000",
"font-size":"25px"
},
value:"fuck world!",
focusin:function(){
$(this).css("border","5px solid #FF3300");
},
focusout:function(){
$(this).css("border","1px solid #000");
}http://www.bizhizu.cn/linglei/?
}).appendTo(document.body);
$("<div>",{另类图片
"class":"bg-yellow",
"id":"fuckie",
css:{
"border":"1px solid #CDCDCD",
"font-size":"25px"
},
html:$("<a>",{
href: ‘#‘,
html:"hello world!",
click: function(event) {
$("#fuckie").css("background-color","#FF3300");
alert("fuck world!!!!!!!!!!");
event.preventDefault();
}
})
}).appendTo(document.body);
});
</script>
</body>
</html>
jQuery创建DOM的方法