1.id选择器：

// 4.如果页面中多个元素id相同，jquery只会获取第一个id的jquery对象

        var jquery = $('#name');

        alert(jquery.val());

        var jquery1 = $('#name');

        alert(jquery1.val());

<body>
<input type="text" name="name" id="name" value="张三">
<input type="text" name="name" id="name" value="李四">
</body>

2.class选择器：

 // 5.获取出来的jquery是一个数组，如果页面中多个元素class相同，jquery只会获取第一个id的jquery对象

        var jquery3 = $('.name');

        alert(jquery3.val());  // 张三

        // 想获取非第一个元素的对象，需要根据索引获取到指定位置的DOM对象后，再转化成jquery对象进行使用

        alert($($('.name')[]).val())

<input type="text" name="name" name ="name" value="张三">

<input type="text" name="name" name ="name" value="李四">

3.parent—child选择器：

// 6.获取div标签下所有class为name的元素

        alert($('div' > .name).length);  // 长度为2

<div>

       <input type="text" name="name" name ="name" value="张三">

       <input type="text" name="name" name ="name" value="李四">

 </div>

4.prev + next选择器：

匹配所有紧邻在prev元素后的next元素。

 // 7.获取紧邻元素为div的之后的class元素

        alert($('div + .name').length);  // 只有一个元素，就是value为sssss的

   <div>

       <input type="text" name="name" name ="name" value="张三">

       <input type="text" name="name" name ="name" value="李四">

   </div>

       <input type="text" name="name" name ="name" value="sssss">

       <input type="text" name="name" name ="name" value="ttttt">

5.prev ~ siblings选择器：

获取div标签后的所有元素。

 // 8.获取div标签后的所有元素，长度为2，值为sssss和ttttt

        alert($('div ~ .name').length);

   <div>

       <input type="text" name="name" name ="name" value="张三">

       <input type="text" name="name" name ="name" value="李四">

   </div>

       <input type="text" name="name" name ="name" value="sssss">

       <input type="text" name="name" name ="name" value="ttttt">
// 8.获取div标签后的所有元素，长度为2，值为sssss和ttttt

        alert($('div ~ .name').length);

   <div>

       <input type="text" name="name" name ="name" value="张三">

       <input type="text" name="name" name ="name" value="李四">

   </div>

   <div>

        <input type="text" name="name" name ="name" value="sssss">

   </div>

        <input type="text" name="name" name ="name" value="sssss">

        <input type="text" name="name" name ="name" value="ttttt">

6.简单过滤选择器：匹配符合条件的元素

7.属性选择器：【attribute】匹配包含给定属性的元素

 // 9.获取所有元素都有value属性的所有元素

        alert($('[value]').length);

        alert($('.name[value]').length); // 所有class为name的带有value的属性

jQuery学习二的更多相关文章

  1. Jquery 学习二

    一.事件编程 1.基本事件(以方法形式存在的) 基本语法: 原生Javascript代码中的事件绑定方式: DOM对象.事件 = 事件的处理程序   jQuery代码中的事件绑定方式: jQuery对 ...

  2. jquery 学习(二) - 属性操作

    html代码 <div class="n1" zdy="z1">AAA <p>1111111</p> <input t ...

  3. jQuery学习(二) 自定义扩展函数

    jQuery函数调用写法很优雅,在项目开发过程中,有需要自定义函数经常被使用到,将这些函数放置到项目ExtTool.js中,为了编码方式的统一,也希望这些自定义函数与jQuery函数一致的调用方式.在 ...

  4. JQuery学习二（获取元素控件并控制）

    $(’#id‘).+function; 例如: 1 <head> 2 <title>JQuery</title> 3 <script src="js ...

  5. jQuery学习(二)——使用JQ完成页面定时弹出广告

    1.JQuery效果 2.步骤分析: 第一步:引入jQuery相关的文件 第二步:书写页面加载函数 第三步:在页面加载函数中,获取显示广告图片的元素. 第四步:设置定时操作(显示广告图片的函数) 第五 ...

  6. jQuery学习(二)

    操作DOM对象: 修改文本: jQuery对象的text()和html()方法可以用来获取节点的文本内容和HTML文本.而当你给方法传入参数时,这两个方法可以被用于设置jQuery的文本内容. 还是以 ...

  7. JQuery学习二-字典操作

    1. 数组中添加map var arr = []; var key = 'Jeremy'; var value = '!!!!' arr.push({ 'key': key, 'value': val ...

  8. jQuery学习-事件之绑定事件（二）

    在上一篇<jQuery学习-事件之绑定事件(一)>我们了解了jQuery的add方法,今天我们来学习下dispatch方法: dispatch: function( event ) {   ...

  9. jQuery学习之二 jQuery选择器

    一.jQuery选择器是什么1.CSS选择器2.jQuery选择器 二.jQuery选择器的优势1.简洁的写法2.支持从CSS1到CSS3选择器3.完善的处理机制  传统js选择器假如要操作的元素不存 ...

随机推荐

  1. 用于异步事件驱动的 P 语言 P Language

    微软最近开源了P语言,致力于在Linux.macOS和Windows上编写安全的异步事件驱动程序. 微软将P描述为一种领域特定语言,对异步系统的组件间通信进行建模,例如嵌入式.网络或分布式系统.P程序 ...

  2. sqlserver内存、会话、连接查询

    1.连接查询 select * from sysprocesses where dbid in (select dbid from sysdatabases where name='dbname') ...

  3. storm 安装配置

    1.1.下载安装包 storm.apache.org 配置zookeeper:http://www.cnblogs.com/eggplantpro/p/7120893.html 1.2.解压安装包ta ...

  4. REST与RPC区别

    OSI网络七层模型 第一层:应用层.定义了用于在网络中进行通信和传输数据的接口: 第二层:表示层.定义不同的系统中数据的传输格式,编码和解码规范等: 第三层:会话层.管理用户的会话,控制用户间逻辑连接 ...

  5. Postgresql 解决锁表

    转载地址:https://blog.csdn.net/cicon/article/details/68068462##一.postgresql解决锁表--查询是否锁表了select oid from ...

  6. jQuery相关方法10

    一.链式编程的原理 <script> //构造函数 function Person(age){ this.age=age; this.sayHi=function(txt){ if(txt ...

  7. luogu 2152

    SuperGcd 二进制算法 1. A = B, Gcd(A, B) = A; 2. A,B为偶数,  Gcd(A, B) = 2 * Gcd(A / 2, B / 2); 3. A 为偶数, B 为 ...

  8. linux下安装python3.6.6

    1.到python的官网去下载python3.6.3安装包,必须是Linux版本的 2.在/usr/tmp下下载python安装包 wget https://www.python.org/ftp/py ...

  9. Jetbrain全栈最新激活方法（2019年及之前所有新老版本）

    随着2019版的到来,之前的永久激活教程也不生效了,所以今天为大家带来一种新的永久激活方式. 1.下载新版破解补丁 破解补丁传送门提取码:3e8j 点击传送门下载补丁文件 jetbrains-agen ...

  10. spark2.1.0的源码编译

    本文介绍spark2.1.0的源码编译 1.编译环境: Jdk1.8或以上 Hadoop2.7.3 Scala2.10.4 必要条件: Maven 3.3.9或以上(重要) 点这里下载 http:// ...