专栏首页Euclid学习日记java学习(jQuery选择器)
原创

java学习(jQuery选择器)

来自雷丰阳老师课程

1.基本选择器

$("#id")            //ID选择器
$("div")            //元素选择器
$(".class")     //类选择器
$(".class,#id1")     //组合选择器:用逗号隔开

2.层次选择器

 $("parent > child")    //子元素选择器:>
$("parent child ")    //后代元素选择器:空格隔开
$("element + next")    //相邻元素选择器:+
$("element ~ siblings")    //兄弟元素选择器:~

3.过滤选择器

3.1基本过滤选择器

$("div:first")    //第一个div
$("div:last")     //最后一个div
$("div:even")     //挑选下标为偶数的div
$("div:odd")      //挑选下标为奇数的div
$("div:eq(4)")    //下标等于 4 的div
$("div:gt(3)")    //下标大于 3 的div
$("div:lt(3)")    //下标小于 3 的div
$("div:not(:animated):last") //除去动画div剩余div中的最后一个div

3.2内容过滤选择器

$(":contains("euclid")")    // 包含euclid文本的元素
$(":empty")                 //所有空元素
$("div:has(p)")        //含有p元素的div元素
$("div:parent")                //含有子元素或者文本的div元素

3.3可见性过滤选择器

$("div:hidden")       //所有不可见div元素,或type为hidden的元素
$("div:visible")      //所有可见div元素

//例如
alert($("input:hidden").attr("value"))

3.4属性过滤选择器

$("div[title]")        //所有含有 title 属性的 div 元素
$("div[id='123']")        // id属性值为123的div 元素
$("div[id!='123']")        // id属性值不等于123的div 元素
$("div[id^='123']")        // id属性值以123开头的div 元素
$("div[id$='123']")        // id属性值以123结尾的div 元素
$("div[id*='123']")        // id属性值包含123的div 元素
$("input[id][name$='man']") //多属性选过滤,同时满足两个属性的条件的元素

3.5子元素属性过滤器

//从1开始计数
$("div.one :nth-child(2)");  // clas为one的div下的第二个子元素
$("div.one :first-child");  // clas为one的div下的第一个子元素
$("div.one :last-child");  //class为one的div下的最后一个子元素
$("div.one :only-child")  //class为one的div且仅有一个子元素的div

4.1表单选择器

$(":input")      //匹配所有 input, textarea, select 和 button 元素
$(":text")       //所有的单行文本框,$(":text") 等价于$("[type=text]")
$(":password")   //所有密码框
$(":radio")      //所有单选按钮
$(":checkbox")   //所有复选框
$(":submit")     //所有提交按钮
$(":reset")      //所有重置按钮
$(":button")     //所有button按钮
$(":file")       //所有文件域 

##4.2表单对像属性选择器

$("input:disable");   //禁用的元素
$("input:enable");   //启用input
$(":selected");   //所有选定的下拉列表元素
$(":checkbox:check"); //所有选中的复选框选项

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 二叉树的非递归遍历(leetcode)

    后序遍历迭代方法和前中遍历的迭代方法类似,但是差别在于后序遍历的顺序是left->right->root;所以我们在从栈中弹出访问一个left之后,要判断当前r...

    euclid
  • 寒假学习计划

    今年考研感觉不太好,借助寒假系统的复习一遍java web和大学其他知识(还有高数/(ㄒoㄒ)/~~)

    euclid
  • java学习(html+css)

    1.网页的构成:结构:html 表现:css 反映:JavaScript

    euclid
  • 浮动元素margin-bottom失效 — IE6盒模型

    HTML5学堂:虽然IE6慢慢的退出市场了,但是还是有必要了解一些兼容问题,让自己的知识有一个更好的沉淀。margin-bottom的bug是容器div的 'z...

    HTML5学堂
  • jQuery选择器大全(48个代码片段+21幅图演示)1

    选择器是jQuery最基础的东西,本文中列举的选择器基本上囊括了所有的jQuery选择器,也许各位通过这篇文章能够加深对jQuery选择器的理解,它们本身用法就...

    逸鹏
  • 爬虫篇 | Python现学现用xpath爬取豆瓣音乐

    最近整理一个爬虫系列方面的文章,不管大家的基础如何,我从头开始整一个爬虫系列方面的文章,让大家循序渐进的学习爬虫,小白也没有学习障碍.

    叫我龙总
  • JSX渲染原理

    1.基于babel-preset-react-app这个语法解析包,把jsx语法转换成一个名为 React.createElement() 的方法调用。

    柴小智
  • React系列之JSX

    JSX是一个有趣的东西。它看似像一个模板语言,但是又具备javascript的所有能力。

    前端博客 : alili.tech
  • 让div水平垂直居中的几种方法

    利用 CSS 来实现对象的垂直居中有许多不同的方法,比较难的是选择那个正确的方法。使用 CSS 实现水平居中很容易,但要实现垂直居中并不容易。而且有些方法在一些...

    A梦多啦A
  • Python爬虫:现学现用xpath爬取豆瓣音乐

    爬虫的抓取方式有好几种,正则表达式,Lxml(xpath)与BeautifulSoup,我在网上查了一下资料,了解到三者之间的使用难度与性能

    叫我龙总

扫码关注云+社区

领取腾讯云代金券