0

0

jquery和document获取html元素的区别是什么?

青灯夜游

青灯夜游

发布时间:2020-11-20 16:40:02

|

10322人浏览过

|

来源于博客园

转载

区别:jquery获取的html元素是jquery对象,可以执行jquery的方法,而document获取的是dom对象,执行的是dom的方法。jQuery对象是jQuery独有的,不能用DOM方法;而DOM对象也不能用jQuery方法。

jquery和document获取html元素的区别是什么?

相关推荐:《jQuery教程

最近通过ocx做了一个视频插件,然后将插件放到html中(想知道的可以看一下)

因为我要操作这个插件,要播放,停止等,所以我需要获取这个元素,不出意外的,我就用jquery来获取,然后根本无法执行,然后用document来获取,正常执行,具体的如下所示

//正常执行     var obj = document.getElementById("player00");
obj.testhelloworld();//无法执行var playobj = $('#player00');
playobj.testhelloworld();

然后我就在想,这两者有什么区别呢?然后搜索了如下结论

立即学习前端免费学习笔记(深入)”;

jquery获取的html元素是jquery对象,可以执行jquery的方法,而document获取的是dom对象,执行的是dom的方法

说明:

DOM对象是我们用传统的方法(javascript)获得的对象,jQuery对象就是用jQuery的类库选择器获得的对象。JQuery对象就是通过jQuery包装DOM对象后产生的对象。JQuery对象是jQuery独有的,其可以使用jQuery里的方法,但是不能使用DOM的方法

顿时释然,我此前一直认为两个是等价的,并为追究为什么dom的方法为什么不能在jquery来执行,现在想想,完全释然了。

既然这样,那么两者之间怎么互相转化呢?毕竟所得到的对象的内容是一样的。

jQuery对象转成DOM对象: 

两种转换方式将一个jQuery对象转换成DOM对象:[index]和.get(index); 

CodiumAI
CodiumAI

AI代码测试工具,在IDE中获得重要的测试建议

下载

(1)jQuery对象是一个数据对象,可以通过[index]的方法,来得到相应的DOM对象。 

如:

var $v =$("#v") ; //jQuery对象 
var v=$v[0]; //DOM对象 
alert(v.checked) //检测这个checkbox是否被选中

(2)jQuery本身提供,通过.get(index)方法,得到相应的DOM对象 

如:

var $v=$("#v"); //jQuery对象 
var v=$v.get(0); //DOM对象 
alert(v.checked) //检测这个checkbox是否被选中

DOM对象转成jQuery对象: 

对于已经是一个DOM对象,只需要用$()把DOM对象包装起来,就可以获得一个jQuery对象了。$(DOM对象) 

如:

var v=document.getElementById("v"); //DOM对象 
var $v=$(v); //jQuery对象

转换后,就可以任意使用jQuery的方法了。 

通过以上方法,可以任意的相互转换jQuery对象和DOM对象。需要再强调注意的是:DOM对象才能使用DOM中的方法,jQuery对象是不可以用DOM中的方法。 

更多编程相关知识,请访问:编程课程!!

相关文章

HTML速学教程(入门课程)
HTML速学教程(入门课程)

HTML怎么学习?HTML怎么入门?HTML在哪学?HTML怎么学才快?不用担心,这里为大家提供了HTML速学教程(入门课程),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
c++ 根号
c++ 根号

本专题整合了c++根号相关教程,阅读专题下面的文章了解更多详细内容。

57

2026.01.23

c++空格相关教程合集
c++空格相关教程合集

本专题整合了c++空格相关教程,阅读专题下面的文章了解更多详细内容。

57

2026.01.23

yy漫画官方登录入口地址合集
yy漫画官方登录入口地址合集

本专题整合了yy漫画入口相关合集,阅读专题下面的文章了解更多详细内容。

237

2026.01.23

漫蛙最新入口地址汇总2026
漫蛙最新入口地址汇总2026

本专题整合了漫蛙最新入口地址大全,阅读专题下面的文章了解更多详细内容。

393

2026.01.23

C++ 高级模板编程与元编程
C++ 高级模板编程与元编程

本专题深入讲解 C++ 中的高级模板编程与元编程技术,涵盖模板特化、SFINAE、模板递归、类型萃取、编译时常量与计算、C++17 的折叠表达式与变长模板参数等。通过多个实际示例,帮助开发者掌握 如何利用 C++ 模板机制编写高效、可扩展的通用代码,并提升代码的灵活性与性能。

17

2026.01.23

php远程文件教程合集
php远程文件教程合集

本专题整合了php远程文件相关教程,阅读专题下面的文章了解更多详细内容。

103

2026.01.22

PHP后端开发相关内容汇总
PHP后端开发相关内容汇总

本专题整合了PHP后端开发相关内容,阅读专题下面的文章了解更多详细内容。

73

2026.01.22

php会话教程合集
php会话教程合集

本专题整合了php会话教程相关合集,阅读专题下面的文章了解更多详细内容。

81

2026.01.22

宝塔PHP8.4相关教程汇总
宝塔PHP8.4相关教程汇总

本专题整合了宝塔PHP8.4相关教程,阅读专题下面的文章了解更多详细内容。

70

2026.01.22

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
jQuery 教程
jQuery 教程

共42课时 | 4.8万人学习

HTML+CSS基础与实战
HTML+CSS基础与实战

共132课时 | 9.7万人学习

tp6+adminlte搭建通用后台
tp6+adminlte搭建通用后台

共39课时 | 5.8万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号