javascript能不能增加標(biāo)簽

發(fā)布時(shí)間：2022-01-19 11:12:42 來(lái)源：億速云閱讀：148 作者：小新欄目：web開(kāi)發(fā)

這篇文章主要介紹javascript能不能增加標(biāo)簽，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！

javascript能增加標(biāo)簽，方法：1、使用“document.createElement("標(biāo)簽名")”語(yǔ)句創(chuàng)建新標(biāo)簽節(jié)點(diǎn)；2、使用insertBefore()或appendChild()函數(shù)在指定子元素節(jié)點(diǎn)前或后插入新標(biāo)簽節(jié)點(diǎn)。

本教程操作環(huán)境：windows7系統(tǒng)、javascript1.8.5版、Dell G3電腦。

節(jié)點(diǎn)的插入分兩種情況：在元素子節(jié)點(diǎn)列表的后面附加子節(jié)點(diǎn)和在元素某個(gè)子節(jié)點(diǎn)前面插入子節(jié)點(diǎn):

第一種情況調(diào)用：element.appendChild（子節(jié)點(diǎn)）；
第二種情況調(diào)用：element.insertBefore（新節(jié)點(diǎn)，現(xiàn)有節(jié)點(diǎn)）。

示例1：在元素子節(jié)點(diǎn)列表的后面附加子節(jié)點(diǎn)

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>

		<ul id="myList">
			<li>Coffee</li>
			<li>Tea</li>
		</ul>
		<p id="demo">單擊按鈕將項(xiàng)目添加到列表中</p>
		<button onclick="myFunction()">點(diǎn)我</button>
		<script>
			function myFunction() {
				var node = document.createElement("LI");
				var textnode = document.createTextNode("Water");
				node.appendChild(textnode);
				document.getElementById("myList").appendChild(node);
			}
		</script>
	</body>
</html>

javascript能不能增加標(biāo)簽

注意：

首先創(chuàng)建一個(gè)節(jié)點(diǎn)，
然后創(chuàng)建一個(gè)文本節(jié)點(diǎn)，
然后將文本節(jié)點(diǎn)添加到LI節(jié)點(diǎn)上。
最后將節(jié)點(diǎn)添加到列表中。

示例2：在元素某個(gè)子節(jié)點(diǎn)前面插入子節(jié)點(diǎn)

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>

		<ul id="myList">
			<li>Coffee</li>
			<li>Tea</li>
		</ul>
		<p id="demo">單擊按鈕插入一個(gè)項(xiàng)目列表</p>
		<button onclick="myFunction()">點(diǎn)我</button>
		<script>
			function myFunction() {
				var newItem = document.createElement("LI")
				var textnode = document.createTextNode("Water")
				newItem.appendChild(textnode)
				var list = document.getElementById("myList")
				list.insertBefore(newItem, list.childNodes[0]);
			}
		</script>
	</body>
</html>

javascript能不能增加標(biāo)簽

注意：

首先創(chuàng)建一個(gè)li節(jié)點(diǎn),
然后創(chuàng)建一個(gè)文本節(jié)點(diǎn),
然后添加文本節(jié)點(diǎn)的在li節(jié)點(diǎn)。
最后在第一個(gè)子節(jié)點(diǎn)列表插入li節(jié)點(diǎn)。

以上是“javascript能不能增加標(biāo)簽”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對(duì)大家有幫助，更多相關(guān)知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道！

向AI問(wèn)一下細(xì)節(jié)

javascript能不能增加標(biāo)簽

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽