[TOC]
## 1.添加內容
### 1-1append 從后添加 //prepend 從前添加
```
<p>你好</p>
<button type="button" id="btn1">后添加</button>
<button type="button" id="btn2">前添加</button>
<script>
$(document).ready(function(){
$("#btn1").click(function(){
$("p").append("---我是從后添加的內容")
//$("p").after("---我是從后添加的內容")
})
$("#btn2").click(function(){
$("p").prepend("我是從前添加的內容---")
//$("p").before("我是從前添加的內容---")
})
})
</script>
```
### 1-2 after和before添加內容
## 2.添加元素 三種方法
> var text1 = "標簽內容"
> var text2 = $("標簽").text("內容");
var text3 = document.createElement("p"); text3.innerHTML = "內容";
```
<p>你好</p>
<button id="btn">添加元素</button>
<script>
$(document).ready(function () {
$("#btn").click(function () {
var text1 = "<p>直接標簽內容一起添加</p>";
var text2 = $("<p></p>").text("標簽內容分開添加");
var text3 = document.createElement("p");
text3.innerHTML = "創建標簽,再innerHTML添加內容";
$("body").append(text1, text2, text3);
})
})
</script>
```
>
