jquery 和 js 对象转换
核心提示:jquery选择器得到的jquery对象和标准的 javascript中的document.getElementById()取得的dom对象是两种不同的对象类型,一般情况下,如S(’#id’)得到的是jquery对象,它不能使用js中的dom方法。所以,如果jquery对象要使用标准的dom方法,就需要进行对象转换。
刚开始学习jQuery,可能一时会分不清楚哪些是jQuery对象,哪些是DOM对象。至于DOM对象不多解释,我们接触的太多了,下面重点介绍一下jQuery,以及两者相互间的转换。
什么是jQuery对象?
---就是通过jQuery包装DOM对象后产生的对象。jQuery对象是jQuery独有的,其可以使用jQuery里的方法。
比如:
$("#test").html() 意思是指:获取ID为test的元素内的html代码。其中html()是jQuery里的方法
这段代码等同于用DOM实现代码:document.getElementById("id").innerHTML;
虽然jQuery对象是包装DOM对象后产生的,但是jQuery无法使用DOM对象的任何方法,同理DOM对象也不能使用jQuery里的方法. 乱使用会报错。比如:$("#test").innerHTML、document.getElementById("id").html()之类的写法都是错误的。
还有一个要注意的是:用#id作为选择符取得的是jQuery对象与document.getElementById("id")得到的DOM对象,这两者并不等价。请参看如下说的两者间的转换。
既然jQuery有区别但也有联系,那么jQuery对象与DOM对象也可以相互转换。在再两者转换前首先我们给一个约定:如果一个获取的是 jQuery对象,那么我们在变量前面加上$,如:var $variab = jQuery对象;如果获取的是DOM对象,则与习惯普通一样:var variab = DOM对象;这么约定只是便于讲解与区别,实际使用中并不规定。
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是否被选中
DOM对象转成jQuery对象:
对于已经是一个DOM对象,只需要用$()把DOM对象包装起来,就可以获得一个jQuery对象了。$(DOM对象)
如:var v=document.getElementById("v"); //DOM对象
var $v=$(v); //jQuery对象
转换后,就可以任意使用jQuery的方法了。
通过以上方法,可以任意的相互转换jQuery对象和DOM对象。需要再强调注意的是:DOM对象才能使用DOM中的方法,jQuery对象是不可以用DOM中的方法
源文摘自:http://www.blogjava.net/jimingminlovefly/articles/371348.html
jquery 和 js 对象转换的更多相关文章
- js replace 全局替换 以表单的方式提交参数 判断是否为ie浏览器 将jquery.qqFace.js表情转换成微信的字符码 手机端省市区联动 新字体引用本地运行可以获得,放到服务器上报404 C#提取html中的汉字 MVC几种找不到资源的解决方式 使用Windows服务定时去执行一个方法的三种方式
js replace 全局替换 js 的replace 默认替换只替换第一个匹配的字符,如果字符串有超过两个以上的对应字符就无法进行替换,这时候就要进行一点操作,进行全部替换. <scrip ...
- 【jQuery】 js 对象
[jQuery] js 对象 一. 创建对象的三种方式 <script> var v1 = new Object(); v1.name = "name1"; v1.a ...
- jQuery对象与js对象转换
前言 jq方法和js的方法属性是不能互相使用的,所以有时候就需要转一下,下面就介绍下方法. js对象转化为jQuery对象 var box=document.getElementById(" ...
- jQuery与js对象互转
@参考文章 1 jQuery对象转js 亲测有效 var $v=$("#v"); //jQuery对象 ); //js对象 或 var $v =$("#v") ...
- 将jquery.qqFace.js表情转换成微信的字符码
jquery.qqFace.js使用方法 引用 <script src="~/Content/qqFace/js/jquery.qqFace.js?v=3"></ ...
- JSON字符串和js对象转换
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON js数据类型: 字符串.数字 ...
- jquery第三期:js与jquery对象转换
我们开始进入jquery的学习了,jquery的学习就不那么中规中矩了,我们来看一个和javascript有所区别的地方. <!DOCTYPE html PUBLIC "-//W3C/ ...
- JQuery学习:jquery对象和js对象区别和转换
JQuery对象与JS对象区别与转换 1.JQuery对象在操作时,更加方便 2.JQuery对象和js对象方法不通用 3.两者相互转换 * jq -- > js:jq对象[索引] 或者 ...
- jquery ajax 传递js对象到后台
第一种:通过struts接收 (function ($) { $("#btnsave").click(function () { var params = {}; params[& ...
随机推荐
- Linux中搭建SVNserver
一 下载工具 1. subversion-1.6.17.tar.gz 2. subversion-deps-1.6.17.tar.gz 二 解压两个包: 1.在此之前,我已经创建了一个用户svnroo ...
- 【转】SoapUI5.0创建WebService接口模拟服务端
原文:http://blog.csdn.net/a19881029/article/details/26348627 使用SoapUI创建WebService接口模拟服务端需要接口描述文件 MathU ...
- Android游戏框架之基础之AA碰撞系统
AA 碰撞体 就是将所有的物体设置为矩形框进行碰撞计算.下面是代码 /* * Copyright (C) 2010 The Android Open Source Project * * Licens ...
- Dojo系列教程
Dojo学习笔记一: 认识Dojo http://blog.csdn.net/lfsfxy9/article/details/8623897 <dojo 边学边用> http://www. ...
- vs开发工具之--自动生成注释
GhostDoc是Visual Studio的一个免费插件,轻松一个快捷键CTRL+SHIFT+D就能够帮助自动生成注释 下载地址:http://submain.com/download/ghostd ...
- cocos2d-html5 笔记5: 事件
在cocos2d里面,通过Node的方式,将整个场景以及里面的object给组织起来,这样很容易画了,从root node开始遍历,把整棵树画出来就是了. 剩下就是animation,timer, 还 ...
- 海量数据处理算法—Bit-Map
原文:http://blog.csdn.net/hguisu/article/details/7880288 1. Bit Map算法简介 来自于<编程珠玑>.所谓的Bit-map就是用一 ...
- ORB:新一代 Linux 应用
Orbital Apps 给我们带来了一种新的软件包类型 ORB,它具有便携软件.交互式安装向导支持,以及离线使用的能力. 便携软件很方便.主要是因为它们能够无需任何管理员权限直接运行,也能够带着所有 ...
- Spring MVC @RequestMapping Annotation Example with Controller, Methods, Headers, Params, @RequestParam, @PathVariable--转载
原文地址: @RequestMapping is one of the most widely used Spring MVC annotation.org.springframework.web.b ...
- 计算机网络中的TCP/UDP协议到底是怎么回事(一)
TCP/IP五层网络结构模型 物理层:物理层建立在物理通信介质的基础上,作为系统和通信介质的接口,用来实现数据链路实体间透明的比特 (bit) 流传输.只有该层为真实物理通信,其它各层为虚拟通信 数据 ...