<div>
<br>
<br>
<br>
</div>
我有一個包含上述 div 元素的 HTML 頁面。如何掃描頁面以查找包含特定專案的 DIV？在這個例子中，我知道我<br>連續三個，就是這樣。DIV 元素沒有類或 ID，我想將其洗掉。
uj5u.com熱心網友回復：
您可以使用同級選擇器來定位一行中的元素 。您可以使用選擇器確保目標元素是 div 的直接子元素>。
您可以找到包含三個br元素的 div，如下所示：
document.querySelector('div > br br br').parentNode;
要從 DOM 中洗掉此元素，請使用該remove方法。
const elToDelete = document.querySelector('div > br br br')?.parentNode;
elToDelete?.remove();
編輯：在答案中添加了可選的鏈接語法，以顯示如何防止拋出未定義的錯誤。
uj5u.com熱心網友回復：
可以使用:has偽類div直接選擇
var elem = document.querySelectorAll("div:has(>br br br)");
console.log([...elem])
elem.forEach(x=>x.remove())<div id=a> a
<br/>
<br/>
<br/>
</div>
<div id=b> b
<br/>
<br/>
</div>
<div id=c> c
<br/>
<br/>
<not-br/>
<br/>
</div>uj5u.com熱心網友回復：
你可以試試這個：
[].slice.call(document.getElementsByTagName("div")).forEach(function(div){
var count = 0;
if(div.children.length === 3)
[].slice.call(div.children).forEach(function(br, i){
if(br.nodeName === "BR")
count ;
});
if(count > 2)
div.parentElement.removeChild(div);
});
uj5u.com熱心網友回復：
你可以用 CSS 隱藏它
div:has(>br br br) {
display: none;
}<div>1</div>
<div><br/><br/><br/></div>
<div>3</div>uj5u.com熱心網友回復：
跨瀏覽器作業的最佳解決方案是以編程方式解決這個問題。請注意 :has() 偽類在 Firefox、IE 或 Opera 上不起作用（請參閱https://caniuse.com/css-has）。
這是一個簡潔的函式式 Javascript 方法：
[].filter.call(document.querySelectorAll('div'), el => el.querySelectorAll('br').length === 3)
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/508198.html
標籤：javascript html
下一篇：導航懸停CSS