网络编程
位置：首页>> 网络编程>> JavaScript>> jQuery模板提案（6）

jQuery模板提案（6）

作者：dishuipiaoxiang　来源：Denis'Blog　发布时间：2010-03-30 18:27:00　

标签：jquery,模板,Javascript,对象

jQuery DOM操作

jQuery DOM操作方法支持声明一个模板。例如，你可以使用jQuery.fn.append方法：

jQuery("selector")
   .append("#template", arrayOrObject, options);

参数

参数类型描述
selector字符串代表模板选择符的一个字符串
data任何数据对象任何数据对象 如果是数组，为每一项实例化化一次。否则，该模板仅实例化一次
options对象对象的字面意义代表可选设置。你可以设置一个渲染和渲染的事件处理程序。你可以传递任何值，这些值将被传入到模板中

示例

下面的代码使用append()方法而不是render()方法在一个无需列表中显示系列产品的name和price。

<script type="text/javascript">
jQuery(function(){
  var products = [
        { name: "Product 1", price: 12.99},
        { name: "Product 2", price: 9.99},
        { name: "Product 3", price: 35.59}
  ];
  $("ul").append("#template", products);
});
</script>
<script id="template" type="text/html">
 <li>{％= name ％} - {％= price ％}</li>
</script>
<ul></ul>

 

jQuery.templates

你可以指定一个或多个编译的模板给Query.templates对象设置。当你想给模板一个语义化的名字以便在一个文档中很方便的多次使用同一模板时，这很有用。

用jQuery.tmpl()函数编译一个模板

示例

<script type="text/javascript">
    // Assign compiled template
    jQuery.templates.foo = jQuery.tmpl("<li>{％=name％}</li>");
    // use name foo as template in append() method:
    jQuery("#container").append("foo", products);
</script>

第一页 上一页 4 5
6
7 8 下一页
0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com