js實(shí)現(xiàn)隨機(jī)點(diǎn)名小功能

更新時(shí)間：2017年08月17日 09:59:57 作者：蒲小若

這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)隨機(jī)點(diǎn)名小功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

本文實(shí)例為大家分享了js實(shí)現(xiàn)隨機(jī)點(diǎn)名功能的具體代碼，供大家參考，具體內(nèi)容如下

<!DOCTYPE html> 
<html> 
 <head> 
  <meta charset="UTF-8"> 
  <title></title> 
 </head> 
 <body> 
  <div id="name1"></div> 
  <button id="btn">stop</button> 
   
 </body> 
 <script type="text/javascript"> 
  var flag = true; 
  var str = "張三,李四,王五,馬六"; 
  var arr = str.split(","); 
  var interId = setInterval("randName()",100); 
  function randName(){ 
   var rand = Math.floor(Math.random() * arr.length); 
   name1.innerHTML = arr[rand]; 
  }  
  btn.onclick = function (){ 
   if (flag) { 
    btn.innerHTML = "start"; 
    clearInterval(interId); 
    flag = false; 
   } else{ 
     
 
btn.innerHTML = "stop"; 
    interId = setInterval("randName()",100); 
    flag = true; 
   } 
  } 
 </script> 
</html>

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

JavaScript運(yùn)動減速效果實(shí)例分析
這篇文章主要介紹了JavaScript運(yùn)動減速效果,模擬了物體做減速運(yùn)動的效果,以兩個(gè)實(shí)例形式分析了javascript實(shí)現(xiàn)物體做減速運(yùn)動的實(shí)現(xiàn)技巧,涉及javascript動態(tài)操作頁面元素樣式及數(shù)學(xué)運(yùn)算的方法,非常簡潔實(shí)用,需要的朋友可以參考下
2015-08-08
el-table el-table-column表頭嵌套循環(huán)數(shù)據(jù)的示例代碼
本文介紹了使用兩個(gè)數(shù)組來實(shí)現(xiàn)el-table中表頭的嵌套循環(huán),一個(gè)數(shù)組用于循環(huán)表格數(shù)據(jù),另一個(gè)用于循環(huán)表頭,幫助讀者更好地理解和應(yīng)用表頭嵌套功能,感興趣的朋友跟隨小編一起看看吧
2024-09-09
JavaScript純前端實(shí)現(xiàn)在線GIF壓縮
這篇文章主要為大家詳細(xì)介紹了如何利用JavaScript純前端實(shí)現(xiàn)在線GIF壓縮工具,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下
2024-03-03
JavaScript設(shè)計(jì)模式之代理模式實(shí)例分析
這篇文章主要介紹了JavaScript設(shè)計(jì)模式之代理模式,簡單描述了代理模式的概念、原理并結(jié)合實(shí)例形式分析了javascript代理模式的相關(guān)實(shí)現(xiàn)與使用技巧,需要的朋友可以參考下
2019-01-01
使用PDFJS遇到的坑及解決辦法記錄
PDF.js是由Mozilla支持的基于HTML5的PDF查看器,可以在web上解析和呈現(xiàn)PDF文件,它支持內(nèi)容檢索、頁面跳轉(zhuǎn)、文件打印等功能,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下
2024-09-09
微信小程序?qū)崿F(xiàn)tab組件切換動畫
tab相對而言用的還是比較多的,但是用起來并沒有難,下面這篇文章主要給大家介紹了關(guān)于微信小程序全局配置之tab的相關(guān)資料,文中通過圖文以及示例代碼介紹的非常詳細(xì),需要的朋友可以參考下
2022-10-10
javascript中in運(yùn)算符用法分析
這篇文章主要介紹了javascript中in運(yùn)算符用法,實(shí)例分析了in運(yùn)算符的相關(guān)使用技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下
2015-04-04
淺談webpack devtool里的7種SourceMap模式
這篇文章主要介紹了淺談webpack devtool里的7種SourceMap模式，主要介紹了這7種模式的使用和打包編譯后的結(jié)果的不同，非常具有實(shí)用價(jià)值，有興趣的可以了解一下
2019-01-01
Js判斷H5上下滑動方向及滑動到頂部和底部判斷的示例代碼
下面小編就為大家分享一篇Js判斷H5上下滑動方向及滑動到頂部和底部判斷的示例代碼，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧
2017-11-11
javascript中的注釋使用與注意事項(xiàng)小結(jié)
在javascript中有兩種注釋方式,單行注釋與多行注釋。
2011-09-09