jQuery-添加元素
四个添加新内容的jQuery方法：
1.append()
2.prepend()
3.after()
4.before()
实例1：
<script>
$(document).ready(function(){
$("#btn1").click(function(){
$("p").append(" <b>追加文本</b>。");
});
$("#btn2").click(function(){
$("ol").append("<li>追加列表项</li>");
});
});
</script>
<body>
<p>这是一个段落</p>
<p>这是另外一个段落</p>
<ol>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
</ol>
<button id="btn1">添加文本</button>
<button id="btn2">添加列表项</button>
</body>实例2：
<script>
function afterText(){
var txt1="<b>I<b>";
var txt2=$("<i><i>").text("love");
var txt3=document.createElement("big");
txt3.innerHTML="jQuery!";
$("img").after(txt1,txt2,txt3);
}
</script>
<body>
<img src="/images/log2.png">
<br><br>
<button οnclick="afterText()">之后插入</button>
</body>注意：append/prepend和after/before有什么区别！
实例：
append:
<p>
<span class="s1">s1</span>
</p>
<script>
$("p").append('<span class="s2">s2</span>');
</script>结果是这样的：
<p>
<span class="s1">s1</span>
<span class="s2">s2</span>
</p>after:
<p>
<span class="s1">s1</span>
</p>
<script>
$("p").after('<span class="s2">s2</span>');
</script>
结果是这样的：
<p>
<span class="s1">s1</span>
</p>
<span class="s2">s2</span>总结：
append/prepend 是在选择元素内部嵌入。
after/before 是在元素外面追加。
6410
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
