タグ付けされた質問 「dom」

Document Object Model(DOM)は、XMLやHTMLなどのマークアップ言語の要素をプログラムで参照する方法です。[javascript]またはDOMパーサーを持つ他のプログラミング言語で使用します



8
要素がページに追加されたときにどのように通知されますか?
DOM要素がページに追加されたときに実行するように選択した機能が必要です。これはブラウザ拡張機能のコンテキストにあるため、ウェブページは私とは関係なく実行され、ソースを変更することはできません。ここに私のオプションは何ですか? 理論setInterval()的には、要素の存在を継続的に検索し、要素が存在する場合にアクションを実行するために使用できるだけだと思いますが、より良いアプローチが必要です。


10
フォーカスが失われたときにDOMから消えるHTML要素を検査するにはどうすればよいですか?
入力からテーブルセルへのCSSプロパティを検査しようとしています。入力を調べようとすると、クリックするとフォーカスが失われ、フォーカスが失われると入力が消えます。別のウィンドウ(インスペクター)に移動しているときにフォーカスを失わないようにするにはどうすればよいですか?
137 html  css  dom 

15
ベストプラクティス:HTML IDまたは名前属性でフォーム要素にアクセスしますか?
熟練したJavaScript開発者なら誰でも知っているように、同じことを行う方法はたくさんあります(多すぎます)。たとえば、次のようなテキストフィールドがあるとします。 <form name="myForm"> <input type="text" name="foo" id="foo" /> JavaScriptでこれにアクセスするには多くの方法があります。 [1] document.forms[0].elements[0]; [2] document.myForm.foo; [3] document.getElementById('foo'); [4] document.getElementById('myForm').foo; ... and so on ... メソッド[1]と[3]はMozilla Geckoのドキュメントに詳しく記載されていますが、どちらも理想的ではありません。[1]はあまりにも一般的すぎて役に立たず、[3]はIDと名前の両方を必要とします(サーバー側の言語にデータを投稿する場合)。理想的には、id属性またはname属性のみを持つことをお勧めします(特に、CSSにidが不要であり、タイプミスの可能性が高まる場合など、両方を持つことは多少冗長です)。 [2]が最も直感的であり、広く使用されているようですが、Geckoのドキュメントで参照されていることはありません。また、上位互換性とクロスブラウザー互換性の両方が心配です(もちろん、可能な限り標準に準拠しています)。 ここでのベストプラクティスは何ですか?誰でもこれを解決できるDOMドキュメントまたはW3C仕様で何かを指すことができますか? ライブラリ以外のソリューション(jQuery / Prototype)に特に関心があります。
136 javascript  html  forms  dom 

3
document.addEventListenerとwindow.addEventListenerの違いは何ですか?
PhoneGapのを使用している間、それが使用しているいくつかのデフォルトのJavaScriptコードを持っているdocument.addEventListenerが、私はその用途に私自身のコードを持っていますwindow.addEventListener: function onBodyLoad(){ document.addEventListener("deviceready", onDeviceReady, false); document.addEventListener("touchmove", preventBehavior, false); window.addEventListener('shake', shakeEventDidOccur, false); } 違いは何ですか?どちらを使用するのが良いですか?

2
指定された位置にある要素を取得する-JavaScript
JavaScriptを使用して、指定された位置にある要素をどのように識別できますか?基本的に、2つの入力パラメーター(x座標とy座標)を取り、パラメーターで表される画面上の位置にあるhtml要素を返す関数を記述しようとしています。
133 javascript  html  dom 

5
querySelector、ワイルドカード要素が一致しますか?
querySelectoror を使用してワイルドカード要素名の一致を行う方法はありquerySelectorAllますか?属性クエリではワイルドカードがサポートされていますが、要素自体はサポートされていません。 私が解析しようとしているXMLドキュメントは、基本的にプロパティのフラットリストであり、名前に特定の文字列が含まれている要素を見つける必要があります。 XMLドキュメントが必要な場合は、おそらく再構築が必要であることを理解していますが、それは起こりません。 明らかに非推奨となったXPath(IE9で削除された)の使用に戻る以外の解決策は許容されます。

5
データベースからの動的HTML文字列のコンパイル
状況 私たちのAngularアプリ内にネストされているのは、ng-bind-html-unsafe属性を持つdivを含む、コントローラーによってサポートされるPageというディレクティブです。これは、「pageContent」という$ scope変数に割り当てられます。この変数には、データベースから動的に生成されたHTMLが割り当てられます。ユーザーが次のページに移動すると、DBが呼び出され、pageContent変数がこの新しいHTMLに設定され、ng-bind-html-unsafeを介して画面上にレンダリングされます。これがコードです: ページディレクティブ angular.module('myApp.directives') .directive('myPage', function ($compile) { return { templateUrl: 'page.html', restrict: 'E', compile: function compile(element, attrs, transclude) { // does nothing currently return { pre: function preLink(scope, element, attrs, controller) { // does nothing currently }, post: function postLink(scope, element, attrs, controller) { // does nothing currently …

6
nodeValueとinnerHTMLおよびtextContent。選ぶ方法は?
プレーンjsを使用してラベル要素の内部テキストを変更していますが、innerHTMLまたはnodeValueまたはtextContentを使用する必要がある理由がわかりませんでした。新しいノードを作成したり、HTML要素を変更したりする必要はありません。テキストを置き換えるだけです。次にコードの例を示します。 var myLabel = document.getElementById("#someLabel"); myLabel.innerHTML = "Some new label text!"; // this works myLabel.firstChild.nodeValue = "Some new label text!"; // this also works. myLabel.textContent = "Some new label text!"; // this also works. 私はjQueryソースを調べましたが、nodeValueを1回だけ使用していますが、innerHTMLとtextContentを数回使用しています。次に、firstChild.nodeValueが大幅に高速であることを示すこのjsperfテストを見つけました。少なくとも私はそれを意味すると解釈しています。 firstChild.nodeValueの方がはるかに速い場合、何が問題なのでしょうか。広くサポートされていませんか?他に問題はありますか?

7
JavaScriptを使用してリンクを作成するにはどうすればよいですか?
タイトルの文字列とリンクの文字列があります。JavaScriptを使用してページにリンクを作成するために2つを組み合わせる方法がわかりません。どんな助けでもありがたいです。 EDIT1:質問に詳細を追加します。これを理解しようとしているのは、RSSフィードがあり、タイトルとURLのリストがあるためです。タイトルをURLにリンクして、ページを使いやすくしたいと思います。 EDIT2:私はjQueryを使用していますが、jQueryをまったく使用していないので、この状況で役立つかもしれないことに気付きませんでした。

2
window.location.href、window.location.replace、window.location.assignの違い
違いは何ですか window.location.href="http://example.com"; window.location.replace("http://example.com"); window.location.assign("http://example.com"); window.location.assign()現在のセッション履歴を置き換えるだけのフォーラムをたくさん読んだので、ブラウザの戻るボタンが機能しません。しかし、これを再現することはできません。 function fnSetVariable() { //window.location.href = "http://example.com"; window.location.replace("http://example.com"); //window.location.assign("http://example.com"); } <a onmouseover="fnSetVariable();" href="PageCachingByParam.aspx?id=12" > CLICK </a>
128 javascript  dom  location 

5
JavaScriptの名前による要素の取得
この関数を考えてみましょう: function validate() { var acc = document.getElementsByName('acc').value; var pass = document.getElementsByName('pass').value; alert (acc); } そして、このHTMLの部分: <table border="0" cellpadding="2" cellspacing="0" valign="top"> <tr> <td class="td1">Account</td> <td class="td2"><input type="text" name="acc" /></td> </tr> <tr class="td1"> <td>Password</td> <td class="td2"><input type="password" name="pass" /></td> </tr> </table> <div><button onClick="validate()" class="cupid-greenx">Login now</button></div> 警告ボックスは表示されていますが、「未定義」と表示されています。
127 javascript  html  dom 

16
DOM要素内のテキスト行を数えるにはどうすればよいですか?できますか?
たとえば、div内の行をカウントする方法があるかどうか疑問に思っています。次のようなdivがあるとします。 <div id="content">hello how are you?</div> 多くの要因に応じて、divには1行、2行、または4行のテキストを含めることができます。スクリプトが知る方法はありますか? 言い換えれば、自動ブレークはDOMで表されますか?
127 javascript  html  dom 

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.