美文网首页
锋利的jQuery 记录的部分笔记

锋利的jQuery 记录的部分笔记

作者: 抓住时间的尾巴吧 | 来源:发表于2016-11-08 11:03 被阅读15次
    Window.onload $(document).ready()
    执行时机 必须等待网页中所有的内容(包括图片)加载完毕后才能执行 网页中所有DOM结构绘制完毕就执行,可能DOM元素关联的东西并没有加载完
    编写个数 不能同时编写多个,<br />以下代码无法正确执行:<br />Window.onload =function(){<br /> alert('test1');<br />} <br />Window.onload =function(){<br /> alert('test2');<br />}<br />结果只会输出"test2" 能同时编写多个,<br />以下代码正确执行:<br />$(document).ready(){<br /> alert('hello world');<br />} <br />$(document).ready(){<br /> alert('hello again');<br />} <br />结果两次都输出
    简化写法 $(document).ready(){}<br />可以简化写成<br />$(function(){})

    jquery链式操作代码块风格

    子元素的操作推荐缩进

    $(this).addClass('highlight')
     .children('li').show().end()
    .siblings().removeClass('highlight')
     .children('li').hide()

    事件冒泡(阻止事件冒泡和自身的默认行为)

    $(element).bing('click', function(){ //点击事件的处理 event.stopPropagation(); //停止事件冒泡 })
    页面某些元素有默认行为,比如submit的表单提交
    event.preventDefault();//可以阻止元素的默认行为

    只能使用一次的点击事件,用one绑定

    $(element).one('click', function(){})

    序列化元素

    • serialize()
      当表单中的内容比较多时,一个一个获取Input的内容显然是不合适的,此时就可以用到serialize(),例如
      $('#form').serialize()
      $(":checked,:radio").serialize()只会将选中的值序列化
      $('#form').serializeArray()不是返回字符串了,而是返回json
    • $.param()方法
      var obj = {a:1,b:2,c:3}
      var k = $.param(obj)
      此时k输出为a=1&b=2&c=3
    • $(element).ajaxStart({})//ajax开始之前,比如在页面部分地方显示加载中。。。
    • $(element).ajaxStop({})

    JQuery validator

    `//自定义一个验证方法
    $.validator.addMethod(
    "functionName",
    function(value,element,param){
    return value == eval(param)
    },
    '错误提示信息'
    )

    `

    闭包

    闭包1.png 闭包2.png

    常见的JQuery插件写法

    ;(function($){ /*这里放置代码*/ })(jQuery);

    JQuery.png

    jQuery判断浏览器类型

    `$(document).ready(){
    //Firefox 2 and above
    if ( $.browser.mozilla && $.browser.version >= "1.8" ) {
    //do something
    }
    //Safari
    if ( $.browser.safari ) {
    //do something
    }
    //Chrome
    if ( $.browser.chrome ) {
    //do something
    }
    //Opera
    if ( $.browser.opera ) {
    //do something
    }
    //IE6 and below

    if ( $.browser.mise &&  $.browser.version <= "6" ) {
        //do something
    }
    //anything above IE6
    if ( $.browser.mise &&  $.browser.version > 6 ) {
        //do something
    }
    

    }
    `

    相关文章

      网友评论

          本文标题:锋利的jQuery 记录的部分笔记

          本文链接:https://www.haomeiwen.com/subject/apyduttx.html