的Javascript獲得當前格的內容，裏面添加父2周的div

好吧，我有一個頁面設置，看起來像這樣：的Javascript獲得當前格的內容，裏面添加父2周的div

<div class="parent">Content here</div>

我想抓住與類「父」每格，並使它看起來像這樣的：

<div class="parent"> 
<div class="child"></div> 
Content Here 
<div class="child"> 
</div>

我知道如何通過與一流的「父」每個格循環，除非我不知道如何加入「孩子」 DIV之前和之後的內容。幫幫我？

來源

2010-02-21 David

我發佈了一個很長的答案，但其中大部分是關於如何找到類「父」的每個div。讓我強調你說的*不知道的部分。使用'parent.appendChild（child）'添加到div的末尾，並在開始處插入'parent.insertBefore（child，parent.firstChild）'。（把'firstChild'替換爲'childNodes [1]'在第二個子節點之前插入，等等） – 2010-02-21 02:59:56

@Tim：你應該真的把它作爲一個答案，以便他可以接受它，如果他想的話:-) – prodigitalson 2010-02-21 15:39:01

在支持getElementsByClassName瀏覽器，你可以這樣做：

var parents = document.getElementsByClassName("parent"); 
for (i=0; i<parents.length; i++){ 
    var child = document.createElement("div"); 
    child.setAttribute("class","child"); 
    parents[i].insertBefore(child, parents[i].firstChild); 
    parents[i].appendChild(child); 
}

getElementsByClassName由Chrome瀏覽器，Firefox 3以上的支持，如以及Opera和Safari的最新版本。（見http://www.quirksmode.org/dom/w3c_core.html#fivemethods）。不幸的是，它目前不支持任何版本的Internet Explorer。

當然，你可以編寫你自己的版本getElementsByClassName在IE中工作。（基本上，只需要遍歷每個元素並將其添加到集合中（如果它的類屬性匹配指定的值）。或者可以讓其他人爲您編寫它，或者使用您在線查找的代碼或僅使用框架正如prodigitalson所暗示的那樣。

來源

2010-02-21 02:37:50

如果你可以使用jQuery變得非常簡單：

$('.parent').prepend('<div class="child"></div>').append('<div class="child"></div>');

來源

2010-02-21 02:16:38 prodigitalson

的Javascript獲得當前格的內容，裏面添加父2周的div

回答

相關問題