dom物件轉換成jquery物件的方法:只要使用「$()」把DOM物件包裝起來即可,語法為「$(DOM物件)」;轉換後,就可以任意使用jQuery中的方法了。
本教學操作環境:windows7系統、jquery1.10.2版本、Dell G3電腦。
DOM物件
DOM(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物件就是透過jQuery包裝DOM物件後產生的物件。
jQuery物件是jQuery獨有的。如果一個物件是jQuery對象,那麼就可以使用jQuery裡的方法。在jQuery物件中無法使用DOM物件的任何方法,同樣的DOM物件也不能使用jQuery裡的方法。
怎麼將dom物件轉換成jquery物件
對於一個DOM對象,只要用$()把DOM物件包裝起來,就可以獲得一個jQuery物件了。方式為$(DOM物件), 轉換後,就可以任意使用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物件網頁特效。
最後再次強調,DOM物件才能使用DOM方法,jquery物件不能使用DOM中的方法,但jquery物件提供了一套更完善的工具來操作DOM。
【推薦學習:jQuery影片教學、web前端影片】
以上是怎麼將dom對象轉換成jquery對象的詳細內容。更多資訊請關注PHP中文網其他相關文章!