5

要素に追加することの違いは何ですか

$('#my_parent_element').append('<div>');​

また

$('#my_parent_element').append($('<div>'));​

$('#my_parent_element').append('<div/>');​

また

$('#my_parent_element').append($('<div/>'));​

このスラッシュの目的は何ですか/

そして、この要素をjQuery要素に変換する目的は何$ですか?

jQueryがこの方法で要素を追加できるのはなぜですか?

4

3 に答える 3

4

1 つは完全に有効なコードであり、現在および将来すべてのブラウザーで動作することが保証されています。もう 1 つは不完全であり、エッジ ケースの状況では動作しない可能性があります。

明確にするために、あなたはしたいです'<div/>'

jQuery は要素の作成/操作のみ可能で、開始タグと終了タグは実行できません。処理されて DOM に格納されると、要素は開始タグと終了タグで表されなくなり、ツリー構造のノードとして表されます。

.append("<div />")vsに関して.append( $("<div />") )は、両者の間に違いはほとんどありません。どちらも同じアクションを実行します。

"<div>"vsは"<div />"API で十分に文書化されています。http://api.jquery.com/jQuery/#jQuery2

"<div>"vs"<div/>"は非常に単純なケースであり、現在および将来すべてのブラウザーで「機能する」はずですが、より複雑になると、html の解析方法におけるブラウザー間の違いで問題が発生します。

于 2012-10-09T15:54:09.070 に答える
3

それは同じだ:

コンストラクター メソッドのjquery ソースから

// Match a standalone tag
rsingleTag = /^<(\w+)\s*\/?>(?:<\/\1>|)$/,


jQuery.fn = jQuery.prototype = {
    constructor: jQuery,
    init: function( selector, context, rootjQuery ) {
    //cut
            if ( selector.charAt(0) === "<" && selector.charAt( selector.length - 1 ) === ">" && selector.length >= 3 ) {
            // Assume that strings that start and end with <> are HTML and skip the regex check
            match = [ null, selector, null ];

            }
    //cut
            // scripts is true for back-compat
            selector = jQuery.parseHTML( match[1], doc, true );
            if ( rsingleTag.test( match[1] ) && jQuery.isPlainObject( context ) ) {
                    this.attr.call( selector, context, true );
            }
    // cut
    }
    //CUT
    parseHTML: function( data, context, scripts ) {
        // Single tag
        if ( (parsed = rsingleTag.exec( data )) ) {
            return [ context.createElement( parsed[1] ) ];
        }
    }

正規表現が と の両方にrsingleTag一致することがわかるように、最初のコントロールは、文字列の長さが >=3の開始文字と終了文字のみをチェックします。<div/><div><>

parseHTML メソッドは再び正規表現を実行するため、セレクターはタグの名前になります。

于 2012-10-09T16:18:56.753 に答える
1

これら4つのオプションのいずれにも大きな違いはないと思います。jQuery は、送信されたパラメーターを処理するときに柔軟です。

タグが 1 つしかない場合は、両者に違いはありません。

ただし、次の違いを理解する必要があります。

<div><span class="inner"> and <div/><span class="inner"/>

最初のものは以下を生成します:

<div><span class="inner"></span></div>

そして2番目のもの:

<div></div><span class="inner"></span>
于 2012-10-09T15:59:09.930 に答える