• 首页
  • vue
  • TypeScript
  • JavaScript
  • scss
  • css3
  • html5
  • php
  • MySQL
  • redis
  • jQuery
  • 相邻选择器

    描述:选择所有与“ next”匹配的下一个元素,并紧随其后的是“ prev”。

    jQuery("prev + next")
    • prev:任何有效的选择器。
    • next:一个选择器,用于匹配第一个选择器旁边的元素。

    下一个相邻的同级选择器(prev + next)和通用同级选择器(prev ~ siblings)都需要考虑的重要一点是,组合器两侧的元素必须共享同一父级。

    例:

    查找标签旁边的所有输入。

    <!doctype html>
    <html lang="en">
    <head>
      <meta charset="utf-8">
      <title>next adjacent demo</title>
      <script src="https://www.lanmper.cn/static/js/jquery-3.5.0.js"></script>
    </head>
    <body>
     
    <form>
      <label for="name">Name:</label>
      <input name="name" id="name">
      <fieldset>
        <label for="newsletter">Newsletter:</label>
        <input name="newsletter" id="newsletter">
      </fieldset>
    </form>
    <input name="none">
     
    <script>
    $( "label + input" ).css( "color" , "blue"  ).val( "Labeled!"  );
    </script>
     
    </body>
    </html>
    

    上篇:子选择器

    下篇:兄弟选择器