JQuery 添加元素

append():增加元素內部後面文字
prepend():增加元素內部前面文字
after():增加元素外部後面文字
before():增加元素外部前面文字

程式碼

html

<p>
	<span class="txt1">測試文字1</span>
</p>
<button id="inside_text1">append</button>
<button id="inside_text2">prepend</button>
<button id="outside_text1">after</button>
<button id="outside_text2">before</button>

js

$(function () {
	$("#inside_text1").click(function () {
		$("p").append('<span class="txt2">測試後面文字2</span>');
	});

	$("#inside_text2").click(function () {
		$("p").prepend('<span class="txt2">測試前面文字2</span>');
	});

	$("#outside_text1").click(function () {
		$("p").after('<span class="txt2">測試後面文字2</span>');
	});

	$("#outside_text2").click(function () {
		$("p").before('<span class="txt2">測試前面文字2</span>');
	});
})

結果

append()

prepend()

after()

before()

所有

tags: JQuery

相關連結

jQuery的添加元素- append() / prepend() / after() / before() 

留言