浅谈JQuery选择器（二）

浅谈JQuery选择器（二）

/**
           内容选择器
           1、:contains("") 匹配含有指定文本的元素对象集合td:contains("aaa");获取含有aaa的td的对象集合

           2、:empty 匹配空元素 没有子元素或没有文本的元素
           3、:has(text) 匹配含有指定选择器所有匹配的元素的对象集合$("#tbdy:has(.rdc)");获取tbdy中含有.rdc的tbdy的对象集合
           4、:parent 匹配含有子元素或者文本的元素的对象集合

           总结：在内容选择器中谁(A)匹配谁(B)那就是获取A对象的集合

    */
     
     /**页面载入事件处理*/
     $(function(){
        
           /**获取td中含有10的td的对象集合*/
           var $tds = $("td:contains('redarmy')");
           /**输出此集合的长度*/
           alert($tds.size()+"=========="+$tds.text());
          
           /**获取tr中含有redarmy的tr对象的集合*/
           var $rtds = $(".rdc:contains('redarmy')");//tr对象
           /**输出此集合的长度*/
           alert($rtds.text()+"-------"+$rtds.size());
           /**获取rdc中td的含有redarmy的td对象集合*/
           var $rtds1 = $(".rdc>td:contains('redarmy')");//td对象
           alert($rtds1.size()+"===="+$rtds1.text());
          
           /**获取id为qw的tr对象中td的空元素*/
           var $etd = $("#qw>td:empty");
          
           alert($etd.size()+"==="+$etd.html()); //html没有打印<td></td>
          
           //获取tbody中含有rdc的tbody对象
           var $tbdys = $("#tbdy:has(.rdc)");
           alert($tbdys.html()+"------------"+$tbdys.size());
            //获取tbody中含有rdc的tr对象集合
            var $trs = $("#tbdy>.rdc");
           alert($trs.html()+"------------"+$trs.size());
          
           //获取.rdc中含有子元素或者文本元素的.rdc的对象
           var $tdps = $(".rdc:parent"); //tr对象
          
           alert($tdps.html()+"--------"+$tdps.text());
           
          
    
     });
  
   </script>

<!-- 引入jquery的js文件 -->
<script type="text/javascript" src="./js/jquery-1.4.4.js">
</script>

<script>

function test() {
/**测试设置属性值
        attr("key",fn)*/
$("#attr>input").attr("value", function() {
return "redarmy";
});
alert("-------中介线-------");
/**设置属性及属性值 attr(key,value);*/
$("#attr>input").attr("value", "m_j");

//获取值
var name = $("#attr>input").attr("name");
alert(name);
//匹配元素中批量设置很多属性的最佳方式
/**attr(properties) 名/值   {}*/
$("#attr>input").attr( {
value : "x_l",
disabled : "disabled"
});

/**移除某个属性*/
$("#attr>input").removeAttr("disabled");

/**添加类名*/
$("#attr>input").addClass("ipt");
/**移除类名*/
$("#attr>input").removeClass("ipt");
  alert("---------------------------执行之前观察效果");
/**如果存在（不存在）就删除（添加）一个类。
*/
$("#attr>input").toggleClass("ipt")
alert("---------------------------执行之后观察效果");

$("#attr").html('邮箱：<input name="name" type="text" />');

$("#attr").text("<u>Some</u> new text");

alert($("#single").val("Single2"));
}
$(function() {
 
/*如果是type =checkbox,radio,select val值代表的是checked,selected
      type="text" val("")代表的是value的值*/
$("#nam").val("HelloWorld");

});
</script>
<style>
.ipt {
border-color: red;
}
</style>