当前位置：主页 > jquery教程 > jQuery中next()方法用法实例

jQuery中next()方法详解

  • 更新时间：2020-07-30 09:08:41
  • 编辑：双嘉良
为找教程的网友们整理了相关的编程文章，网友郜浩荡根据主题投稿了本篇教程内容，涉及到jQuery、next()、方法、用法、jQuery中next()方法用法实例相关内容，已被777网友关注，涉猎到的知识点内容可以在下方电子书获得。
  • 计算方法与实习(第4版) / 5.87 MB 推荐度：
  • 《微信公众平台应用开发：方法、技巧与案例》源码 / 13.21 MB 推荐度：
  • 数值计算方法(第2版) / 4.75 MB 推荐度：
  • 数值计算方法(第二版) / 8.65 KB 推荐度：
  • 计算方法简明教程 / 21.1 KB 推荐度：

    • jQuery中next()方法用法实例

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

    此方法获得匹配元素集合中每个元素紧邻的同辈元素。
    也可以使用可选的表达式对同辈元素集合进行筛选。

    语法结构:

    复制代码 代码如下:
    $(selector).next(expr)

     

    参数列表:

    参数 描述
    expr 可选。用于筛选的表达式

     

    实例代码:

    实例一:

     

    复制代码 代码如下:

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="utf-8"/>
    <meta name="author" content="//www.jb51.net/" />
    <title>next()函数-码农之家</title>
    <style type="text/css">
    .father
    {
      height:200px;
      width:200px;
      border:1px solid blue;
    }
    </style>
    <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
      $("p").next().css("color","blue")
    })
    </script>
    </head>
    <body>
    <div class="father">
      <p>我是p元素</p>
      <span>我是span元素</span>
      <p>我是p元素</p>
      <div>我是div元素</div>
    </div>
    </body>
    </html>

     

    将每一个p元素紧邻的元素中的字体颜色设置为蓝色。

    实例二:

     

    复制代码 代码如下:

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="utf-8"/>
    <meta name="author" content="//www.jb51.net/" />
    <title>next()函数-码农之家</title>
    <style type="text/css">
    .father
    {
      height:200px;
      width:200px;
      border:1px solid blue;
    }
    </style>
    <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
      $("p").next("span").css("color","blue")
    })
    </script>
    </head>
    <body>
    <div class="father">
      <p>我是p元素</p>
      <span>我是span元素</span>
      <p>我是p元素</p>
      <div>我是div元素</div>
    </div>
    </body>
    </html>

     

    将与p元素紧邻的span元素中的字体颜色设置为蓝色。

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

    相关教程

    • jQuery中slidedown与slideup实例用法

      这篇文章主要介绍了jQuery中slidedown与slideup方法用法,结合实例形式分析了jQuery基于slidedown与slideup方法实现页面元素展开与折叠的实现技巧,需要的朋友可以参考下

      发布时间：2020-04-24

    • jQuery fadeTo方法调整图片的透明度用法说明

      利用jquery的fadeTo方法可以简单的制作一些很不错的动画效果.可以使图片或者文字或者区块以不同的透明度效果出现.例如以下练习实例，感兴趣的朋友可以参考下哈

      发布时间：2020-06-22

    • jQuery mobile NuGet移动网站用法

      这篇文章主要介绍了使用jQuery mobile NuGet让你的网站在移动设备上同样精彩，使用jQuery mobile NuGet包，改变共享的布局和视图，并使你的网站在传统的浏览器和大部分手机展现的都很好。,需要的朋

      发布时间：2020-07-16

    • jQuery中parents()用法浅析

      这篇文章主要介绍了jQuery中parents()方法用法,实例分析了parents()方法的功能、定义及取得一个包含着所有匹配元素的父辈元素的元素集合使用技巧,需要的朋友可以参考下

      发布时间：2020-02-07

    • jQuery网页遮罩层插件用法示例效果

      这篇文章主要介绍了轻量级网页遮罩层jQuery插件用法,实例分析了jquery遮罩层插件的定义、功能及使用方法,非常简单实用,需要的朋友可以参考下

      发布时间：2020-03-01

    • jQuery中disabled选择器用法总结

      这篇文章主要介绍了jQuery中:disabled选择器用法,实例分析了:disabled选择器功能、定义及选取所有禁用的表单元素的技巧,需要的朋友可以参考下

      发布时间：2020-06-05

    • jquery用法技巧总结

      本文给大家汇总介绍了一下Jquery使用小技巧，算是比较全面了，一共26个小店，非常细致,需要的朋友可以参考下

      发布时间：2020-01-18

    • jQuery中$(this).index与$.each的用法详解

      这篇文章主要介绍了jQuery 中$(this).index与$.each的使用方法，以及使用环境，有需要的小伙伴自己参考下吧

      发布时间：2020-01-30

    • jQuery中事件对象e的事件冒泡用法实例详解

      这篇文章主要介绍了jQuery中事件对象e的事件冒泡用法,需要的朋友可以参考下

      发布时间：2019-11-16

    • jQuery Position用法及兼容性详解

      position方法获取匹配元素相对父元素的偏移。接下来通过本文给大家分享jQuery Position方法使用和兼容性的相关知识，感兴趣的朋友一起看看吧

      发布时间：2019-11-24

    • 关于jquery easyui中treegrid用法的例子

      本篇文章主要是对jquery easyui中treegrid用法的简单实例进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助

      发布时间：2020-03-07

    用户留言

    发布评论

    最新更新

    热门推荐