jquery中eq和get如何使用

发布于 2022-10-15 09:34:54 字数 2362 浏览 31 评论 0

转:沐海

jquery中eq和get如何使用

eq:返回是一个 jquery对象 作用是 将匹配的元素集合缩减为一个元素。这个元素在匹配元素集合中的位置变为0,而集合长度变成1

get:是一个html 对象数组作用是取得其中一个匹配的元素。 num表示取得第几个匹配的元素。

如:html代码

  1. <ul>
  2.   <li>li-1</li>
  3.   <li>li-2</li>
  4. </ul>

复制代码比如我们通过jquery选择器 $("li")那么我们将会有两个li元素我如何只想选择其中一个呢?

$("li:eq(0)").html() 或者 $("li").eq(0).html() 就是第一个li 这里我们将获得 li-1

$("li:eq(1)").html() 或者 $("li").eq(1).html() 就是第二个li 这里我们将获得 li-2

下面我们看看 get因为get返回是html对象所以我们这里

$("li").get(0).style.color='red'

只有这样用或者将 get返回对象转换成jquery对象在操作

$($("li").get(0)).css("color",'red')

即可

完整代码

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  2. <HTML>
  3. <HEAD>
  4.   <TITLE> New Document </TITLE>
  5.   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  6.     <SCRIPT LANGUAGE="JavaScript" src="js/jquery.js"></script>
  7.   <SCRIPT LANGUAGE="JavaScript">
  8.    <!--
  9.     $("document").ready(function(){
  10.        alert($("li:eq(1)").html());//显示 li-2 alert($("li:eq(0)").html())
  11.     $("li").get(0).style.color='red';
  12.     $($("li").get(1)).css("color",'red')
  13.     })
  14.    //-->
  15.   </SCRIPT>
  16. </HEAD>
  17. <BODY>
  18. <ul>
  19.   <li>li-1</li>
  20.   <li>li-2</li>
  21. </ul>
  22. </BODY>
  23. </HTML>

复制代码

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文