<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01//EN""http://www.w3.org/TR/html4/strict.dtd"><html><head><metahttp-equiv="Content-Type"content="text/html;charset=UTF-8"><title>UntitledDocument</title><linkrel="stylesheet"type="text/css"href="css/style.css"><styletype="text/css">div,span,p{width:140px;height:140px;margin:5px;background:#aaa;border:#0001pxsolid;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><scripttype="text/javascript"src="js/jquery-1.7.2.js"></script><scripttype="text/javascript">$(function(){//选取含有属性title的div元素.$("#btn1").click(function(){$("div[title]").css("background","#ffbbaa");});//选取属性title值等于'test'的div元素.$("#btn2").click(function(){$("div[title='test']").css("background","#ffbbaa");});//选取属性title值不等于'test'的div元素(没有属性title的也将被选中).$("#btn3").click(function(){//选取的元素中包含没有title的div元素.$("div[title!='test']").css("background","#ffbbaa");});//选取属性title值以'te'开始的div元素.$("#btn4").click(function(){$("div[title^='te']").css("background","#ffbbaa");});//选取属性title值以'est'结束的div元素.$("#btn5").click(function(){$("div[title$='est']").css("background","#ffbbaa");});//选取属性title值含有'es'的div元素.$("#btn6").click(function(){$("div[title*='es']").css("background","#ffbbaa");});//组合属性选择器,首先选取有属性id的div元素，然后在结果中选取属性title值含有'es'的div元素.$("#btn7").click(function(){$("div[id][title*='es']").css("background","#ffbbaa");});//选取含有title属性值,且title属性值不等于test的div元素.$("#btn8").click(function(){$("div[title][title!='test']").css("background","#ffbbaa");});})</script></head><body><inputtype="button"value="选取含有属性title的div元素."id="btn1"/><inputtype="button"value="选取属性title值等于'test'的div元素."id="btn2"/><inputtype="button"value="选取属性title值不等于'test'的div元素(没有属性title的也将被选中)."id="btn3"/><inputtype="button"value="选取属性title值以'te'开始的div元素."id="btn4"/><inputtype="button"value="选取属性title值以'est'结束的div元素."id="btn5"/><inputtype="button"value="选取属性title值含有'es'的div元素."id="btn6"/><inputtype="button"value="组合属性选择器,首先选取有属性id的div元素，然后在结果中选取属性title值含有'es'的div元素."id="btn7"/><inputtype="button"value="选取含有title属性值,且title属性值不等于test的div元素."id="btn8"/><br><br><divclass="one"id="one">id为one,class为one的div<divclass="mini">class为mini</div></div><divclass="one"id="two"title="test">id为two,class为one,title为test的div<divclass="mini"title="other">class为mini,title为other</div><divclass="mini"title="test">class为mini,title为test</div></div><divclass="one"><divclass="mini">class为mini</div><divclass="mini">class为mini</div><divclass="mini">class为mini</div><divclass="mini"></div></div><divclass="one"><divclass="mini">class为mini</div><divclass="mini">class为mini</div><divclass="mini">class为mini</div><divclass="mini"title="tesst">class为mini,title为tesst</div></div><divclass="none">style的display为"none"的div</div><divclass="hide">class为"hide"的div</div><div>包含input的type为"hidden"的div<inputtype="hidden"value="123456789"size="8"></div><divid="mover">正在执行动画的div元素.</div></body></html>