是否有任何替代jQuery .after（）函數

我想將我的jQuery腳本轉換爲javascript。我有一個問題有..是否有任何替代jQuery .after（）函數

我有一個創建一個節點

var new_node = document.createElement("div"); 
     new_node.className="tooltip"; 
     new_node.innerHTML = html; 
     alert(new_node.className);

腳本時，我這樣做

jQuery(link).after(new_node);

它工作正常。但我想要這樣做的方式。我試過使用appendChild函數，但它給出了一些奇怪的結果。

請幫我解決這個問題。

來源

2011-03-14 usmanali

定義'奇怪的結果'。 – 2011-03-14 11:48:18

1）我們可以看到更多的代碼嗎？生成的HTML？現有的HTML？等等。2）你爲什麼從jQuery切換到JS？ 3）請努力提高您的接受率。畢竟，這是一個社區網站。 – Dutchie432 2011-03-14 11:49:07

爲了記錄，jQuery代碼**是** JavaScript代碼。我認爲你的意思是你想擺脫圖書館的使用。 – Pointy 2011-03-14 11:49:30

您正在比較jQuery的after和appendChild，但他們做了非常不同的事情。 after把放在後面的參考元素上，appendChild把它放在裏面吧。

您可能需要insertBefore（參考節點爲link的nextSibling）。

所以：

var link = /* ... get the `a` element from somewhere ... */; 
var new_node = document.createElement("div"); 
new_node.className="tooltip"; 
new_node.innerHTML = html; 
link.parentNode.insertBefore(new_node, link.nextSibling);

如果link是在其父的最後一件事，那很好; link.nextSibling將爲null和insertBefore接受null作爲參考節點（它表示「在末尾插入」）。

來源

2011-03-14 11:51:26

這是一個[現場示例]（http：// jsbin。com/uharu4） – 2011-03-14 12:06:38

謝謝Crowder，幫助了很多 – usmanali 2011-03-14 12:11:29

jQuery(link).append(new_node);

來源

2011-03-14 11:49:56 mdm

我想OP希望避免使用任何jQuery代碼。 – Pointy 2011-03-14 11:50:33

這就是你如何通過jQuery將節點追加到節點引用。要在'純'JS中完成它，需要獲得對需要附加到的DOMElement的引用。 – mdm 2011-03-14 11:52:34

假設你已經有了一個節點實例化爲link，你可以做你想做的事，普通的JavaScript是這樣的：

link.parentNode.appendChild(new_node);

的link節點將必須在其容器中的最後一個節點。否則，您必須找到link的下一個同級並使用insertBefore將new_node置於適當的位置。

來源

2011-03-14 11:51:09 Robusto

這將工作如果「鏈接」已經是其父容器中的最後一件事，但如果它是第一件事...... – Pointy 2011-03-14 11:53:08

那麼，這肯定會在'link'之後。可能是之後的一大堆**，當然不等同於jQuery的「after」之後。 – 2011-03-14 11:53:41

@Pointy，T.J .:我注意到這個問題可能與您在編輯和修復時同時進行。感謝您指出它。 – Robusto 2011-03-14 11:54:45

是否有任何替代jQuery .after（）函數

回答

相關問題