3

John Resigの投稿: http ://ejohn.org/apps/workshop/adv-talk/#3 には、オブジェクトパラメータを使用してメソッドをアタッチできると書かれています。

'text'は問題なく機能しているように見えますが、オブジェクト内の他のすべてのものが属性として要素に追加されます。

これに添付できる他の方法はありますか?

$("<li/>", { 
  click: function(){}, 
  id: "test", // mix ids and jQuery methods 
  class: "clickable" 
});

それともこれが解決策ですか?

$("<li/>")
  .click(function(){})
  .attr("id","test")
  .addClass("clickable");
4

4 に答える 4

2

jQueryソースを見ると、@Nealはほぼ正しいように見えます。構文を使用しているようです

$(htmlCode, config);

呼び出しと同等です:

$(htmlCode).attr(config, true);

キーにリストされている場合、キーで指定されたjQuery関数を呼び出すようにtrue指示する(文書化されていない?)パラメーターはどこにありますか。このリスト(少なくともjQuery 1.6.4では)には、次の関数が含まれています。.attr()config$.attrFn$.attrFn

val、css、html、text、data、width、height、offset、blur、focus、focusin、focusout、load、resize、scroll、unload、click、dblclick、mousedown、mouseup、mousemove、mouseover、mouseout、mouseenter、mouseleave、変更、選択、送信、キーダウン、キープレス、キーアップ、エラー

したがって、configオブジェクトには、属性名とその値(デフォルト)を表すキー、または上記の関数名と最初の引数のいずれかを含めることができます。Resigは、構成オブジェクトのキーとして表示されるときにタイプミスがあると思いますaddClass。これは、ご存知のように、これは「addclass」という名前の属性を生成するだけだからです。

于 2011-09-15T22:41:39.787 に答える
1
$("<li/>", {
      //any attribute can go here
      'id': 'text',
      'class': 'clickable'
   })
  .click(function(){})
于 2011-09-15T22:21:18.080 に答える
1

両方の方法をテストしました。どちらのアプローチでも同じ結果(HTMLコード、DOMプロパティ)が生成されますが、2番目のオプションは2倍高速です。

テストケース:

javascript:void(function(){
var t=new Date;
for(var i=0;i<100;i++){

/*paste code here, copy the whole code to the location bar*/

}
alert((new Date).getTime()-t.getTime())})();
于 2011-09-15T22:37:17.443 に答える
0

単純なパフォーマンス上の利点の結果を考えると、要素を定義するために2番目のパラメーターオブジェクトを使用するケースはあまりないように思われることは明らかだと思います。

John Resigも指摘しているように、これは複雑な作成にも使用できます。

$("<li><a></a></li>") // li 
  .find("a") // a 
    .attr("href", "http://ejohn.org/") // a 
    .html("John Resig") // a 
  .end() // li 
  .appendTo("ul");

私の想定では、この方法では遅くなると思いましたが、この例の方が読みやすく、@nrabinowitzで言及されているサブセットの代わりに完全なjQueryメソッドのサポートが可能であることがわかりました。

于 2011-09-16T16:21:29.707 に答える