使用基于css属性的jQuery选择元素？

Question

不会问我是否真的找不到答案。 所以这是我的问题。 我使用的网站使用uBlock周围的漏洞，它使用脚本覆盖随机生成的元素类，例如：

<div class="lcelqilne1471483619510ttupv"></div>
<div class="xgdxts1471483770461tkbfjhcr"></div>

字符串每次都会更改，因此选择它会使其无法持续进行。 这个类覆盖了网站，迫使你点击它并接收一个弹出/广告，一些如何使用Base64漏洞或东西绕过并显示一个有效的弹出窗口/新标签。 但它确实有CSS变量，理论上可以选择类/ ID。 但是我不知道怎么用javascript / jQuery（用greasemonkey）来做。 弹出窗口也是看不见的。

display: block !important;
visibility: visible !important;
top: 0px !important;
left: 0px !important;
position: absolute !important;
z-index: 999999 !important;

为了简化我的要求，我想根据其CSS属性选择此元素，而不是元素的名称，然后隐藏/阻止它。 http://prntscr.com/c7474u

Answer 1

您可以使用.filter()来检查所需设置的计算样式。

$("div[class]").filter(function() {
    if (this.className.length != 27) { // skip the expensive style check if we don't have a random-looking class
        return false;
    }
    var style = getComputedStyle(this);
    return (style.visibility == 'visible' && style.top == '0px' && style.left == '0px' && style.position == 'absolute' && style.zIndex == 999999);
}).hide();

我怀疑这会非常昂贵。 如果你可以缩小选择器的范围，那将有所帮助。

Answer 2

您可以使用document.querySelectorAll("[class]") ， Array.prototype.filter() ， RegExp.prototype.test()检查.length equaling 27元素className ，并包含小写字母后跟数字后跟小写字母。

 var filter = [].filter.call(document.querySelectorAll("[class]") , function(el) { return el.className.length === 27 && /[az]+[0-9]+[az]+/.test(el.className) }); console.log(filter); // do stuff filter[0].style.color = "blue";

 <div class="xgdxts1471483770461tkbfjhcr">xgdxts1471483770461tkbfjhcr</div> <div class="abc456wyx">abc</div> <div class="123def789">123</div>

Answer 3

鉴于您在屏幕截图中发布的标记，您可以考虑使用CSS解决方案：

body > div:last-child {
    display: none !important;
}

这是因为body > div:last-child比.xgdxts1471483770461tkbfjhcr更具体（我正在假设选择器是如何应用的，因为原始帖子中没有包含它）

例：

 .xgdxts1471483770461tkbfjhcr { display: block !important; visibility: visible !important; top: 0px !important; left: 0px !important; position: absolute !important; z-index: 999999 !important; } body > div:last-child { display: none !important; }

 <body> <div id="fb-root"></div> <div style="display:none"></div> <div class="xgdxts1471483770461tkbfjhcr">Hello</div> </body>

使用基于css属性的jQuery选择元素？

问题描述

3 个解决方案

解决方案1
6 2016-08-18 01:54:50

解决方案2
2 2016-08-18 02:28:37

解决方案3
1 2016-08-18 02:14:42

使用基于css属性的jQuery选择元素？

问题描述

3 个解决方案

解决方案1 6 2016-08-18 01:54:50

解决方案2 2 2016-08-18 02:28:37

解决方案3 1 2016-08-18 02:14:42

解决方案1
6 2016-08-18 01:54:50

解决方案2
2 2016-08-18 02:28:37

解决方案3
1 2016-08-18 02:14:42