Jquery使用记录

日期:2013-3-25 13:51 | 标签: Jquery | 阅读:566

JQuery风风火火10余年,毫无疑问是最经典的辅助库,想到jquery就想到$,想到$就想到money,哈哈,有木有。围绕jquery还有好几部著作,锋利的jquery,'javascript忍者秘术'...jquery大而全,平常工作中只需用到jQuery中的30%。

  1. 每次滚动将第一个元素放置至最后一个元素,结合left(-banner宽度)则行。 元素替换方案:
    // jquery
    $target.append(first-child);
    // js
    target.appendChild(first-child);
    
    注意:如果$target有多个,那么只复制不移动。

$创建div

其实还可以这样

var a = $('<div/>', {'class': 'myClass',id': 'pengyi'};
console.log(a);

$.data灵活使用。

这是块滑动插件Sly中源码,我加了注释:

// 创建jquery插件
$.fn[pluginName] = function (options, callbackMap) {
    var method, methodArgs;

    // 验证选项,分为两类[初始化、调用方法]
    if (!$.isPlainObject(options)) {
        if (type(options) === 'string' || options === false) {
            method = options === false ? 'destroy' : options;
                            //获取除去第一个参数后的参数集
            methodArgs = Array.prototype.slice.call(arguments, 1);
        }
        options = {};
    }

    // 遍历元素
    return this.each(function (i, element) {
        // 防止多次初始化[$.data的灵活使用]
        var plugin = $.data(element, namespace);

        if (!plugin && !method) {
            //如果不存在则创建一个新的
            plugin = $.data(element, namespace, new Sly(element, options, callbackMap).init());
        } else if (plugin && method) {
            // 存在并需要调用Sly方法
            if (plugin[method]) {
                plugin[method].apply(plugin, methodArgs);
            }
        }
    });
};

$.fn.data

假如你的属性是这样的data-myid="xxx",你可以这样获取$.fn.data(xxx),当然,你也可以这样设置。
注意,data-虽然是html5新增的属性,但是在jquery里是通用的!

jquery slice(from,to)

指定参数范围内子集,可为负数

Jquery index()

该方法返回指定元素相对于其他指定元素的index位置

Jquery 跳出foreach循环

居然有哥们想到了break;现在都印象深刻。

$("#process").each(function(){
        //模拟continue
     if(unsucceed){
      return;   
    }  
});

$("#process").each(function(){
        //模拟break
    if(succeed){
      return false;  
    }  
  })

jquery实现深拷贝

  1. 深拷贝

    jQuery.extend(true,{},oldProject);
    
  2. 浅拷贝

    jQuery.extend({},oldProject);
    

    注:浅拷贝会有诸多问题

is()

根据选择器、元素或 jQuery 对象来检测匹配元素集合,如果这些元素中至少有一个元素匹配给定的参数,则返回 true。

参考

设计思想(阮一峰)
最佳实践(阮一峰)

版权声明: 署名-非商业性使用-禁止演绎 4.0 国际(CC BY-NC-ND 4.0
Copyright ©2013-2017 | 粤ICP备14081691号 | yipeng手工打造 | 联系方式