美文网首页我爱编程
jQuery常用方法

jQuery常用方法

作者: 老虎爱吃母鸡 | 来源:发表于2016-09-05 21:37 被阅读0次
    • Jquery 中, $(document).ready()是什么意思?和window.onload 的区别? 还有其他什么写法或者替代方法?
      • $(document).ready()
        其实是DOMContentLoaded事件,就是当页面文档完全加载并解析完毕之后,会触发DOMContentLoaded事件,HTML文档不会等待样式文件、图片文件、子框架页面的加载
        参考:DOMContentLoaded---MDN
        • 其他写法
    $(handler)//直接放在`$()`就可以
    
    - window.onload
    

    window.onload事件会等到页面的所有资源都下载完成后才触发

    • $node.html()和$node.text()的区别?
      • $node.html()
        获取的是节点的html内容,例如
    <div id=test><span>hello</span></div>
    $('#test').html()//返回的就是'<span>hello</span>'
    
    - $node.text()
    

    获取的是节点的text内容

    <div id=test><span>hello</span></div>
    $('#test').text()//返回的是'hello'
    
    • $.extend 的作用和用法?
      • $.extend的作用
        可以合成多个对象到第一个对象,如果只有一个对象将扩展到jQuery的命名空间
      • $.extend的用法
        • 在jQuery上扩展
    $.extend({
        name:function(n){
            return n
        },
        age: 18
    })
    $.name('hello')//'hello'
    $.age//18
    

    如果只传入一个对象,那么目标就是jQuery,就会扩展到jQuery的命名空间
    - 合并对象
    jQuery.extend( [deep ], target, object1 [, objectN ] )//这是$.extend的语法
    - deep参数
    可选的参数,表示是否进行深拷贝,默认是false
    - target参数
    即合成的目标对象,如果是已存在的对象将会被修改
    - object1[,objectN]
    即将要合成的多个对象,后面的属性会覆盖前面的

    • JQuery 的链式调用是什么?
      即获取一次对象,就能一直在获取的对象上操作。因为很多jQuery的操作返回的是原来的那个选中的对象,所以就能一直操作下去,例如
    $('.a')
        .children('.b').addClass('asdf').end()
        .children('#test').addClass('qwer').end()
        .parent().addClass('zxcv').end()
    
    • JQuery ajax 中缓存怎样控制?
      POST请求不会产生缓存,但是如果GET请求的URL一样,就会产生缓存,产生缓存的结果是浏览器不会去服务器更新内容,而是使用本地的缓存
      • 使用时间戳
        在请求的地址后面加上一个时间戳,每次的URL是不同的,所以就不会缓存
      • JQuery ajax控制缓存
        $.ajax()中提供cache属性来控制缓存,默认是true(datatype为script和jsonp的默认值为false),如果设置的是false,就会强制请求页面不被浏览器缓存,注意,这个方法只对GET请求有效,而且,也只有GET请求需要这个参数,原理就是在URL后面加"_={timestamp}"
    • jquery 中 data 函数的作用
      可以在选中的元素上储存任意的数据
      • .data( key, value )
    $('div').data('src','http://baidu.com')
    $('div').data('src')//'http://baidu.com'
    
    - 在HTML5中,可以访问到元素中的data-*属性
    
    <div data-src="http://baidu.com"></div>
    $('div').data('src')//'http://baidu.com'
    

    相关文章

      网友评论

        本文标题:jQuery常用方法

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