最新国产好看的视频,伊人天堂AV在线,国产Aaaaaa视频,蜜臀视频在线观看一区,人妻av色图,密臀久久久精品影片,青青视频免费观看毛片,久草在线观看视,国产三级精品色情在线

Javascript & DHTML 實(shí)例編程（教程）（四）初級(jí)實(shí)例篇2—?jiǎng)赢?/h1>
 更新時(shí)間：2007年06月02日 00:00:00   作者：  
上篇說了動(dòng)態(tài)創(chuàng)建結(jié)點(diǎn)和刪除結(jié)點(diǎn)的例子，這一篇說一些如何用setInterval和setTimeout做簡單的動(dòng)畫。
語法皆是window.setTimeout(fn, delay), window.setInterval(fn, delay)
fn可以是一個(gè)函數(shù)名，也可以是一個(gè)執(zhí)行的字符串，但要注意的是，如果fn是一個(gè)可以執(zhí)行的字符串，且有參數(shù)，如window.setInterval("myFunction(obj)",1000)將可能拋出一個(gè)異常，這個(gè)時(shí)候，通常是你要傳遞一個(gè)對(duì)象參數(shù)，我建議用這樣的一個(gè)辦法來解決，也建議使用這種方法來使用window.setTimeout和window.setInterval：

window.setInterval(function (){
myFunction(obj);},1000);

還有一種情況就是在一個(gè)"class"里，即要執(zhí)行this.myFunction(obj)如何實(shí)現(xiàn)呢？


function jsclass() {};
jsclass.prototype.init = function (obj) {
  var self = this; //創(chuàng)建一個(gè)this指針的引用
  window.setInterval(function(obj) {
  self.myFunction(obj);},1000);
};
jsclass.prototype.myFunction = function (obj) {
  //TODO
};

DHTML的全局方法setInterval和setTimeout，所謂全局，即在window層，不屬于DHTML的DOM元素的方法里，這兩個(gè)有一些區(qū)別，網(wǎng)上也有很多說明，也就是setInterval是循環(huán)執(zhí)行一個(gè)指定函數(shù)，setTimeout是只執(zhí)行一次。例外說明一點(diǎn)，屬于window層次的，可以在前面不加window，即可以用window.setInterval也可以直接用setInterval。

它們都返回一個(gè)數(shù)字型的timerId，用于cleaverInterval/clearTimeout方法，從setInterval/setTimeout中返回。如果做過桌面應(yīng)用的朋友，可以把這個(gè)setInterval和setTimeout假想成創(chuàng)建一個(gè)線程，而timerId則是一個(gè)線程Id，而cleaverInterval/clearTimeout方法則是消毀這個(gè)線程。也許這樣可以更好的理解這兩個(gè)方法。

(在具體的應(yīng)用中，我更驅(qū)向于用setTimeout。)

知道這兩個(gè)方法的功能，先來寫一個(gè)簡單的例子：

一個(gè)一秒后彈出的alert對(duì)話框。

<script>
window.setTimeout(function () {
  alert("timeout example after 1 second");
},1000)
</script>

每一秒創(chuàng)建一個(gè)新DIV結(jié)點(diǎn)的函數(shù)
<script>
function intervalExample() {
  var div=document.createElement("div");
  div.innerHTML = "tutorial of DHTML and javascript programming, by www.never-online.net";
  document.body.appendChild(div);
}
window.setInterval(intervalExample,1000);
</script>

而實(shí)際應(yīng)用中，setTimeout可以有一個(gè)另類一些的應(yīng)用，比如相當(dāng)于VB中的DoEvents函數(shù)，或者.net桌面程序中Application.DoEvents();這樣的功能，也就是異步處理，因?yàn)镈HTML沒有多線程，所以說這個(gè)功能在很多的時(shí)候是為了給用戶覺得不是在假死狀態(tài)，或者給其它的程序按照代碼的邏輯繼續(xù)執(zhí)行下去而不會(huì)阻塞或者也不會(huì)跳過一段代碼執(zhí)行。

舉個(gè)例子。

下段代碼是沒有加setTimeout的。運(yùn)行后，錨點(diǎn)會(huì)馬上指向hash2

<script>
window.location.hash="hash1";
window.location.hash="hash2";
</script>

這一段是加了setTimeout的，錨點(diǎn)會(huì)在3秒后指向hash1，再在3秒后指向hash2
<script>
var doEventsDelay = 0;
function DoEvents (fn) {
  window.setTimeout(fn,doEventsDelay);
  doEventsDelay+=3000;
}
DoEvents(function () {
  window.location.hash="hash1";
  doEventsDelay-=3000;
}
);
DoEvents(function () {
  window.location.hash="hash2";
  doEventsDelay-=3000;
  }
);
</script>

下面我們做一個(gè)實(shí)用些的例子，比如一個(gè)動(dòng)態(tài)顯示tip的動(dòng)態(tài)菜單。

一、這里只講解setTimeout的方法，setInterval的請(qǐng)看demo里的代碼，還要注明一點(diǎn)（本例中有一個(gè)比較嚴(yán)重的問題是沒有解決的，這一問題我將留到以后再講解）是關(guān)于坐標(biāo)的。比如將下面代碼中的sliderShow放到一個(gè)table中，就可能會(huì)發(fā)現(xiàn)一些問題了。:D

思路，得到一個(gè)元素，相對(duì)這個(gè)元素的作標(biāo)，再根據(jù)一個(gè)tip的容器從而做一個(gè)動(dòng)畫，
主要用到的就是相對(duì)元素的X，Y坐標(biāo)，關(guān)于坐標(biāo)的一些屬性意義，參見下圖：
/upload/200762224726499.gif


而整個(gè)動(dòng)畫的思路，見下圖
http://www.never-online.net/tutorial/js/sliderShow/sliderTip.png
注釋代碼：


[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
是否覺得上面的例子很多都是重復(fù)的勞動(dòng)？如果減少一些豈不更好？:D，的確如此，上面的JS代碼有近一半都是重復(fù)的，在這里我就不把它優(yōu)化了，還是留給大家做一些實(shí)質(zhì)性的工作，減少上面代碼的冗余。 

相關(guān)文章

最新評(píng)論

东乡| 海盐县| 武功县| 从江县| 玛沁县| 永德县| 浠水县| 定南县| 来凤县| 旬邑县| 棋牌| 漯河市| 积石山| 丰都县| 阿克苏市| 蕉岭县| 永平县| 乌苏市| 普格县| 永丰县| 彰化县| 黎川县| 廊坊市| 义乌市| 会东县| 瓦房店市| 黄龙县| 房产| 渑池县| 长海县| 攀枝花市| 新津县| 石狮市| 龙口市| 博客| 陇西县| 安陆市| 穆棱市| 喀喇沁旗| 封丘县| 南康市|