錨標簽未附加在段落標簽javascript中

Question

我正在使用以下代碼

for (var i = 0; i < results.length; i++) {

//console.log(results[i].vicinity);
para = document.createElement('p');
aTag = document.createElement('a');
aTag.setAttribute('href',"/restaurants");
aTag.innerHTML = results[i].name;
mypara = para.appendChild(aTag);
console.log(mypara);
nearby_places.appendChild(mypara); 

}

最后一行中的console.log(mypara)創建了anchor tag但是它沒有包裝在段落標記中，因為它應該根據代碼邏輯。 我在做什么錯

Answer 1

appendChild將子級返回的子項嘗試合並父節點para - console.log(para); 要查看追加的結果，最后一行將如下所示：

nearby_places.appendChild(para);

Answer 2

appendChild()方法直接修改para ，而不是保留原始值並返回修改后的值。 因此，您應該繼續對段落使用para變量，而不是mypara 。 您修改后的代碼為：

for (var i = 0; i < results.length; i++) {

//console.log(results[i].vicinity);
para = document.createElement('p');
aTag = document.createElement('a');
aTag.setAttribute('href',"/restaurants");
aTag.innerHTML = results[i].name;
para.appendChild(aTag);
nearby_places.appendChild(para); 

}

更多信息：根據MDN， appendChild()返回附加的節點。 這就是為什么console.log()調用僅顯示<a>標記的原因。 請參閱： https : //developer.mozilla.org/en-US/docs/Web/API/Node/appendChild 。

Answer 3

這是一個有效的樣本小提琴： https : //jsfiddle.net/fNPvf/22007/

para = document.createElement('p');
aTag = document.createElement('a');
aTag.setAttribute('href',"/restaurants");
aTag.innerHTML = "wendys";
para.appendChild(aTag);
document.body.appendChild(para);