<!-- 子元素过滤选择器 -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Untitled Document</title>
<style type="text/css">
div, span, p {
width: 140px;
height: 140px;
margin: 5px;
background: #aaa;
border: #000 1px solid;
float: left;
font-size: 17px;
font-family: Verdana;
}
div.mini {
width: 55px;
height: 55px;
background-color: #aaa;
font-size: 12px;
}
div.hide {
display: none;
}
</style>
<script type="text/javascript" src="jquery-1.7.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#btn1").click(function() {
//选取子元素, 需要在选择器前添加一个空格.
//选取每个class为one的div父元素下的第2个子元素
$(".one :nth-child(2)").css("background","#ffbbaa");
});
$("#btn2").click(function() {
//选取每个class为one的div父元素下的第一个子元素
$(".one :first-child").css("background","#ffbbaa");
});
$("#btn3").click(function() {
//选取每个class为one的div父元素下的最后一个子元素
$(".one :last-child").css("background","#ffbbaa");
});
$("#btn4").click(function() {
//如果class为one的div父元素下的仅仅只有一个子元素，那么选中这个子元素
$(".one :only-child").css("background","#ffbbaa");
});
});
</script>
</head>
<body>
<input type="button" value="选取每个class为one的div父元素下的第2个子元素." id="btn1"/>
<input type="button" value="选取每个class为one的div父元素下的第一个子元素." id="btn2"/>
<input type="button" value="选取每个class为one的div父元素下的最后一个子元素." id="btn3"/>
<input type="button" value="如果class为one的div父元素下的仅仅只有一个子元素，那么选中这个子元素." id="btn4"/>
<br><br>
<div class="one" id="one">
id 为 one,class 为 one 的div
<div class="mini">class为mini</div>
</div>
<div class="one" id="two" title="test">
id为two,class为one,title为test的div
<div class="mini" title="other">class为mini,title为other</div>
<div class="mini" title="test">class为mini,title为test</div>
</div>
<div class="one">
<div class="mini">class为mini</div>
<div class="mini">class为mini</div>
<div class="mini">class为mini</div>
<div class="mini"></div>
</div>
<div class="one">
<div class="mini">class为mini</div>
<div class="mini">class为mini</div>
<div class="mini">class为mini</div>
<div class="mini" title="tesst">class为mini,title为tesst</div>
</div>
<div style="display:none;" class="none">style的display为"none"的div</div>
<div class="hide">class为"hide"的div</div>
<div>
包含input的type为"hidden"的div<input type="hidden" value="123456789" size="8">
</div>
<div id="mover">正在执行动画的div元素.</div>
</body>
</html>
Drawable
硬件工程
Typora
需求分析
armv9
激光
蔚来
list
AI作画
ChatGPT国内
Exchanger
linq
IT难
NTF
safari
原型模式
颜宁
编程开发
坑人
电磁
jQuery子元素过滤选择器
相关文章
jQuery表单过滤选择器
<!-- 表单过滤选择器 -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head><meta http-equiv"Content-Type" content"text/html; charsetUTF-8"…
反射应用一：创建运行时类的对象
1.代码举例
/*** author wkq* date 2020/3/5 - 13:36* Person类*/
public class Person {public String name;private int age;public Person(String name, int age) {this.name name;this.age age;}public Person() {System.out.println("Person()");}private Pe…
反射应用二：获取运行时类的完整结构
我们可以通过反射，获取对应的运行时类中所有的属性、方法、构造器、父类、接口、父类的泛型、包、注解、异常等。。。。 典型代码：
package java1;/*** author wkq* date 2020/3/9 - 22:07*/
MyAnnotation(value "hi")
public class Person …
反射应用三：调用运行时类的指定结构（重点）
//调用指定的属性：
Test
public void testField1() throws Exception {Class clazz Person.class;//创建运行时类的对象Person p (Person) clazz.newInstance();//1. getDeclaredField(String fieldName):获取运行时类中指定变量名的属性Field name clazz.getDec…
Cookie介绍与使用
a)什么是 Cookie?
1、Cookie 翻译过来是饼干的意思。 2、Cookie 是服务器通知客户端保存键值对的一种技术。 3、客户端有了 Cookie 后，每次请求都发送给服务器。 4、每个 Cookie 的大小不能超过 4kb
b)如何创建 Cookie Servlet 程序中的代码：
protec…
Session介绍与使用
i) 什么是 Session 会话?
1、Session 就一个接口（HttpSession）。 2、Session 就是会话。它是用来维护一个客户端和服务器之间关联的一种技术。 3、每个客户端都有自己的一个 Session 会话。 4、Session 会话中，我们经常用来保存用户登录之后…
Filter 过滤器介绍与代码实现
1 、Filter 什么是过滤器 1、Filter 过滤器它是 JavaWeb 的三大组件之一。三大组件分别是：Servlet 程序、Listener 监听器、Filter 过滤器 2、Filter 过滤器它是 JavaEE 的规范。也就是接口 3、Filter 过滤器它的作用是： 拦截请求，过滤响应。…