首頁(yè) 猿問將具有 className...

將具有 className 的元素添加到具有 idName 的其他元素

JavaScript

千巷貓影 2023-09-28 16:41:01

我想添加一個(gè)創(chuàng)建的元素 li ，其類名存儲(chǔ)在數(shù)組中，并且我想將這個(gè)具有特殊類名的新元素 li 添加到具有 id 的靜態(tài)元素中。我有一個(gè)錯(cuò)誤 appenChild 不是函數(shù)。順便說(shuō)一句，我們?cè)谝粋€(gè) JS 對(duì)象內(nèi)部。控制臺(tái)顯示了正確的內(nèi)容，它向我顯示了具有良好類名的 li，但我無(wú)法將其添加到 id stacks-icons 中。我希望最終結(jié)果是：在我的 ul 中添加一個(gè)新的 li，其類名是我在數(shù)組圖標(biāo)中選擇的。這里是 HTML 和 JS ：<ul id="stacks-icons"> <li></li></ul>和 JS（構(gòu)造函數(shù)中的變量） this.icons = ["fab fa-html5", "fab fa-css3"]; this.iconsRow = $('#stacks-icons');以及方法 let i = document.createElement('li'); i.className = this.icons[1]; this.iconsRow.appenChild(i); console.log(i);

查看完整描述

2 回答

陪伴而非守候

TA貢獻(xiàn)1757條經(jīng)驗(yàn) 獲得超8個(gè)贊

使用querySelector查找DOM元素并將appenChild更改為appendChild，如下所示

let icons = ["fab fa-html5", "fab fa-css3"];

let ir = document.querySelector('#stacks-icons');

let i = document.createElement('li');

i.className = icons[1];

ir.appendChild(i);

反對(duì) 回復(fù) 2023-09-28

慕萊塢森

TA貢獻(xiàn)1810條經(jīng)驗(yàn) 獲得超4個(gè)贊

使用appendChild而不是appenChild.?另外，用于document.querySelector選擇 dom 元素。

如果您使用 jQuery，則使用append()not ，appendChild()因?yàn)槟峭ㄟ^ jQuery 方法獲取元素，所以您也應(yīng)該使用 jQuery 方法進(jìn)行追加。

示例片段如下 -

class Iconlist{

? constructor(){

? ? this.icons = ["fab fa-html5", "fab fa-css3"];

? ? this.iconsRow = $('#stacks-icons');

? }

??

? create(){

? ? let i = document.createElement('li');

? ? i.textContent = "Some text";

? ? i.className = this.icons[1];

? ? this.iconsRow.append(i);

? ? console.log(i);

? }

}

let mi = new Iconlist();

mi.create();

? <li>ABC</li>

</ul>

反對(duì) 回復(fù) 2023-09-28

互換的青春

TA貢獻(xiàn)1797條經(jīng)驗(yàn) 獲得超6個(gè)贊

appendChild如果您使用選擇該元素，則不會(huì)調(diào)用任何方法jQuery。Jquery 有append一個(gè)方法，您可以通過它在ul. 我在這里添加了兩種方法（jquery 和 javascript），您可以通過它們實(shí)現(xiàn)您的目標(biāo)。這是工作示例：

var icons = ["fab fa-html5", "fab fa-css3"];

// 1st way using javascript

var ul = document.getElementById("stacks-icons");

let i = document.createElement('li');

i.className = icons[0];

i.appendChild(document.createTextNode("1st using javascript"));

ul.appendChild(i);

// 2nd way using jquery

var iconsRow = $('#stacks-icons');

let i1 = document.createElement('li');

i1.className = icons[1];

i1.appendChild(document.createTextNode("2nd using jquery"));

iconsRow.append(i1);

<li>Default</li>

</ul>

反對(duì) 回復(fù) 2023-09-28

2 回答
0 關(guān)注
161 瀏覽

關(guān)注

添加回答

舉報(bào)

0/150

提交

取消

使用 Ctrl+D 可將網(wǎng)站添加到書簽

微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)

第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

熱搜

最近搜索清空

將具有 className 的元素添加到具有 idName 的其他元素

將具有 className 的元素添加到具有 idName 的其他元素

2 回答

添加回答