jQuery和js使用点滴

1、checkbox全选按钮

     <input type="checkbox" name="allcheck" id="allcheck" / >全选
     <input type="checkbox" name="subBox" value="1" / >1
     <input type="checkbox" name="subBox" value="2" / >2
     <input type="checkbox" name="subBox" value="3" / >3
     <input type="checkbox" name="subBox" value="4" / >4
     <input type="checkbox" name="subBox" value="5" / >5

    //全选和全不选功能按钮
    $("#allcheck").click(function() {
        var checked = $("#allcheck").is(':checked');
        $('input[name="subBox"]').prop('checked', checked);                
    });

2、判断checkbox是否选中

<input type="checkbox" name="allcheck" id="allcheck" />

 var checked = $("#allcheck").is(':checked');

3、遍历表格的数据，然后通过json传递到后端

<table class="table ">
   <thead>
    <tr data-type="1">
        <th>id</th>
        <th>名称</th>
        <th>年龄</th>
        <th>性别</th>
    </tr>
   </thead>
   <tbody id="rows">    
    <tr data-type="2">
        <th>1</th>
        <th>张</th>
        <th>22</th>
        <th>男</th>
    </tr>
    <tr data-type="3">
        <th>2</th>
        <th>张</th>
        <th>18</th>
        <th>女</th>
    </tr>
    <tr data-type="4">
        <th>3</th>
        <th>张</th>
        <th>24</th>
        <th>男</th>
    </tr>
    <tr data-type="5">
        <th>4</th>
        <th>张</th>
        <th>22</th>
        <th>女</th>
    </tr>
   </tbody>
</table>
<button onclick="gettableInfo()"> 获得表格数据</button>
function gettableInfo() {
    var objs = new Array();
    $('#rows tr').each(function(index){
        var obj = {};
        var tdArr = $(this).children();    
        
        obj["sequence"] = index;
        //获取data-type中的值    
        obj["type"] = $(this).data('type');
        obj["id"] = tdArr.eq(0).html();
        obj["name"] = tdArr.eq(1).html();
        obj["eag"] =tdArr.eq(2).html();
        obj["sex"] =tdArr.eq(3).html();
        
        objs.push(obj); 
    });
    
    alert(JSON.stringify(objs));
    return objs;
}

4、实现点击按钮表格行的上下移动

    <style type="text/css">
        .a{
            background: #666;
        }
    </style>

<table class="table ">
   <thead>
    <tr data-type="1">
        <th>id</th>
        <th>名称</th>
        <th>年龄</th>
        <th>性别</th>
    </tr>
   </thead>
   <tbody id="rows">    
    <tr data-type="2" onclick="clicktr(this)" >
        <th>1</th>
        <th>张</th>
        <th>22</th>
        <th>男</th>
    </tr>
    <tr data-type="3" onclick="clicktr(this)" >
        <th>2</th>
        <th>张</th>
        <th>18</th>
        <th>女</th>
    </tr>
    <tr data-type="4" onclick="clicktr(this)" >
        <th>3</th>
        <th>张</th>
        <th>24</th>
        <th>男</th>
    </tr>
    <tr data-type="5" onclick="clicktr(this)" >
        <th>4</th>
        <th>张</th>
        <th>22</th>
        <th>女</th>
    </tr>
   </tbody>
</table>

<button id="prev" > 上移</button>
<button id="next" > 下移</button>

var TROBJ=null;
    //上下移动
    $("#prev").click(function() {
        if(TROBJ==null){
            alert("请选择一行");
        }
        $(TROBJ).insertBefore($(TROBJ).prev());
    });
    $("#next").click(function() {
        if(TROBJ==null){
            alert("请选择一行");
        }
        $(TROBJ).insertAfter($(TROBJ).next());
    });

function clicktr(obj) {
    TROBJ=obj;

    $('#rows tr').each(function(index){

        if ($(TROBJ).data('type')!=$(this).data('type')) {
            //如果不等于当前对象，将class移除
           $(this).removeClass("a");
        }
        
    })
    // $(obj).addClass("a"); 
    $(obj).toggleClass("a");
}

 5、监听窗口大小改变的事件

$(window).resize(function () {
    alert("窗口大小改变");
});

 5、JS输出html内容，除了换行标签外其他原样输出

window.onload=function(){ 
test();
}

function test(){
     var str = "haha<br/><button>haha</button><br/>asdasd<div>aaaa</div>";
 str = str.replace(/</g,'&lt');
 str = str.replace(/>/g,'&gt');
 str = str.replace(/&ltbr/&gt/g,"<br/>");
  document.write(str);
}

6、js全部替换某个字符

window.onload=function(){ 
test()
} 
function test(){
     var str = "hahaaaacccbbbdddffffhaha";
    //直接把“a”替换成“z”
   str = str.replace(/a/g,"f");

   //变量的形式替换
   // var s="a";
   // str = str.replace(new RegExp(s,"gm"),"u");
   // str = str.replace(eval("/"+s+"/g"),"z");
  document.write(str);
}