我想隱藏 id 以 _event_2 或 _event_1 結尾的塊。 https://i.stack.imgur.com/8pVff.png 我稍微更正了代碼。
let tabMyMarketHistory = document.getElementsByClassName("market_tab_well_tabs")[0];
let aDisplayNoneListing = document.createElement('a');
let spanDisplayNoneListing = document.createElement('span');
aDisplayNoneListing.id ="displayNoneListingCanceledCreated";
aDisplayNoneListing.className ="market_tab_well_tab";
spanDisplayNoneListing.className ="market_tab_well_tab_contents";
spanDisplayNoneListing.textContent ="Clear";
aDisplayNoneListing.append(spanDisplayNoneListing);
tabMyMarketHistory.append(aDisplayNoneListing);
let DisplayNoneListing =document.getElementById("displayNoneListingCanceledCreated");
DisplayNoneListing.onclick = function() {
DisplayNoneListing.className = "market_tab_well_tab market_tab_well_tab_active";
let itemDetals =document.querySelectorAll(`div[id^="history_row"]`);
if (itemDetals.length > 0) {
for (let i= 0; i < itemDetals.length; i ) {
if (itemDetals[i].id.includes('event_1') || itemDetals[i].id.includes('event_2')) {
document.getElementById(itemDetals[i].id.toString()).style.display = 'none';
console.log(document.getElementById(itemDetals[i].id.toString()));
}
}
}
};
}
非常感謝您的評論。
uj5u.com熱心網友回復：
它對我有用，它是隱藏的，但當我從 ID 末尾洗掉 1 時并非沒有：
let itemDetals = document.querySelectorAll(`div[id^="history_row"]`);
if (itemDetals.length > 0) {
for (let i = 0; i < itemDetals.length; i ) {
if (itemDetals[i].id.includes('_event_1') || itemDetals[i].children[6].firstElementChild.id.includes('_event_2')) {
document.getElementById(itemDetals[i].id.toString()).style.display = 'none';
console.log(itemDetals[i].id.toString());
}
}
}<div class="market_listing_row market_recent_listing_row" id="history_row_3297188894015887588_event_1">Hi</div>uj5u.com熱心網友回復：
不太確定您要通過以下行完成什么。你能解釋一下嗎？
itemDetals[i].children[6].firstElementChild.id.includes('_event_2')
我將它更改為event_2像我想的那樣尋找第一個并且它作業正常，即使在 div 的孩子上也是如此（如果這是你想要完成的，那是我的猜測）。您基本上以 DOM 中的所有 div 為目標，無論它們是否為孩子。
PS：兩個小吹毛求疵。您應該將細節重命名為詳細資訊（拼寫錯誤）并將包含更改為僅查找event_1or event_2，因為額外的內容_是不必要的。
這是代碼：
<html>
<body>
<div class="market_listing_row market_recent_listing_row" id="history_row_3297188894015887588_event_3">
Event 3 - Parent
<div class="market_listing_row market_recent_listing_row" id="history_row_329718889ee4015887588_event_2">Event 1 - Child</div>
</div>
<div class="market_listing_row market_recent_listing_row" id="history_row_3297188894015887588_event_1">
Event 1 - Parent
<div class="market_listing_row market_recent_listing_row" id="history_row_329714015887588_event_2">Event 2 - Child</div>
</div>
<script>
let itemDetals = document.querySelectorAll(`div[id^="history_row"]`);
if (itemDetals.length > 0) {
for (let i= 0; i < itemDetals.length; i ) {
if (itemDetals[i].id.includes('event_1') || itemDetals[i].id.includes('event_2')) {
document.getElementById(itemDetals[i].id.toString()).style.display = 'none';
}
}
}
</script>
</body>
</html>
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/318136.html
標籤：javascript dom