ホームページ > ウェブフロントエンド > jsチュートリアル > jQueryオブジェクトとは何ですか? jQueryオブジェクトをDOMオブジェクトインスタンスに変換する方法の詳細な説明

jQueryオブジェクトとは何ですか? jQueryオブジェクトをDOMオブジェクトインスタンスに変換する方法の詳細な説明

伊谢尔伦
リリース: 2017-07-20 13:13:45
オリジナル
2099 人が閲覧しました

初めて jQuery を学習し始めると、どれが jQuery オブジェクトでどれが DOM オブジェクトであるかわからないかもしれません。 DOM オブジェクトに関してはあまり説明がありませんが、jQuery とその 2 つの変換に焦点を当てましょう。

jQuery オブジェクトとは何ですか?

---DOMオブジェクトをjQueryでラップして生成したオブジェクトです。 jQuery オブジェクトは jQuery に固有であり、jQuery のメソッドを使用できます。

例:

$("#test").html() は、ID テストを持つ要素内の HTML コードを取得することを意味します。このうち、html()はjQueryのメソッドです

このコードは、DOMを使用してコードを実装するのと同等です:

document.getElementById("id").innerHTML;
DOMオブジェクトをラップした後にjQueryオブジェクトが生成されますが、 , jQuery DOM オブジェクトのメソッドも同様に、むやみに使用するとエラーが報告されます。例: $("#test").innerHTML、document.getElementById("id").html() などの記述方法が間違っています。

もう 1 つの注意点は、#id をセレクターとして使用して取得される jQuery オブジェクトと document.getElementById("id") で取得される DOM オブジェクトは同等ではないということです。以下の 2 つの間の変換を参照してください。

jQuery は異なるものですが関連しているため、jQuery オブジェクトと DOM オブジェクトを相互に変換することもできます。 2 つを変換する前に、まず規則を作成します。jQuery オブジェクトが取得された場合は、次のように変数の前に $ を追加します。DOM オブジェクトが取得された場合は、次と同じです。通常. : var variab = DOM object; この規則は説明と区別の便宜のためだけであり、実際の使用では規定されていません。

jQuery オブジェクトを DOM オブジェクトに変換する:

jQuery オブジェクトを DOM オブジェクトに変換する 2 つの変換メソッド: [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 object)

例:


var v=document.getElementById("v"); //DOM对象
var $v=$(v); //jQuery对象
ログイン後にコピー

変換後は、jQuery メソッドを自由に使用できます。

上記のメソッドにより、jQueryオブジェクトとDOMオブジェクトを任意に相互変換することができます。もう一度強調しておく必要があるのは、DOM 内のメソッドを使用できるのは DOM オブジェクトのみであり、jQuery オブジェクトは DOM 内のメソッドを使用できないということです。

以上がjQueryオブジェクトとは何ですか? jQueryオブジェクトをDOMオブジェクトインスタンスに変換する方法の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート