JQuery 学习笔记 选择器之四


Posted in Javascript onJuly 23, 2009
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>无标题文档</title> 
<script src="js/jquery-1.3.2.js"></script> 
<script type="text/javascript"><!-- 
$(function(){ 
    $("#aContains").click(function(){ 
        $("div:contains('hello')").each(function(){ 
            $(this).css("background","red");                             
        })                         
    }) 
    $("#aEmpty").click(function(){ 
        $("div:empty").each(function(){ 
            $(this).html("EmptyDIV");                             
        })                         
    }) 
    $("#aHas").click(function(){ 
        $("div:has(p)").each(function(){ 
            $(this).css("background","red");                         
        })                         
    }) 
    $("#aParent").click(function(){ 
        $("div:parent").each(function(){ 
            $(this).css("background","red");                         
        })                         
    }) 
}) 
// --></script> 
</head> <body> 
<div id ="div1"> 
    <p>hello word!</p> 
</div> 
<div id ="div2"> 
    hello 
</div> 
<div id ="div3" height="20px"> 
</div> 
<div id ="div4"></div> 
<a href="#" id="aContains">设置内容包含“hello”的节点红色背景颜色</a> 
<a href="#" id="aEmpty">设置无内容的DIV内容设为EmptyDIV</a> 
<a href="#" id="aHas">设置包含 p 节点的 div 节点红色背景颜色</a> 
<a href="#" id="aParent">设置包含子节点的 div 节点红色背景颜色</a> 
</body> 
</html>

首先还是对本章的课外知识点进行说明下
1.element.css("attributeName","value")
描述:用于设置element的style,在例子中$(this).css("background","red");就是设置节点的background为red。
现在进入主题咯
1.$("TagName:contains('keyword')")
描述:用于获取所有TagName节点里包含keyword内容的节点集合
返回值:Array(Element);
2.$("TagName:Empty")
描述:用于获取所有TagName节点里,内容为空的节点集合
返回值:Array(Element);
3.$("TagName1:has(TagName2))
描述:用于获取所有TagName1节点里,包含TagName2子节点的节点集合
返回值:Array(Element);
4.$("TagName:parent")
描述:用于获取所有TagName节点里,包含子节点的节点集合
返回值:Array(Element);
Javascript 相关文章推荐
js获取某月的最后一天日期的简单实例
Jun 22 Javascript
JavaScript中的条件判断语句使用详解
Jun 03 Javascript
基于JavaScript实现通用tab选项卡(通用性强)
Jan 07 Javascript
javascript的理解及经典案例分析
May 20 Javascript
jQuery实现表格文本框淡入更改值后淡出效果
Sep 27 Javascript
web 屏蔽BackSpace键实例代码
Dec 24 Javascript
javaScript基础详解
Jan 19 Javascript
JS拉起或下载app的实现代码
Feb 22 Javascript
解决Vue打包后访问图片/图标不显示的问题
Jul 25 Javascript
javascript(基于jQuery)实现鼠标获取选中的文字示例【测试可用】
Oct 26 jQuery
微信小程序实现自定义底部导航
Nov 18 Javascript
使用node-media-server搭建一个简易的流媒体服务器
Jan 20 Javascript
JQuery 学习笔记 选择器之三
Jul 23 #Javascript
JQuery 学习笔记 选择器之二
Jul 23 #Javascript
JQuery 学习笔记 选择器之一
Jul 23 #Javascript
javascript IFrame 强制刷新代码
Jul 23 #Javascript
jQuery TextBox自动完成条
Jul 22 #Javascript
JavaScript 动态生成方法的例子
Jul 22 #Javascript
模仿jQuery each函数的链式调用
Jul 22 #Javascript
You might like
关于二级目录拖拽排序的实现(源码示例下载)
2013/04/26 PHP
Zend的MVC机制使用分析(二)
2013/05/02 PHP
php计算数组不为空元素个数的方法
2014/01/27 PHP
ThinkPHP文件上传实例教程
2014/08/22 PHP
PHP实现定时执行任务的方法
2014/10/05 PHP
php学习笔记之基础知识
2014/11/08 PHP
理解Javascript_08_函数对象
2010/10/15 Javascript
jQuery中DOM树操作之使用反向插入方法实例分析
2015/01/23 Javascript
Node.js开发者必须了解的4个JS要点
2016/02/21 Javascript
引入JavaScript时alert弹出框显示中文乱码问题
2017/09/16 Javascript
使用jQuery 操作table 完成单元格合并的实例
2017/12/27 jQuery
在SSM框架下用laypage和ajax实现分页和数据交互的方法
2019/09/27 Javascript
Vue实现PC端靠边悬浮球的代码
2020/05/09 Javascript
Vue切换div显示隐藏,多选,单选代码解析
2020/07/14 Javascript
vue:el-input输入时限制输入的类型操作
2020/08/05 Javascript
python根据出生年份简单计算生肖的方法
2015/03/27 Python
python分布式环境下的限流器的示例
2017/10/26 Python
pip安装Python库时遇到的问题及解决方法
2017/11/23 Python
Python文本处理之按行处理大文件的方法
2018/04/09 Python
python for和else语句趣谈
2019/07/02 Python
Win10下Python3.7.3安装教程图解
2019/07/08 Python
Python OpenCV调用摄像头检测人脸并截图
2020/08/20 Python
基于YUV 数据格式详解及python实现方式
2019/12/09 Python
python django中8000端口被占用的解决
2019/12/17 Python
html+css3实现的登录界面
2020/12/09 HTML / CSS
css3中flex布局宽度不生效的解决
2020/12/09 HTML / CSS
寻找完美的房车租赁:RVShare
2019/02/23 全球购物
应届生求职信范文
2014/05/26 职场文书
社会实践活动总结范文
2014/07/03 职场文书
个人批评与自我批评材料
2014/10/17 职场文书
毕业设计指导教师评语
2014/12/30 职场文书
房屋租赁意向书范本
2015/05/09 职场文书
赢在中国观后感
2015/06/02 职场文书
Java9新特性之Module模块化编程示例演绎
2022/03/16 Java/Android
MySQL分区路径子分区再分区
2022/04/13 MySQL
SQL SERVER中的流程控制语句
2022/05/25 SQL Server