JQuery 学习笔记 选择器之四

炳全心思源

炳全心思源

2016-02-19 15:44

最近很多朋友喜欢上设计,但是大家却不知道如何去做,别担心有图老师给你解答,史上最全最棒的详细解说让你一看就懂。
代码如下:
!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"
phello 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);
展开更多 50%)
分享

猜你喜欢

JQuery 学习笔记 选择器之四

Web开发
JQuery 学习笔记 选择器之四

JQuery 学习笔记 选择器之六

Web开发
JQuery 学习笔记 选择器之六

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

JQuery 学习笔记 选择器之五

Web开发
JQuery 学习笔记 选择器之五

JQuery 学习笔记 选择器之二

Web开发
JQuery 学习笔记 选择器之二

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

JQuery 学习笔记 选择器之三

Web开发
JQuery 学习笔记 选择器之三

JQuery 学习笔记 选择器之一

Web开发
JQuery 学习笔记 选择器之一

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

删除Windows7下IE8/IE7浏览器的搜索框 一步轻松搞定

删除Windows7下IE8/IE7浏览器的搜索框 一步轻松搞定

jquery 将disabled的元素置为enabled的三种方法

jquery 将disabled的元素置为enabled的三种方法
下拉加载更多内容 ↓