2012-02-29 99 views
2

我試圖找出結合下面的語句如何在短短的一條線這兩個JavaScript線結合

document.getElementById('div1').appendChild(document.createElement('div')).id="div2"; 
document.getElementById('div2').appendChild(document.createTextNode('More about me')); 
+4

你爲什麼要合併它們? – 2012-02-29 06:04:54

+0

IDK只是好奇心,因爲我正在學習語言,在書中我讀了作者這樣做了4個步驟,我只想知道是否有方法將它們合併成一行。對不起,我的英語): – Alejandro 2012-02-29 06:07:59

+0

這是一個很好的問題,因爲它可以讓你學習推薦的方法。現在的標準大部分都是正確的。 – Purag 2012-02-29 06:21:29

回答

2

appendChild()返回到剛纔添加的節點的引用的一種方式,所以第二getElementById不必要:

document.getElementById('div1').appendChild(document.createElement('div')) 
.appendChild(document.createTextNode('More about me')) 
.parentNode.id="div2"; // only if you need the second div to have id="div2" for some other reason. 
0

聲明:這根本不是一件好事,我會在一瞬間解釋爲什麼。

document.getElementById("div1").innerHTML = document.getElementById("div1").innerHTML + "<div id='div2'>More about me</div>"; 

這樣做是確保新div得到附加而不是簡單地替換現有div的內容。

現在顯然,這是非常醜陋的代碼。

這是不好的原因是因爲我們正在做的是插入我們似乎認爲或被認爲是實際的元素。這是錯誤的—我們插入一個字符串,稍後將其翻譯爲元素。這對我們來說純粹是不方便的。

DOM腳本的使用(這是你在—之前實際創建一個元素並添加它)之前創建的元素作爲實際的HTML對象。重點是它只是更多純粹輸入(並且在大多數情況下,執行比innerHTML更快)。

使用innerHTML現在變得越來越普遍,我喜歡讓自己懷疑,僅僅因爲我是一個Javascript書呆子,並且從我所瞭解的(在本網站上,實際上),DOM腳本是許多方面都好得多。

其次,DOM腳本可以比innerHTML更加整潔和易於維護。你可能會知道我上面給出的代碼根本不方便。 ;)