jqueryオブジェクトがhtmlオブジェクト(つまりjsのdomオブジェクト)にどのように変換されるか

2499 ワード

コアヒント:jqueryセレクタで得られたjqueryオブジェクトと標準javascriptのdocument.getElementById()で取得したdomオブジェクトは2つの異なるオブジェクトタイプであり、一般的にS(’#id’)のようにjqueryオブジェクトが得られ、jsのdomメソッドは使用できない.したがって、jqueryオブジェクトが標準的なdomメソッドを使用する場合は、オブジェクト変換が必要です.
jQueryの勉強を始めたばかりで、jQueryオブジェクトとDOMオブジェクトの区別がつかないかもしれません.DOMオブジェクトの解釈が少ないことについては,接触が多すぎるので,jQueryと両者の相互間の変換に重点を置いて紹介する.
jQueryオブジェクトとは?
---jQueryでDOMオブジェクトをパッケージしたオブジェクトです.jQueryオブジェクトは、jQuery独自のメソッドを使用することができます.
例:
$("#test").html()とは、IDがtestの要素内のhtmlコードを取得することを意味します.ここでhtml()はjQueryのメソッドです
このコードはDOMでコードを実装するのと同じです.
 
document.getElementById("id").innerHTML;
jQueryオブジェクトはDOMオブジェクトをパッケージング後に生じるが、jQueryはDOMオブジェクトのいかなる方法も使用することができず、同様にDOMオブジェクトもjQuery内の方法を使用することができない.むやみに使うと間違いを報告する.例:$("#test").innerHTML、document.getElementById("id").html()などの書き方は間違いです.
もう一つ注意したいのは、#idをセレクタとして取得するのはjQueryオブジェクトとdocumentである.getElementById(「id」)で得られたDOMオブジェクトは,両者は等価ではない.以下に述べる両者間の遷移を参照してください.
jQueryに違いがあるが関連がある以上、jQueryオブジェクトとDOMオブジェクトは互いに変換されてもよい.両者を変換する前に、まず、jQueryオブジェクトを取得した場合、var$variab=jQueryオブジェクトなどの変数の前に$を追加します.DOMオブジェクトが取得された場合、var variab=DOMオブジェクトは慣習と同様です.このような約束は説明と区別が容易であるだけで、実際の使用では規定されていない.
jQueryオブジェクトからDOMオブジェクトへ:
2つの変換方式は1つのjQueryオブジェクトをDOMオブジェクトに変換する:[index]と.get(index);
(1)jQueryオブジェクトはデータオブジェクトであり,[index]の方法で対応するDOMオブジェクトを得ることができる.
例:var$v=$("#v");//jQueryオブジェクト
var v=$v[0];//DOMオブジェクト
alert(v.checked)/このcheckboxが選択されているかどうかを検出
(2)jQuery自体が提供する、通過する.get(index)メソッド、対応するDOMオブジェクトを得る
例:var$v=$("#v");//jQueryオブジェクト
var v=$v.get(0);//DOMオブジェクト
alert(v.checked)/このcheckboxが選択されているかどうかを検出
DOMオブジェクトからjQueryオブジェクトへ:
既にDOMオブジェクトである場合、DOMオブジェクトを$()でパッケージするだけで、jQueryオブジェクトを得ることができます.$(DOMオブジェクト)
例:var v=document.getElementById("v");//DOMオブジェクト
var $v=$(v);//jQueryオブジェクト
変換後、jQueryのメソッドを任意に使用できます.
以上の方法により,jQueryオブジェクトとDOMオブジェクトを任意に相互変換することができる.なお、DOMオブジェクトはDOMのメソッドを使用することができ、jQueryオブジェクトはDOMのメソッドを使用することはできません.
 
 
最近のプロジェクト:
手形入庫手形消込手形発行手形返却手形紛失申告手形結報
function querypiaoju(obj){     if(obj.checked){
alert(obj.value);
}
}
 
function doSearch(){querypiaoju($(「input[name='querypiaoju]:checked」).get(0);//jqueryオブジェクトを元のdomオブジェクトに変換する}
 
$("#test")           //jQuery  
$("#test")[0]       //jQuery  ->   DOM  
$($("#test")[0])   //DOM  ->jQuery  (   ,       $()      DOM     jQuery    )