注1:このスクリプトを適用しようとしているWebサイトを所有していないため、手動編集用のソースコードにアクセスできません。
注2:純粋なjavascript(jqueryではない)が必要です。Firefox v56のtampermonkey内のスクリプトを使用しますが、外部の* .jsライブラリをロードしたくありません。PUREJSコードが必要です。
さて、ここに行きます...
問題のサイトの内部にbody
は、次のようなボタンがあります。
<button class="bad_button js-only">reply</button>
他のページ要素の中にはdiv
、次のような要素が1つあります。
<div class="returnprofile js-only" style="display: none;"></div>
上記のボタンを押すと:
-ページは動的にscript
要素を構築/作成し、ページ内に挿入します-次に、データベースから情報を取得head
してその「非表示」div
要素にコンテンツを入力します
-次に、上記の必須div
要素を変更して表示しますstyle
からdisplay: none
へdisplay: block
-最後に、私は、このようなポップアップそのショーの情報を提供しています:
<div class="returnprofile js-only" style="display: block;">
<aside class="profile-flap js-captcha">
<ul>
<li>
<h1>nick name:</h1>
<p>fR3r0X</p>
</li>
<li class="skill">
<h1>
<span class="most_used">Cyclone</span>
</h1>
<p class="attack_skill">
Ancestral Warchief
</p>
</li>
</ul>
</aside>
</div>
さて、私が説明したことはすぐには起こりません。時間がかかる。そして、それは常にランダムな時間です。私はfirebugを監視しているときに何が起こっているかを観察しました。そして、それがいくつかのgoogle recaptchaスクリプトを使用していることがわかり、データベースからすべての情報を取得してポップアップに入力します。
何が欲しい?:ポップアップ
内の「どこかに」ボタンを配置したいので、ボタンdiv
をクリックすると、いくつかの要素のinnerTextをコピーできます。スキル名'。ボタンの挿入を手伝ってくれる必要はありません。私はそれを理解します。
何が問題ですか?:
そのdiv
ポップアップ内の要素を「ロック」(フック)することはできません。これは、スクリプトの作業が完了するとコンテンツが動的に読み込まれ、ボタンをクリックすると元のページが作成する動的スクリプトが「最後にロードされました。
そのため、要素を「見つけて」、document.getElementsByClassName
ordocument.getElementsByTagName
またはdocument.querySelector
などを使用して変数に入れることができません。
私はすでにこことグーグルで解決策を探しましたが、これに使用できるコード例が見つかりません。タイムアウト付きの関数を作成してみましたが、そのdivポップアップの一部である要素の1つが表示されたら、それを「フック」できるかどうかを確認しました。
私はこのようなものをテストするためだけに試しました:
setTimeout( function () {
var skill = document.querySelector('.attack_skill');
skill.style.background = "yellow";
}, 3000);
そして...それが機能することもあれば、機能しないこともあります。そして、すべては、関数を「待機」するように選択した時間の長さに依存します。したがって、問題のWebサイトがそのdiv
ポップアップの内容を埋めるのに時間がかかり、その前に私の関数が起動しようとしても、何も起こりません。タイムアウト値を増やすことでそれを「修正」できますが、それは解決策ではありません。関数が開始するまで20秒待機し、Webサイトに3秒でdivポップアップが表示されるとすると、モニター画面が表示され、スクリプトが起動するまで17秒待機します。 。そのため、div
ポップアップが表示されたらすぐに、そのポップアップの要素にアクセス(および変更)する方法が必要です。そのポップアップが表示されるのに20秒かかる場合はそうですが、表示されたら、自分のjavascriptコードを(タイムアウトやラグなしで)即座に実行したいと思います。
私は周りを見回しました...そして私は初心者なので、それはすべて間違っているかもしれませんが、「私はいくつかの「イベントリスナー」が必要だと思います」。それらの使用方法がわかりません。 「クリック」イベントとして使用(起動)されていますが、特定の要素が表示されたらコードを開始するイベントが必要です(そのようなものが存在する場合)。私の場合は、非表示の瞬間にアタッチできます。 divの状態をからdisplay:none
に変更しdisplay:block
ます。そのようなものをどのようにコーディングするかわからない場合でも、それを回避する方法を「ブレインストーミング」していたのかわかりません。:(
何が問題で何が必要かを説明できたと思います。
誰かがコード例を添付することにした場合、そのdivポップアップの要素のいくつかの中にボタンを「追加する」ことができます。内部<p class="attack_skill">
または単に背景などを変更します。主な目標は、動的に自分自身を作成する要素(またはdivポップアップの一部である要素)に「フック」する方法を示すことです。
私の「小説」を読んで私を助けようと決心したすべての人に事前に感謝します!
1つのオプションは、の代わりにsetInterval
(およびclearInterval
)を使用して、目的の条件setTimeout
をポーリングすることです。
var x;
// run some code every 1000ms to check for the presence of an element
x = setInterval(function() {
const el = document.querySelector('blahblahblah');
if (el !== null) {
// my element is on the page; no need to poll any more
clearInterval(x);
// do some things here
el.style.background = 'yellow';
}
}, 1000);
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加