jQuery对象和DOM对象的相互转化实现代码
jQuery对象和DOM对象相互转化
jQuery对象和DOM对象
jQuery对象就是通过jQuery包装DOM对象后产生的对象。jQuery对象是jQuery独有的,其可以使用jQuery里的方法,但是不能使用DOM的方法;例如$("#img").attr("src","test.jpg"); 这里的$("#img")就是jQuery对象;
DOM对象就是Javascript固有的一些对象操作。DOM对象能使用Javascript固有的方法,但是不能使用jQuery里的方法。例如:document.getElementById("img").src="test.jpg";这里的document.getElementById("img")就是DOM对象;
$("#img").attr("src","test.jpg"); 和document.getElementById("img").src="test.jpg";是等价的,是正确的,但是$("#img").src="test.jpg";或者document.getElementById("img").attr("src","test.jpg"); 都是错误的。
在说一个例子:就是this,我在写jQuery的时候经常这样写:this.attr("src","test.jpg"); 可是就是出错。其实this是DOM对象,而.attr("src","test.jpg") 是jQuery方法,所以出错了。要解决这个问题就要将DOM对象转换成jQuery对象,例如$(this).attr("src","test.jpg");
1.DOM对象转成jQuery对象:
对于已经是一个DOM对象,只需要用$()把DOM对象包装起来,就可以获得一个jQuery对象了。$(DOM对象)
如:var v=document.getElementById("v"); //DOM对象
var $v=$(v); //jQuery对象
转换后,就可以任意使用jQuery的方法了。
2.jQuery对象转成DOM对象:
两种转换方式将一个jQuery对象转换成DOM对象:[index]和.get(index);
(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是否被选中
jQuery对象和DOM对象的相互转化实现代码的更多相关文章
- jQuery对象和dom对象的辨析和相互转化
jquery对象和dom对象总是让人感觉很难分清,其实只要做到1对两者概念有明确认识2找出不同点 A DOM 1概念 DOM对象(Document Object Model,文档对象模型)可以把htm ...
- jQuery对象和dom对象之间的相互转化
var domObj = document.getElementById("demo"); var $Obj = $("#demo"); DOM转jQuery: ...
- jQuery对象与DOM对象的相互转化
jQuery是一个类数组对象,DOM对象就是一个单独的DOM元素,他们都是可以操作的DOM元素. 一.jQuery对象转化为DOM对象 有以下两种方法: 方法一:利用数组下标的方式读取jQuery中的 ...
- 区别jquery对象和dom对象及转换方法
一.jquery对象 由$() 获取,例如 var div = $("#id"); 这个div是jquery对象,它里面没有dom对象自带的方法.常见的dom对象自带的方法, 例如 ...
- 判断一个对象是jQuery对象还是DOM对象
今天调试一段代码的时候,看到其中一个变量,想知道它到底是jquery对象还是dom对象. 虽然直接console出这个对象,看它的内部可以判断出来.但是我想有没有什么更方便的方法呢. 后来我想到了一个 ...
- jQuery对象和DOM对象的区别
jQuery对象和DOM对象使用说明,需要的朋友可以参考下.1.jQuery对象和DOM对象第一次学习jQuery,经常分辨不清哪些是jQuery对象,哪些是 DOM对象,因此需要重点了解jQuery ...
- jQuery对象与dom对象相互转换
核心提示:jquery选择器得到的jquery对象和标准的 javascript中的document.getElementById()取得的dom对象是两种不同的对象类型,一般情况下,如S('#id' ...
- JQuery对象与DOM对象的区别与转换
1.jQuery对象和DOM对象的区别 DOM对象,即是我们用传统的方法(javascript)获得的对象,jQuery对象即是用jQuery类库的选择器获得的对象; eg: var domObj ...
- 什么是jquery $ jQuery对象和DOM对象 和一些选择器
1什么是jQuery: jQuery就是将一些方法封装在一个js文件中.就是个js库 我们学习这些方法. 2为什么要学习jQuery: 原生js有以下问题: 1.兼容性问题2.代码重复3.DOM提供的 ...
随机推荐
- CentOS6.9 下编译安装MySQL5.7.19
官网:https://www.mysql.com/ 下载地址:https://cdn.mysql.com//Downloads/MySQL-5.7/mysql-5.7.19.tar.gz 一.准备工作 ...
- Linux基础知识之挂载详解(mount,umount及开机自动挂载)
Linux基础知识之挂载详解(mount,umount及开机自动挂载) 转载自:http://www.linuxidc.com/Linux/2016-08/134666.htm 挂载概念简述: 根文件 ...
- jq 获取页面中checkbox已经选中的checkbox
var array={}; var arrChk=$("input[name='bike']:checked"); if(arrChk.length<=0){ alert(' ...
- <C#入门经典>学习笔记1之初识C#
序言 选择< C#入门经典第五版>作为自学书籍,以此记录学习过程中的笔记与心得. C#简单介绍 1. C#是一种块结构的语言 2. C#区分大写和小写 C#变量 C#的变量定义与C语言相似 ...
- Windows server2008 搭建ASP接口訪问连接oracle数据库全过程记录
真的是太不easy了,曾经的时候在window server 2003上面搭建了一套asp+oracle的接口系统.就费了好大的劲儿,事实上那会迷迷瞪瞪的也不知道怎么的就弄好了,也懒得管了.OK,从昨 ...
- 自学宝典:10个学习Android开发的网站推荐
1. Android Developers 作为一个Android开发者,官网的资料当然不可错过,从设计,培训,指南,文档,都不应该错过,在以后的学习过程中慢慢理解体会. 2. Android Gui ...
- 第5章 网页下载器和urllib2模块
网页下载器:将互联网上URL对应的网页下载到本地的工具 通过网页下载器将互联网中的url网页,存储到本地或内存字符串 python有哪几种网页下载器? 1.urllib2 python官方基础模块 ...
- List和Set排序的实现
List.Set.Map的区别 List和Set继承了Collection接口. List以特定索引来存取元素,可以有重复元素.Set不能存放重复元素(用对象的equals()方法来区分元素是否重复) ...
- python 补充:join() , 基本数据类型的增删改查以及深浅拷贝
# join() join() 方法用于将序列中的元素以指定的字符连接生成一个新的字符串. li = ["李李嘉诚", "麻花藤", "黄海海峰&q ...
- 页游手游服务器(五)sql缓存层
sql的通用缓存,是实现最麻烦的一部分,对于查询结果的缓存,主要有如下的结构来缓存: cache tablename--player statement--select * from player w ...