美文网首页
jQuery框架基本了解

jQuery框架基本了解

作者: 该不会是个傻子吧 | 来源:发表于2017-07-25 00:49 被阅读0次

    使用jQuery必须先引入jQuery

    $(document).ready与window.onload的区别

    • window.onload是等页面所有的内容(dom,音频,视频,图片,gif等等)加载完成的时候,才调用函数
    • $(document).ready仅等DOM加载完成的时候就开始执行
      代码测试: 先弹‘jQuery'后弹'javascript';
            window.onload=function () {
                alert('javascript')
                }
            
           $(document).ready(function () {
                alert('jQuery')
            })
    

    JS与jQuery的关系

    - jQuery只是一个工具库,会jQuary不一定会JS;会JS一定会jQuery
    - jQuery比JS简单很多,操作元素很方便
    - jQuery和JS可以相互转换
        + jquery通过[]或 get()可以转成原生
        + $(原生)就能转成jquery;
    - jQuery方法函数化,除了length,我们的常用其他属性,都是方法的调用 $().xxx()
    - jquery可以进行链式操作:能否进行链式操作,取决于前面函数的返回值;
    - jquery取值,赋值合体
    

    获取元素

    • $('#el')
    • 标签名 $('div'); 如果指定某一个元素,使用eq();
    • $('.xxxx')
      • 获取所有标签
    • 获取多个元素,可以用逗号分隔 $('.wrap div,.wrap p')
    • 属性选择器 $([attr]) $(div[id=div1]) $([attr1][attr2])
    • $('div').first() (同理:first,last,eq());
    • $('div:first') (同理:first,last,eq);
    • $('div:even') ; even是偶数; odd奇数
    • $('.wrap').find('p')找的是子子孙孙
    • $('.wrap').children('p')找的仅仅是儿子;

    jquery中的取值赋值合体

    • html():普通标签:不传参数,是取值; 传了参数为字符串的话,是设置;
      • div p ol ul li dl dd dt h1...h6
      • del i ins span b
    • val():表单元素通过val来进行取值,赋值,参数跟html一样的;
      • input textarea form
    • css() //设置样式
      + 一个参数:如果这个参数是字符串- 获取
      如果这个参数是对象-设置一堆
      + 两个参数:设置一个;
    • attr() //操作属性
      + 一个参数:如果这个参数是字符串-是获取属性
      如果这个参数是对象-设置一堆属性
      + 两个参数是设置属性: 设置一组属性 k:v
    • 操作class名
      • addClass()
      • removeClass()
    • 事件
      • on来绑定事件
      • off来解除绑定
      • one代表绑定一次
      • 自动触发 trigger('行为')
    • DOM操作:-- 文档处理
    • 运动--效果
    • 前后台数据交互--$.ajax()

    相关文章

      网友评论

          本文标题:jQuery框架基本了解

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