0725-jQuery - 添加元素, 删除元素
添加新的 HTML 内容
- append() - 在被选元素的结尾插入内容
<script>
$(document).ready(function(){
$("#btn1").click(function(){
$("p").prepend("<b>Prepended text</b>. ");
});
$("#btn2").click(function(){
$("ol").prepend("<li>Prepended item</li>");
});
});
</script>
- prepend() - 在被选元素的开头插入内容
- <script>
function appendText()
{
var txt1="<p>Text.</p>"; // 以 HTML 创建新元素
var txt2=$("<p></p>").text("Text."); // 以 jQuery 创建新元素
var txt3=document.createElement("p");
txt3.innerHTML="Text."; // 通过 DOM 来创建文本
$("body").append(txt1,txt2,txt3); // 追加新元素
}
</script>
- after() - 在被选元素之后插入内容
- before() - 在被选元素之前插入内容
删除元素/内容:
- remove() - 删除被选元素(及其子元素)
- <script>
$(document).ready(function(){
$("button").click(function(){
$("#div1").remove();
});
});
</script>
- empty() - 从被选元素中删除子元素
- <script>
$(document).ready(function(){
$("button").click(function(){
$("#div1").remove();
});
});
</script>