問題タブ [selectors-api]
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.
javascript - XPath または querySelector?
XPath は、querySelector が実行できるすべてのこと、およびそれ以上のことを実行できます。この 2 つを比較する速度のベンチマークは見たことがありません。そのため、現時点では構文の簡潔さに基づいて選択していますが、これは恣意的なものに思えます。
編集: おそらく、私は Firefox 用の Greasemonkey スクリプトを作成していると述べるべきだったので、ブラウザー間の互換性について心配しておらず、ライブラリを含めたくありません。
jquery - :jQuery の nth-of-type() / シズル?
Sizzle (jQuery が使用するセレクター エンジン) には組み込みの:nth-child()
セレクターが付属しているのに、セレクターがないことに驚きました:nth-of-type()
。
:nth-child()
ととの違い:nth-of-type()
を説明して問題を説明するために、次の HTML ドキュメントを考えてみましょう。
Sizzle はブラウザー ネイティブのメソッドquerySelector()
とquerySelectorAll()
メソッドが存在する場合 (つまり、セレクター APIを既に実装しているブラウザー内)にそれらを使用するため$('body p:nth-child');
、もちろん動作します。ただし、Sizzle にはこのセレクターのフォールバック メソッドがないため、古いブラウザーでは機能しません。
:nth-of-type()
セレクターを Sizzleに簡単に追加したり、jQuery に実装したりすることは可能ですか (おそらく組み込みの:nth-child()
selectorを使用して)? パラメータ付きのカスタムセレクターがいいでしょう。
css - データ属性のセレクター API
HTML5 では、CSS セレクターは data-* 属性でうまく動作するようです。例えば:
最初の を適切にスタイルします。ただし、selectors-api を使用してそのような要素を選択しようとすると失敗します。例:
また
Chrome と Safari では、これにより不可解なエラーが発生します。
SYNTAX_ERR: DOM 例外 12
selectors-api を使用して data-* 属性に基づいて要素を適切に選択する方法について何か考えはありますか?
javascript - querySelectorはすべてのブラウザでサポートされていますか?
querySelectorはすべてのブラウザでサポートされていますか?それが使用するための代替手段ではありませんか?
IE8、FF3、Chrome4でテストしました。問題ありません。私は古いブラウザを持っていません。だから私は古いブラウザが私に問題を与えるかどうか知りたいですか?
javascript - Javascript を使用してチェックボックスから値を渡す
チェックボックスから値を渡そうとする単純なフォームを作成しています...
...この関数を使用して:
そして、このすべての値を同時に渡すという事実を除けば、問題なく動作します。
これについて私を助けてください。
よろしくお願いします
ドム
javascript - querySelector('#id') が document.getElementById('id') にマップされないのはなぜですか?
私は最近、セレクターのパフォーマンスに夢中になっています。現在セレクター API を実装しているブラウザーはdocument.getElementById
、単純なパラメーター#id
が渡されたときに使用しないことに悩まされています。
パフォーマンスの低下は非常に大きいため、ライブラリの作成者はそれを回避する独自の方法を実装し続けています。
何か案は?
javascript - JavaScriptを介したCSS疑似要素スタイルの変更
JavaScriptを介してCSS疑似要素スタイルを変更することは可能ですか?
たとえば、次のようにスクロールバーの色を動的に設定したいと思います。
また、スクロールバーに次のように非表示にするように指示できるようにします。
ただし、これらのスクリプトは両方とも次を返します。
Uncaught TypeError:nullのプロパティ'style'を読み取れません
これについて他の方法はありますか?
クロスブラウザーの相互運用性は重要ではありません。Webkitブラウザーで機能するために必要なだけです。
javascript - querySelector による javascript addEventListener が機能しない
こんにちは、これは私のjavascriptコードです:
このコードから、最後から2行目の「ads.addEventListener」以外はすべて正常に動作します。理由は何ですか?私はここで何か間違っていますか..?
広告クラスに追加された div をクリックして、公開機能を呼び出す必要があります。
誰も私を助けますか?
javascript - querySelectorAllで要素の子のみを検索し、すべての子孫を検索しないようにする方法はありますか?
たとえば、ドキュメントのスニペットがある場合:
(これは架空のドキュメントです。HTMLパーサーは実際にはこのようなDOMを構築しません。)
そして、最も外側の<div>
要素への参照、私はどういうわけか、外側の直接の子である要素outerDiv.querySelectorAll('p')
のみを選択するために使用したいと思います。<p>
<div>
実際にはよりもはるかに長いセレクターがあるため、要素を使用outerDiv.childNodes
して検索することはできません(たとえば、のように見える場合があります)。また、HTMLを制御できず、jQueryやその他のJavaScriptライブラリを使用できません。<p>
"p"
"p > a > b"
また、内部もに一致"div > "
するため、セレクターの前に追加して適用するだけでは不十分です。outerDiv.parentNode
<p>
"div > p"
CSSセレクターを自分で解析しすぎずにこれを行うためのクリーンな方法はありますか?
javascript - querySelector 検索直下の子
私はいくつかのjqueryのような機能を持っています:
問題は、どうすれば同じことができquerySelector()
ますか?
問題は、親を明示的に指定する必要がある>
セレクターです。querySelector()
回避策はありますか?