zoukankan      html  css  js  c++  java
  • 《锋利的jQuery》读书笔记

    jQuery理念:write less, do more!

    第 一 章
    一:jQuery简介
    a:轻量级
    b:强大选择器
    c:DOM封装
    d:ajax封装
    e:不污染顶级变量 只建立一个jQuery对象:所有的方法都在这个对象下!
    f:解决了浏览器的兼容性问题
    g:行为和结构的分离
    h:丰富的插件

    二:语言环境的配置
    a:在页面中导入即可!

    三:jquery对象和DOM对象
    jquery对象——》DOM对象: 将jquery对象看成一个数组!
    DOM对象——》jquery对象: $(dom对象) 包装下即可
    $():jquery对象的制造工厂


    第 二 章 jQuery选择器

    四:选择器 (jquery的重中之重) 超NB
    a:css选择器找到元素添加样式,jquery选择器找到元素添加行为!
    b:在jquery中使用的css选择器拥有跨浏览器的兼容性!
    c:过滤选择器
    1.基本过滤选择器
    2.内容过滤选择器
    3.可见性过滤选择器
    4.属性过滤选择器
    5.子元素过滤选择器
    6.表单对象属性过滤选择器

    五: $('#id\#b') // 转义特殊字符 “#”

    六:a标签的href属性跳转可以用jquery覆盖掉! 就是说jquery执行的优先级比a标签默认的href属性高!

    七:jquery选择器是可以扩展的! 给jquery装插件!


    第 三 章 jQuery中的DOM操作

    八:DOM
    a:是一种与浏览器、平台、语言无关的接口。
    b:分为DOM Core、HTML-DOM、CSS-DOM
    c:节点:文档节点、元素节点、文本节点、属性节点、注释节点
    DOM操作
    a:增 先创建节点,再插入节点。
    clone()复制节点,再插入! 若要复制节点具备原来节点的事件(clone()方法参数里写true)。
    b:删 remove()方法、empty()方法
    c:改 替换 包裹 移动
    d:查
    f:替换 replaceWith() replaceAll()
    g:包裹 wrap() wrapAll() wrapInner()
    f:属性的设置、获取、删除 attr() attr('','') removeAttr('');
    h:样式的操作 addClass() removeClass() toggleClass() hasClass()
    i:html() text() val()
    j:遍历 children() next() prev() siblings() closest()

    CSS-DOM
    a: css() offset() position() scrollTop() scrollLeft() (这里需要强化)


    第 四 章 jQuery中的事件和动画

    1.合成事件:hover() toggle()
    2.冒泡 和 捕获
    (3).事件对象event的属性:event.type event.preventDefault() event.stopPropagation()
    event.target event.pageX event.pageY event.which
    4.bind() unbind() one()
    5.模拟操作: 直接激活事件 $('元素').trigger('事件名')
    $('元素').click()
    6.触发自定义事件:
    <script>
    $('#btn').bind('myClick',function(){
    $('#test').append('<p>我的自定义事件</p>');
    })
    $('#btn').trigger('myClick'); // 触发这个事件
    </script>



    第 五 章 jQuery对表格和表单的操作

    1.is(":animated") 判断是否处于动画队列. jQuery操作的都是jQuery对象!

    2.each() 和each(i)

    3.表单验证:阻止非法的提交! 安全吧!
    所以一般怕用户无视输入框的错误提醒,执意提交表单,所以可以在submit按钮上设置判断; 若输入不合法,则表单不应该被提交哦!
    So,输入框输入的时候有判断,点击提交button的时候也有判断! 两次前段验证哦!
    就那几种事件:keyup focus blur


    第六章 AJAX
    1. 传统模式:数据提交是通过表单来实现的。数据获取是全页面刷新。 锁住浏览器。
    ajax模式: 数据按需发送, 页面局部刷新。 异步。数据的渲染到了前端,减轻服务器负担。

    XMLHttpRequest对象:javascript内置对象; 发送异步请求、接受响应、执行回调。
    浏览器:渲染引擎和js引擎。

    封装:$.ajax() (最底层)
    $.load() $.get() $.post()
    $.getScript() $.getJSON() 第三层
    get方法:无参数 post有参数 data

    xml:web服务领域的世界语!

    get:参数在url后进行传递。
    数据传输大小有限制。
    请求的数据会被浏览器缓存。 不安全。

    post:参数作为http消息的实体内容。
    数据传输大小没有限制。

    $.each(): 不同于jquery对象的each()方法。 全局函数!

    JSONP:ajax跨域!

    序列化:存储和传输!

    全局ajax事件:ajaxComplete ajaxError ajaxSend ajaxSuccess

    Cookie: 是网站设计者放置在客户端的小文本文件。 浏览器关闭不删除的。
    session cookie:浏览器关闭后删除。


    第七章

    1. ;(function($){
        // 代码
    })(jQuery);

    2. 多用人家的插件,不要自己再去发明轮子了,除非你有大把的时间哦!



    第八章

    1.图片合并:减少http请求!
    2.stop(true,true): (动画队列清空,正在执行动画跳至末状态)



    末尾:

    1. 调试程序:alert
    2. console.log

    Ajax:XMLHttpRequest对象。

    jQuery加载并解析XML。

















  • 相关阅读:
    caffe常用层: batchNorm层和scale层
    简述configure、pkg-config、pkg_config_path三者的关系
    python删除list中元素的三种方法
    Leetcode 872. Leaf-Similar Trees
    Leetcode 508. Most Frequent Subtree Sum
    Leetcode 572. Subtree of Another Tree
    Leetcode 894. All Possible Full Binary Trees
    Leetcode 814. Binary Tree Pruning
    Leetcode 557. Reverse Words in a String III
    python 多维list声明时的小问题
  • 原文地址:https://www.cnblogs.com/njqa/p/5953886.html
Copyright © 2011-2022 走看看