我有兩個(gè) div 標(biāo)簽，里面有列表。使用 Javascript，我嘗試將“intoleranceList”中的每個(gè)項(xiàng)目放入字符串中，然后將其顯示在“info”div 標(biāo)記中。有人可以幫忙嗎？這是我的 Javascript 試圖做到這一點(diǎn)。var area= document.getElementById("info");var listArea = document.getElementById("intoleranceList").getElementsByTagName("li");var intoleranceArray = [];for(let i = 0; i < listArea.length; i++) { intoleranceArray[i] = listArea[i].innerHTML;}var intoleranceString = intoleranceArray.toString();area.innerHTML = intoleranceString;<div id = "intoleranceList"> <ul class = "list"> <li>One</li> <li>Two</li> <li>Three</li> </ul></div><div id = "nonIntoleranceList"> <ul class = "list"> <li>One</li> <li>Two</li> <li>Three</li> </ul></div><div id = "info"></div>
2 回答
翻閱古今
TA貢獻(xiàn)1780條經(jīng)驗(yàn) 獲得超5個(gè)贊
你可以這樣做：
const intolanceList = document.querySelectorAll("#intoleranceList > ul > li");//only select li's inside a ul tag and inside a intoleranceList id
const info = document.getElementById("info");
const text = [];
intolanceList.forEach(i => {
text.push(i.textContent)//catch every text and push to array
})
info.textContent = text.join(" ")//catch array and transform in string with spaces between itens
收到一只叮咚
TA貢獻(xiàn)1821條經(jīng)驗(yàn) 獲得超5個(gè)贊
我嘗試使用 Javascript ES5 來(lái)實(shí)現(xiàn)這一點(diǎn)：
window.onload = function () {
var intoleranceList = document.querySelectorAll('#intoleranceList li');
var intoleranceListStrings = getStringListFromLi();
AddStringsToInfo(intoleranceListStrings);
function AddStringsToInfo(arr) {
var infoElement = document.getElementById('info');
infoElement.textContent = arr.join(',');
}
function getStringListFromLi(){
var intoleranceListStrings = [];
for(var i=0;i<intoleranceList.length;i++){
intoleranceListStrings.push(intoleranceList[i].textContent);
}
return intoleranceListStrings;
}
}
<div id="intoleranceList">
<ul class="list">
<li>One</li>
<li>Two</li>
<li>Three</li>
</ul>
</div>
<div id="nonIntoleranceList">
<ul class="list">
<li>One</li>
<li>Two</li>
<li>Three</li>
</ul>
</div>
<div id="info"></div>
并使用ES6
window.onload = () => {
const intoleranceList = document.querySelectorAll('#intoleranceList li');
const AddStringsToInfo = (arr) => {
const infoElement = document.getElementById('info');
infoElement.textContent = arr.join(',');
}
const getStringListFromLi = () => {
const intoleranceListStrings = [];
for(let i=0; i<intoleranceList.length ;i++){
intoleranceListStrings.push(intoleranceList[i].textContent);
}
return intoleranceListStrings;
}
const intoleranceListStrings = getStringListFromLi();
AddStringsToInfo(intoleranceListStrings);
}
<div id="intoleranceList">
<ul class="list">
<li>One</li>
<li>Two</li>
<li>Three</li>
</ul>
</div>
<div id="nonIntoleranceList">
<ul class="list">
<li>One</li>
<li>Two</li>
<li>Three</li>
</ul>
</div>
<div id="info"></div>
- 2 回答
- 0 關(guān)注
- 126 瀏覽
添加回答
舉報(bào)
0/150
提交
取消