jQuery对象与JavaScript对象的相互转换

发表于 | 分类于 | | 浏览 次

简介

jQuery对象是DOM对象经过jQuery包装之后产生的对象，其是jQuery独有的，可以使用jQuery里面的方法，但不能使用DOM的方法，同样的DOM对象也不能使用jQuery里面的方法， $("#username") 是一个jQuery对象， document.getElementById("username") 是一个DOM对象，比如我们要给 id 为 username 的 input 标签赋值 test，使用DOM对象中的方法可以这样

document.getElementById("username").value = "test";

而使用jQuery对象可以这样

$("#username").val("test");

以上两种方式都是单独使用DOM或者jQuery实现给input赋值，那么如果我们获取到了一个jQuery对象，能不能通过某种方式把DOM对象转换成jQuery对象或者把jQuery对象转换成DOM对象呢，答案是肯定的。

jQuery对象转换成DOM对象

1
2
3
4
5
var username = $("#username"); #这里获取的是一个jQuery对象

var usernameDom = username.get(0);  
或者 
var username = $username[0]  #这里的usernameDom对象现在就是一个DOM对象了，它是从jQuery对象中获取到的

DOM对象转换成jQuery对象

1
2
3
var username = document.getElementById("username"); #这里获取的是一个DOM对象

var $username = $(username); #现在这里的$username对象现在就是一个jQuery对象

参考资料

  1. jQuery对象与js对象互相转换
  2. JQuery对象与javascript对象的转换
  3. jQuery官方英文文档
  4. jQuery中文文档
显示评论