Js - Dom原生對象和jQuery對象的聯系、區別、相互轉換


Dom原生對象和jQuery對象的聯系、區別、相互轉換:

聯系:
  1、jQuery對象:通過jQuery包裝DOM對象后產生的對象;
  2、兩者之間可以相互轉換;
區別:
  1、jquery選擇器得到的jquery對象和標准的 javascript中的document.getElementById()取得的dom對象是兩種不同的對象類型,兩者不等價;
  2、jQuery無法使用DOM對象的任何方法,同理DOM對象也不能使用jQuery里的方法. 亂使用會報錯。

例如:
  $("#id").html();
  document.getElementById("id").innerHTML;
  意思是指:獲取ID為id的元素內的html代碼。這兩段代碼結果相同,但中間的取值過程不同。
  即:$("#id").innerHTML、document.getElementById("id").html()之類的寫法都是錯誤的。

相互轉換:
  jQuery對象轉成DOM對象---兩種轉換方式:[index]和.get(index)
  1、jQuery對象是一個數據對象,通過[index]的方法
  如:var $v = $("#v") ; //jQuery對象
  var v = $v[0]; //DOM對象
  alert(v.checked) //檢測這個checkbox是否被選中
  2、jQuery本身提供,通過.get(index)方法
  如:var $v = $("#v"); //jQuery對象
  var v = $v.get(0); //DOM對象
  alert(v.checked) //檢測這個checkbox是否被選中

  DOM對象轉成jQuery對象:
  對於DOM對象,只需用$()把DOM對象包裝起來,就可得到jQuery對象
  如:var v=document.getElementById("v"); //DOM對象
  var $v=$(v); //jQuery對象

需要注意:jQuery無法使用DOM對象的任何方法,同理DOM對象也不能使用jQuery里的方法. 亂用會影響代碼執行。

 

水平有限,文中錯誤不妥在所難免,歡迎批評指正建議評論。文章將不定期修改完善斧正。謝謝!

 

參考文檔:

JQUERY 對象與DOM對象之兩者相互間的轉換

http://www.jb51.net/article/17911.htm

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM