jQuery中get()方法用法实例


Posted in Javascript onDecember 27, 2014

本文实例讲述了jQuery中get()方法用法。分享给大家供大家参考。具体分析如下:

此方法可以返回匹配集合中所有DOM元素的数组或者一个指定索引的DOM元素。
索引值是从0开始的。

说明:从上面的定义可以看出,此方法可以将jQuery对象转换成DOM对象。

语法结构一:

$(selector).get()

没有参数的时候会取得所有匹配的DOM元素的数组。

实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta name="author" content="https://3water.com/" />

<title>get()函数-三水点靠木</title>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript">

$(document).ready(function(){

  $($(".zhuanqu").get()).css("color","green");

})

</script>

</head>

<body>

<div>

  <ul>

    <li>ASP专区</li>

    <li class="zhuanqu">jsp专区</li>

    <li>php专区</li>

    <li>ASP.NET专区</li>

  </ul>

  <ul>

    <li>DIV+CSS专区</li>

    <li class="zhuanqu">Jquery专区</li>

    <li class="zhuanqu">javascript专区</li>

    <li>html专区</li>

  </ul>

</div>

</body>

</html>

通过使用$(".zhuanqu").get(),可以取得类名为zhuanqu的li元素的数组。看了实例大家可能就问为什么外面还要套上$(),这是因为通过get()方法获得是DOM对象,需要转化成jQuery对象才能使用CSS()方法。

语法结构二:

$(selector).get(index)

带有参数,取得所有匹配的DOM元素数组中指定的一个匹配的元素。

实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta name="author" content="https://3water.com/" />

<title>get()函数-三水点靠木</title>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript">

$(document).ready(function(){

  $($(".zhuanqu").get(0)).css("color","green");

})

</script>

</head>

<body>

<div>

  <ul>

    <li>ASP专区</li>

    <li class="zhuanqu">jsp专区</li>

    <li>php专区</li>

    <li>ASP.NET专区</li>

  </ul>

  <ul>

    <li>DIV+CSS专区</li>

    <li class="zhuanqu">Jquery专区</li>

    <li class="zhuanqu">javascript专区</li>

    <li>html专区</li>

  </ul>

</div>

</body>

</html>

里面的参数是要获取的DOM对象数组中DOM对象的索引,索引是从零开始的。

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
客户端静态页面玩分页
Jun 26 Javascript
Javascript 二维数组
Nov 26 Javascript
jquery队列函数用法实例
Dec 16 Javascript
jQuery中:gt选择器用法实例
Dec 29 Javascript
JavaScript位置与大小(1)之正确理解和运用与尺寸大小相关的DOM属性
Dec 26 Javascript
jQuery实现页面评论栏中访客信息自动填写功能的方法
May 23 Javascript
javascript 将共享属性迁移到原型中去的实现方法
Aug 31 Javascript
总结Javascript中数组各种去重的方法
Oct 04 Javascript
Js利用Canvas实现图片压缩功能
Sep 13 Javascript
JS实现的tab页切换效果完整示例
Dec 18 Javascript
基于javascript的无缝滚动动画实现2
Aug 07 Javascript
vue+iview实现手机号分段输入框
Mar 25 Vue.js
jQuery的context属性用法实例
Dec 27 #Javascript
jQuery对象的selector属性用法实例
Dec 27 #Javascript
jQuery对象的length属性用法实例
Dec 27 #Javascript
jQuery中size()方法用法实例
Dec 27 #Javascript
jQuery中each()方法用法实例
Dec 27 #Javascript
jQuery.holdReady()方法用法实例
Dec 27 #Javascript
jQuery中的jQuery()方法用法分析
Dec 27 #Javascript
You might like
php 无限极分类
2008/03/27 PHP
PHP 页面编码声明方法详解(header或meta)
2010/03/12 PHP
PHP中运用jQuery的Ajax跨域调用实现代码
2012/02/21 PHP
基于PHP遍历数组的方法汇总分析
2013/06/08 PHP
php实现QQ空间获取当前用户的用户名并生成图片
2015/07/25 PHP
在Laravel5.6中使用Swoole的协程数据库查询
2018/06/15 PHP
IE 下的只读 innerHTML
2009/08/21 Javascript
JavaScript 学习笔记(十六) js事件
2010/02/01 Javascript
js实现图片上传并正常显示
2015/12/19 Javascript
JS作用域深度解析
2016/12/29 Javascript
jquery对table做排序操作的实例演示
2017/08/10 jQuery
详解layui弹窗父子窗口之间传参数的方法
2018/01/16 Javascript
axios全局请求参数设置,请求及返回拦截器的方法
2018/03/05 Javascript
JavaScript监听一个DOM元素大小变化
2020/04/26 Javascript
Js生成随机数/随机字符串的方法小结【5种方法】
2020/05/27 Javascript
[03:56]还原FTP电影首映式 DOTA2群星拼出遗迹世界
2014/03/26 DOTA
深入分析在Python模块顶层运行的代码引起的一个Bug
2014/07/04 Python
Python的Flask框架中实现简单的登录功能的教程
2015/04/20 Python
使用py2exe在Windows下将Python程序转为exe文件
2016/03/04 Python
最大K个数问题的Python版解法总结
2016/06/16 Python
Python使用pyodbc访问数据库操作方法详解
2018/07/05 Python
python openpyxl使用方法详解
2019/07/18 Python
Joules美国官网:出色的英国风格
2017/10/30 全球购物
美国最大的高尔夫发球时间预订网站:TeeOff.com
2018/03/28 全球购物
Priority Pass机场贵宾室会籍计划:全球超过1200间机场贵宾室
2018/08/26 全球购物
理工大学毕业生自荐信范文
2014/02/22 职场文书
大学生精神文明先进个人事迹材料
2014/05/02 职场文书
领导干部“四风”查摆问题个人整改措施
2014/10/28 职场文书
专业见习报告范文
2014/11/03 职场文书
入党团支部推荐意见
2015/06/02 职场文书
Java输出Hello World完美过程解析
2021/06/13 Java/Android
Python Pandas模块实现数据的统计分析的方法
2021/06/24 Python
Java集成swagger文档组件
2021/06/28 Java/Android
不同品牌、不同型号对讲机如何互相通联
2022/02/18 无线电
Tomcat用户管理的优化配置详解
2022/03/31 Servers
Mysql如何查看是否使用到索引
2022/12/24 MySQL