DOM要素をjQuery要素に変換するにはどうすればよいですか?


277

document.createElement()で要素を作成しています。Jqueryオブジェクトのみを受け取る関数に渡すにはどうすればよいですか?

$("#id") 

要素がまだページに表示されていないため、使用できません。


2
この質問は、stackoverflowの最良の質問として授与される必要があります
Oliver

回答:


445
var elm = document.createElement("div");
var jelm = $(elm);//convert to jQuery Element
var htmlElm = jelm[0];//convert to HTML Element

10
これが機能するのは、jqueryが文字列セレクターだけでなく、既存のjqueryオブジェクト、または有効なdomオブジェクトをメインの$()クエリ関数の引数として受け取るためです。
Samuel Meacham、

逆はどうですか?jquery要素があり、それをdom要素に変換したいですか?
Ryan Sampson、2010

2
:逆にすることによって行うことができjohnjianfang.blogspot.com/2009/04/...
ライアンサンプソン

すばらしい!非常に便利
オリバー

ちょっと@Mariusは、elmにDOMノードのコレクションが含まれている場合に機能しますか?
daremkd

16

jQueryを使用して要素を構築するのはどうですか?例えば

$("<div></div>")

ページに追加する準備ができた新しいdiv要素を作成します。さらに短くすることができます

$("<div>")

次に、必要なコマンドをチェーンし、イベントハンドラーを設定して、それをDOMに追加できます。例えば

$('<div id="myid">Div Content</div>')
    .bind('click', function(e) { /* event handler here */ })
    .appendTo('#myOtherDiv');

2
実際には、コードを変更できない場所から要素を取得しています
Tanmoy

2

これまでのところ、私が作成した最善の解決策:

function convertHtmlToJQueryObject(html){
    var htmlDOMObject = new DOMParser().parseFromString(html, "text/html");
    return $(htmlDOMObject.documentElement);
}
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.