• $( document ).ready()&$(window).load()


     

    $( document ).ready()

    https://learn.jquery.com/using-jquery-core/document-ready/

    A page can't be manipulated safely until the document is "ready." jQuery detects this state of readiness for you. Code included inside $( document ).ready() will only run once the page Document Object Model (DOM) is ready for JavaScript code to execute. Code included inside $( window ).load(function() { ... }) will run once the entire page (images or iframes), not just the DOM, is ready.

    <!doctype html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>$( document ).ready()</title>
        <script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script>
            $(document).ready(function () {
                alert("document loaded");
            });
        //document ready 简写
        $(function() {
            // ...代码...
        })
    $(window).load(function () { alert("window loaded"); }); </script> </head> <body> <iframe src="http://techcrunch.com"></iframe> </body> </html>

    Experienced developers sometimes use the shorthand $() for $( document ).ready(). If you are writing code that people who aren't experienced with jQuery may see, it's best to use the long form.

    1
    2
    3
    4
    // Shorthand for $( document ).ready()
    $(function() {
    console.log( "ready!" );
    });

    You can also pass a named function to $( document ).ready() instead of passing an anonymous function.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    // Passing a named function instead of an anonymous function.
     
    function readyFn( jQuery ) {
    // Code to run when the document is ready.
    }
     
    $( document ).ready( readyFn );
    // or:
    $( window ).load( readyFn );

    DOMContentLoaded

    https://developer.mozilla.org/zh-CN/docs/DOM/DOM_event_reference/DOMContentLoaded

    当页面中的文档树解析完成时,在页面的Document对象上,会触发DOMContentLoaded事件.该事件代表了,页面的DOM树已经构建完成,但页面引用的样式表和图像文件,以及包含的框架页面可能还没有加载完成,在页面完全加载完成时,会触发另外一个类似的称为"load"的事件.

    该事件会冒泡到当前页面的window对象上.但框架页面中文档加载完成时并不会触发父页面的DOMContentLoaded事件.

    浏览器兼容性

    FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
    Basic support 0.2 1.0 (1.7 or earlier) 9.0 9.0 3.1
    <script>
      document.addEventListener("DOMContentLoaded", function(event) {
        console.log("DOM fully loaded and parsed");
      });
    </script>
  • 相关阅读:
    Cypress自动化框架笔记
    SSH 用公钥免密登录,需要改文件权限
    python函数的可变参数 *和**
    Socket进程处理被中断的系统调用及Accept函数返回EINTR错误处理 (转)
    perror 与 strerror
    perror 函数
    strerror 函数
    getch ()函数 (来自百度百科)
    C语言运算符及其优先级汇总表口诀
    第四章
  • 原文地址:https://www.cnblogs.com/darr/p/4754429.html
Copyright © 2020-2023  润新知