通过检索匹配jQuery对象得到对应的DOM元素。

.get( [index ] )

  • index
    类型: Integer
    从0开始计数,用来确定获取哪个元素。

.get() 方法允许我们直接访问jQuery对象中相关的DOM节点。 如果index的值超出范围 - 小于元素数量的负数或等于或大于元素的数量 - 那么它将返回undefined。 假设我们页面上有一个简单的无序列表:

<ul>
<li id="foo">foo</li>
<li id="bar">bar</li>
</ul>

如果指定了 index 参数, .get() 则会获取单个元素:

console.log( $( "li" ).get( 0 ) );

由于索引 index 是以 0 开始计数的,所以上面代码返回了第一个列表项:

<li id="foo">

每个 jQuery 对象也被当成一个数组,所以我们也可以直接用数组的取值运算符来获得列表项:

console.log( $( "li" )[0] );

然而,这种语法缺少某些 .get() 所具有的附加功能,比如可以指定索引值为负值:

console.log( $( "li" ).get(-1) );

负的索引值表示从匹配的集合中从末尾开始倒数,所以上面这个例子将会返回列表中最后一项:

<li id="bar">

Example: 给出点中元素的标签名。

<!DOCTYPE html>
<html>
<head>
<style>
span { color:red; }
div { background:yellow; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<span>&nbsp;</span>
<p>In this paragraph is an <span>important</span> section</p> <div><input type="text" /></div>
<script>
$("*", document.body).click(function (e) {
e.stopPropagation();
var domEl = $(this).get(0);
$("span:first").text("Clicked on - " + domEl.tagName);
});
</script> </body>
</html>

Description: 通过检索匹配jQuery对象得到对应的DOM元素。

  • version added: 1.0.get()

  • 这个方法不接收任何参数

假设我们页面上有一个简单的无序列表:

<ul>
<li id="foo">foo</li>
<li id="bar">bar</li>
</ul>

如果不带参数, .get() 会返回所有的元素:

console.log( $( "li" ).get() );

调用这个方法将会返回所有匹配的DOM节点,这些节点包含在一个标准的数组中:

[<li id="foo">, <li id="bar">]

Example:

选择文档中的所有div,并且作为一个数组返回。然后使用浏览器原生的 reverse 方法将数组翻转。

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>get demo</title>
<style>
span { color:red; }
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
Reversed - <span></span> <div>One</div>
<div>Two</div>
<div>Three</div>
<script>
function disp(divs) {
var a = [];
for ( var i = 0; i < divs.length; i++) {
a.push( divs[i].innerHTML );
}
$( "span" ).text( a.join(" ") );
}
disp( $( "div" ).get().reverse() );
</script> </body>
</html>

jquery的get()方法的更多相关文章

  1. jquery 通过submit()方法 提交表单示例

    jquery 通过submit()方法 提交表单示例: 本示例:以用户注册作为例子.使用jquery中的submit()方法实现表单提交. 注:本示例仅提供了对表单的验证,本例只用选用了三个字段作为测 ...

  2. jquery.on()超级方法

    $.on()方法是jquery1.7之后的一个超级方法,将事件绑定和事件委托整合到一个函数中去,支持绑定多个事件,并且可以绑定自定义事件.使用起来很方便. demo传送门 事件委托 首先说一下事件委托 ...

  3. 重写jquery的ajax方法

    //首先备份下jquery的ajax方法 var _ajax=$.ajax; //重写jquery的ajax方法 $.ajax=function(opt){ //备份opt中error和success ...

  4. jQuery的extend方法

    jq中的extend在面试中经常会被问道,今天我总结一个下有关于extend的用法三种进行对比,可能不全,希望大家指点, 用法一: $.extend({})  ,为jQuery类添加方法,可以理解为扩 ...

  5. jQuery中eq()方法用法实例

    本文实例讲述了jQuery中eq()方法用法.分享给大家供大家参考.具体分析如下: 此方法能够获取匹配元素集上的相应位置索引的元素. 匹配元素集上元素的位置索引是从0开始的. 语法结构: 复制代码 代 ...

  6. HTML 5 的自定义 data-* 属性和jquery的data()方法的使用

    人们总喜欢往HTML标签上添加自定义属性来存储和操作数据.但这样做的问题是,你不知道将来会不会有其它脚本把你的自定义属性给重置掉,此外,你这样做也会导致html语法上不符合Html规范,以及一些其它副 ...

  7. 深度理解Jquery 中 offset() 方法

    参考原文:深度理解Jquery 中 offset() 方法

  8. [转]jQuery的each方法的几种常用的用法

    下面提一下jQuery的each方法的几种常用的用法 复制代码 代码如下:  var arr = [ "one", "two", "three&quo ...

  9. jquery中$.ajax方法提交表单

    function postdata(){                        //提交数据函数 $.ajax({                                //调用jqu ...

  10. JS,JQuery的扩展方法

    转 http://blog.csdn.net/tuwen/article/details/11464693 //JS的扩展方法: 1 定义类静态方法扩展 2 定义类对象方法扩展            ...

随机推荐

  1. 系统管理员都要知道的 30 个 Linux 系统监控工具

    1. top - 进程活动监控命令 top 命令会显示 Linux 的进程.它提供了一个运行中系统的实时动态视图,即实际的进程活动.默认情况下,它显示在服务器上运行的 CPU 占用率最高的任务,并且每 ...

  2. debian修改连接数限制

    golang写的socket做压力测试的时候,提示too many open files,解决方法如下 sudo gvim /etc/security/limits.conf 添加 * - nofil ...

  3. C#String地址、拼接性能学习

    String类型不可变.定义string变量时会在堆上分配存储空间,而对该变量进行值变更时会重新分配一个存储空间,且保留原存储空间. 测试思路:获取string类型变量值变更前后的存储空间地址,判断地 ...

  4. 【转】使用JMeter对数据库做压力测试

    作为一名开发人员,大多情况下都会认真的做好功能测试,但是却常常忽略了软件开发之后的压力测试,尤其是在面向大量用户同时使用的Web应用系统的开发过程,压力测试往往是不够充分的.近期我在一个求职招聘型的网 ...

  5. 利用nginx_push_stream_module实现服务器消息推送

    NGiNX_HTTP_Push_Module 是一个 Nginx 的扩展模块,它实现了 HTTP Push 和Comet server的功能.HTTP Push 被经常用在网页上主动推的技术,例如一些 ...

  6. windows下mysql定时备份

    场景:一套B/S小系统,租用了一个虚拟服务器windows 2003,数据库是mysql,做每天的数据库备份 1.关于windows下的定时任务执行     * 命令说明 - /sc 指定计划类型,取 ...

  7. 十五.jQuery源码解析之Sizzle总体结构.htm

    Sizzle是一款纯javascript实现的css选择器引擎,它具有完全独立,无库依赖;小;易于扩展和兼容性好等特点. W3C Selectors API规范定义了方法querySelector() ...

  8. html2pdf 中文支持问题

    系统用的是HTML2PDF V4.0.3 版本 百度后 http://blog.sina.com.cn/s/blog_6b0ce0310101fdv6.html 发现中文支持不好 还是有乱码问题 解决 ...

  9. 转:系统吞吐量(TPS)、用户并发量、性能测试概念和公式

    PS:下面是性能测试的主要概念和计算公式,记录下: 一.系统吞度量要素: 一个系统的吞度量(承压能力)与request对CPU的消耗.外部接口.IO等等紧密关联. 单个reqeust 对CPU消耗越高 ...

  10. j2EE框架collection

    在 Java2中,有一套设计优良的接口和类组成了Java集合框架Collection,使程序员操作成批的数据或对象元素极为方便.这些接口和类有很多对抽象数据类型操作的API,而这是我们常用的且在数据结 ...