jQuery选择器使用及举例3-内容过滤选择器

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<script type="text/javascript" src="jquery-3.1.1.js"></script>
<script type="text/javascript">
function fun1(){
//1.获取节点内容包含北京的元素 不考虑层级关系
$("div:contains(‘北京‘)").css(‘color‘,‘pink‘);

//2.空白节点选择器：获取空元素 注意:空格有影响!!!!!
$(‘div:empty‘).css(‘background‘,‘green‘);

//3. 包含span的div
$(‘div:has(span)‘).css(‘background‘,‘green‘);

//4. 以div为父节点的
$(‘div:parent‘).css(‘background‘,‘green‘);

}
</script>
</head>
<body>
<h2>内容过滤</h2>
<div>北京</div>
<div>上海</div>
<div style="width:100px;height:100px;"></div>
<input type="button" name="" value="触发" onclick="fun1()" id="">
</body>
</html>

时间： 2024-10-07 08:43:33

jQuery选择器使用及举例3-内容过滤选择器的相关文章

一步一步学习 JQuery (三) 过滤选择器:基本过滤选择器 &amp;&amp; 内容过滤选择器 &amp;&amp; 可见性过滤选择器

过滤选择器: 过滤选择器主要是通过特定的过滤规则来筛选出所需的 DOM 元素, 该选择器都以 ":" 开头 按照不同的过滤规则, 过滤选择器可以分为基本过滤, 内容过滤, 可见性过滤, 属性过滤, 子元素过滤和表单对象属性过滤选择器. 一.基本过滤选择器 改变第一个 div 元素的背景色为 # bbffaa 改变最后一个 div 元素的背景色为 # bbffaa 改变class不为 one 的所有 div 元素的背景色为 # bbffaa 改变索引值为偶数的 div 元素的背景色为 #

黑马day16 jquery&amp;内容过滤选择器&amp;可见度选择器

内容过滤选择器的过滤规则主要体现在它所包含的子元素和文本内容上 1.:contains(text) 用法: $("div:contains('John')")    返回值  集合元素 说明:匹配包含给定文本的元素.这个选择器比较有用,当我们要选择的不是dom标签元素时,它就派上了用场了,它的作用是查找被标签"围"起来的文本内容是否符合指定的内容的. 2.:empty 用法: $("td:empty")   返回值  集合元素 说明:匹配所有不包

jQuery内容过滤选择器

1 <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> 2 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 3 <html> 4 <head> 5 <!-- jQuery内容过滤选择器 --> 6 <

JQuery 内容过滤选择器

<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <link href="../../CSS/2-8.css" rel="stylesheet&

Jquery过滤选择器，选择前几个元素，后几个元素，内容过滤选择器等

一.基本过滤选择器(重点掌握下列八个):first 选取第一个元素 $("div:first").css("color","red");:last 选取最后一个元素 $("div:last").css("color","red");:not 除去指定的选择器外的元素 $("div:not").css("color","red")

内容过滤选择器

<!DOCTYPE HTML> <html> <head> <title>jQuery内容过滤选择器</title> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> </head> <body> <div>Div1</div> <div>2</div

过滤选择器——内容过滤选择器

内容过滤选择器根据元素中的文字内容或所包含的子元素特征获取元素,其文字类容可以模糊或绝对匹配进行元素定位,其详细说明如表: 选择器 功能 返回值 :contains(text) 获取包含给定文本的元素 元素集合 :empty 获取所有不包含子元素或者文本的空元素 元素集合 :has(selector) 获取含有选择器所匹配的元素的元素 元素集合 :parent 获取含有子元素或者文本的元素 元素集合 示例——使用jQuery内容过滤选择器选择额元素 1 <!DOCTYPE html PUBLIC

jQuery选择器-内容过滤选择器

包含文本选择器: 用于根据标签的文本内容进行元素过滤,返回元素集合. 1 <script type="text/javascript"> 2 $(function(){ 3 $("div:contains(test)").css("background","#bbffaa"); 4 }); 5 </script> 包含元素选择器: :has(),用于根据标签的子元素进行元素过滤,返回元素集合. 1 &l

jQuery 基本选择器 层次选择器 过滤选择器 内容过滤选择器 可见过滤选择器 属性过滤选择器 表单对象属性过滤选择器

原文地址:https://www.cnblogs.com/awdsjk/p/9808409.html