jQuery对象可通过索引或get()方法转为JS DOM对象,而JS DOM对象则可通过$()函数转为jQuery对象,掌握二者转换可提升开发灵活性。

jQuery对象和JavaScript原生对象(DOM对象)在使用时有不同的方法和属性,因此在开发中经常需要进行相互转换。下面介绍它们之间的转换方式。
1. jQuery对象转为JS对象(DOM对象)
jQuery对象本质上是一个类数组对象,封装了多个DOM元素。要将其转换为原生的JS DOM对象,可以通过索引访问或使用.get()方法。
- 通过索引获取:使用[index]语法取出对应的DOM元素
- 使用.get(index)方法:返回指定位置的DOM元素,不传参数则返回所有元素组成的数组
示例:
// 获取第一个匹配的DOM元素var $div = $('div');
var divJs = $div[0]; // 或者 $div.get(0)
2. JS对象(DOM对象)转为jQuery对象
将原生DOM元素转换为jQuery对象,只需将其作为参数传递给$()函数即可。这样就可以调用jQuery提供的各种方法。
示例:
// 原生JS获取元素var divElement = document.getElementById('myDiv');
// 转换为jQuery对象
var $div = $(divElement);
转换后就可以使用如.fadeIn()、.addClass()等jQuery方法。
基本上就这些。掌握这两种转换方式,能让你在使用原生JS和jQuery时更加灵活。注意不要混淆两者的调用方式,避免出现方法未定义的错误。










