1、append(content|fn)
向每個匹配的元素內部追加內容。
這個操作與對指定的元素執行appendChild方法,將它們新增到文件中的情況類似。
比如
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<ul>
<li>111111</li>
<li>222222</li>
<li>333333</li>
<li>444444</li>
</ul>
</body>
<script type="text/javascript" src="jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$('li').append('<p name="p2">p2</p>')
</script>
</html>複製程式碼
結果是這個樣子的
2、appendTo(content)
把所有匹配的元素追加到另一個指定的元素元素集合中。
實際上,使用這個方法是顛倒了常規的$(A).append(B)的操作,即不是把B追加到A中,而是把A追加到B中。
比如
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<ul>
<li>111111</li>
<li>222222</li>
<li>333333</li>
<li>444444</li>
</ul>
</body>
<script type="text/javascript" src="jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$('<p>哈哈</p>').appendTo('li')
</script>
</html>複製程式碼
結果是這個樣子的
append與appendTo的區別:
①append()前面是要選擇的物件,後面是要在物件內插入的元素內容 即$(A).append(B), 把B追加到A中appendTo()前面
②appendTo()後面是要選擇的物件,前面是要在物件內插入的元素內容即$(A).appendTo(B),把A追加到B中