欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JS小技巧之通過字符串追加元素

 更新時間：2023年01月14日 17:14:11   作者：一只卑微的菜狗  
這篇文章主要介紹了JS小技巧之通過字符串追加元素方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教

JS通過字符串追加元素

原生JS中通過動態(tài)的創(chuàng)建createElement，但是元素里面內(nèi)容較多，需要innerHTML賦值，在appendChild追加到父元素里面。

如下代碼：

// 動態(tài)添加對象
// 1. 創(chuàng)建元素
var li = document.createElement('li');
// 2. 添加節(jié)點
li.innerHTML = text.value;
?
// 3.1 將一個節(jié)點添加到指定父節(jié)點的子節(jié)點列表末尾
ul.appendChild(li);
?
// 3.2 將一個節(jié)點添加到父節(jié)點的指定子節(jié)點前面
ul.insertBefore(li, ul.children[0]);

現(xiàn)在，高級的做法是利用insertAdjacentHTML()可以直接把字符串格式元素添加到父元素中。

// 這里的ul是父節(jié)點
var li = '<li class="liactive"><span>測試</span></li>';
ul.insertAdjacentHTML('beforeend', li);
?
// 第一個參數(shù)是插入的位置，該參數(shù)有以下四個值：
// beforebegin：插入到元素自身的前面
// afterbegin：插入元素內(nèi)部的第一個子節(jié)點之前
// beforeend：插入元素內(nèi)部的最后一個子節(jié)點之后
// afterend：插入到元素自身的后面

如appendChild的方法與insertAdjacentHTML()方法之間的區(qū)別在于：前者不支持追加字符串的子元素，后者支持

JS追加字符串的奇怪問題

遇到一個奇怪的問題，JS在向一個table追加一行信息的時候tr,td元素全部被過濾掉了

打印出來的原始字符串如下圖：

追加以后的結(jié)構(gòu)如下圖：

出現(xiàn)這個問題的主要原因就在于那個隱藏域上，也就是tr之后多了其它的元素就會出現(xiàn)這個問題，但至于為什么會這樣，可能是自己技術(shù)沒到家哈，理解的不夠，不知道怎么回事

解決很簡單

把隱藏域放到td里面去就沒有問題了，原理就不知道了，記一下，僅防以后再犯此類錯誤

總結(jié)

以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。

相關(guān)文章

最新評論