zoukankan      html  css  js  c++  java
  • 关于js与jquery中的文档加载

    jquery中的$(document).ready()类似于javascript中的window.onload(),但是其中还是有很大区别的

    1.jquery中的可以简化为$().ready(),$(function),   而js却不行必须全部写完。

    2.同时js的window.onload()只能有一个,而jquery的$(document).ready()却可以有多个。

    3.最重要的一点是window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。

             $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕。

    下面说说在项目中遇到的问题

    先上代码,这个demo中我不用引入jquery包就可以使用类似jquery的$(id)(我个人不建议使用),在这个demo中页面会弹出"1",在此处完全没有问题。

    <!DOCTYPE html>
    <head> 
    <title>JS</title> 
    <script>
    function $(id){return document.getElementById(id)};
    window.onload = function(){
        alert($("aaa").value);
    };
    </script>
    </head> 
    <body> 
    <input id="aaa" value="1" />
    </body>  
    </html>

    再上代码,此处的问题会报错"Cannot read property 'ready' of null",可以自己先想想为什么。。。

    <!DOCTYPE html>
    <head> 
    <title>JS</title> 
    <script src="js/jquery-2.1.1.min.js"></script>
    <script>
    function $(id){return document.getElementById(id)};
    $(document).ready(function(){                      //这是错误的代码案列
    $("#aaa").click(function(){
        $("#aaa").hide();
    });
    });
    </script>
    </head> 
    <body> 
    <a id="aaa" value="1" >aaaaaa</a>
    </body>  
    </html>

    问题在与我们对"$"定义了一个函数,同时又想使用jquery提供的"$",所以报错"Cannot read property 'ready' of null",问题在于我们写的"$"影响了$(document)这块,所以还是老老实实导包,别嫌麻烦,不然出现bug,要是在不熟悉的其中语法(代码就一行,项目大的话还不容易发现。o(╥﹏╥)o),改bug就要更长的时间,也是醉了。

  • 相关阅读:
    梦心日记本V2.0终于要完工了
    上班半年大总结
    真有趣
    搞定设计模式1之策略模式
    利用GDI+制作背景颜色淡入淡出效果的按钮
    浏览器之争
    学习自定义控件
    搞定设计模式2之代理模式
    (转)学习asp.net比较完整的流程
    搞定设计模式3之中介者模式
  • 原文地址:https://www.cnblogs.com/whiteme/p/7410693.html
Copyright © 2011-2022 走看看