Jquery简单应用-1.8.3

时间:2021-05-07 10:33:22
  1. Jquery属于什么?
    1. javascript的一个库
    2. 一个.js文件
  2. 用什么用?
    1. 可以提高javascript的编程效率
  3. 使用流程
    1. 用一个html<script type='text/javascript' src='???'>标签 导入相应的jquery.js文件
  4. Jquery架构
    1. 选择器  你的目标在哪里
      1. 元素选择器 就是HTML标签 格式:[$("XXXX")]
      2. 属性选择器 就是HTML标签内的各种属性 格式:[$("[XXXX=YYYY]")]
      3. CSS选择器 就是HTML标签的CSS样式 格式:[$("XXXX").css(key,value)]
      4. ID选择器 就是HTML标签的ID属性 格式[$("#XXXX")]
      5. Class选择器 就是HTML标签的Class属性 格式[$(".XXXX")]
      6. 层次选择器 就是HTML标签的结构层次以上选择器的组合 格式[$("1234")]
    2. Jquery事件驱动机制 你要做什么事情
      1. $(document).ready(function 事情的过程)  HTML 加载就绪的时候去执行
      2. $(选择器).click(function 事情的过程) 单击目标的时候
      3. $(选择器).dbclick(function 事情的过程) 双击目标的时候
      4. $(选择器).focus(function 事情的过程) 获得关注的时候
      5. $(选择器).mouseover(function 事情的过程) 鼠标移到上面的时候
    3. Jquery动态技术 具体使用请参考 帮助文档
      1. $(选择器).hide() 隐藏目标
      2. $(选择器).show() 显示目标
      3. $(选择器).toggle() 切换目标
      4. $(选择器).animate() 定义目标的动画效果
      5. $(选择器).fadeIn() 淡入目标
      6. $(选择器).fadeOut() 淡出目标
    4. Jquery搭积木技术
      1. HTML部分
        1. $(选择器).html(context) 在HTML内部添加标签
        2. $(选择器).append(context) 在目标内部添加标签
        3. $(选择器).prepend(context) 在目标内部内容之前添加标签
        4. $(选择器).after(context) 在目标之后添加标签
        5. $(选择器).before(context) 在目标之前添加标签
      2. CSS部分
        1. $(选择器).css(key,value) 设置单个任意CSS样式
        2. $(选择器).css({key,value,....}) 设置多个任意CSS样式
        3. $(选择器).css(key) 获取一个匹配的CSS属性值
    5. Jquery AJAX 代理请求技术
      1. $(选择器).load(url,data,callback) 把数据加载到目标内部
      2. $.ajax(options) 参数实在太多 参考帮助文档
      3. $.get(url,data,callback,type) get方法发送一个ajax 请求
      4. $.post(url,data,callback,type) post方法发送一个ajax 请求
      5. $.getJSON(url,data,callback) get方式的请求返回JSON格式的数据
      6. $.getScript(url,data,callback)加载一个JavaScript文件