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);
}