HTML7常用的类型刮刮乐 光棒效果
常用的类型：
1.数学：
Math.ceil()：天花板数
Math.floor()：地板数
Math.round()：四舍五入取整数
Math.random()：生成0-1之间的随机数
2.日期时间：
var s = new Date();
var s = new Date(1999,7,23);
函数：
getFullYear():
getMonth()：
getDate()：获取日
getHours()
getMinutes()
getSeconds()
getDay()：获取星期
setFullYear(year,month,day)
setHours(hour,minute,second,ms)
toLocaleDateString()：转化为本地的日期时间格式字符串
3.字符串
length：字符串的长度
toLowerCase()
toUpperCase()
//压缩字符串中的两端空格。
function Trim(m){
while((m.length>0)&&(m.charAt(0)==' '))
m = m.substring(1, m.length);
while((m.length>0)&&(m.charAt(m.length-1)==' '))
m = m.substring(0, m.length-1);
return m;
}
indexOf("子串")：第一次出现的位置
lastIndexOf("子串")：最后一次出现的位置
以上两个方法，如果父串中不包含子串，则返回-1
substr("起始位置","截取长度")
substring("起始位置","结束位置")
![wps5BC1.tmp[8]](http://images0.cnblogs.com/blog/701067/201503/021921052388164.jpg "wps5BC1.tmp[8]")
<title>无标题文档</title>
<style type="text/css">
.cc{
width:120px;
height:120px;
background-color:rgb(102,255,102);
}
.dd{width:120px;
height:120px;
border:1px solid blue;
float:left;
margin:10px;}
</style>
<script language="javascript">
function hidediv(dd)
{
dd.style.display="none"
var s=dd.parentNode.getAttribute("haha");
if(s=="1")
{
alert("恭喜你中大奖");
window.location.reload();
}
}
</script>
</head>
<body>
<div class="dd"><div class="cc" onclick="hidediv(this)"></div></div>
<div class="dd"><div class="cc" onclick="hidediv(this)"></div></div>
<div class="dd"><div class="cc" onclick="hidediv(this)"></div></div>
<div class="dd"><div class="cc" onclick="hidediv(this)"></div></div>
<div class="dd"><div class="cc" onclick="hidediv(this)"></div></div>
<div class="dd"><div class="cc" onclick="hidediv(this)"></div></div>
<div class="dd"><div class="cc" onclick="hidediv(this)"></div></div>
<div class="dd"><div class="cc" onclick="hidediv(this)"></div></div>
<div class="dd"><div class="cc" onclick="hidediv(this)"></div></div>
<div class="dd"><div class="cc" onclick="hidediv(this)"></div></div>
</body>
</html>
<script language="javascript">
var divs=document.getElementsByTagName("div")
for (var i=0;i<divs.length;i++)
{
if (divs[i].className=="dd")
{
var n=(Math.round(Math.random()*100000000)%10)+1;
var path="images/"+n+".png";
divs[i].style.backgroundImage="url("+path+")"
if(n == 1)
{
divs[i].setAttribute("haha","1");
}
}
}
</script>
![wps5BD1.tmp[9]](http://images0.cnblogs.com/blog/701067/201503/021921071455848.jpg "wps5BD1.tmp[9]")
<title>无标题文档</title>
<script language="javascript">
function doup(dd){
dd.style.borderColor="gray";
dd.style.backgroundColor="#009900";
dd.style.margin="0px 0px 0px 0px";}
function dodown(dd){
dd.style.borderColor = "blue";
dd.style.backgroundColor="green";
dd.style.margin="1px 0px 0px 1px"
}
</script>
</head>
<body>
<span style="display:inline-block;padding:5px; background-color:green; border:3px solid gray; cursor:default " onmousedown="dodown(this)" onmouseup="doup(this)" >点开</span>
</body>
</html>
![wps5BE2.tmp[9]](http://images0.cnblogs.com/blog/701067/201503/021921087239332.jpg "wps5BE2.tmp[9]")
<title>无标题文档</title>
<script language="javascript">
var bg="white"
function doover(tt)
{
bg = tt.style.backgroundColor;
tt.style.backgroundColor="yellow"
}
function doout(tt)
{
tt.style.backgroundColor=bg}
</script>
</head>
<body>
<table width="100%" border="1" cellpadding="0" cellspacing="0">
<tr style=" background-color:#ffccff" onmouseover="doover(this)" onmouseout="doout(this)">
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr style=" background-color:rgb(51,255,153)" onmouseover="doover(this)" onmouseout="doout(this)">
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr style=" background-color:navy" onmouseover="doover(this)" onmouseout="doout(this)">
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr style=" background-color:rgb(204,255,153)" onmouseover="doover(this)" onmouseout="doout(this)">
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr style=" background-color:blue" onmouseover="doover(this)" onmouseout="doout(this)">
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</body>
</html>
