首頁 > web前端 > js教程 > 網頁中JS函數自動執行常用三種方法_javascript技巧

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

WBOY
發布: 2016-05-16 15:07:33
原創
1396 人瀏覽過

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

一、JS方法
1.最簡單的呼叫方式,直接寫到html的body標籤裡面:

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

登入後複製

2.在JS語句呼叫:

<script type="text/javascript">
  function myfun()   
{    alert("this window.onload");   }   /*用window.onload调用myfun()*/  
window.onload = myfun;//不要括号
</script>

登入後複製

第三種

<script type="text/javascript">
window.onload=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區域中,有以下函數:

<SCRIPT  LANGUAGE="JavaScript"> 

  functionn MyAutoRun()

  { 

   //以下是您的函数的代码,请自行修改先!

   alert("函数自动执行哦!"); 

  } 

</SCRIPT>

登入後複製

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

①第一種方法

將如上程式碼改為:

<SCRIPT  LANGUAGE="JavaScript"> 

  functionn MyAutoRun()

  { 

   //以下是您的函数的代码,请自行修改先!

   alert("函数自动执行哦!"); 

  } 

  window.onload=MyAutoRun(); //仅需要加这一句

</SCRIPT>

登入後複製

②第二種方法

修改網頁的Body為:

或改為:

③第三種方法

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

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

實作方法,將最上面的那JS函數,改為:

<SCRIPT  LANGUAGE="JavaScript"> 

  functionn MyAutoRun()

  { 

   //以下是您的函数的代码,请自行修改先!

   alert("函数自动执行哦!"); 

  } 

  setTimeout("MyAutoRun()",1000); //这样就行拉

</SCRIPT>

登入後複製

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

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

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板