zoukankan      html  css  js  c++  java
  • 《精通javascript》5,6章复习(三)

      想想还是把标题改成复习好点,因为书中的知识点挺多而且细,不好概括,凡是觉得重要的我都想提一提把code重新打一遍。继续(二)的内容,接下来该是从DOM删除一个节点:NodeParent.removeChild(NodeToRemove);

    书中removeChild为基础封装了两个函数:

     1     //从DOM中移除一个节点
     2     function remove(elem) {
     3         if(elem)  
     4             elem.parentNode.removeChild( elem);
     5     }
     6 
     7     //清空一个元素的所有子节点
     8     function empty(elem) {
     9         while(elem.firstChild) {
    10             remove(elem.firstChild);
    11         }
    12     }

    DOM部分算是复习结束,接下来是Event部分。同样是javascript开发中一个很核心的东西。说到事件这里有个重要的概念,javascript的事件分两个阶段:capturing and bubbling phase,称为事件的捕获和冒泡阶段。

    来个能说明问题的例子:

     1 <div id="content">
     2     <ul class="links">
     3         <li>
     4             <!-- 我们点击了这个链接 -->
     5             <a href="/">Home</a>
     6         </li>
     7         <li>
     8             <a href="/about/">About</a>
     9         </li>
    10     </ul>
    11 </div>

    首先是capturing phase:假设我们单击了一个链接,事件的激发顺序:

    document的click处理事件-->body的click处理事件-->div的click处理事件,以此类推最后到达那个我们点击的a,然后进入bubbling phase,顺序和capturing phase相反。

    有时我们要取消事件冒泡:

    function stopBubble(e) {

      //如果默认传入了event对象,那么这是非IE浏览器

          if(e && e.stopPropagation )

          //因此支持W3C标准的stopPropagation()方法

                 e.stopPropagation();

      else

                    //否则我们要用IE取消事件冒泡的方式

                    window.event.cancelBubble = true;

    }

    对于浏览器的默认行为我们在开发过程中也要注意,比如一个用户表单,当用户输入内容,并按下提交按钮,如果表单内容所填有误的话,就应该给用户指出错误,不给予提交。阻止浏览器的默认行为:

    function stopDefault(e) {

      //阻止默认的浏览器行为(W3C)

         if( e && e.preventDefault)   e.preventDefault();

         else  window.event.returnValue = false;  //IE中采用的方法

         return false;

    }

    接着作者讲述了些开发网页的原则,比如在去掉css和javascript的前提下,看看自己的网页是否还能良好的导航与浏览,你的html标签是否具有良好的语义,css和javascript有没有跟HTML DOM进行分离等等..我觉得在CSS方面有本书很不错,《超越CSS:web设计精髓》。

  • 相关阅读:
    css 负边距 小记
    javascript Array 方法学习
    使用自定义字体 @font-face 小试
    mongodb 基本指令学习 (2)
    mongodb 基本指令学习
    ASP.NET MVC AJAX调用JsonResult方法并返回自定义错误信息
    MVC MVVM Knockout 常遇问题总结
    关于 mvc 中 连字符
    在一般处理程序中,把Form Post过来的表单集合转换成对象 ,仿 MVC post,反射原理
    EF经验分享_jimmyzzc
  • 原文地址:https://www.cnblogs.com/AndyWithPassion/p/professional_js_3.html
Copyright © 2011-2022 走看看