您的位置:首页 > Web前端 > JQuery

jquery学习之1.7-属性过滤器学习

2014-03-24 11:34 316 查看
属性过滤器学习,主要内容包含:

<%@ page language="java" import="java.util.*"
pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>11</title>
<script type="text/javascript" src="js/jquery-1.11.0.js">
</script>
<script language="javascript">
$(document).ready(function()
{

//***********************改变有title的div颜色为#aa0000********
$("#bt1").click(
function()
{
$("div[title]").css("background","#aa0000");
}
);
//********改变有title且title值为test的div颜色为#bb0000********

$(".bt2").click(
function()
{
$("div[title='test']").css("background","#bb0000");
//$("div[title=\"test\"]").css("background","#bb0000");
}
);
//********改变有title且title值以te开头的div颜色为#110000********

$("#bt3").click(function()
{
$("div[title^='第一']").css("background","#110000");
});
//********改变有title且title值以st结尾的div颜色为#ff0000********

$("#bt4").click(function(){
$("div[title$='st']").css("background","#ff0000")
});
//********改变有id且title值包含div的div颜色为#001100********
$("#bt5").click(function(){
$("div[id][title*='div']").css("background","#001100")
});
});

//******************************************************
</script>
</head>
<body>
<input type="button"  id="bt1" value="改变div1背景颜色为绿色" ></input>
<input type="button" class="bt2" value="改变有title且title值为test的div颜色为#bb0000" ></input>
<input type="button"  id="bt3" value="改变有title且title值以te开头的div颜色为#110000" ></input>
<input type="button"  id="bt4" value="改变有title且title值以st结尾的div颜色为#ff0000" ></input>
<input type="button"  id="bt5" value="改变有id且title值包含div的div颜色为#001100" ></input>

<div id="div1" title="第一个div" style="background:grey;border:1px solid;width:20%;height:30%;float:left">div1</div>
<div class="div2" title="test" style="background:white;border:1px solid;width:20%;height:30%;float:left"><p>p1第一段</p>p2第二段<p></p></div>
<br>
</body>
</html>


my Code
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: