jQuery对象转化为DOM对象
jQuery库本质上还是JavaScript代码,它只是对JavaScript语言进行包装处理,为的是提供更好更方便快捷的DOM处理与开发中经常使用的功能。我们使用jQuery的同时也能混合JavaScript原生代码一起使用。在很多场景中,我们需要jQuery和DOM能够相互的转换,它们都是可以操作的DOM元素,jQuery是一个类数组对象,而DOM对象就是一个单独的DOM元素。
如何把jQuery对象转化为DOM对象?
1.利用数组下标的方式读取到jQuery中的DOM对象
HTML代码
<div>元素一</div>
<div>元素二</div>
<div>元素三</div>
JavaScript代码
var $div = $('div');//jQuery对象
var div=$div[0];//转化成DOM对象
div.style.color='red';//操作DOM对象的属性
用jQuery找到所有的div元素(3个),因为jQuery对象也是一个数组结构,可以通过数组下标索引找到第一个div元素,通过返回的div对象,调用它的style属性修改第一个div元素的颜色。这里需要注意的一点是,数组的索引是从0开始的,所以第一个元素下标是0。
2.通过jQuery自带的get()方法
jQuery对象自身提供一个get()方法允许我们直接访问jQuery对象中相关的DOM节点,get方法中提供一个元素的索引:
var $div=$('div');//jQuery对象
var div=$div.get(0);//通过get方法,转化成DOM对象
div.style.color='red';//操作DOM对象的属性
其实我们翻开源码看看就知道,get方法就是利用第一种方式处理的,只是包装成一个get让开发者更直接方便的使用。
jQuery对象转化为DOM对象的更多相关文章
- 锋利的jQuery(1)——DOM对象与jQuery对象的转换
1.认识jQuery DOM对象:即文档对象模型 jQuery对象:通过jQuery包装DOM对象后产生的对象.这是jQuery对象所特有的,在jQuery对象中无法使用DOM对象的任何方法,同时DO ...
- jQuery对象和普通DOM对象的区别
1.DOM对象DOM实际上是以面向对象方式描述的文档模型.DOM定义了表示和修改文档所需的对象.这些对象的行为和属性以及这些对象之间的关系.根据W3C DOM规范,DOM是HTML与XML的应用编程接 ...
- 深刻了解jQuery对象和普通DOM对象的区别
深刻了解jQuery对象和普通DOM对象的区别.互相转化见Q1 Q1,js的写法:document.getElementById('save').disabled=true; 在jquery中我是这样 ...
- 通示jQuery实例方法,未DOM对象添加多个方法
<script type="text/javascript"> /* * 通示jQuery实例方法,未DOM对象添加多个方法 * 用按钮做多个事件的调用 */ (fun ...
- dom变成jquery对象 先获取dom对象 然后通过$()转换成jquery对象
dom变成jquery对象 先获取dom对象 然后通过$()转换成jquery对象
- jQuery 对象 与 原生 DOM 对象 相互转换
区别 jQuery 选择器得到的 jQuery对象 和 原生JS 中的document.getElementById() document.querySelector取得的 DOM对象 是两种不同类型 ...
- jQuery对象转成DOM对象:
jQuery对象转成DOM对象: 两种转换方式将一个jQuery对象转换成DOM对象:[index]和.get(index); (1)jQuery对象是一个数据对象,可以通过[index]的方法,来得 ...
- jQuery入门二(DOM对象与jQuery对象互相转换)
- DOM对象与jQuery对象互相转换 第一篇说过,DOM对象不能调用jQuery对象的属性和方法,同样jQuery对象也不能调用DOM对象的属性和方法.但是在实际开发中,可能两者间需要互相调用对方 ...
- jquery对象转成dom对象
jQuery库本质上还是JavaScript代码,它只是对JavaScript语言进行包装处理,为的是提供更好更方便快捷的DOM处理与开发中经常使用的功能.我们使用jQuery的同时也能混合Java ...
随机推荐
- URL中传递JSON数据
有关于JSON如何在前后之间进行传递,转换成对象等操作,请查看 C#Json数据交互 (这篇文章主要介绍了如何转化Json格式的数据,以及如何使用) 我们在URL中传递数据一般都是 XX.asp ...
- jQuery对表单、表格的操作以及更多应用
表单和表格都是HTML的重要组成部分,分别用于采集.提交用户输入的信息和显示列表数据. 表单应用:一个表单有3个基本组成部分: ①表单标签:包含处理表单数据所用的服务器端程序URL以及数据提交到服务器 ...
- Python,针对指定文件类型,过滤空行和注释,统计行数
参考网络上代码编辑而成,无技术含量,可自行定制: 目前亲测有效,若有待完善之处,还望指出! 强调:将此统计py脚本放置项目的根目录下执行即可. 1.遍历文件,递归遍历文件夹中的所有 def getFi ...
- 当Java遇见了Html--Jsp九大内置对象篇
jsp内置对象对象是web容器创建的一组对象,不使用new关键词久可以使用的内置对象. 九大内置对象包括以下: out --JspWriter request --ServletRequest rep ...
- Angular之简单的登录注册
使用Angular实现了一个简单的登录注册的功能........ 涉及到的Angular知识点很少 主要是这个功能的实现...(*^__^*) 嘻嘻…… 里面涉及到的知识点记录: 1.本地存储的操作 ...
- Java分享笔记:FileOutputStream流的write方法
/*------------------------ FileOutputStream: ....//输出流,字节流 ....//write(byte[] b)方法: 将b.length个字节从指定字 ...
- Spring Boot Shiro权限管理--自定义 FormAuthenticationFilter验证码整合
思路shiro使用FormAuthenticationFilter进行表单认证,验证校验的功能应该加在FormAuthenticationFilter中,在认证之前进行验证码校验. 需要写FormAu ...
- 关于Pycharm基本操作笔记
创建 project(工程,译音:破拽科特) 1.Create New project(创建一个新的工程,译音:科瑞特 纽 破摘科特) 2.pure python(纯派森,译音:皮忧儿 派森) 3.l ...
- ThinkPHP路由去掉隐藏URL中的index.php
官方默认的.htaccess文件 <IfModule mod_rewrite.c> Options +FollowSymlinks -Multiviews RewriteEngine On ...
- python_字符串_常用处理
1. 输出原序列的反向互补序列 in1 = open("brca1.fasta", "r") out1 = open("re_brca1.fasta& ...