18

querySelectorAll は ID でピリオド (.) 文字をサポートしていますか?

つまり、以下のような要素を追加すると:

var div = document.createElement('div');
div.id='my.divid';
document.body.appendChild(div);

次に、以下のように querySelectorAll を使用します。

document.querySelectorAll('#my.divid');

それから私は何も得ません！

したがって、ピリオドは id の正当な文字であり、querySelectorAll は Firefox が提供する公式のメソッドです。メソッドが id でピリオド (.) をサポートしていないとは信じられません。私は何か間違いをしましたか？

4

2 に答える 2

32

.がクラス セレクターを表していることを覚えておく必要があります。そのため、セレクターは ID を持つ要素ではなく#my.divid、IDmyと classdividを持つ要素を表します。したがって、次の要素がセレクターに一致します。my.divid

var div = document.createElement('div');
div.id = 'my';
div.className = 'divid';
document.body.appendChild(div);

上記の ID を持つ要素を選択する必要がある場合はmy.divid、ピリオドをエスケープする必要があります。

document.querySelectorAll('#my\\.divid');

バックスラッシュが 2 つあるのは、JS セレクター文字列であるためです。CSS ルールでは、バックスラッシュを 1 つ使用します。#my\.divid

于 2013-07-10T05:53:05.013 に答える
2

中のピリオドはquerySelectorAll、css クラスを指定していることを意味します。あなたの場合、 「my」でCSSクラス「divid」を持つquerySelectorAllDOM要素を見つけようとしています。id今回は、クラスではなく ID で要素が必要であることをどのようにquerySelectorAll知ることができますか? idメソッドを混乱させないように、適切な属性を持つのはあなた次第です。ピリオドを使用することはできますが、jquery などの他のライブラリと混同しないように、ほとんどの場合ピリオドを使用しないことをお勧めします。

于 2013-07-10T05:54:01.620 に答える