jQuery 获取DOM节点的两种方式
jQuery中包裹后的DOM对象实际上是一个数组,要获得纯粹的DOM对象可以有两种方式:
1、使用数组索引方式访问,例如:
var dom = $(dom)[0];
如: $("#id")[0]
2、使用函数get()访问,例如:
var dom = $(dom).get(0);
get()函数中的参数为索引号。
什么是jQuery对象?
就是通过jQuery包装DOM对象后产生的对象。jQuery对象是jQuery独有的,其可以使用jQuery里的方法。
比如:
$("#test").html() 意思是指:获取ID为test的元素内的html代码。其中html()是jQuery里的方法
这段代码等同于用DOM实现代码:
document.getElementById("id").innerHTML;
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对象与dom对象的转换
则为jquery对象,可以使用jquery的方法。
由于jquery对象本身是一个集合。所以如果jquery对象要转换为dom对象则必须取出其中的某一项,一般可通过索引取出。
$("#msg")[0], $("div").eq(1)[0], $("div").get()[1], $("td")[5]
这些都是dom对象,可以使用dom中的方法,但不能再使用Jquery的方法。
以下几种写法都是正确的:
$("#msg").html();
$("#msg")[0].innerHTML;
$("#msg").eq(0)[0].innerHTML;
$("#msg").get(0).innerHTML;
jQuery 获取DOM节点的两种方式的更多相关文章
- 获取DOM节点的几种方式
DOM 是一个树形结构,操作一个DOM节点,实际上就是这几个操作:更新.删除.添加.遍历 在操作DOM节点之前,需要通过各种方式先拿到这个DOM节点,常用的方法有: 一.通过元素类型的方法来操作: d ...
- JavaWeb后台从input表单获取文本值的两种方式
JavaWeb后台从input表单获取文本值的两种方式 #### index.html <!DOCTYPE html> <html lang="en"> & ...
- SparkStreaming获取kafka数据的两种方式:Receiver与Direct
简介: Spark-Streaming获取kafka数据的两种方式-Receiver与Direct的方式,可以简单理解成: Receiver方式是通过zookeeper来连接kafka队列, Dire ...
- strus2中获取表单数据 两种方式 属性驱动 和模型驱动
strus2中获取表单数据 两种方式 属性驱动 和模型驱动 属性驱动 /** * 当前请求的action在栈顶,ss是栈顶的元素,所以可以利用setValue方法赋值 * 如果一个属性在对象栈,在页面 ...
- jQuery中开发插件的两种方式
jQuery中开发插件的两种方式(附Demo) 做web开发的基本上都会用到jQuery,jQuery插件开发两种方式:一种是类扩展的方式开发插件,jQuery添加新的全局函数(jQuery的全局函数 ...
- 使用web.xml方式加载Spring时,获取Spring context的两种方式
使用web.xml方式加载Spring时,获取Spring context的两种方式: 1.servlet方式加载时: [web.xml] <servlet> <servlet-na ...
- 【C#表达式树 六】表达式树中创建节点的两种方式
创建表达式树节点的两种方式1.用expression的静态方法MakeBinary|MakeUnary(ExpressionType,参数)的方式创建表达式树节点: BinaryExpression ...
- Express全系列教程之(四):获取Post参数的两种方式
一.关于POST请求 post方法作为http请求很重要的一部分,几乎所有的网站都有用到它,与get不同,post请求更像是在服务器上做修改操作,它一般用于数据资源的更新.相比于get请求,post所 ...
- drupal7 覆写node-type.tpl.php获取字段值的两种方式
字段的机读名称为:field_publication_date <!-- 下面两种方式都可以获取node字段的值--> 出版时间: <?php print date('Y-m-d', ...
随机推荐
- C#关于log4net(Log For Net)
1 介绍 log4net(Log For Net)是Apache开源的应用于.Net框架的日志记录工具,详细信息参见Apache网站.它是针对Java的log4j(Log For Java ...
- “pip failed to create process”的问题
增加python -m的方法能完美解决pip,easy_install 安装时报错:“pip failed to create process”的问题,据推测应该是64bit操作系统下会是如此. Wi ...
- sonarQube Github pull request扫描代码
参考官方地址:https://docs.sonarqube.org/display/PLUG/GitHub+Plugin 运行环境:sonarQube6.2 + sonarScanner2.8 近来, ...
- 【wordpress】 $wpdb 应用实例
<?php require_once('e:/php/wordpress/wp-blog-header.php');//注释掉这一句就出错了 global $wpdb; $a = $wpdb-& ...
- 使用Xshell上传下载文件
很多时候我们需要在Windows跟Linux之间,或者Linux跟Linux之间传文件,这里我们讲的是使用Xshell实现文件上传下载. 一.使用rz,sz实现Windows,linux上传下载 1. ...
- 【kd-tree】bzoj1176 [Balkan2007]Mokia
裸题不多说,注意在sqrt(n*log(n))次插入后重构树以保持深度. #include<cstdio> #include<cmath> #include<algori ...
- 【计算几何】【凸包】bzoj1670 [Usaco2006 Oct]Building the Moat护城河的挖掘
#include<cstdio> #include<cmath> #include<algorithm> using namespace std; #define ...
- Inno Setup 注册表启动项 修改注册表
//注册表启动项 [Registry] Root: HKLM; Subkey: "SOFTWARE\Microsoft\Windows\CurrentVersion\Run"; ...
- jquery--动态篇
jQuery中隐藏元素的hide方法 让页面上的元素不可见,一般可以通过设置css的display为none属性.但是通过css直接修改是静态的布局,如果在代码执行的时候,一般是通过js控制元素的st ...
- ASP.NET Core 1.0基础之诊断
来源https://docs.asp.net/en/latest/fundamentals/diagnostics.html ASP.NET Core 1.0包含了一些新的特性来辅助诊断问题.可以在S ...