JavaScript 創(chuàng)建隨機(jī)數(shù)和隨機(jī)圖片
①自JavaScript產(chǎn)生后,好多瀏覽器中都有內(nèi)置的隨機(jī)數(shù)發(fā)生方法。例如:
var number = Math.random();
該方法產(chǎn)生一個(gè)0到1之間的浮點(diǎn)數(shù)。
②基于時(shí)間,亦可以產(chǎn)生隨機(jī)數(shù)。例如:
var now=new Date();
var number = now.getSeconds();
這將產(chǎn)生一個(gè)基于目前時(shí)間的0到59的整數(shù)。
var now=new Date();
var number = now.getSeconds()%43;
這將產(chǎn)生一個(gè)基于目前時(shí)間的0到42的整數(shù)。
③這里介紹一個(gè)相當(dāng)優(yōu)秀的的隨機(jī)數(shù)發(fā)生器程序,能應(yīng)用于許多領(lǐng)域。
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]
如果要在你的網(wǎng)頁(yè)中使用該隨機(jī)數(shù)發(fā)生器,必須把這段代碼放在<HEAD> 和 </HEAD>標(biāo)記之間。
要?jiǎng)?chuàng)建一個(gè)隨機(jī)浮點(diǎn)數(shù)時(shí),使用rnd();要?jiǎng)?chuàng)建一個(gè)隨機(jī)整數(shù)時(shí),例如,1到10時(shí),使用rand(10)。
下面創(chuàng)建隨機(jī)圖片的例子中,就是用這個(gè)隨機(jī)數(shù)發(fā)生器來(lái)產(chǎn)生隨機(jī)數(shù)的,因此,要使下面的例子能正常工作,要確保你的網(wǎng)頁(yè)中已包含上面這段代碼。
創(chuàng)建隨機(jī)圖片
創(chuàng)建隨機(jī)圖片,這是利用隨機(jī)數(shù)所能做的最簡(jiǎn)單的事了。此例中,我們假設(shè)有10張圖片, banner1.gif.....banner10.gif,每當(dāng)文檔被載入時(shí),我們希望能隨機(jī)地顯示這些圖片。
<script language="JavaScript"><!--
document.write('<img src="../images/banner' + rand(10) + '.gif" width=400 height=40>');
//--></script>
如果圖片不是以數(shù)字的形式來(lái)命名的,或者圖片的類(lèi)型或大小不一樣時(shí),那么,你也可以通過(guò)檢查隨機(jī)數(shù)的值,然后顯示相應(yīng)的圖片:
<script language="JavaScript"><!--
var number = rand(10);
if (number == 1) {
var picture = "one.gif";var width = 400;var height = 40;
}
else if (number == 2) {
var picture = "two.jpg";var width = 200;var height = 20;
}
...
...
else if (number == 9) {
var picture = "nine.gif";var width = 450;var height = 450;
}
else if (number == 10) {
var picture = "ten.jpg";var width = 40;var height = 400;
}
document.write('<img src="../images/' + picture + '" width=' + width + ' height=' + height + '>');
//--></script>
上面介紹了怎樣隨機(jī)顯示圖片,同樣的道理,也可以利用隨機(jī)數(shù)創(chuàng)建隨機(jī)的文本、表單、標(biāo)題廣告、URL 、背景顏色和圖像、調(diào)查表和幀等等,這里就不再多說(shuō)了.
- 基于JavaScript代碼實(shí)現(xiàn)隨機(jī)漂浮圖片廣告
- JSP隨機(jī)驗(yàn)證圖片如何制作
- javascript隨機(jī)顯示背景圖片的方法
- JavaScript實(shí)現(xiàn)隨機(jī)替換圖片的方法
- js鼠標(biāo)點(diǎn)擊圖片實(shí)現(xiàn)隨機(jī)變換圖片的方法
- js實(shí)現(xiàn)網(wǎng)頁(yè)隨機(jī)切換背景圖片的方法
- javascript隨機(jī)將第一個(gè)dom中的圖片添加到第二個(gè)div中示例
- js 圖片隨機(jī)不定向浮動(dòng)的實(shí)現(xiàn)代碼
- javascript 隨機(jī)廣告代碼(圖片廣告)
- JS實(shí)現(xiàn)鼠標(biāo)移動(dòng)到縮略圖顯示大圖的圖片放大效果
- 圖片上傳即時(shí)顯示縮略圖的js代碼
- JS實(shí)現(xiàn)頁(yè)面載入時(shí)隨機(jī)顯示圖片效果
相關(guān)文章
javascript監(jiān)聽(tīng)鼠標(biāo)滾輪事件淺析
這篇文章主要介紹了javascript監(jiān)聽(tīng)鼠標(biāo)滾輪事件淺析,使用具體例子說(shuō)明,同時(shí)考慮了不同的瀏覽器,需要的朋友可以參考下2014-06-06layer彈出層的關(guān)閉問(wèn)題詳解之在執(zhí)行完畢后關(guān)閉當(dāng)前彈出層
在前端頁(yè)面中用layer打開(kāi)窗口供用戶(hù)輸入或選擇是非常常見(jiàn)的用法,但是有時(shí)為了完成一次操作,需要彈出多個(gè)窗口進(jìn)行選擇、輸入或者提示,因此在關(guān)閉窗口的時(shí)候需要實(shí)現(xiàn)指定關(guān)閉任意窗口,需要的朋友可以參考下2023-10-10JS一維數(shù)組轉(zhuǎn)化為三維數(shù)組的實(shí)現(xiàn)示例
很多時(shí)候,跟后端接口開(kāi)發(fā)對(duì)接時(shí),因?yàn)樾枨蟮年P(guān)系,需要前端地區(qū)數(shù)據(jù)跟后端的數(shù)據(jù)要一一對(duì)應(yīng),有時(shí)候需要的是多維數(shù)據(jù),這篇文章主要介紹了JS一維數(shù)組轉(zhuǎn)化為三維數(shù)組的實(shí)現(xiàn)示例,感興趣的可以了解一下2021-12-12js對(duì)數(shù)組中的數(shù)字從小到大排序?qū)崿F(xiàn)代碼
對(duì)數(shù)組中的數(shù)字從小到大排序,很多時(shí)候需要用的多,需要的朋友可以參考下2012-09-09TypeScript 安裝使用及基本數(shù)據(jù)類(lèi)型
這篇文章主要介紹了TypeScript 安裝使用及基本數(shù)據(jù)類(lèi)型,本文分步驟給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2021-03-03JS實(shí)現(xiàn)課堂隨機(jī)點(diǎn)名和順序點(diǎn)名
這篇文章主要介紹了基于JS實(shí)現(xiàn)課堂隨機(jī)點(diǎn)名和順序點(diǎn)名的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友參考下2017-03-03JavaScript 事件監(jiān)聽(tīng)實(shí)例代碼[兼容IE,firefox] 含注釋
JavaScript事件監(jiān)聽(tīng)完整實(shí)例 含注釋?zhuān)浅5牟诲e(cuò),大家可以直接使用。2009-08-08原生JavaScript+LESS實(shí)現(xiàn)瀑布流
這篇文章主要介紹了原生JavaScript+LESS實(shí)現(xiàn)瀑布流的方法,附上了具體實(shí)例,這里推薦給有需要的小伙伴。2014-12-12javascript Array對(duì)象基礎(chǔ)知識(shí)小結(jié)
感覺(jué)自己對(duì)Array對(duì)象總是有種朦朧的感覺(jué),今天自己手寫(xiě)總結(jié),加深一下印象。2010-11-11