JS中的拖拽

一、类名处理

元素添加类名：
    dom.className = "a,b,c"
    dom.setAttribute = ("class",a,b,c)
获取类名列表
    dom.classList
    box.classList.remove("b");
    box.classList.add("c");

二、jquery

1. jquer拖拽
    $("#box p.mp").draggable({
            axis:"x", // 约束在水平方向移动，y垂直方向移动
            containment:'parent', //在父元素中移动
            grid:[20,10], // 每次移动的长度
            drag:function(event,ui) {
                // 拖拽事件的回调
                console.log(ui);
                console.log(ui.position.left,ui.positon.top)
                // 输出的是p在父元素中的位置变化
            }
        });
        $("#box").resizable();
2. jquery事件
    $("#box").click(funcion(){});
    $("#box").mouseclick(function(){});
    排他思想
    $("button").click(function(){
        //  排他
        // $("button").eq($(this).html()-1).addClass("cur").siblings().removeClass("cur");
        $(this).addClass("cur").siblings().removeClass("cur");
    });
    $("button").each(function(index,item){
        $(item).html(index);
    });
3. jquery插件
    jquery插件有很多，所谓的插件就是依赖于jQuery库而存在的字库
4. jquery获取元素尺寸
    $("#box").width();             获取计算后的高度
    getComputerStyle            dom
    $("#box").innerWidth();     获取计算后元素内容加padding的宽度
    $("#box").outerWidth();     盒子真实宽度
    $("#box").outerWidth(true); 盒子真实宽度加margin
5.jquery获取元素干净位置
    offset()
    top left right bottom
6.jquery鼠标滚轮事件
    在jquery中没有鼠标滚轮事件，需要使用插件
    jquery-1.12.3.min.js
7.jquery窗口方法
    $(window).scrollTop(); 卷屏高度
    $(window).width();     窗口宽度
    $(window).height();  窗口高度

三、object类型

对象类型(Object)
    基本数据类型：Number  String  Boolean  Null  Undefined
    对象类型：Array Object RegExp Function
    数据存储类型：txt json xml
1. 对象的创建方式
    1) 字面量创建
        var obj = {};
    2) new 构造函数方式创建
        var obj = new Object();
        obj.name = "张三",
        obj.age = 13
    注：两种创建方式各有各的加值方式，不允许杂糅，各用各的，虽然没有问题，但这是不规范的
    {} 是对象的组织形式，界定符
    对象：一切皆对象，对象就是一个包含无序属性的集合
2. 对象键值对中键的命名方式
    1) 数字 字母 下划线 以及 特殊字符
    2) 如果是字母下划线开头可以不用引号
       但如果是数字字母或特殊字符开头的必须加引号
       eg: "@qwe", "222", "2wef", " ", " 2we#", " var", "in", "float"
    3) 对象与json的区别
        对象的键可以写引号(特殊情况下必须写)，
        写的话单引号双引号都可以，但是json的键必须是双引号
    4) 构造函数实例化
        使用 new Object() 方式构造函数，就是使用构造函数 Object() 来实例化对象
    5) 对象的值
        对象的值可以是任何数据类型：数字 字符串 正则 数组 对象 函数 null undefined ……
    6) this 在不同地方的指向
        函数中的this指向函数的拥有者
        1) 直接使用() 调用的函数指向window
        2) 函数绑定到事件处理程序，其中this指向事件源
        3) 在定时器中调用的this指向window
        4) 在对象的方法中使用this指向调用方法的这个对象
        6) call  apply bind  调用函数，this指向人工设置的对象