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中的方法

时间: 2024-11-05 14:54:22

jquery 和 js 对象转换的相关文章

jQuery对象与js对象转换

前言 jq方法和js的方法属性是不能互相使用的,所以有时候就需要转一下,下面就介绍下方法. js对象转化为jQuery对象 var box=document.getElementById("box"); var $box=$(box); jQuery对象转化为js对象 var box1=$(box)[0]; var box2=$(box).get(0); 示例: <script src="http://libs.baidu.com/jquery/1.11.3/jquer

JS中JSON.stringify()方法,将js对象转换成字符串,传入服务器

JSON 通常用于与服务端交换数据. 在向服务器发送数据时一般是字符串. 我们可以使用 JSON.stringify() 方法将 JavaScript 对象转换为字符串. 语法 JSON.stringify(value[, replacer[, space]]) 参数说明: value: 必需, 要转换的 JavaScript 值(通常为对象或数组). replacer: 可选.用于转换结果的函数或数组. 如果 replacer 为函数,则 JSON.stringify 将调用该函数,并传入每个

20170907笔记:JS对象&amp;jQuery对象转换

JS对象转到jQuery对象 // JS与jQuery对象互转 // JS获取对象 var obj = document.getElementById('id'); // 把JS对象转换到jQuery对象 var $obj = $(obj); jQuery对象转到JS对象 // JS与jQuery对象互转 // jQuery获取对象 var $obj = $('#id'); // jQuery对象转换到JS对象 var obj = $obj.get(0);

JQuery之JQuery的版本 JQuery入门 属性获取 JQuery就绪函数 JS文档就绪函数和JQuery文档就绪函数的区别 JS对象和JQuery对象的区别 关于$的使用 多个JS库的冲突解决方案

JQuery的版本 JQuery入门 属性获取 JQuery就绪函数 JS文档就绪函数和JQuery文档就绪函数的区别 JS对象和JQuery对象的区别 关于$的使用 多个JS库的冲突解决方案 JQuery的版本 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jQuery的版本</title> <

js对象与json格式的转换

目前的项目数据交互几乎都用JQuery,所以处理流程是:前端页面数据->JS对象->jQuery提交->python处理,另外一种就是倒过来.python肯定不能直接处理JS对象数据,所以要把JS对象转换成为python能处理的一种数据格式(通常是字典dict),同样,python取数据反馈到前端也要把字典数据转换成JS能处理的对象,这个中间转换数据格式通常就是JSON. 一.JS对象转换成为JSON 流程:读取前端页面数据,组装成为JS对象,并通过jQuery的$.post()方法传递

Js对象与jquery对象相互转换

有时候在我们开发过程中,需要将js对象和jquery对象之间进行转换: 1.js对象转jquery对象时,直接用$()括起来就行 比如: var v = document.getElementById("v"); //DOM对象 var $v = $(v); //jQuery 对象 2.jquery转js对象: 2. jQuery 对象转成 DOM 对象 两种转换方式讲一个 jQuery 对象转换成 DOM 对象: [index] 和 .get(index): (1) jQuery 对

js对象和jQuery对象互转

<!DOCTYPE html><html><head><meta charset="utf-8"><title></title><script src="jquery-1.8.3.js"></script></head><body><h1 class="h1">能不能给我一首歌的时间</h1><h1

JSON(二)——JavaScript中js对象与JSON格式字符串的相互转换

首先我们来看一下js中JSON格式的字符串 var JSONStr1 = "{\"name\" : \"张三\"}"; 注意以下的写法不是js中JSON格式的字符串,它只是一个js的字符串. var JSONStr2 = "{'name' : '张三'}"; 我们看JSON语法中对于字符串的定义:是由双引号包围的任意数量Unicode字符的集合,使用反斜线转义.一个字符(character)即一个单独的字符串(characte

jQuery的文件引入、入口函数以及js对象和jquery对象之间的互相转换

JavaScript与jquery的区别 JavaScript是一门编程语言,用来编写客户端浏览器脚本. jQuery是javascript的一个库,包含多个可重用的函数,用来辅助简化javascript开发 jQuery能做的javascript都能做到,而JavaScript能做的事情,jQuery不一定能做到 jQuery文件的引入 <body> <div class="box"></div> <!--引包(引入jquery库)-->