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. main方法中参数"String[ ] args"详解

    1.在编写完一个有主方法的java文件时,需要在cmd窗口中先编译此java文件(javac xxx.java),然后再运行(java xxx) 其实在运行java xxx的时候如果后面跟着参数用空格 ...

  2. 对linux下日志文件error监控

    对日志文件中的error进行监控,当日志文件中出现error关键字时,就截取日志(grep -i error 不区分大小写进行搜索"error"关键字,但是会将包含error大小写 ...

  3. git 廖雪峰博客笔记

    其他参考 http://www.softwhy.com/article-8498-1.html 本地模拟多用户来学习 参考   其实就是克隆两个目录,两个目录的git config 不同的名字和邮箱, ...

  4. 洛谷 P2119 魔法阵 题解

    Analysis 这道题也是考试题,我也依然打了个n三次方暴力.正解是先枚举差,再枚举c和d,a和b用乘法原理优化,这样就能大大减少时间. #include<iostream> #incl ...

  5. js 删除节点

    亲身经历,寻得此法,告知大家=============== 在javascript操作dom树的时候可能会经常遇到增加,删除节点的事情,比如一个输入框后一个增加按钮,一个删除按钮,点击增加就增加 个输 ...

  6. vue中点击复制粘贴功能 clipboard 移动端

    页面是由 v-for 循环渲染出来,要给每一个结构里面的复制按钮加一个复制功能 npm install clipboard --save    安装,如果安装处问题,多安装几次,我自己也安装了好几次 ...

  7. journalnode Can't scan a pre-transactional edit log 异常处理

    由于数据磁盘爆满,达到100%,导致journalnode宕掉,在启动journalnode以后,查看日志,提示Can't scan a pre-transactional edit log,这个时候 ...

  8. 【解决方案】IP代理池设计与解决方案

    一.背景 爬虫服务请求量大,为了应对反爬措施,增加爬虫的爬取效率和代理IP使用率,需要设计一个IP代理池,满足以下需求: 定时任务获取第三方代理 及时剔除IP代理池中失效的IP 业务隔离IP 若IP未 ...

  9. JAVA SparkSQL初始和创建DataFrame的几种方式

    建议参考SparkSQL官方文档:http://spark.apache.org/docs/latest/sql-programming-guide.html 一.前述       1.SparkSQ ...

  10. 目录:JAVA

    收藏: Java:类与继承