基于JavaScript实现随机颜色输入框
2016-12-10 11:49
645 查看
废话不多说了额,具体代码如下所示:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> table{width:500px;height:400px;} table td{width:100px;height:50px;} </style> <script> window.onload=function(){ var inps=document.getElementsByTagName('input'); var btn=document.getElementsByTagName("button")[0]; //点击获取table btn.onclick=function(){ var table=document.createElement("table"); var tbody=document.createElement("tbody"); var n=inps[0].value; var m=inps[1].value; for(var i=1;i<=n;i++){ var tr=document.createElement("tr"); //循环时获取颜色值 for(var j=1;j<=m;j++){ var td=document.createElement("td"); tr.appendChild(td); var color="rgb("+parseInt(Math.random()*256)+","+parseInt(Math.random()*256)+"," +parseInt(Math.random()*256)+")"; td.style.backgroundColor=color; } inps[0].value=""; inps[1].value=""; tbody.appendChild(tr); table.appendChild(tbody); document.body.appendChild(table); } }} </script> </head> <body> 行:<input type="text" value=""/> 列:<input type="text" value="" /> <button>获取随机颜色</button> </body> </html>
以上所述是小编给大家介绍的基于JavaScript实现随机颜色输入框,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!
您可能感兴趣的文章:
相关文章推荐
- 基于javascript实现随机颜色变化效果
- 基于JavaScript实现随机颜色输入框
- 基于javascript实现随机颜色变化效果
- 基于JavaScript代码实现随机漂浮图片广告
- 基于JavaScript代码实现随机漂浮图片广告
- javascript小练习实现颜色随机变化
- 【JavaScript】基于H5 canvas实现的画板绘图工具(类似你画我猜)——整合颜色选取、保存图片到本地功能
- 基于JavaScript与css实现网页随机抽奖功能
- 基于JavaScript实现简单的随机抽奖小程序
- JavaScript实现简单生成随机颜色的方法
- JavaScript控制输入框中只能输入中文、数字和英文的方法【基于正则实现】
- 基于JavaScript实现简单的随机抽奖小程序
- 用 javascript 实现随机抽奖 ( 从 1 到 输入值之间任取一个整数值)
- javascript实现基于XML的导航功能
- 用Javascript实现评估用户输入密码的强度
- 用javascript实现改变TEXTAREA滚动条和按钮的颜色,以及怎样让滚动条变得扁平
- 简单的颜色查看页面代码——基于DOM的实现
- javascript实现随机产生数字与字母的组合
- javascript+css实现单击颜色褪去效果
- 利用javascript在asp.net中实现颜色的选择