1.选择器练习：

 1)查找UL中的元素的内容
格式：$(“ul li:XX”).text()   XX：代表方法

比如：获取到第一元素，然后获取当中的值

$(“ul li:first”).text()

获取最后一个元素，然后获取当中的值

$(“ul li:last”).text() 
查找索引号是奇数的标签,索引号从1开始
$("ul li:odd").size();
查找表格的索引号为偶数行个数，索引号从0开始
$("table tr:even").size();
查找表格中第3行的内容，从索引号0开始
$("table tr:eq(2)");
查找表格中第二第三行的个数，即索引值是1和2，也就是比0大
假如说有三条记录,为1和2的数据，可以理解为大于0的标签

$("table tr:ge(0).size()");
查找表格中第一第二行的个数，即索引值是0和1，也就是比2小
可以理解为小于2的标签

$("table tr:lt(2)")
给页面内所有标题<h1><h2><h3>加上红色背景色，且文字加绿色
$(":header").css('bgcolor','bule');
text() 和 html()方法的区别：

 text()方法可以是XMl、HTML还可以是jsp,但是HTML（）不可以将xml的属性值取出来。所以text()这个方法也是推荐是一种方法
 Html()强调的是标签中的内容，即使标签中的指中的子标签，也会显示出来
 Text()强调的是文本，只将值取出来
<body>

    <ul>

        <li>list item </li>

        <li>list item </li>

        <li>list item </li>

        <li>list item </li>

        <li>list item </li>

    </ul>

    <table border="">

      <tr><td>line1[]</td></tr>

      <tr><td>line2[]</td></tr>

      <tr><td>line3[]</td></tr>

      <tr><td>line4[]</td></tr>

      <tr><td>line5[]</td></tr>

      <tr><td>line6[]</td></tr>

    </table>

    <h1>h1</h1>

    <h2>h2</h2>

    <h3>h3</h3>

    <p>p</p>

    <script type="text/javascript">

        //1)查找UL中第一个元素的内容

           $(“ul li:first”).text() 获取到第一个元素，然后获取他们里面的值

        //2)查找UL中最后个元素的内容

           $(“ul li:last()”).text()    最后一个

        //3)查找表格的索引号为1、3、5...奇数行个数，索引号从0开始

           $(“table tr:odd”).size()  获取为奇数的值

        //4)查找表格的索引号为2、4、6...偶数行个数，索引号从0开始

           $(“table tr:even”).size()  获取为偶数的值

        //5)查找表格中第二行的内容，从索引号0开始，这是一种祖先 后代 的变化形式

           $(“table tr:eq()”)

        //6)查找表格中第二第三行的个数，即索引值是1和2，也就是比0大

           $(“table tr:gt().size()”)找出下标里面的值为0的。就是下标大于0的有几个

        //7)查找表格中第一第二行的个数，即索引值是0和1，也就是比2小

           $(“table tr:lt(2)”)  小于2

    </script>

  </body>

2.练习2

1)查找所有包含文本"kw"的div元素的个数查找一下，因为是数据,所以注意大小写

$(“div”).size()  获取到所有的div标签

$(“div:contains(‘kw’)”).size()  查找一下

/2)查找所有p元素为空的元素个数

$("p:empty").size()     empty为空的。

3)给所有包含p元素的div元素添加一个myClass样式

查找div中含有p标签的，然后在后面加上自己的样式

$("div.has(p)").addclass("myClass");

4)查找所有含有子元素或者文本的p元素个数,即p为父元素

注意：p里面的数据是自己本身带有的，不是手动输入的。

$("p:parent").size();

练习

<body>

    <div><p>kw Resig</p></div>

    <div><p>George Martin</p></div>

    <div>Malcom kw Sinclair</div>

    <div>J. Ohn</div>

    <div></div>

    <p>kw啦啦啦</p>

    <p></p>

    <script type="text/javascript">

        //1)查找所有包含文本"kw"的div元素的个数

            $(“div”).size()

            $(“div:contains(‘kw’)”).size()值是有大小写区分的。

          //2)查找所有p元素为空的元素个数

            $(“p:empty”).size()  empty为空的

          //3)给所有包含p元素的div元素添加一个myClass样式

            $(“div:has(p)”).addClass(“myclass”)

          //4)查找所有含有子元素或者文本的p元素个数,即p为父元素

            $(“p:parent”).size()</script>

  </body>

jQuery笔记---选择器(二)的更多相关文章

  1. jQuery笔记（二）jQuery中DOM操作

    前言 本篇主要介绍DOM操作,在说DOM操作之前,首先我们应该熟悉DOM树,以一个例子为例来说明DOM树.首先看这段HTML代码.(本文后面的代码如果没有特别指出,都是针对下述HTML代码进行操作) ...

  2. jQuery笔记——选择器

    jQuery 最核心的组成部分就是:选择器引擎.它继承了 CSS 的语法,可以对 DOM 元 素的标签名.属性名.状态等进行快速准确的选择,并且不必担心浏览器的兼容性 常规选择器 根据id选择元素就是 ...

  3. jQuery笔记---选择器

    查找API,jQuery选择器,定位标签 1.基本选择器 id定位标签 class属性定位标签 标签名定位标签 2.举例 <html> <head> <meta http ...

  4. jQuery笔记（二）

    $()下的常用方法 addClass():添加样式 removeClass():删除样式 $('div').addClass('box2 box4'); $('div').removeClass('b ...

  5. jQuery笔记---选择器(三)

    1.1查找隐藏的tr元素的个数 $(“table tr:hidden”).size() 查找所有可见的tr元素的个数 $(“table tr:not(:hidden)”).size()   一般是不使 ...

  6. jQuery自学笔记（二）：jQuery选择器

    一.简单选择器 ID选择器:$('#box') 元素标签名:$('div') 类选择器:$('.box') jQuery提供了length和size()两种方法查看返回的元素,可验证ID在页面只出现一 ...

  7. jQuery学习笔记（二）：this相关问题及选择器

    上一节的遗留问题,关于this的相关问题,先来解决一下. this的相关问题 this指代的是什么 这个应该是比较好理解的,this就是指代当前操作的DOM对象. 在jQuery中,this可以用于单 ...

  8. jQuery笔记（一）jQuery选择器

    一.前言 编写任何javascript程序我们要首先获得对象, jQuery选择器能彻底改变我们平时获取对象的方式, 可以获取几乎任何语意的对象, 比如"拥有title属性并且值中包含tes ...

  9. jquery笔记之属性选择器 查找以某种条件开头的页面元素

    jquery笔记之属性选择器 查找以某种条件开头的页面元素 转载:http://www.blogbus.com/amyqiong-logs/78340326.html $("div[id]& ...

随机推荐

  1. 洛谷P2251 质量检测

    题目背景 无 题目描述 为了检测生产流水线上总共N件产品的质量,我们首先给每一件产品打一个分数A表示其品质,然后统计前M件产品中质量最差的产品的分值Q[m] = min{A1, A2, ... Am} ...

  2. 轻松八步搞定Cacti配置安装（原创视频）

    轻松八步搞定Cacti配置安装 1.安装web server $sudo apt-get install apache2 验证 http://localhost 2.$sudo apt-get ins ...

  3. Kinect 开发 —— 面部识别

    EmguCV库也能用来进行面部识别(face identify).实际的面部识别,就是将一张图像上的人物的脸部识别出来,这是个很复杂的过程,具体过程我们这里不讨论.对一幅影像进行处理来找到包含脸部的那 ...

  4. 2017国家集训队作业[agc016e]Poor Turkey

    2017国家集训队作业[agc016e]Poor Turkey 题意: 一开始有\(N\)只鸡是活着的,有\(M\)个时刻,每个时刻有两个数\(X_i,Y_i\),表示在第\(i\)个时刻在\(X_i ...

  5. 【DRF频率】

    目录 使用自带的频率限制类 使用自定义的频率限制类 开发平台的API接口调用需要限制其频率,以节约服务器资源和避免恶意的频繁调用. DRF就为我们提供了一些频率限制的方法. DRF中的版本.认证.权限 ...

  6. Linux硬件信息查看

    more /proc/cpuinfo more /proc/meminfo more /proc/*info lspci 查看主板信息等cat /proc/cpuinfo CPU信息cat /proc ...

  7. 【习题 8-7 UVA - 11925】Generating Permutations

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 让你把排列1..n变换成对应的输入序列. 每次可以交换前两个数字,或者把第一个数字放到末尾去. 可以逆向考虑. 即把无序的序列变换成 ...

  8. linux6.0系统如何安装portmap

    因为在6.0的系统里,portmap已经改名了.在Redhat或CentOS5中可以使用 service portmap start启动服务,然后在启动nfs服务,实现挂载. 6里面可是试试 serv ...

  9. 软考之路--从生活着手，看PV怎样操作

    PV操作.是软考其中一个非常重要的考点,一听到这个名词,顿时赶脚高大上有么有,在软考的历年试题中,也不乏PV操作的身影,老师也对PV操作进行了一次讲课,那时年少.听得稀里糊涂,也不是非常理解,在小编的 ...

  10. [leetcode] Palindrome Number（不使用额外空间）

    本来推断回文串是一件非常easy的事情,仅仅须要反转字符串后在与原字符串相比較就可以.这道题目明白说明不能使用额外的空间.那么使用将其分解连接成字符串的方法便不是可行的.仅仅好採用数学的方式: 每次取 ...