juqery学习3之juqery对象条件筛选
代码例子:某个div块下的字体样式的控制。
//script代码
<script src="${sitePath}/cec_wcp/js/jquery-1.8.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
function SetFont(size){
//如果id为news_content的div块下存在p标签,则控制p标签中字体的大小。
//如果该id下的div块中不存在p标签,则直接控制该div下的字体的大小
if($("#news_content p").length>){
$("#news_content p").css("font-size",size+"pt");
}else{
$("#news_content").css("font-size",size+"pt");
}
}
</script>
//html代码
<p>【字体:<a href="javascript:SetFont(14)">大</a> <a href="javascript:SetFont(12)">中</a> <a href="javascript:SetFont(10)">小</a>】</p>
<div id="news_content"></div>
第一种:jquery条件综合多条件选择器
模式:$(选择器1,选择器2)----->返回选择器1内符合选择器2的jquery对象(选择器1内的后代元素,儿子孙子辈都有)
第二种:jquery对象find()方法
模式:$(选择器1,选择器2).find("选择器3")--->返回符合选择器1,选择器2的jquery对象中包含的符合选择器3的所有后代元素。包括孙子辈。不包括自身。
第三种:jquery对象children()方法
模式:$(选择器1,选择器2).children("选择器3")--->返回符合选择器1+选择器2的孩子级别的选择器3的jquery对象。只包含孩子辈,无孙子辈。不包括自身。
jQuery 选择器
| 选择器 | 实例 | 选取 |
|---|---|---|
| * | $("*") | 所有元素 |
| #id | $("#lastname") | id="lastname" 的元素 |
| .class | $(".intro") | 所有 class="intro" 的元素 |
| element | $("p") | 所有 <p> 元素 |
| .class.class | $(".intro.demo") | 所有 class="intro" 且 class="demo" 的元素 |
| :first | $("p:first") | 第一个 <p> 元素 |
| :last | $("p:last") | 最后一个 <p> 元素 |
| :even | $("tr:even") | 所有偶数 <tr> 元素 |
| :odd | $("tr:odd") | 所有奇数 <tr> 元素 |
| :eq(index) | $("ul li:eq(3)") | 列表中的第四个元素(index 从 0 开始) |
| :gt(no) | $("ul li:gt(3)") | 列出 index 大于 3 的元素 |
| :lt(no) | $("ul li:lt(3)") | 列出 index 小于 3 的元素 |
| :not(selector) | $("input:not(:empty)") | 所有不为空的 input 元素 |
| :header | $(":header") | 所有标题元素 <h1> - <h6> |
| :animated | 所有动画元素 | |
| :contains(text) | $(":contains('W3School')") | 包含指定字符串的所有元素 |
| :empty | $(":empty") | 无子(元素)节点的所有元素 |
| :hidden | $("p:hidden") | 所有隐藏的 <p> 元素 |
| :visible | $("table:visible") | 所有可见的表格 |
| s1,s2,s3 | $("th,td,.intro") | 所有带有匹配选择的元素 |
| [attribute] | $("[href]") | 所有带有 href 属性的元素 |
| [attribute=value] | $("[href='#']") | 所有 href 属性的值等于 "#" 的元素 |
| [attribute!=value] | $("[href!='#']") | 所有 href 属性的值不等于 "#" 的元素 |
| [attribute$=value] | $("[href$='.jpg']") | 所有 href 属性的值包含以 ".jpg" 结尾的元素 |
| :input | $(":input") | 所有 <input> 元素 |
| :text | $(":text") | 所有 type="text" 的 <input> 元素 |
| :password | $(":password") | 所有 type="password" 的 <input> 元素 |
| :radio | $(":radio") | 所有 type="radio" 的 <input> 元素 |
| :checkbox | $(":checkbox") | 所有 type="checkbox" 的 <input> 元素 |
| :submit | $(":submit") | 所有 type="submit" 的 <input> 元素 |
| :reset | $(":reset") | 所有 type="reset" 的 <input> 元素 |
| :button | $(":button") | 所有 type="button" 的 <input> 元素 |
| :image | $(":image") | 所有 type="image" 的 <input> 元素 |
| :file | $(":file") | 所有 type="file" 的 <input> 元素 |
| :enabled | $(":enabled") | 所有激活的 input 元素 |
| :disabled | $(":disabled") | 所有禁用的 input 元素 |
| :selected | $(":selected") | 所有被选取的 input 元素 |
| :checked | $(":checked") | 所有被选中的 input 元素 |
撒旦法
juqery学习3之juqery对象条件筛选的更多相关文章
- 孤荷凌寒自学python第七十天学习并实践beautifulsoup对象用法3
孤荷凌寒自学python第七十天学习并实践beautifulsoup对象用法3 (完整学习过程屏幕记录视频地址在文末) 今天继续学习beautifulsoup对象的属性与方法等内容. 一.今天进一步了 ...
- 孤荷凌寒自学python第六十九天学习并实践beautifulsoup对象用法2
孤荷凌寒自学python第六十九天学习并实践beautifulsoup对象用法2 (完整学习过程屏幕记录视频地址在文末) 今天继续学习beautifulsoup对象的属性与方法等内容. 一.今天进一步 ...
- Hbase条件筛选
需求来自于,模糊查找当天的所有记录,并查找对应列的记录数 public static void main(String[] args) throws Exception{ //创建HBase连接 Co ...
- HBase多条件筛选查询方案
最近的项目需要使用Hbase做实时查询,由于Hbase只支持一级索引,也就是使用rowkey作为索引查询,所以对于多条件筛选查询的支持不够,在不建立二级索引的情况下,只能使用Hbase API中提供的 ...
- Servlet的学习之Request请求对象(3)
本篇接上一篇,将Servlet中的HttpServletRequest对象获取RequestDispatcher对象后能进行的[转发]forward功能和[包含]include功能介绍完. 首先来看R ...
- jquery实现多条件筛选特效代码分享
本文实例讲述了jquery实现多条件筛选特效.分享给大家供大家参考.具体如下:jquery实现的多条件搜索表单带日期选择表格表单效果源码,是一段实现了多个条件筛选搜索的特效代码,多条件拥有时间.地点. ...
- JDBC动态查询MySQL中的表(按条件筛选)
动态查询实现按条件筛选.PreparedStatement 准备语句指定要查询的表头列,.setString()通过赋值指定行,.executeQuery()执行语句 在数据库test里先创建表sch ...
- JS前端数据多条件筛选(商品搜索)
有时候也会需要在前端进行数据筛选,增强交互体验.当数据可用的筛选条件较多时,把逻辑写死会给后期维护带来很大麻烦.下面是我自己写的一个简单的筛选器,筛选条件可以根据数据包含的字段动态设置. 仿照京东的筛 ...
- mxonline实战8,机构列表分页功能,以及按条件筛选功能
对应github地址:列表分页和按条件筛选 一. 列表分页 1. pip install django-pure-pagination 2. settings.py中 install ...
随机推荐
- http之响应报文response
一般情况下,服务器接收并处理客户端发过来的请求后会返回一个HTTP的响应消息. HTTP响应也由四个部分组成,分别是:状态行.消息报头.空行和响应正文. http响应消息格式.jpg 例子 HTTP/ ...
- Bootstrap fileinput v1.0(ssm版)
前言bootstrap fileinput是一个很好的文件上传插件.但是官方不出api,这就尴尬了.百度一下,每个人写法都不相同,好多代码本身都是错的.我修改后才能跑起来.综上所述:所以今天我摸索了一 ...
- CCPC-Wannafly Winter Camp Day1 (Div2, onsite)
Replay Dup4: 要是不挂机,再多仔细想想就好了 J确实自闭好久,一直在想正确性,最后数据错了,喵喵喵? 还是要保证充足的休息啊,中间睡了一小会儿,也不知道睡了多久,醒来他们就又过了一道 要发 ...
- zw“小数据”理论也碰上了“黑天鹅”
4月上旬,在blog<大数据和高频量化交易 >,我们曾经说过: 实战测试,数据越多,反而会影响精度.目前个人数据分析的一个重点,就是"小"数据.老子<道德经·第六 ...
- python webdriver grid多节点运行webdriver程序
grid整理: 机制 Hub机器和节点机器上要装jdk和jar包 A机器:hub 中控:用来监控所有节点机的状态 启动命令: java -jar selenium-server-standalone ...
- ngular6开发不完全笔记(三)-- 报错指南
router Uncaught Error: Template parse errors: 'router-outlet' is not a known element: If 'router-out ...
- 自定义Git【转】
本文转载自:http://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000 自定义Git 在安装G ...
- Spring Boot与数据
SpringBoot 着眼于JavaEE! 不仅仅局限于 Mybatis .JDBC. Spring Data JPA Spring Data 项目的目的是为了简化构建基于 Spring 框架应用的数 ...
- 2017NOIP模拟赛-科普基地
今天回来打的第一场NOIP难度的试题,结果惨不忍睹.写一下每道题的做法,然后每道题犯的__弱智__错误 UPD:2018.9.15 突然这篇题解就变成很多大佬要看的了,因为之前是写给自己看的,所以写的 ...
- BZOJ 1853: [Scoi2010]幸运数字(容斥原理)
http://www.lydsy.com/JudgeOnline/problem.php?id=1853 题意: 在中国,很多人都把6和8视为是幸运数字!lxhgww也这样认为,于是他定义自己的“幸运 ...