本节书摘来自异步社区《jQuery、jQuery UI及jQuery Mobile技巧与示例》一书中的第3章，第3.9节，作者：【荷】Adriaan de Jonge , 【美】Phil Dutson著，更多章节内容可以访问云栖社区“异步社区”公众号查看
在前面的例子中，HTML几乎都是直接用文本字符串生成的。其实还可以使用jQuery来生成HTML。传入属性映射（property map）对象作为HTML元素的属性（attribute），在映射对象中可以嵌套HTML元素作为子元素。代码清单3-9演示了如何使用这种方式来生成HTML。
代码清单3-9 使用jQuery构建无序列表
00 <!DOCTYPE html> 01 02 <html lang="en"> 03 <head> 04 <title>Generate HTML using jQuery</title> 05 <style> 06 /* 请将下列代码移至一个外部的 07 .css文件 */ 08 .test { 09 background-color: yellow; 10 } 11 </style> 12 </head> 13 <body> 14 15 <p>Under this paragraph, you should see a yellow bulleted list</p> 16 17 <div id="append-to-placeholder"> 18 </div> 19 20 <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script> 21 22 <script> 23 // 请将下列代码移至一个外部的.js文件中 24 $(document).ready(function() { 25 26 var htmlGen = function() { 27 return '<li>1</li><li>2</li>'; 28 } 29 30 $('<p/>', { 31 class: 'test', 32 html: $('<ul/>', {html: htmlGen}) 33 }).appendTo('#append-to-placeholder'); 34 35 }); 36 </script> 37 </body> 38 </html>在这个例子中，第26～28行是“生成”HTML的函数。第32行引用了这个函数，它是会自动执行的。第30～32行的这种嵌套方式能够以一种更加动态的方法构建HTML元素。第31行的class的值可以是变量，可以按条件替换。
相关资源：敏捷开发V1.0.pptx