zoukankan      html  css  js  c++  java
  • 06jQuery-01-基本选择器

    1、jQuery概要

    JavaScript的一个库,只是一个jquery-xxx.js的文件,它可以让你写更少的代码,做更多的事。

    $是著名的jQuery符号。实际上,jQuery把所有功能全部封装在一个全局变量jQuery中,而$也是一个合法的变量名,它是变量jQuery的别名。

    jQuery选择器得到的对象是一个jQuery对象,已经不是普通JS通过方法获取的HTML对象了,它类似数组,每个元素都是一个引用了DOM节点的对象。jQuery对象和DOM对象可以相互转换。

    2、jQuery的选择器

    按id查找
    // 查找<div id="abc">: 
    var div = $('#abc');

    按tag查找
    var ps = $('p'); // 返回所有<p>节点
    ps.length; // 数一数页面有多少个<p>节点

    按class查找
    var a = $('.red'); // 所有节点包含`class="red"`都将返回
    // 例如:
    // <div class="red">...</div>
    // <p class="green red">...</p>
    
    //查找同时包含red和green的节点
    var a = $('.red.green'); // 注意没有空格!同时查找red和green
    // 符合条件的节点:
    // <div class="red green">...</div>
    // <div class="blue green red">...</div>

    按attr查找
    var email = $('[name=email]'); // 找出<??? name="email">
    var passwordInput = $('[type=password]'); // 找出<??? type="password">
    var a = $('[items="A B"]'); // 找出<??? items="A B">
    
    //按属性查找还可以使用前缀查找或者后缀查找
    var icons = $('[name^=icon]'); // 找出所有name属性值以icon开头的DOM
    // 例如: name="icon-1", name="icon-2"
    var names = $('[name$=with]'); // 找出所有name属性值以with结尾的DOM
    // 例如: name="startswith", name="endswith"
    
    //这个方法尤其适合通过class属性查找,且不受class包含多个名称的影响
    var icons = $('[class^="icon-"]'); // 找出所有class包含至少一个以`icon-`开头的DOM
    // 例如: class="icon-clock", class="abc icon-home"

    组合查找
    组合查找就是把上述简单选择器组合起来使用。如果我们查找$('[name=email]'),很可能把表单外的<div name="email">也找出来,但我们只希望查找<input>,就可以这么写:
    var emailInput = $('input[name=email]'); // 不会找出<div name="email">

    多项选择器
    多项选择器就是把多个选择器用,组合起来一块选:
    $('p,div'); // 把<p>和<div>都选出来
    $('p.red,p.green'); // 把<p class="red">和<p class="green">都选出来


  • 相关阅读:
    部署 AppGlobalResources 到 SharePoint 2010
    还原一个已删除的网站集
    使用仪表板设计器配置级联筛选器 (SharePoint Server 2010 SP1)
    File or arguments not valid for site template
    Pex and Moles Documentation
    Content Query Webpart匿名访问
    Running Moles using NUnit Console from Visual Studio
    Calling a WCF Service using jQuery in SharePoint the correct way
    Updating Content Types and Site Columns That Were Deployed as a Feature
    asp.net中判断传过来的字符串不为空的代码
  • 原文地址:https://www.cnblogs.com/deng-cc/p/6681384.html
Copyright © 2011-2022 走看看