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

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

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

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

  1 <!DOCTYPE html>
  2 <HTML lang="zh-CN">
  3  <HEAD>
  4  <meta charset="utf-8">
  5   <TITLE>jQuery文档加载完毕的几种写法</TITLE>
  6  </HEAD>
  7 
  8  <body style=" overflow-y:scroll;overflow-x:auto;">
  9  <input type="text"  id="dd1" value="" />
 10 
 11 <textarea id="tt" cols="30" rows="30"></textarea>
 12 
 13 <script src="jquery.js"></script>
 14 
 15 <script>
 16 
 17 var i=1;
 18 
 19 //jQuery方式
 20 ;$(document).ready(function(){
 21         var str=$("#tt").val()+'
'+'$_A加载完毕'+i;
 22         $("#tt").val(str);
 23         i++;
 24     });
 25 
 26 ;$(function(){
 27         var str=$("#tt").val()+'
'+'$_B加载完毕'+i;
 28         $("#tt").val(str);
 29         i++;
 30     });
 31 
 32 ;$(function($) {
 33         var str=$("#tt").val()+'
'+'$_C加载完毕'+i;
 34         $("#tt").val(str);
 35         i++;
 36 });
 37 
 38 ;$(window).load(function() {
 39         var str=$("#tt").val()+'
'+'$_D加载完毕'+i;
 40         $("#tt").val(str);
 41         i++;
 42 });
 43 
 44 ;(function() {
 45         var str=$("#tt").val()+'
'+'$_E加载完毕'+i;
 46         $("#tt").val(str);
 47         i++;
 48 })(jQuery);
 49 
 50 ////////////////////jQuery与别名$可互通/////////////////////////////////
 51 ;jQuery(document).ready(function(){
 52         var str=$("#tt").val()+'
'+'jQuery_F加载完毕'+i;
 53         $("#tt").val(str);
 54         i++;
 55     });
 56 
 57 ;jQuery(function() {
 58         var str=$("#tt").val()+'
'+'jQuery_G加载完毕'+i;
 59         $("#tt").val(str);
 60         i++;
 61 })
 62 
 63 ;jQuery(function($) {
 64         var str=$("#tt").val()+'
'+'jQuery_H加载完毕'+i;
 65         $("#tt").val(str);
 66         i++;
 67 });
 68 
 69 ;jQuery(window).load(function() {
 70         var str=$("#tt").val()+'
'+'jQuery_I加载完毕'+i;
 71         $("#tt").val(str);
 72         i++;
 73 });
 74 
 75 //js方式
 76 window.onload = function () {
 77         var str=document.getElementById("tt").value+'
'+'js加载完毕'+i;;
 78         document.getElementById("tt").value=str;
 79         i++;
 80     };
 81 
 82 
 83 ;$().ready(function(){
 84         var str=$("#tt").val()+'
'+'$_J加载完毕'+i;
 85         $("#tt").val(str);
 86         i++;
 87     });
 88 
 89 ;(function(jQuery) {
 90         var str=$("#tt").val()+'
'+'$_K加载完毕'+i;
 91         $("#tt").val(str);
 92         i++;
 93 })();
 94 
 95 
 96 ;(function($) {
 97        var str=$("#tt").val()+'
'+'$_L加载完毕'+i;
 98         $("#tt").val(str);
 99         i++;
100 })(jQuery);
101 
102 ;(function() {
103        var str=$("#tt").val()+'
'+'$_M加载完毕'+i;
104         $("#tt").val(str);
105         i++;
106 })(jQuery);
107 
108 ;(function(jQuery) {
109        var str=$("#tt").val()+'
'+'$_N加载完毕'+i;
110         $("#tt").val(str);
111         i++;
112 })(jQuery);
113 
114 /*$().load(function() {
115         alert('ok');
116 });*/
117 /*window.onload = function () {
118         var str=document.getElementById("tt").value+'
'+'js加载完毕'+i;;
119         document.getElementById("tt").value=str;
120         i++;
121     };*/
122 
123 
124 /*注意顺序,没有按照我们上面的顺序出来的,那就是本身加载有先后。
125 E、K、L、M、N是同一种方式,不同写法
126 D和I加载的是window,所以慢。
127 
128 /iE下/
129 $_E加载完毕1
130 $_K加载完毕2
131 $_L加载完毕3
132 $_M加载完毕4
133 $_N加载完毕5
134 $_A加载完毕6
135 $_B加载完毕7
136 $_C加载完毕8
137 jQuery_F加载完毕9
138 jQuery_G加载完毕10
139 jQuery_H加载完毕11
140 $_J加载完毕12
141 js加载完毕13
142 $_D加载完毕14
143 jQuery_I加载完毕15
144 
145 /firefox下/
146 
147 $_E加载完毕1
148 $_K加载完毕2
149 $_L加载完毕3
150 $_M加载完毕4
151 $_N加载完毕5
152 $_A加载完毕6
153 $_B加载完毕7
154 $_C加载完毕8
155 jQuery_F加载完毕9
156 jQuery_G加载完毕10
157 jQuery_H加载完毕11
158 $_J加载完毕12
159 $_D加载完毕13
160 jQuery_I加载完毕14
161 js加载完毕15
162 */
163 </script>
164 
165 </body>
166 
167 </HTML>
原文地址:https://www.cnblogs.com/double405/p/5124831.html