添加
- append() - 在被選元素的結尾插入內容
- prepend() - 在被選元素的開頭插入內容
- after() - 在被選元素之后插入內容
- before() - 在被選元素之前插入內容
刪除
- remove() - 刪除被選元素（及其子元素）
- empty() - 從被選元素中刪除子元素
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jQuery添加/刪除元素</title>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
<p>操作我</p>
<button type="button" id="button1">1、追加</button>
<button type="button" id="button2">2、從頭追加</button>
<button type="button" id="button3">3膜赃、后面追加</button>
<div id="div1">
<button type="button" id="button4">4叹坦、刪除p標簽</button>
<button type="button" id="button5">5稽穆、刪除button標簽</button>
</div>
<script>
$("#button1").click(function() {
var txt1 = "+追加的文本-1";
var txt2 = "<p>+追加的文本-2</p>";
var txt3 = $("<p></p>").text("+追加的文本-3");
var txt4 = document.createElement("p").innerHTML = "+追加的文本-4";
$("p").append(txt1, txt2, txt3, txt4);
})
$("#button2").click(function() {
// 001
$("p").prepend("我才是開始+");
// 002
$("p").before("又添加了開始+");
})
$("#button3").click(function() {
$("p").after("+追尾");
})
$("#button4").click(function() {
$("p").remove();
})
$("#button5").click(function() {
// 001
// $("button").remove();
// 002
$("button").remove("#button2");
})
</script>
</body>
</html>
