Tampermonkey隱藏沒有特定文本的元素？

Question

在蒸汽市場，爲上市代碼如下：

<span id="listing_285218391330225741_name" class="market_listing_item_name" style="color: #CF6A32;">StatTrak™ M4A1-S | Cyrex (Minimal Wear) 
    <span style="color:red"> 
     (warning) 
    </span> 
</span> 

使用一些蒸汽增強插件，它增加了<span style="color:red"> (warning) </span>與姓名標籤的任何項目。

因爲每個上市有spans，是有使用JavaScript（Tampermonkey），以刪除不包含單詞「警告」任何span的方法嗎？

換句話說，只顯示帶名稱標籤的列表。

Answer 1

一般隱藏家長：

1. 獲取所有的跨度/節點，你可能想刪除列表。
2. 過濾出包含您特定文本的內容。
3. 刪除或隱藏剩下的內容。
4. 請注意AJAX（或插件）計時問題。

您可以執行步驟1通3使用jQuery，如：

var itemRows  = $(".market_listing_row_link"); 
var rowsToDelete = itemRows.not (":has(.market_listing_item_name > span:contains('(warning)'))"); 
rowsToDelete.hide(); 

---

但，因爲預警是通過一個插件添加（和/或某些市場的頁面可能被添加AJAX技術），很可能你的Tampermonkey腳本會在頁面完成之前按你期望的/需要的方式運行。

爲了彌補這一點，使用像waitForKeyElements()等技術，並找到一些條件，你可以知道你提到的「插件」已完成其工作。

由於您沒有提供詳細信息，因此我們將假定插件在事件觸發之前完成。

所以，這裏是一個完整的Tampermonkey腳本，在這兩個AJAX和靜態場景的作品（你可能需要提供基於這種「插件」額外的延遲時間）：

// ==UserScript== 
// @name  _Steam Market, hide items that DON't have a warning!? 
// @include http://YOUR_SERVER.COM/YOUR_PATH/* 
// @match *://steamcommunity.com/market* 
// @require http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js 
// @require https://gist.github.com/raw/2625891/waitForKeyElements.js 
// @grant GM_addStyle 
// ==/UserScript== 
/*- The @grant directive is needed to work around a design change 
    introduced in GM/TM 1.0. It restores the sandbox. 
*/ 
window.addEventListener ("load", function() { 
    waitForKeyElements (".market_listing_row_link", hideUnwarnedRows); 
}, false); 

function hideUnwarnedRows (jNode) { 
    if (jNode.has (".market_listing_item_name > span:contains('(warning)')").length) { 
     return; 
    } 
    jNode.hide(); 
} 

Answer 2

如果你能保證對警告的跨度風格是紅色的，你可以做

var elms = document.querySelectorAll('.market_listing_item_name > span[style="color:red"]'); 

讓每一個警告跨度。然後，通過遍歷所有這些，應用樣式

elms.forEach(function(el){ 
    el.parentElement.style.display = "hidden"; 
}