問題タブ [dom]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
11 に答える
28805 参照

javascript - 動的に作成された DOM 要素が DOM に追加されているかどうかを確認するにはどうすればよいですか?

仕様によるとBODY、およびのみがFRAMESETアタッチする「onload」イベントを提供しますが、動的に作成された DOM 要素が JavaScript の DOM にいつ追加されたかを知りたいです。

私が現在使用している非常に単純なヒューリスティックは次のとおりです。

  • 最終的な祖先が見つかるまで、要素のparentNodeプロパティをトラバースします(つまり、parentNodeがnullになるまでparentNode.parentNode.parentNode.etc)

  • 究極の祖先が定義済みの null 以外のbodyプロパティを持っている場合

    • 問題の要素が dom の一部であると仮定します
  • そうしないと

    • これらの手順を 100 ミリ秒でもう一度繰り返します

私が求めているのは、私がやっていることで十分であることの確認 (IE7 と FF3 の両方で動作しています) か、何らかの理由で完全に忘れていたより良い解決策です。おそらく、チェックすべき他のプロパティなどです。


編集:これを行うにはブラウザーに依存しない方法が必要です。残念ながら、私は1つのブラウザーの世界に住んでいません。とはいえ、ブラウザ固有の情報はありがたいですが、それが動作することを知っているブラウザに注意してください。ありがとう!

0 投票する
6 に答える
134575 参照

javascript - キーを押してHTML入力を変更した後、HTML入力の新しい値を取得するにはどうすればよいですか?

HTML入力ボックスがあります

' keyup 'イベントのハンドラーをアタッチしましたが、イベントハンドラーの実行中に入力ボックスの現在の値を取得すると、値はそのままではなく、そのまま取得されます。

「 keypress 」イベントと「change 」イベントを取得しようとしましたが、同じ問題です。

これは簡単に解決できると思いますが、現時点で唯一の解決策は、短いタイムアウトを使用して、数ミリ秒後にコードをトリガーすることだと思います。

それらのイベント中に現在の値を取得する方法はありますか?

編集:後で同じコードをチェックしたので、jsファイルでキャッシュの問題が発生したようですが、問題なく動作しました。私は質問を削除しますが、それがアイデアを投稿した親切な人々の担当者を失うかどうかはわかりません:)

0 投票する
2 に答える
6780 参照

javascript - JavascriptでaddEventHandlerを使用する安全で普遍的な方法は?

この問題の詳細に入る前に、状況を明確にしたいと思います。私たちの Web 分析会社は大規模なサイトのコンサルタントとして働いており、(SCRIPT タグを 1 つ追加する以外に) ページ自体を制御することはできません。

既存のスクリプトは、ページ上の「新しい」(addEventListener または attachEvent) ハンドラーを完全に認識しない「古い」方法 (element.onclick = blah; の派手なバージョンで、元のハンドラーも実行する) を使用してハンドラーをインストールします。これを修正して、多くのカスタム開発を必要とせずにスクリプトをより多くのサイトで実行できるようにしたいと考えています。

ここで最初に考えたのは、独自のスクリプトで addEventListener/attachEvent を使用することでしたが、これには問題があります。クライアントのサイトで「古い」方法を使用してハンドラーを設定すると、「新しい」方法でインストールしたハンドラーが消去されます。すべてのブラウザーをテストしたわけではありませんが、簡単で汚いテストでは、IE7 と FF3 の両方でこれが発生することが示されています。また、ページのイベント ハンドラーが既に設定されている後に「新しい」方法を使用すると、それらのハンドラーが消去される可能性があるというリスクもあります。

だから私の質問は、ページ上の他のイベントハンドラーがどのようにインストールされているかに関係なく機能する addEventListener/attachEvent を使用して Javascript でイベントハンドラーを追加するために使用できる安全な手法は何ですか?

覚えておいてください: スクリプトがインストールされているサイトを変更する方法はありません。(このような質問に対するデフォルトの答えは常に「すべてを同じように書き直すだけです」であるため、強調しなければなりません。)

0 投票する
3 に答える
20568 参照

javascript - JavaScript を使用して 2 つの DOM 要素間の相対位置を取得する

jQuery を使用して一部のコンテナーにドロップできる一連のドラッグ可能な要素を実装しました。必要なのは、ユーザーの操作なしで要素を特定のコンテナーに移動するアニメーションです。問題は、要素とドロップ コンテナーがDOM の完全に異なる部分にあり、ほとんどが float を使用して配置されていることです。

必要なのは、できれば jQuery を使用して、2 つのフローティング DOM 要素間の絶対位置の差を取得するためのコードだけです。私が見つけた唯一のことは、DOM を上方に解析するいくつかのハックでしたが、常にブラウザー固有のものでした (たとえば、「これは Firefox や IE などではうまく機能しません」)。

ベストは次のようなものです:

またはjQuery表記で:

0 投票する
13 に答える
40929 参照

javascript - 要素に一意の要素 ID がない場合でも、一意の要素 ID

一連の要素を反復処理する GreaseMonkey スクリプトを作成しています。要素ごとに、後でその要素を参照するために使用できる文字列 ID が必要です。要素自体にはid属性がなく、元のドキュメントを変更して属性を与えることはできません (ただし、スクリプトで DOM を変更することはできます)。参照が必要になったときに、GreaseMonkey スクリプト自体が範囲外になるため、参照をスクリプトに保存できません。たとえば、ブラウザが使用する「内部」IDを取得する方法はありますか? Firefox のみのソリューションで問題ありません。他のシナリオに適用できるクロスブラウザー ソリューションは素晴らしいものです。

編集:

  • GreaseMonkey スクリプトが範囲外の場合、後で要素をどのように参照していますか? 彼らの GreaseMonkey スクリプトは、イベントを DOM オブジェクトに追加しています。参照を配列または他の同様のメカニズムに格納することはできません。イベントが発生すると、GreaseMonkey スクリプトが範囲外になるため、配列がなくなるためです。そのため、イベントは、イベントがアタッチされたときにスクリプトが持っていた要素参照について何らかの方法で知る必要があります。問題の要素は、それが接続されている要素ではありません。

  • 要素にカスタム プロパティを使用することはできませんか? はい、しかし問題はルックアップにあります。そのカスタムプロパティが目的のIDに設定されているものを探して、すべての要素を繰り返し処理する必要があります。それは確かに機能しますが、大きなドキュメントでは非常に時間がかかる可能性があります. 私は、ブラウザが検索の面倒な作業を実行できるものを探しています。

  • ドキュメントを変更できるかできないか? ソース ドキュメントを変更することはできませんが、スクリプトで DOM を変更することはできます。質問で明確にします。

  • クロージャーを使用できませんか?Closuses は機能することが判明しましたが、最初は機能しないと思っていました。私の後の投稿を参照してください。

「使用できる内部ブラウ​​ザ ID はありますか?」という質問に対する答えのように思えます。は「いいえ」です。

0 投票する
6 に答える
26400 参照

php - コールバック関数とは何ですか? OOP で使用するにはどうすればよいですか?

php シンプルな HTML DOM パーサーを使用して、記事でいっぱいのページの各記事から画像、タイトル、日付、および説明を取得したいと考えています。API を見ると、コールバック関数を設定する set_callback があることに気付きました。ただし、これが何をするのか、またはどのように使用するのかわかりませんか? 例の1つでは、いくつかのものを取り除く関数を呼び出すために使用されていましたが、これを使用してすべての関数を呼び出す必要があるかどうか疑問に思っていますか?

なぜこれを使用するのか、これまでコールバック関数に出くわしたことがないので、これは何をするのか疑問に思っていると思います!

0 投票する
4 に答える
33109 参照

c# - C# で HTML の文字列から DOM を操作するにはどうすればよいですか?

今のところ、HTML を含む文字列から DOM を操作できることがわかった最善の方法は次のとおりです。

2 つの問題があります。

  1. WebBrowserオブジェクトが必要です!
  2. これは複数のスレッドでは使用できません。別のスレッド(メインスレッド以外)で動作するものが必要です。

何か案は?

0 投票する
6 に答える
81799 参照

javascript - IDなしでHTML要素にアクセスする方法は?

たとえば、以下のスニペットでは、親要素(header-inner div)のIDを知っているh1要素にアクセスするにはどうすればよいですか?

ありがとう!

0 投票する
1 に答える
4350 参照

php - PHPでDOMElement->tagNameプロパティを変更するためのより良い方法はありますか?

MVCフレームワーク用のTextboxコントロールを構築しているところに出くわしました。ドキュメント全体を完成させる直前に、ServerTagから継承する(DOMElementから継承する)すべてに対してPreRenderを呼び出します。

DOMElement派生オブジェクトのtagNameを変更する唯一の方法は、すべての属性が古いものと同期された新しいオブジェクトに置き換えることです。

これはコードでどのように見えるかです:

それは本当にそれをする唯一の方法ですか?この方法には、コントロールの背後にあるすべてのロジックを無効にするという、かなり望ましくない副作用があります。

0 投票する
1 に答える
1698 参照

php - PHP: DOMNode オブジェクトから属性を削除する

DOMNodeいくつかの属性を持つオブジェクトがあります。$Node->attributesは でありDOMNamedNodeMap、マップ内のエントリの 1 つを削除するメソッドはありません。このDOMNodeクラスには、要素から属性を削除するメソッドもありません。関連する他の多くのクラスを調べましたが、属性ノードを親から削除するメカニズムを提供するものはないようです。

DOMNode::removeChild動作しません。DOMAttrオブジェクトを渡すと、「見つかりませんエラー」がスローされます。

新しいものを作成し、不要なものを除いDOMNamedNodeMapてすべての属性を追加する以外に...何かアイデアはありますか? ありがとう。