jQuery文档加载完毕的几种写法

我就是我 2022-02-13 12:00 278阅读 0赞

js中文档加载完毕。一般在body加一个onload事件或者window.onload = function () \{\}

jQuery中有好多写法，平时也不注意，别人一问，还真觉得头大。

下面是我整理测试的结果。

<html>
    <head>
       <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
       <script src="jquery-1.7.1.js" type="text/javascript"></script>
    
    </head>
    
    <body style=" overflow-y:scroll;overflow-x:auto;">
    <input type="text"  id="dd1" value="" />
    
    <textarea id="tt" cols="30" rows="30"></textarea>
    </body>
    </html>
            
    <script>
    var i=1;
    
    //jQuery方式
    $(document).ready(function(){
    	    var str=$("#tt").val()+'\r\n'+'$_A加载完毕'+i;
    		$("#tt").val(str);
    		i++;
        });
    
    $(function(){
    		var str=$("#tt").val()+'\r\n'+'$_B加载完毕'+i;
    		$("#tt").val(str);
    		i++;
    	}) ;
    
    $(function($) {
            var str=$("#tt").val()+'\r\n'+'$_C加载完毕'+i;
    		$("#tt").val(str);
    		i++;
    });
    
    $(window).load(function() {
            var str=$("#tt").val()+'\r\n'+'$_D加载完毕'+i;
    		$("#tt").val(str);
    		i++;
    });
    
    (function() {
            var str=$("#tt").val()+'\r\n'+'$_E加载完毕'+i;
    		$("#tt").val(str);
    		i++;
    })(jQuery)
    
    jQuery与别名$可互通/
    jQuery(document).ready(function(){
    	    var str=$("#tt").val()+'\r\n'+'jQuery_F加载完毕'+i;
    		$("#tt").val(str);
    		i++;
        });
    
    jQuery(function() {
            var str=$("#tt").val()+'\r\n'+'jQuery_G加载完毕'+i;
    		$("#tt").val(str);
    		i++;
    })
    jQuery(function($) {
            var str=$("#tt").val()+'\r\n'+'jQuery_H加载完毕'+i;
    		$("#tt").val(str);
    		i++;
    });
    
    jQuery(window).load(function() {
            var str=$("#tt").val()+'\r\n'+'jQuery_I加载完毕'+i;
    		$("#tt").val(str);
    		i++;
    });
    
    //js方式
    window.onload = function () {
    	    var str=document.getElementById("tt").value+'\r\n'+'js加载完毕'+i;;
    		document.getElementById("tt").value=str;
    		i++;
    	};
    
    
    
    
    /*注意顺序,没有按照我们上面的顺序出来的，那就是本身加载有先后。
    D和I加载的是window，所以慢。
    
    $_E加载完毕1
    $_A加载完毕2
    $_B加载完毕3
    $_C加载完毕4
    jQuery_F加载完毕5
    jQuery_G加载完毕6
    jQuery_H加载完毕7
    js加载完毕8
    $_D加载完毕9
    jQuery_I加载完毕10
    
    */
    </script>