將span標記添加到Javascript中數組中的每個元素？

-2

假設我有一個數組。如何將span標籤中的每個元素包裝在數組中？另外，如果我想將.appendchild的每個span元素轉換爲div元素，我該怎麼做呢？將span標記添加到Javascript中數組中的每個元素？

function add_span(arr){ 
    var new_arr= document.createElement("span");// arr is passed in correctly 
    var text=document.createTextNode(arr); // text cannot be output 
    new_arr.appendChild(text); 
    return new_arr; 
}

，並在主：

for (i = 0; i < unique_array.length; i++) 
{ 
    span_array[i]=add_span(unique_array[i]); 
} 
var cloud_text=document.createTextNode(span_array); 
cloud.appendChild(cloud_text);

輸出現在看起來像這樣： [object HTMLSpanElement],[object HTMLSpanElement],[object HTMLSpanElement],[object HTMLSpanElement],[object HTMLSpanElement],[object HTMLSpanElement],[object HTMLSpanElement],[object HTMLSpanElement],[object HTMLSpanElement],[object HTMLSpanElement],[object HTMLSpanElement]

來源

2014-11-14 YING L

谷歌：DOM操作和追加股利。 – givanse 2014-11-14 17:52:36

這個問題似乎是無關緊要的，因爲它沒有顯示提問者爲了回答她/他自己的問題而付出的努力。 – Qberticus 2014-11-14 19:06:02

是不是您正在尋找的HTMLSpanElements數組？ – Xenyal 2014-11-17 05:30:48

-1

您可以通過所有的數組元素的要循環，並添加span標籤的開頭和像這樣結束：

var example = []; 

for(var i = 0; i < example.length; i++) { 
    example[i] = '<span>' + example[i] + '</span>'; 
}

這增加了html spa n標籤到你的文本，然後你的數組元素裏面。 i充當您正在使用的數組對象的標識符。

來源

2014-11-14 17:26:59 DrRoach

請給你的答案添加一些解釋。僅有代碼的答案有時足夠好，但代碼+解釋答案總是更好 – Barranka 2014-11-14 17:54:41

當我這樣做時，它使它成爲一個字符串，對吧？那麼當我顯示它，應該像蘋果。顯然，我不想要顯示。 – 2014-11-14 18:08:45

@Barranka謝謝，我很忙，但我現在已經更新了。 – DrRoach 2014-11-14 23:19:59

JSFiddle Example (Updated)

假定有一個字符串數組：

var arrayExample = ["apple", "orange", "pear"];

迭代通過陣列中的每個字符串：

arrayExample.forEach(main);

追加陣列串項目成span對象，然後變成div對象：

編輯

function main(arrayItem, index, array) { 
    var spanObj = "<span>" + arrayItem + "</span>" 
    var divObj = document.createElement('div'); 
    divObj.innerHTML = spanObj; 

    // Do something like: 
    document.body.appendChild(divObj); 

    // Replace old array string with new array string wrapped in <span> 
    arrayExample[index] = spanObj 
} 
alert(arrayExample); // will output your new Array

來源

2014-11-14 18:16:35 Xenyal

如何處理JS只？謝謝 – 2014-11-14 18:22:43

檢查我的編輯以及我附加的jsFiddle示例。 – Xenyal 2014-11-14 18:27:42

@YINGL它有用嗎？ – Xenyal 2014-11-14 18:39:21

將span標記添加到Javascript中數組中的每個元素？

回答

相關問題