script常用类型和事件
常用的类型：
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("起始位置","结束位置")
事件：（事件源，事件数据，事件处理程序）
一、最常用的鼠标事件
onclick：当鼠标单击的时候，要执行的代码。
ondblclick：当鼠标双击的时候，要执行的代码。
onmouseover:当鼠标移动到元素上时，要执行的代码。
onmouseout:当鼠标从元素上离开时，要执行的代码。
<示例>光棒效果。
onmousedown:
onmouseup:
<示例>使用这两个事件，用span做出一个模拟的按钮。
<script> function dodown(dd) { dd.style.borderColor="black"; dd.style.backgroundColor="green"; dd.style.margin="10px 0px 0px 10px" } function doup(dd) { dd.style.borderColor="red"; dd.style.backgroundColor="#9c9"; dd.style.margin="0px 0px 0px 0px" } </script> </head> <body> <span style="display:inline-block;padding:5px;background:#9C9;border:3px solid red" onmousedown="dodown(this)" onmouseup="doup(this)"> click me</span> </body>
点击后的效果：
案例 光棒效果
<body> <table width="300" border="1"> <tr style="background-color:#F00" onmouseover="show(this)" onmouseout="done(this)"> <td > </td> <td> </td> <td> </td> </tr> <tr onmouseover="show(this)" onmouseout="done(this)"> <td> </td> <td> </td> <td> </td> </tr> <tr style="background-color:#F00" onmouseover="show(this)" onmouseout="done(this)"> <td> </td> <td> </td> <td> </td> </tr> <tr onmouseover="show(this)" onmouseout="done(this)"> <td> </td> <td> </td> <td> </td> </tr> <tr style="background-color:#F00" onmouseover="show(this)" onmouseout="done(this)"> <td> </td> <td> </td> <td> </td> </tr> </table> </body> </html> <script language="javascript"> var s="white" function show(dd) { s=dd.style.backgroundColor; dd.style.backgroundColor="blue" } function done(dd) { dd.style.backgroundColor=s } </script>
案例：刮刮乐
<style type="text/css"> .wai { border:2px ridge #F00; width:128px;height:128px;margin:10px; float:left; position:relative; left:70px } .nei { background-color:#F00; width:128px;height:128px} #btn {float:left; width:100%; text-align:center; } #main { width:900px; margin:auto; } </style> <script language="javascript"> var num=0; function show(dd) { dd.style.display="none"; var s=dd.parentNode.getAttribute("haha");/******上一层的查询*****/ if(s=="1") {alert("恭喜中奖"); window.location.reload();/*******中奖自动重置******/ } num+=1;/** 10次都没有自动重置***/ if(num==10&&s!=1) {alert("再来10块钱！"); window.location.reload(); } } </script> </head> <body> <div id="main"> <div class="wai" ><div class="nei" onclick="show(this)"></div></div> <div class="wai"><div class="nei" onclick="show(this)"></div></div> <div class="wai"><div class="nei" onclick="show(this)"></div></div> <div class="wai"><div class="nei" onclick="show(this)"></div></div> <div class="wai"><div class="nei" onclick="show(this)"></div></div> <div class="wai"><div class="nei" onclick="show(this)"></div></div> <div class="wai"><div class="nei" onclick="show(this)"></div></div> <div class="wai"><div class="nei" onclick="show(this)"></div></div> <div class="wai"><div class="nei" onclick="show(this)"></div></div> <div class="wai"><div class="nei" onclick="show(this)"></div></div> <div id="btn" align="center"><input id="hh" type="button" onclick="huanyuan()"value="重置"></div> </div> </body> </html> <script> var divs=document.getElementsByTagName("div"); for(var i=0;i<divs.length;i++) { if(divs[i].className=="wai") { 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"); } } } function huanyuan() {window.location.reload()} </script>
手机抽奖
<style> .no1 { margin:20px; border:5px dashed #FF0000; width:100% } #main {width:400px; margin:auto; text-align:center; font-family:华文行楷; font-size:50px } #begin {margin:20px; background:#03F; border:2px solid red; padding:5px } </style> </head> <body> <div id="main"> <div id="show" class="no1">XXXXXXXXXXX</div> <span id="begin" onclick="dobegin()">开始</span> </div> </body> </html> <script> var a=new Array(); a[0]=17685602035; a[1]=13853350543; a[2]=15344564298; a[3]=18344564676; a[4]=13344564043; a[5]=15644564545; a[6]=15534456440; a[7]=15734452222; a[8]=12344564111; a[9]=12344564333; var timeid; function doshow() { var n=Math.round (Math.random()*10000000)%10; var s=a[n]; var dd=document.getElementById("show"); dd.innerHTML = s; timeid=window.setTimeout("doshow()","50");/*延时**/ } function dobegin() { var gg=document.getElementById("begin") if(gg.innerHTML=="开始") { doshow(); gg.innerHTML="停止"; } else {gg.innerHTML="开始"; window.clearTimeout(timeid)/**定义的变量来代替doshow（）**/ document.getElementById("show").innerHTML="17685602035"/*作弊*/ } } </script>
