CSS属性に基づいてjQueryで要素を選択していますか？

本当に答えが見つからないかどうか尋ねることはありません。だからここに私の問題がある。私が使用してウェブサイトには、uBlock周りの抜け穴を利用し、それはのようなランダム生成された要素のクラスをオーバーレイするためのスクリプトを使用しています。CSS属性に基づいてjQueryで要素を選択していますか？

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

文字列は、それが一定の基準で、それは不可能選択、毎回変わります。このクラスはウェブサイトをオーバーレイし、ポップアップ/広告を受け取るように強制します。いくつかの方法でBase64エクスプロイトなどを使用して、動作中のポップアップ/ newtabをバイパスして表示することができます。しかし、理論的にはクラス/ IDを選択できるCSS変数があります。私はしかし、アイデアを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

出典

2016-08-18 computerguy

ジャスト側のコメント：あなたはDOMツリー内のその位置に基づいて、それを選択すると考えていますか？それともランダムでもあります（身体の直接的な子供、時にはメインの直接の子供、時には他の場所にネストされることもあります）。 – Assimilater

その方法はわかりませんが、それはランダムではありません。screenshot：http://prntscr.com/c7474u – computerguy

私はあなたのOPにそのマークアップを入れています:) – Assimilater

.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();

これはかなり高価になると思われます。セレクタを絞り込むことができれば助けになります。

出典

2016-08-18 01:54:50 Barmar

悪いことに、本当にありがとうございます。でも、jQueryを使ってどうやってやるのが大好きです。 :) – computerguy

これはjQueryです。 jQueryセレクタを使用している場合は不可能です。セレクタは、CSSではなくDOM属性にのみアクセスできます。 – Barmar

大変ありがとうBarmar。誰かが他の答えを持っている場合は、気軽に投稿してください。 – computerguy

あなたはスクリーンショットの投稿マークアップを与え検討するかもしれないCSSソリューション：

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

body > div:last-childは（私は、セレクタはそのため、どのように適用されるかについての仮定を作ってるんだ.xgdxts1471483770461tkbfjhcrより具体的であるので、これは動作します）あなたのオリジナルのポストに含まれていなかった

例：

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

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

出典

2016-08-18 02:14:42 Assimilater

私は要素の位置がhtmlツリーに変わったとは思わないが、 /prntscr.com/c74d9r – computerguy

サイドの発言：私はFirefoxとChromeでこれをテストしました。スタンドアロンのページで動作するようですが、SO上でスニペットを実行すると、「はさまない」と表示されます。私はそれが何であるか分かりません.... – Assimilater

あなたのコードは、ありがとう！ – computerguy

あなたは.lengthが27に等しい、とdocument.querySelectorAll("[class]")、Array.prototype.filter()、RegExp.prototype.test()を使用して小文字に続く数字が続く小文字を収容するための要素classNameを確認することができます。

var filter = [].filter.call(document.querySelectorAll("[class]") 
 
       , function(el) { 
 
        return el.className.length === 27 
 
          && /[a-z]+[0-9]+[a-z]+/.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>

出典

2016-08-18 02:28:37 guest271314

ちょっとファンキーですが、私はそれが軽量で好きです:) – Assimilater

はまだ 'run code snippet'に表示されています。 – computerguy

@computerguy _ "はまだ 'run code snippet'に表示されていますが、スタックが壊れていると推測されます。" https://jsfiddle.net/v49ftLuk/ – guest271314

CSS属性に基づいてjQueryで要素を選択していますか？

答えて

関連する問題