ホームページ > 記事 > ウェブフロントエンド > domオブジェクトをjqueryオブジェクトに変換する方法
domオブジェクトをjqueryオブジェクトに変換する方法
- 青灯夜游オリジナル
- 2022-03-11 15:32:414655ブラウズ
dom オブジェクトを jquery オブジェクトに変換する方法: "$()" を使用して DOM オブジェクトをラップするだけです、構文は "$(DOM object)" です; 変換後、任意の jQuery メソッドを使用できます。
このチュートリアルの動作環境: Windows7 システム、jquery1.10.2 バージョン、Dell G3 コンピューター。
DOM オブジェクト
DOM (Document Object Model、Document Object Model) では、各 DOM をツリーとして表すことができます。まず簡単な例を見てみましょう。 コードは次のとおりです。
// ...省略其他代码
<h3>例子</h3>
<p title="选择你最喜欢的水果">你最喜欢的水果是？</p>
<ul>
<li>苹果</li>
<li>橘子</li>
<li>菠萝</li>
</ul>
// ...省略其他代码は、上記の HTML 構造を DOM ツリーとして記述します。
この DOM 内のノードツリーは DOM 要素ノードです。 JS の getElementByTagName または getElementById を通じて要素ノードを取得できます。このようにして得られたDOM要素がDOMオブジェクトです。
jQuery オブジェクト
jQuery オブジェクトは、DOM オブジェクトを jQuery でラップすることで生成されるオブジェクトです。
jQuery オブジェクトは jQuery に固有のものです。オブジェクトが jQuery オブジェクトの場合は、jQuery のメソッドを使用できます。 DOM オブジェクトのメソッドを jQuery オブジェクトで使用することはできません。また、同じ DOM オブジェクトで jQuery のメソッドを使用することはできません。
dom オブジェクトを jquery オブジェクトに変換する方法
DOM オブジェクトの場合、DOM オブジェクトを $() でラップするだけで jQuery オブジェクトを取得できます。 。メソッドは $(DOM object) で、変換後は jQuery の任意のメソッドを使用できます。
注: 一般的に使用される jQuery オブジェクトは、$() 関数を通じて製造されます。$() 関数は、jQuery オブジェクトの製造ファクトリーです。
jquery コードは次のとおりです:
<body>
<p>my</p>
<p>my</p>
<script src="jquery-1.10.2.min.js"></script>
<script>
var cr = document.getElementsByTagName("p") //DOM对象
var $cr = $(cr); //jquery对象
$cr.eq(0).("fuck"); //检测是否转换成功，可以用jquery方法 输出结果为第二个my改成了fuck
$cr.eq(1).html("you"); //输出结果为my改成you
</script>
</body>変換後は、任意の jquery メソッドを使用できます。
上記のメソッドを通じて、jquery オブジェクトと DOM オブジェクトの Web ページ効果を自由に相互に変換できます。
最後に、DOM メソッドを使用できるのは DOM オブジェクトだけであることを再度強調します。jquery オブジェクトは DOM 内のメソッドを使用できませんが、jquery オブジェクトは DOM を操作するためのより完全なツール セットを提供します。
[推奨学習: jQuery ビデオ チュートリアル 、Web フロントエンド ビデオ ]
以上がdomオブジェクトをjqueryオブジェクトに変換する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。