jQuery中has()方法用法实例


Posted in Javascript onJanuary 06, 2015

本文实例讲述了jQuery中has()方法用法。分享给大家供大家参考。具体分析如下:

此方法保留包含特定后代的匹配元素。
.has()方法将会从原始的jQuery对象中重新创建一组匹配的对象。
方法通过删选参数将会遍历原先对象的后代,含有匹配后代的对象将得以保留。

语法结构一:

$(selector).has(expr)

参数列表:

参数 描述
expr 字符串选择器。

实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript"> 

$(document).ready(function(){ 

  $("li").has("span").css("color","green") 

}) 

</script>

</head>

<body>

<div>

  <ul>

    <li><span>HTML专区</span></li>

    <li class="js">Javascript专区</li>

    <li>Div+Css专区</li>

    <li>Jquery专区</li>

  </ul>

</div>

</body>

</html>

匹配含有span元素的li元素,并将其中的字体颜色设置为绿色。

语法结构二:

$(selector).has(element)

参数列表:

参数 描述
element 含有的DOM元素。

实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript"> 

$(document).ready(function(){ 

  $("li").has(document.getElementsByTagName("span")).css("color","green"); 

}) 

</script>

</head>

<body>

<div>

  <ul>

    <li><span>HTML专区</span></li>

    <li class="js">Javascript专区</li>

    <li>Div+Css专区</li>

    <li>Jquery专区</li>

  </ul>

</div>

</body>

</html>

匹配含有span元素的li元素,并将其中的字体颜色设置为绿色。

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
客户端静态页面玩分页
Jun 26 Javascript
用js实现上传图片前的预览(TX的面试题)
Aug 14 Javascript
javascript nextSibling 与 getNextElement(node) 使用介绍
Oct 13 Javascript
你需要知道的10个最佳javascript开发实践小结
Apr 15 Javascript
jQuery中:empty选择器用法实例
Dec 30 Javascript
举例讲解AngularJS中的模块
Jun 17 Javascript
深入分析下javascript中的[]()+!
Jul 07 Javascript
react.js CMS 删除功能的实现方法
Apr 17 Javascript
vue使用Axios做ajax请求详解
Jun 07 Javascript
Nginx设置为Node.js的前端服务器方法总结
Mar 27 Javascript
实例分析javascript中的异步
Jun 02 Javascript
Vue CLI中模式与环境变量的深入详解
May 30 Vue.js
jQuery中map()方法用法实例
Jan 06 #Javascript
jQuery中is()方法用法实例
Jan 06 #Javascript
JavaScript中document对象使用详解
Jan 06 #Javascript
jQuery中Form相关知识汇总
Jan 06 #Javascript
使用VS开发 Node.js指南
Jan 06 #Javascript
jQuery实现的图片分组切换焦点图插件
Jan 06 #Javascript
JavaScript静态类型检查工具FLOW简介
Jan 06 #Javascript
You might like
PHP分页显示制作详细讲解
2008/11/19 PHP
php file_get_contents抓取Gzip网页乱码的三种解决方法
2013/11/12 PHP
php中require和require_once的区别说明
2014/02/27 PHP
PHP HTTP 认证实例详解
2016/11/03 PHP
PHP使用PhpSpreadsheet操作Excel实例详解
2020/03/26 PHP
javascript当onmousedown、onmouseup、onclick同时应用于同一个标签节点Element
2010/01/05 Javascript
9个JavaScript评级/投票插件
2010/01/18 Javascript
javascript 全等号运算符使用说明
2010/05/31 Javascript
javascript计算用户打开网页的停留时间
2014/01/09 Javascript
深入理解javascript严格模式(Strict Mode)
2014/11/28 Javascript
AngularJS的内置过滤器详解
2015/05/14 Javascript
jQuery操作属性和样式详解
2016/04/13 Javascript
JavaScript里 ==与===区别详解
2016/08/16 Javascript
jQuery实现导航滚动到指定内容效果完整实例【附demo源码下载】
2016/09/20 Javascript
VueJs与ReactJS和AngularJS的异同点
2016/12/12 Javascript
Angular使用ng-messages与PHP进行表单数据验证
2016/12/28 Javascript
利用node.js如何搭建一个简易的即时响应服务器
2017/05/28 Javascript
Vue Socket.io源码解读
2018/02/07 Javascript
react中使用swiper的具体方法
2018/05/15 Javascript
vue-cli监听组件加载完成的方法
2018/09/07 Javascript
js中自定义react数据验证组件实例详解
2018/10/19 Javascript
vue+elementUI动态增加表单项并添加验证的代码详解
2020/12/17 Vue.js
在Python下进行UDP网络编程的教程
2015/04/29 Python
python基于Tkinter库实现简单文本编辑器实例
2015/05/05 Python
python八皇后问题的解决方法
2018/09/27 Python
对pandas的层次索引与取值的新方法详解
2018/11/06 Python
解决PyCharm的Python.exe已经停止工作的问题
2018/11/29 Python
服务器端jupyter notebook映射到本地浏览器的操作
2020/04/14 Python
SK-II神仙水美国官网:SK-II美国
2020/02/25 全球购物
iostream与iostream.h的区别
2015/01/16 面试题
团队激励口号
2014/06/06 职场文书
党员查摆四风问题思想汇报
2014/10/25 职场文书
学校重阳节活动总结
2015/03/24 职场文书
微信小程序实现聊天室功能
2021/06/14 Javascript
Python语法学习之进程的创建与常用方法详解
2022/04/08 Python
SQL试题 使用窗口函数选出连续3天登录的用户
2022/04/24 Oracle