jquery - jQueryセレクターでこれまでに見たことのないもの

Question

この構文のセレクターは見たことがありません。誰かが私にそれを説明できますか？

var $select = $('<select>', { id: 'csvMarketSelector', name: 'csvMarketSelector' });

また

var $marketSelectorContainer = $('<div>').add($('<p>', { text: settings.marketLabel })

settings.marketLabel; を理解しました。上記のようなセレクターは見たことがありません。ピエロはご遠慮ください。ここを含めて自分の答えを探しましたが、役立つものは何も見つかりませんでした。

前もって感謝します。

score 5 · Accepted Answer

ここの文字列はセレクターではありません。このjQuery関数は、新しい DOM 構造に解析するHTML 文字列も受け入れることができます。この関数の使用に可能な形式は次のとおりです。jQuery

jQuery( html [, ownerDocument] ) // htmlString, document

jQuery( html, attributes )       // htmlString, Object

新しい DOM 要素は、他の選択された要素と同様に、jQuery リストに保持されます。操作関数を使用して、後でページの DOM に追加できます。

score 4 · Accepted Answer

var $select = $('<select>', {
    id: 'csvMarketSelector',
    name: 'csvMarketSelector'
});

説明：

$('<select>':

<select>jQuery オブジェクトにラップされた新しい要素を作成する

{ id: 'csvMarketSelector', name: 'csvMarketSelector' }

: その要素のプロパティを設定します (つまり<select>)

var $select

jquery オブジェクトを変数に割り当てる$select

これで、この変数を次のように使用できます-

$('body').append($select);

より詳しい情報：

score 0 · Accepted Answer

var $select = $('<select>', { id: 'csvMarketSelector', 
                              name: 'csvMarketSelector' 
                            });

id 属性と name属性を指定して select 要素を作成するだけです。

しかし、作成された要素はまだ DOM に追加されていません。

.append(HTML を DOM に挿入するまたは任意のメソッドを使用できます。

$('#div').append($select)

score 0 · Accepted Answer

波括弧内の部分は、$('') によって作成される要素に適用される属性のハッシュです。Sushanth が言及しているように、まだ DOM に追加されていません。これを行うことにより、別の構文を使用して同じ結果を達成することもできます。

var $select = $('<select id="csvMarketSelector" name="csvMarketSelector">');

まだ誰も言及していない重要なことは、これら 2 種類の属性指定を混在させて一致させることはできないということです。

var $select = $('<select id="csvMarketSelector">', {name: 'csvMarketSelector'});

上記の行は失敗します。すべての属性をタグに入れるか、そのタグに関連付けられたハッシュに入れる必要があります。

4 に答える 4