Jquery操作属性选择器
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>层级选择器</title>
<link rel="stylesheet" href="../../css/style.css" />
<script type="text/javascript" src="../../js/jquery-1.8.3.js" ></script>
<script>
$(function(){
$("#btn1").click(function(){
$("div[id]").css("background-color","red");
}); $("#btn2").click(function(){
$("div[id='two']").css("background-color","red");
});
});
</script> </head>
<body>
<input type="button" id="btn1" value="选择有id属性的div"/>
<input type="button" id="btn2" value="选择有id属性的值为two的div"/> <hr/>
<div id="one">
<div class="mini">
111
</div>
</div> <div id="two">
<div class="mini">
222
</div>
<div class="mini">
333
</div>
</div> <div id="three">
<div class="mini">
444
</div>
<div class="mini">
555
</div>
<div class="mini">
666
</div>
</div> <span id="four"> </span>
</body>
</html>
style.css
body { font:12px/19px Arial, Helvetica, sans-serif; color:#666;}
form div { margin:5px 0;}
.int label { float:left; width:100px; text-align:right;}
.int input { padding:1px 1px; border:1px solid #ccc;height:16px;}
.sub { padding-left:100px;}
.sub input { margin-right:10px; }
.formtips{width: 200px;margin:2px;padding:2px;}
.onError{
background:#FFE0E9 url(../img/reg3.gif) no-repeat 0 center;
padding-left:25px;
}
.onSuccess{
background:#E9FBEB url(../img/reg4.gif) no-repeat 0 center;
padding-left:25px;
}
.high{
color:red;
} 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;
} table { border:;border-collapse:collapse;}
td { font:normal 12px/17px Arial;padding:2px;width:100px;}
th { font:bold 12px/17px Arial;text-align:left;padding:4px;border-bottom:1px solid #333;}
.even { background:#FFF38F;} /* 偶数行样式*/
.odd { background:#FFFFEE;} /* 奇数行样式*/
.selected { background:#FF6500;color:#fff;}
Jquery操作属性选择器的更多相关文章
- jQuery 操作属性
jQuery 操作属性 我们来看看jQuery 操作属性都有哪些???? 属性 css代码!! html代码!! jQuery代码!! 下面做一个小例子 小例子html的代码 小例子jQuery的代码 ...
- jQuery学习-属性选择器
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 4月12日学习笔记——jQuery操作属性和样式
区分 DOM 属性和元素属性 <img src="images/image.1.jpg" id="hibiscus" alt="Hibiscus ...
- JQuery操作属性、样式、风格(attr、class、css)
样式操作 <p class="myclass" title="选择喜欢的水果">你最喜欢的水果是?</p> 在上面代码中,class也是 ...
- jQuery操作属性和样式详解
我们可以使用 javascript 中的getAttribute和setAttribute来操作元素的"元素属性".在 jQuery 中给你提供了attr()包装集函数, 能够同时 ...
- jquery操作属性 attr()和 prop()兼容性问题
jquery1.6中新加了一个方法prop(),一直没用过它,官方解释只有一句话:获取在匹配的元素集中的第一个元素的属性值. 大家都知道有的浏览器只要写disabled,checked就可以了,而有的 ...
- Jquery操作属性
1.attr(name,value):修改单个属性! name :属性名称 value:属性的值 <script> $(function(){ //给div添加一个alt=hello的属性 ...
- jquery 操作css 选择器
.addClass() 为每个匹配的元素添加指定的样式类名 .addClass(className) className 为每个匹配元素所有增加的一个或多个样式名 .addClass(function ...
- Jquery操作层级选择器
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
随机推荐
- 1,版本控制git--仓库管理
再开始这个话题之前,让我想起了一件很痛苦的事情,在我大学写毕业论文的时候,我当时的文件是这样保存的 毕业论文_初稿.doc 毕业论文_修改1.doc 毕业论文_修改2.doc 毕业论文_修改3.d ...
- echo shell commands as they are executed
http://stackoverflow.com/questions/2853803/in-a-shell-script-echo-shell-commands-as-they-are-execute ...
- 虚拟机中如何挂载物理磁盘(VMware操作)
测试的时候难免会遇到,从真是机器拷贝东西到虚拟机中,虽说安装了VMware tools(Vm→Install VMware tools...),就可以将文件直接拖到虚拟机里面去,但是这样拷贝总是需要花 ...
- 《Cracking the Coding Interview》——第5章:位操作——题目8
2014-03-19 06:33 题目:用一个byte数组来模拟WxH的屏幕,每个二进制位表示一个像素.请设计一个画水平线的函数. 解法:一个点一个点地画就可以了.如果要优化的话,其实可以把中间整字节 ...
- USACO Section2.1 The Castle 解题报告
castle解题报告 —— icedream61 博客园(转载请注明出处)--------------------------------------------------------------- ...
- 用Chrome浏览器,学会这27个超好用功能
一些非常有用的隐藏捷径 1. 想要在后台打开一个新的标签页而不离开现有的页面,这样就不会打断目前的工作了?按住 Ctrl 键或 Cmd 并点击它.如果你要在一个全新的窗口中打开一个链接,那就按 Shi ...
- 【志银】Win764位配置Github环境及将代码部署到Github pages-志银强势总结
(软件及教程下载分享:链接:http://pan.baidu.com/s/1dFysay9 密码:pug0) 1-安装Git-2.9.2-64-bit.exe(解压安装文件,运行安装程序,除了记得修改 ...
- php中普通方法和静态方法的区别以及抽象类和接口
实例化类产生对象.class fenbi{ //普通成员,属于对象 public $length = "10cm"; //静态成员,静态变量,属于类. public static ...
- 软考——(1)J2SE
我们先从Java说起,简单的说,Java是一种面向对象的程序设计语言,可跨平台使用. 与之前学习的程序设计语言相比,最值得一提的就是Java的两种核心机制:Java虚拟机和垃圾回收机制. 1)虚拟机 ...
- P3456 [POI2007]GRZ-Ridges and Valleys
题意翻译 给定一个地图,为小朋友想要旅行的区域,地图被分为n*n的网格,每个格子(i,j) 的高度w(i,j)是给定的.若两个格子有公共顶点,那么他们就是相邻的格子.(所以与(i,j)相邻的格子有(i ...