jquery事件处理

1.on off bind unbind 事件的绑定和事件移除

on(eve,[sel],[data],fn) on可实现委托事件

eg：$("ul").on("click", ".box",data,handlelist);

off(eve,[sel],[fn]

json类型的数据 类型即是数组型也是对象型

on 同时绑定多个事件 中间用空格隔开

off 事件的移除 ，不写任何参数该元素的所有事件全被移除

bind 绑定事件 unbind 移除事件如果不写参数全部移除 和on off一致

绑定多个事件空格隔开

2.尺寸

height([val|fn]) 内容高

width([val|fn])

innerHeight()

innerWidth()//包含padding

outerHeight([options])

outerWidth([options])没有参数是包含边框的 有参数为true时是包括外margin的

height width fn参数分别是 index 旧值

设置或者获取元素的宽和高

获取出来是没有像素单位的 px

3内部插入

append(content|fn) fn回调函数问题参数是index索引html当前元素的html内容

appendTo(content)区别： 前后位置颠倒

prepend(content|fn)

prependTo(content)

$(".block").append($(".small"));// 后面的追加到前面的元素之后
$(".small").prependTo($(".block"));           

4.外部插入

after(content|fn)

$(".child").after($(".small")); //small插在child之后

<br/>before(content|fn)<br/>insertAfter(content) <br/>

$(".small0").insertAfter($(".child1")); //small0插在child1之后`

insertBefore(content)

fn 回调函数 index 索引

5.jquery里面如何创建dom元素 jquery dom innerHTML+=str

var str="<div class='child2'></div>";
        $(".block").html(function (index,old){
           return old+str;
       });           

//var ele=$("<div class='child2'></div>");
        var ele=$("<div></div>");
                ele.addClass("child2");
                console.log(ele);
        //将创建创建的dom 追加到block
        $(".block").append(ele);           

6.包裹

wrap(html|ele|fn) 一对一进行包含

$(".child").wrap(ele); //后面的包裹前面的 `

unwrap() 移除指定元素的父元素

wrapAll(html|ele) 将匹配的元素全部包起来

wrapInner(html|ele|fn) fn参数index 将元素的内容包裹起来

$(".box").detach();//这样就不行
console.log($("ul>li"));           

$(".price").replaceWith(ipt);//后面的替换前面的
ipt.replaceAll($(".price"));//前面的替换后面的           

<div class="price">43￥</div>
<div class="price">41￥</div>
<div class="price">42￥</div>
<div class="price">44￥</div>
$(".price").each(function (){
            var ipt = $("<input type='text' class='price'/>");
            ipt.val($(this).html());
            //$(this).replaceWith(ipt)
            ipt.replaceAll($(this));
        });