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

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

JavaScript,通過自定義數(shù)據(jù) ID 查找子 DIV

JavaScript,通過自定義數(shù)據(jù) ID 查找子 DIV

三國紛爭 2021-06-09 17:05:54
我正在嘗試使用已經(jīng)設置的自定義 DATA-ID attr ive在他的父母中找到一個孩子 DIV ,在找到那個特定的孩子之后,將其刪除。我已經(jīng)讓我的代碼工作了,但我想知道是否有更好的方法,更好的方法?假設我試圖找到 DATA-ID 為 2 的孩子:HTML    <div class="parent-div">       <div class="child-item" data-id="1"> SomeContent </div>       <div class="child-item" data-id="2"> SomeContent </div>       <div class="child-item" data-id="3"> SomeContent </div>    </div>JS    removeChild(dataID) {       const parentContainer = document.querySelector('.parent-div');       const children = [...parentContainer.querySelectorAll('.child-item')];       children.forEach(child => {          child.dataset.id === dataID ? child.remove() : 0;       })   };   removeChild(2);
查看完整描述

2 回答

?
慕碼人2483693

TA貢獻1860條經(jīng)驗 獲得超9個贊

發(fā)現(xiàn)孩子直接使用Element.querySelector()帶有屬性選擇器,并將其刪除:


function removeChild(dataID) {

  const child = document.querySelector(`[data-id='${dataID}']`);


  if(child) child.remove();

};


removeChild(2);

<div class="parent-div">

  <div class="child-item" data-id="1"> SomeContent </div>

  <div class="child-item" data-id="2"> SomeContent </div>

  <div class="child-item" data-id="3"> SomeContent </div>

</div>

如果可以有多個具有相同屬性的項目,請使用Document.querySelectorAll(),然后使用 forEach 迭代結果,并刪除項目:


function removeChild(dataID) {

  const children = document.querySelectorAll(`[data-id='${dataID}']`);


  children.forEach(el => el.remove());

};


removeChild(2);

<div class="parent-div">

  <div class="child-item" data-id="1"> SomeContent </div>

  <div class="child-item" data-id="2"> SomeContent </div>

  <div class="child-item" data-id="2"> SomeContent </div>

  <div class="child-item" data-id="2"> SomeContent </div>

  <div class="child-item" data-id="2"> SomeContent </div>

  <div class="child-item" data-id="2"> SomeContent </div>

  <div class="child-item" data-id="3"> SomeContent </div>

</div>


查看完整回答
反對 回復 2021-06-18
  • 2 回答
  • 0 關注
  • 274 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網(wǎng)微信公眾號