使用JavaScript刪除兩個注釋標簽之間的所有內容

Question

如何刪除兩個不在標准標簽中的標簽之間的所有內容；

<!--googleoff: index-->
    some codes and content here...
<!--googleon: index-->

這是一則在一個網站上展示的廣告，我想通過用戶JS阻止和刪除瀏覽器中的主題

Answer 1

這些是注釋節點，而不是標簽。 最好的辦法可能是確定父母，然后遍歷孩子。 看評論：

// Assuming a single parent
let parent = document.querySelector(".stuff");
if (parent) {
    // Uncomment if you want to see nodes before the change
    // showNodes("before", parent);
    let removing = false;
    let child = parent.firstChild;
    let next = null;
    // While we still have child elements to process...
    while (child) {
        // If we're already removing, remember that
        let removeThis = removing;
        // Before we remove anything, identify the next child to visit
        next = child.nextSibling;
        // Is this a comment node?
        if (child.nodeType === Node.COMMENT_NODE) {
            if (child.nodeValue.includes("googleoff: index")) {
                // It's the node that tells us to start removing:
                // Turn on our flag and also remove this node
                removing = true;
                removeThis = true;
            } else if (child.nodeValue.includes("googleon: index")) {
                // It's the node that tells us to stop removing:
                // Turn off our flag, but do remove this node
                removing = false;
                removeThis = true;
            }
        }
        if (removeThis) {
            // This is either stuff in-between the two comment nodes
            // or one of the comment nodes; either way, remove it
            parent.removeChild(child);
        }

        // Move on to next child
        child = next;
    }
    // Uncomment if you want to see nodes before the change
    // showNodes("after", parent);
}

現場示例：

 // Brief delay so you can see it happen setTimeout(() => { // Assuming a single parent let parent = document.querySelector(".stuff"); if (parent) { // Uncomment if you want to see nodes before the change // showNodes("before", parent); let removing = false; let child = parent.firstChild; let next = null; // While we still have child elements to process... while (child) { // If we're already removing, remember that let removeThis = removing; // Before we remove anything, identify the next child to visit next = child.nextSibling; // Is this a comment node? if (child.nodeType === Node.COMMENT_NODE) { if (child.nodeValue.includes("googleoff: index")) { // It's the node that tells us to start removing: // Turn on our flag and also remove this node removing = true; removeThis = true; } else if (child.nodeValue.includes("googleon: index")) { // It's the node that tells us to stop removing: // Turn off our flag, but do remove this node removing = false; removeThis = true; } } if (removeThis) { // This is either stuff in-between the two comment nodes // or one of the comment nodes; either way, remove it parent.removeChild(child); } // Move on to next child child = next; } // Uncomment if you want to see nodes before the change // showNodes("after", parent); } }, 800); function showNodes(label, parent) { console.log(label); for (let child = parent.firstChild; child; child = child.nextSibling) { console.log(child.nodeType, child.nodeValue); } } 

 <div> Just some content that isn't related </div> <div class="stuff"> This is the parent element <!--googleoff: index--> some codes and content here... <!--googleon: index--> </div> 

如果這些東西出現在一個以上的地方，顯然要將其包裝成一個循環。

如果您無法識別父級，則必須完全遍歷DOM，這需要更多的工作（遞歸函數），但還不錯。