jquery之生成新HTML($()的使用)

jquery之生成新HTML($()的使用)

----------

 

有时候，我们想生成新HTML片段插入到页面里。利用jquery，这就是小事一桩。$函数不仅能够选择现在页面元素，还能够生成HTML。思考：

$("<div>hello</div>")

这个表达式新建<div>元素以便添加到页面里。在现在元素的包装集上可执行的任何jquery命令，在新建的HTML片段上同样可以执行。

注意：如果想要创建空<div>元素，可走捷径：$("<div>") 等同于 $("<div></div>")和$("</div>")

看以下代码：

$("<div class='foo'>I have foo!</div><div>I don't</div>").filter(".foo").click( function(){alert("I'm foo!");} ).end().appendTo("#someParentDiv"); 

 

在这个片段中，首先创建了两个<div>元素，一个带有类foo而另一个没有。然后收窄选择范围，只选择带有类foo的<div>元素，并给它绑定事件处理程序。一旦点击，就会触发警告对话框。最后，使用end()函数还原到包含两个<div>元素的完整集合，并把这两个元素追加到id为someParentDiv的元素之后，从而把它们绑定到DOM树。