Question

我有一个Chrome扩展程序，它实际上删除了一个按钮，并在第三方网页中添加了2个其他HTML元素。它通过观察当前选项卡上的URL是什么来实现这一点，如果它与正则表达式匹配，它将继续并执行HTML注入。然而，即使使用相当高端的笔记本电脑，我也会看到少量的延迟。我将CSS设置为display:none的按钮在删除之前出现了几分之一秒，并被我的2个HTML元素替换。

是否可以消除此延迟，以便在Chrome扩展程序中的js脚本删除之前，用户无法在几分之一秒内看到原始按钮显示？到目前为止，我确保负责将按钮的属性设置为无的js文件在前5行中具有此代码。 Chrome API中是否有任何内容可以让我在加载页面之前删除该按钮？

我的code.js

var tabURL = window.location.href;
var origBtn = document.getElementsByClassName("Btn Btn-short Btn-primary Mend-med")[0];

if(origBtn != null) origBtn.style.display = "none";

var canProceed = correctURL(); //external method check if it matches url regex
if(canProceed == true){
    var rowElm = document.getElementsByClassName("Grid-table W-100 Fz-xs Py-lg")[0];
    var div = document.createElement('div');

    div.innerHTML = "<div class='extelms'>\
        <div class='selectContainer'>\
            <select required class='form-control' name='dayselect' id='days'>\
                <option value='1'>1 Day</option>\
                <option value='2'>2 Days</option>\
                <option value='3'>3 Days</option>\
                <option value='4'>4 Days</option>\
                <option value='5'>5 Days</option>\
                <option value='6'>6 Days</option>\
                <option value='7'>7 Days</option>\
            </select>\
            <button id='submit'>Submit</button>\
        </div>\
    </div>\
    </div>";
    document.getElementsByClassName("Grid-u Px-med Fz-sm Va-mid")[0].appendChild(div);
    document.getElementsByClassName("Grid-u Px-med Fz-sm Va-mid")[0].style.display = '-webkit-inline-box';
}

我的manifest.json

  "content_scripts": [
    {
      "matches": ["https://basketball.fantasysports.yahoo.com/nba/*"],
      "css": ["fantasy.css"],
      "js": ["js/fantasy.js"],
      "run_at": "document_end"
    }
  ]

假设由于当我尝试搜索我试图从网页中删除的元素时尚未加载网站的元素，因此不会替换HTML元素。

Answer 1

确保按钮永不显示的一种方法是包括
.Btn.Btn-short.Btn-primary.Mend-med{display:none;}
在fantasy.css中（可能更明确的选择器）。内容脚本样式表能够影响原始DOM（尽管清单键名称为content_scripts）。在你能够向DOM添加按钮之前，你仍然需要等待DOM完成它的加载;没有真正解决方法。

删除显示：Chrome中没有延迟？

1 个答案: