获取元素的内容

作者：曾庆林

html()方法

Html():获取匹配元素集合中第一个元素的HTML内容

html(htmlstring) 设置匹配元素中的HTML内容

//很少用，几乎大部分的jquery方法都可以用这样的回掉函数形式
html(function(index,hmtl))：根据传递的函数来设置匹配元素集合中每个元素的HTML内容并返回jQuery对象。

text()方法

text():获取匹配元素中的文本

text(string):设置元素的文本

    注意：html（） 和 text 是有区别的一个是获取设置html 一个是获取设置 文本

val() 方法

val():获取表单中的值

val(string):设置中的值

  val 主要针对表单中的值
  html（） text（） 主要针对 元素节点里面的html和文本内容

html

<h4>
  <label >
    <input type="checkbox" name="" id="all" value="" />全选  
  </label>
</h4>
<ul class="item">
  <li><label ><input type="checkbox" />item1</label></li>
  <li><label ><input type="checkbox" />item2</label></li>
  <li><label ><input type="checkbox" />item3</label></li>
  <li><label ><input type="checkbox" />item4</label></li>
  <li><label ><input type="checkbox" />item5</label></li>
  <li><label><input type="checkbox" />item6</label></li>
    
</ul>
<p>有<span class="t"></span>项被选中</p>

js

$(function(){
/*1 当all 发生改变时，判断 all checked 属性是否为真，为真全选，为false 全不选*/
    $("#all").change(function(){
        var val=$(this).attr("checked");
        if(val){
          $(".item :checkbox").attr("checked",true);    
          $(".t").text($(".item :checkbox").length)
        }else{
          $(".item :checkbox").attr("checked",false);   
          $(".t").text(0);
        }
        
    })
//2 单击小的，当被选中的数量大于等于checkbox数量是  让all 全选 else  all 不全选
     $(".item :checkbox").change(function(){
        var selen=$(".item :checkbox:checked").length;
        //checkbox被选中的个数
        var itemlen=$(".item :checkbox").length;
        //小checkbox的个数
        if( selen>=itemlen){
           $("#all").attr("checked",true);
        }else{
           $("#all").attr("checked",false);
        }
        $(".t").text(selen);
     })

})