2015-10-02 6 views
5

以下のコードでは、a[href^="/"]は正規表現ですか?「a [href^=」/「]」とはどういう意味ですか?

なぜ^シンボルがあり、それは何ですか?

どのクリックイベントに応答しますか、それとも応答しませんか?以下のコードで

$(document).on('click', 'a[href^="/"]', function(e) { 
    e.preventDefault(); 
    var href = $(e.currentTarget).attr('href'); 
    console.log('click ' + href); 
    Backbone.history.navigate(href, { trigger: true }); 
}); 

(code source)

+2

[重複?](http://stackoverflow.com/questions/11216134/what-does-this-jquery-code-with-square-brackets-and-a-caret-平均) – Firedrake969

+0

類似点はありますが、質問は全く同じではありません。 – Leahcim

+0

質問は本質的に同じです - 「^ =はどういう意味ですか?」 – Firedrake969

答えて

11

Q.は、a[href^="/"]正規表現ですか?

R.いいえ、正規表現ではありません。それは(CSSベースの)jQuery selectorです。

Q.なぜ^記号があり、それは何ですか?

startsWithを意味するので、この記号があります。

Q.どのクリックイベントに応答しますか?

R.それは、/で始まるhref属性を持つ任意のaタグに対応させていただきます。


注:外部リンクはhttp/https始まりますしながら、バックボーンのコードは、おそらく、ウェブサイトのすべての内部リンクを取得し、クライアントのナビゲーションを行うために彼らの行動を変えるためにそのセレクタを使用していること。

+0

私は必ずCSSセレクタと呼んでいるとは言えませんが、それはCSS文脈では使われていないからです。 –

+0

@AlbertXingあなたが正しいと思うのは、実際はCSSセレクタに基づいたjQueryセレクタです。私の答えを更新しました。 – Buzinas

+0

内部/外部リンクの差別化についての良い点(OPに対する詳細な回答に加えて) – Leahcim

2

^記号は、イベント/

2

a[href^="/"]で始まるリンクを実行することを示してセレクタである:

セレクタは、ツリー内の要素に対して一致するパターンであり、このような形態の一つとしてXML文書内のノードを選択するために使用できるいくつかの技術があります。セレクタはHTMLおよびXMLでの使用に最適化されており、パフォーマンスに重要なコードで使用できるように設計されています。

それが本当に正規表現ではありませんが、^シンボルは、種類の類似した正規表現^アンカーです。特定の属性セレクタとして使用されています:

6.3.2。サブストリングマッチング属性セレクタ

3つの追加属性セレクタは属性の値がストリングに一致するために設けられている

[ATT^=ヴァル]

値で始まるのatt属性を持つ要素を表し接頭辞「val」。 "val"が空文字列の場合、セレクタは何も表しません。

[ATT $ =ヴァル]

は値接尾辞 "ヴァル" で終わるのatt属性を持つ要素を表します。 "val"が空文字列の場合、セレクタは何も表しません。

[ATT * =ヴァル]

値ストリング「ヴァル」の少なくとも一つのインスタンスを含むATT属性を持つ要素を表します。 "val"が空文字列の場合、セレクタは何も表しません。

これらは要素属性のセレクタです(hrefは属性です)。

W3C仕様:Selectors Level 3

関連する問題