JQuery入门(二)JQuery选择器(层级+属性)(1)(转)
<!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>Jquery选择器(层级+属性)</title>
<script type="text/javascript" language="JavaScript" src="../lib/jquery/jquery-1.3.2.js">
</script>
<link rel="stylesheet" type="text/css" href="../Default.css">
<script type="text/javascript" language="JavaScript">
$(document).ready(function(){
//在给定的祖先元素下匹配所有的后代元素
// $("form input").each(function(){
// $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
// });
//在给定的父元素下匹配所有的子元素,不包括孙子元素等其他后代元素
// $("form>input").each(function(){
// $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
// });
//匹配在label元素后面的input原书
// $("label + input").each(function(){
// $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
// });
//找到所有与表单同辈的 input 元素(级数深度一样的元素)
// $("form ~ input").each(function(){
// $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
// });
//查找所有 name 属性包含 'man' 的 input 元素
// $("input[name*='man']").each(function(){
// $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
// });
//查找所有 name 属性不是 newsletter 的 input 元素
// $("input[name!='newsletter']").each(function(){
// $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
// });
//查找所有 name 属性不是 milkman 的 input 元素
// $("input[name='milkman']").each(function(){
// $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
// });
//查找所有 name 属性以 'letter' 结尾的 input 元素
// $("input[name$='letter']").each(function(){
// $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
// });
//查找所有 name 属性以 'letter' 结尾的 input 元素
// $("input[name^='news']").each(function(){
// $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
// });
//查找所有含有 id 属性的 div 元素
// $("div[id]").each(function(){
// $("span").append("被选中的元素Name属性值为:"+$(this).text()+"<br/>");
// });
//找到所有含有 id 属性,并且它的 name 属性是以 man 结尾的
// $("input[id][name$='man']").each(function(){
// $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
// });
});
</script>
</head>
<body>
<span></span>
<form>
<label>
Name:
</label>
<input name="name" />
<fieldset>
<label>
Newsletter:
</label>
<input name="newsletter" />
</fieldset>
</form>
<input name="none" />
<div><input name="none1" /></div>
<input name="none2" />
<input name="man-news" />
<input name="milkman" id="input1"/>
<input name="letterman2" />
<input name="newmilk" />
<input name="newsboy" />
<div></div>
<div id="div1">div1</div>
<div id="div2">div2</div>
</body>
</html>