jquery - 開始タグと自己終了タグを使用して空の要素を作成する

Question

jQueryでは、これに違いはありますか？

$('<div>').appendTo('body');

この：

$('<div />').appendTo('body');

私はいつもそれを「自己閉鎖」の方法で見てきましたが、エラーなしでいくつかのプロダクションコードで使用されている最初の方法に出くわしました。これが将来的に問題を引き起こす可能性はありますか、それともこれは許容できる方法ですか？

score 12 · Accepted Answer

ドキュメントには次のように書かれています。

パラメータに$（'<img />'）や$（'<a> </a>'）などの単一のタグがある場合、jQueryはネイティブのJavaScript createElement（）関数を使用して要素を作成します。

それはまた言う：

要素を含めることができないタグは、クイッククローズされる場合とされない場合があります

したがって、フォーム$('<div>')も機能するようですが、文書化されていません。ドキュメントから明らかなように、終了タグが必要なタグには、その終了タグを付けるか、自己終了する必要があります。

将来のバージョンで重大な変更の犠牲になる可能性が低いため、文書化されたバージョンに固執します。

<rant>
jQueryライブラリには、可能な限り1つの関数呼び出しに入れる習慣があるため（on例については最近の追加を参照）、非自動終了タグ...
</rant>

score 6 · Accepted Answer

いいえ。これ$("<div>")もこれも$("<div />")問題を引き起こしません。

証明は、jQueryソース<...>に移動すると、単一のタグ構文を持つセレクターの場合、次の正規表現でセレクターを解析することがわかります。

rsingleTag = /^<(\w+)\s*\/?>(?:<\/\1>)?$/

シンボリック部分のみが使用されcreateElement、閉じスラッシュはオプションにすることができます。

score 4 · Accepted Answer

その構文は、その後に何も続かない限り、問題を引き起こしません。

$("<div>") // Ok!
$("<div>foobar") // Not Ok!
$("<div><p>") // Not Ok!

3 に答える 3