在網頁中JS函數自動執行常用三種方法

本文爲大家分享了在網頁中JS函數自動執行常用方法,供大家參考,具體內容如下

一、JS方法
1.最簡單的調用方式,直接寫到html的body標籤裏面:

?
1
2
<body onload="myfunction()">
<html> <body onload="func1();func2();func3();"> </body> </html>

2.在JS語句調用:

?
1
2
3
4
5
<script type="text/javascript">
  function myfun()   
{    alert("this window.onload");   }   /*用window.onload調用myfun()*/  
window.onload = myfun;//不要括號
</script>

第三種

?
1
2
3
4
5
6
<script type="text/javascript">
window.οnlοad=function(){
func1();
func2();
func3(); }
</script>

二、JQ方法

1.整個頁面的document全部加載完成以後執行。不幸的這種方式不僅要求頁面的DOM tree全部加載完成,而且要求所有的外部圖片和資源全部加載完成。更不幸的是,如果外部資源,例如圖片需要很長時間來加載,那麼這個js方法執行感覺就比較慢了。也就是說這是一種最嚴謹的頁面加載完再執行方法的方法。
window.onload =function() { $("table tr:nth-child(even)").addClass("even"); //這個是jquery代碼 };

2.僅只需要加載所有的DOM結構,在瀏覽器把所有的HTML放入DOM tree之前就執行方法。包括在加載外部圖片和資源之前。
$(document).ready(function() { $("table tr:nth-child(even)").addClass("even"); //任何需要執行的js特效 });

還有一種簡寫方式
$(function() { $("table tr:nth-child(even)").addClass("even"); //任何需要執行的js特效 });

在網頁中JS函數自動執行常用三種方法

在HTML中的Head區域中,有如下函數:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
<SCRIPT  LANGUAGE="JavaScript">
 
  functionn MyAutoRun()
 
  {
 
   //以下是您的函數的代碼,請自行修改先!
 
   alert("函數自動執行哦!");
 
  }
 
</SCRIPT>

下面,我們就針對上面的函數,讓其在網頁載入的時候自動運行!

①第一種方法

將如上代碼改爲:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<SCRIPT  LANGUAGE="JavaScript">
 
  functionn MyAutoRun()
 
  {
 
   //以下是您的函數的代碼,請自行修改先!
 
   alert("函數自動執行哦!");
 
  }
 
  window.οnlοad=MyAutoRun(); //僅需要加這一句
 
</SCRIPT>

②第二種方法

修改網頁的Body爲:

<body onLoad="MyAutoRun();">

或者改爲:

<body onLoad="javascript:MyAutoRun();">

③第三種方法

使用JS定時器來間斷性的執行函數:

setTimeout("MyAutoRun()",1000);   //隔1000毫秒就執行一次MyAutoRun()函數

實現方法,將最上面的那JS函數,改爲:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<SCRIPT  LANGUAGE="JavaScript">
 
  functionn MyAutoRun()
 
  {
 
   //以下是您的函數的代碼,請自行修改先!
 
   alert("函數自動執行哦!");
 
  }
 
  setTimeout("MyAutoRun()",1000); //這樣就行拉
 
</SCRIPT>

其它的方法比較特殊,也不常用,通用性也不大,就不介紹了!

以上爲大家介紹的是JS函數自動執行常用方法,希望對大家的學習有所幫助。

轉自:http://www.jb51.net/article/81724.htm
發佈了3 篇原創文章 · 獲贊 7 · 訪問量 14萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章