jQuery 文档操作 - appendTo() 方法

来源：互联网发布：申请淘宝达人后怎么做编辑：程序博客网时间：2024/06/06 04:47

1、语法

语法

$(content).appendTo(selector)

参数描述content必需。规定要插入的内容（可包含 HTML 标签）。selector必需。规定把内容追加到哪个元素上。

先看一个例子：

<html><head><script type="text/javascript" src="/jquery/jquery.js"></script><script type="text/javascript">$(document).ready(function(){   $('<p/>', {    'class': 'myclass',    'id': 'myid',    html: 'appendTo例子'  }).appendTo('h1');});</script></head><body></body></html>

该代码运行的结果是：

查看页面元素：

通过上面的截图，我们发现<p class="myclass" id="myid">appendTo例子</p>被加到<h1></h1>元素中了，appendTo() 方法在被选元素的结尾（仍然在内部）插入指定内容。

2、代码解释

如下代码解释：

  $('<p/>', {    'class': 'myclass',    'id': 'myid',    html: 'appendTo例子'  })

构建一个p元素，并增加class、id属性，以及元素之间的内容。

3、append() 和 appendTo()区别

append() 方法在被选元素的结尾（仍然在内部）插入指定内容。

语法

$(selector).append(content)

参数描述content必需。规定要插入的内容（可包含 HTML 标签）。

使用函数来附加内容

使用函数在指定元素的结尾插入内容。

语法

$(selector).append(function(index,html))

亲自试一试

参数描述function(index,html)

必需。规定返回待插入内容的函数。

index - 可选。接收选择器的 index 位置。
html - 可选。接收选择器的当前 HTML。

append() 和 appendTo() 方法执行的任务相同。不同之处在于：内容和选择器的位置，以及 append() 能够使用函数来附加内容。

0 0