zoukankan      html  css  js  c++  java
  • 选择器,$("A+B") 和$("A~B") 的理解

      在我发表这个理解之前,我有看过博客园 永恒浪子 大神的 JQuery选择器大全(http://www.cnblogs.com/hulang/archive/2011/01/12/1933771.html)。

    一开始,我对以上参考文献的一些讲解理解有偏差。例如,$("A+B") 和$("A~B"),在以上参考文献中,对此的部分解释是这样的:

    $("A+B") 查找A元素后面的兄弟节点,包括非直接子节点

    $("A~B") 查找A元素后面的兄弟节点,不包括非直接子节点

    以及文献中所列举的例子。

      我对文献中所提到的“直接子节点”一开始理解不透彻,有偏差。我误解为“子节点”和“孙子节点”的区别。经我个人的测试,我得到了更准确的理解:

    $("A+B") 就是查找A元素面的第一个兄弟B节点

    $("A~B") 查找A元素后面的所有兄弟B节点

    对于同一个代码,同一个对象,每个人的理解可能都不一样的。对于同一个对象,也不仅仅是只有一种理解才是正确的。上代码:

    jQuery:

                $("#del_names").click(function () {
                    $("label ~ input").remove();
                });
                $("#Button1").click(function () {
                    $("label + input").remove();
                });    

    Html:

    <body>
      <form id="form1" runat="server">
        <input name="name0" type="text" value="name0" />
        <label>Here are Names:</label>
        <input name="name1" type="text" value="name1" /><span>插入一个标签间隔一下</span>
        <input name="name2" type="text" value="name2" />
        <input name="name3" type="text" value="name3" />
        <fieldset>
              <input name="newsletter1" type="text" value="name11" />
              <label>Newsletter:</label>
              <input name="newsletter2" type="text" value="name12" />
        </fieldset>
        <fieldset>
              <input name="newsletter1" type="text" value="name21" />
              <input name="newsletter2" type="text" value="name22" />
        </fieldset>
        <input name="name4" type="text" value="name4" />
        <input type="button" id="del_names" value="Name Deleted ~" /><input type="button" id="Button1" value="Name Deleted +" />
      </form>
      <input name="name5" type="text" value="name5" />
    </body>
    Html代码
  • 相关阅读:
    composer 的安装以及一些插件的下载等
    linux 服务器安装php5.6
    数据库异地备份---服务器配置流程
    expect安装
    linux 服务器安装mysql5.6
    使用navicat 使用IP、用户名、密码直接连接linux服务器里面的数据库
    函数指针 指针函数
    信号量
    消息队列-Message Queue
    生成库文件,会链接依赖的库文件吗?
  • 原文地址:https://www.cnblogs.com/youler/p/3904505.html
Copyright © 2011-2022 走看看