zoukankan      html  css  js  c++  java
  • 选择器

    传统的Javascript是通过document.getElementById()函数来选择页面元素,这需要被选择的元素具有定义好的ID。相比之下,jQuery对页面元素的选择就要灵活多,它不但支持通过ID选择,而且还支持Class Name、元素及其位置顺序、以及这些方法的组合。

    如果你对CSS熟悉,你一定知道什么是ID和Class。ID和Class都是对页面元素的标识,不同的是ID是对某个元素的标识(不同的元素不可以具有相同的ID),而Class是对一类元素的标识(不同元素可以具有相同的Class)。 jQuery用到的ID和Class就是来自CSS。

    1. 通过“ID”来选择:

    <p id="myID">这一段落的ID是“myID"</p>
    
    //用以下jQuery来选择这一段落,然后加上特效(向右移动10px)
    
    $("#myID").animate({ marginLeft: 10}, 'fast');

    2. 通过“Class”来选择:

    <p class="myClass">这一段落的Class是”myClass“</p>
    
    //用以下的jQuery来选择这一段落,然后附加上一个词
    
    $(".myClass").append("<b>Hello</b>"

    3. 通过“元素及其位置顺序”来选择:

    <ul>
    
      <li>第一列</li>
    
      <li>第二列</li>
    
      <li>第三列</li>
    
    </ul>
    
    //使用下列jQuery对第三列进行选择,然后加上特效
    
    $('li:eq(2)').animate({ marginLeft: 10}, 'fast');

    4. 使用“上述方法的组合”来多项选择:

    <p id="myID">paragraph with id</p>
    
    <p class="myClass">paragraph with class</p>
    <ul>
    
      <li>第一列</li>
    
      <li>第二列</li>
    
      <li>第三列</li>
    
    </ul>
    
    //使用以下jQuery可以把上面的HTML元素都选中
    
    $('#myID, .myClass, li:eq(2)').$('li').append("-被选中");

    注意:

    • 选择页面元素的格式是:$('selector') , 这里selector是你要选择的元素,它可以是以上4种情况。
    • 元素选择后,通常要执行一些操作,以上例子里使用了animateappend,更多更深入的探讨将在以后的文章里详述。
    • jQuery的选择器(selector)功能强大,所包含的内容比较多,这里只是对最基本的功能进行介绍。我会在以后的文章里对它进行更加详细的介绍。
    • Update:2/15/2009: $('selector')是jQuery('selector')的缩写,如果你的Javascript代码包含有对$的其他定义,你必须使用jQuery来代替$
  • 相关阅读:
    Spark监控官方文档学习笔记
    Maven打包排除某个资源或者目录
    源码中的哲学——通过构建者模式创建SparkSession
    CentOS7启动Tomcat报错:./startup.sh: Permission denied
    Centos7 安装 redis
    centos7 查找jdk 安装路径
    Activemq(centos7)开机自启动服务
    /var/run/redis_6379.pid exists, process is already running or crashed解决方案
    activeMQ 修改端口号
    CentOS7.5 通过wget下载文件到指定目录
  • 原文地址:https://www.cnblogs.com/Look_Sun/p/1667509.html
Copyright © 2011-2022 走看看