读书笔记-- --JavaScript王者归来

<html>

<head>
    <title></title>
    <meta name="keyword" content="读书笔记-- --JavaScript王者归来">
    <meta name='discription' content="读书笔记-- --JavaScript王者归来">
</head>

<body>
    <script>
    读书笔记-- --JavaScript王者归来

    第一张 从零开始

    程序设计之道无远弗届, 御晨风而返.-- --杰弗瑞.杰姆士
    1.1 为啥选择js

    第二章 浏览器中的javascript

    可移动的盒子

    function f_mdown(obj) {
        currentMoveObj = obj; //当对象被按下时,记录该对象
        //setCapture()可以让对象捕抓到鼠标事件,跟随鼠标做出响应
        currentMoveOj.setCapture();
        //设置对象定位方式为absolute,便于计算拖动位置
        currentMoveObj.style.position = "absolute";
        //记录鼠标按下时距离被移动物体的左上角的偏移量
        //以便在移动鼠标的时候正确的计算位移
        relLeft = event.x - currentMoveObj.style.pixlLeft;
        relTop = event.y - currentMoveObj.style.pixelTop;
    }

    window.document.attachEvent("onmouseup", function() {
        //releaseCapture()执行和setCapture()相反操作
        currentMoveObj.releaseCapture();
        currentMoveObj = null; //当鼠标释放时同事释放拖拽对象
    })


    function f_move(obj) {
        if (cerruntMoveObj != null) {
            //真正移动鼠标的时候,计算被移动物体的实际位置.
            currentMoveObj.style.pixelLeft = event.x - relLeft;
            currentMoveObj.style.pixelTop = event.y - relTop;
        }
    }

    第三章 开发环境和调试方法


    debuger;

    第四章 javascript 核心

    大小写敏感

    分隔符: js解析器采用最长匹配原则, 并且在这个基础上忽略程序代码之间的空格制表符和换行符(统称分隔符)


    第五章 javascript 核心

    第六章 javascript 核心

    第七章 javascript 核心

    第八章 javascript 集合

    哈希表

    是根据关键码值对来进行直接访问的集合类型的数据结构

    var hashTabel = { a: 1, b: 2, c: 3 };



    第九章 字符串




    第十章正则表达式



    常用正则
    var Pattern = {};
    Pattern.Empty = /^[\s\n\r\t]*$/; //空串
    Pattern.Int = /^[0-9]*[1-9][0-9]*$/ // 整数
    Pattern.Float = /^([+-])?(0|([1-9][0-9]*))([.][0-9]+)?$/; //浮点数
    Pattern.Money = /^([+-])?(0|[1-9][0-9]*)(.[0-9]{1,2})?$/; //货币
    Pattern.SPhone = /^[0-9]{3-4}[-]([0-9]{6,8}([-][0-9]{1,6}))?$/ //电话号码(长号码)
    Pattern.LPhone = /^[0-9]{3-4}[-][0-9]{6-8}([-][0-9]{1-6})?$/ //电话号码(短号码)
    Pattern.Phone = /^[0-9]{11}$/; //手机号码
    Pattern.Email = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/ //电子邮箱
    Pattern.Url = /^http:\/\/([\w-]+\.)+[\w-]+(\/[\w-.\/?%&=]*)?$/



    110.2 .2 特殊字符和转移序列

        [...] 位于括号之内的任意字符

    [ ^ ...] 不位于括号之内的任意字符

        .除换行和Unicode行终止符之外的任意字符

    \ w 任何ascii单子字符, 等价于[a - zA - Z0 - 9]

    \ W 非任ascii单子字符, 等价于[ ^ a - zA - Z0 - 9]

    \ s 任何Unicode空白符

    \ S 任何非Unicode空白符


    \ d任何ASCII数字, 等价于[0 - 9]

    \ D 出了数字之外的任何字符, 等价于[ ^ 0 - 9]


    \ b 退格直接量


    10.2 .3 重复

        *
        表示0次或者多次重复

        +
        表示1次或多次的重复

        ?
        表示0次或者1次重复

    { n } n次重复

    { m, n } m到n次重复

    { m, } 至少m次重复



    exec()

    var str = "420105198203091614";

    var re = /\d{6}([12]\d{3})([01]\d)([0123]\d)\d{4}/;

    var id = re.exec(str);


    第十一章 浏览器对象


    window 对象的声明周期
    一个window对象在某个浏览器进程终止前总是存在的.
    也就是说, 即使你关闭了某个浏览器, 这个窗口所引用的window对象依然存在,
    除非这个浏览器进程已经被完全终止

    open(); //打开新窗口

    close(); //关闭当前窗口

    write(); //把文件附加到当前打开的文档

    writeln(); //把文件附加在当前打开的文档,并输出一个换行符


    第十二章 文档对象模型
    Document对象

    状态栏: 用来向用户线束一个特定的消息


    12.5 .4 克隆节点
    Javascript中, DOM兑现对象是引用类型, 所以建一个DOM对象赋值给不同的变量,
    拷贝的是他的引用, 而不是值
    cloneNode(); //带参数表示复制节点包括内容,不带参数只复制节点不复制内容



    第十三章 事件处理
    将消息进行处理的行为, 被称为事件响应或者事件处理

    Onabort() //图片装载被中断
    Onblur() //元素失去焦点
    Ocnchanges() // 元素内容变化
    Onclck() //点击鼠标
    Ondbclick() //双击鼠标
    Onerror() //图片装载失败
    Onfocus() //元素获得聚焦
    onkeydown() //键盘被按下
    onkeypress() //键盘被按下并释放
    onkeyup(); //键盘被释放
    Onoad(); //文档装载完毕
    onmousedown(); //鼠标被按下
    onmousemover(); //鼠标移动到元素上
    onmouseup(); //鼠标被释放
    onreset(); //表单被重置
    onresize(); //调整窗口大小
    onselect(); //选中文字
    onsubmit(); //表单被提交
    onunload(); //下载文档或框架


    13.3 .1 起泡和捕抓--浏览器的事件传播
    stopPropagation(); //阻止冒泡事件
    cancelBubble(); //IE阻止冒泡事件
    preventDefault(); //阻止默认事件


    第十四章 级联样式表
    CSS和DOM的关系




    第十五章 数据存储的脚本

    cookie

    userData: IE为js提供了另一种存储客户端数据的手段


    第十六章 同步和异步


    第十七章 XML DOM和XML HTTP



    第十八章 Ajax简介

    xmlhttp = null;
    if (window.XMLHttpRequest) {
        xmlhttp = new XMLHttpRequest();
    } else if (window.ActiveXObject) {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    if (xmlhttp != null) {
        xmlhttp.onreadystatechange = state_change;
        xmlhttp.open("GET", url, true);
        xmlhttp.send(null);
    } else {
        alert("")
    }

    function state_change() {
        if (xmlhttp.readyState == 4) {
            if (xmlhttp.status == 200) {

            } else {

            }
        } else {

        }
    }

    第十九章 标准与兼容

    19.2 .1 平台和浏览器的兼容性

    最小公分母法
    通过避开使用不兼容代码和实现上有BUG的代码来达到跨浏览器的兼容性
    btn.onclick = function(event) {
        event = event || window.event;
        alert(event.x)
    }

    19.2 .2 防御性编码
    在你不确定某个模块是否实现并且对应的实现没有BUG时,
    遇到一些额外的编码来保证这些模块被正确运行
    btn.onclick = function(event) {
        event = event || window.event;
        var src = event.srcElement || event.target;
        alert(src.x)
    }
    19.2 .3 客户端探测
    var isOpera = navagator.userAgent.indexOf("Opera") > -1;
    .
    .
    .

    19.2 .4 特性检测
    if (window.ActiveXObject) {
        xmlhttp = new ActiveXObject("MSXML.XMLHTTP");
    }

    19.2 .5 实现标准
    自己编写代码实现某些浏览器未能实现的标准模块, 这种方法常用语编写较大型的应用程序中

    19.2 .6 适度停止运行
    适度的取消一些特定的浏览器不太重要的功能
    if (isMos) {
        alert("不支持滤镜")
    } else if (isIE) {
        obj.filter.alpha = "(opacity=20)"
    }
    </script>
</body>

</html>

  

posted @ 2018-03-30 16:48  SunLike阿理旺旺  阅读(170)  评论(0编辑  收藏  举报