Javascript技巧收集

1. switch
ECMAScript 和 Java 中的 switch 语句有两点不同。在 ECMAScript 中，switch 语句可以用于字符串，而且能用不是常量的值说明情况
2. 三种消息框
alert("hello world!");
confirm("good!");
prompt("a", "heloo");
3. for in
var x
var mycars = new Array()
mycars[0] = "Saab"
mycars[1] = "Volvo"
mycars[2] = "BMW"

for (x in mycars)
{
document.write(mycars[x] + "<br />")
}
4. try catch
try
  {
  adddlert("Welcome guest!")
  }
catch(err)
  {
  txt="此页面存在一个错误。\n\n"
  txt+="错误描述: " + err.description + "\n\n"
  txt+="点击OK继续。\n\n"
  alert(txt)
  }
5. throw
var x=prompt("Enter a number between 0 and 10:","")
try
{
if(x>10)
throw "Err1"
else if(x<0)
throw "Err2"
}
catch(er)
{
if(er=="Err1")
alert("Error! The value is too high")
if(er == "Err2")
alert("Error! The value is too low")
}
6. 时间
6.1 时钟
<script type="text/javascript">
function startTime()
{
var today=new Date()
var h=today.getHours()
var m=today.getMinutes()
var s=today.getSeconds()
// add a zero in front of numbers<10

m=checkTime(m)
s=checkTime(s)
document.getElementById('txt').innerHTML=h+":"+m+":"+s
t=setTimeout('startTime()',500)
}

function checkTime(i)
{
if (i<10)
  {i="0" + i}
  return i
}
</script>
6.2 年
<script type="text/javascript">

var minutes = 1000*60
var hours = minutes*60
var days = hours*24
var years = days*365
var d = new Date()
var t = d.getTime()
var y = t/years

document.write("It's been: " + y + " years since 1970/01/01!")

</script>
7. 数组
7.1 声明和赋值
var mycars=new Array()
mycars[0]="Saab"
mycars[1]="Volvo"
mycars[2]="BMW"

var mycars=new Array(3)
mycars[0]="Saab"
mycars[1]="Volvo"
mycars[2]="BMW"

var mycars=new Array("Saab","Volvo","BMW")
7.2 排序

数字排序必须提供一个函数，如下的sortNumber
<script type="text/javascript">

function sortNumber(a, b)
{
return a - b
}

var arr = new Array(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"

document.write(arr + "<br />")
document.write(arr.sort(sortNumber))

</script>
8. Boolean 对象
初始化false，其他全是true
var myBoolean=new Boolean()
var myBoolean=new Boolean(0)
var myBoolean=new Boolean(null)
var myBoolean=new Boolean("")
var myBoolean=new Boolean(false)
var myBoolean=new Boolean(NaN)
9. Math对象
Math 对象提供多种算数值类型和函数。无需在使用这个对象之前对它进行定义。
10. RegExp 对象(配合split()等函数使用)
var patt1=new RegExp("e");
3 个方法：test()、exec() 以及 compile()
test() 方法检索字符串中的指定值。返回值是 true 或 false。
exec() 方法检索字符串中的指定值。返回值是被找到的值。如果没有发现匹配，则返回 null。
compile() 方法用于改变 RegExp。

11.HTML DOM
HTML DOM 是 W3C 标准（是 HTML 文档对象模型的英文缩写，Document Object Model for HTML）。

12.Navigator 对象
avaScript Navigator 对象包含了有关访问者浏览器的所有信息。
我们需要清楚的是，JavaScript 在 IE6、IE5 和 IE4 中的获得的版本号是相同的。
<script type="text/javascript">
var x = navigator;
document.write("CodeName=" + x.appCodeName);
document.write("<br />");
document.write("MinorVersion=" + x.appMinorVersion);
document.write("<br />");
document.write("Name=" + x.appName);
document.write("<br />");
document.write("Version=" + x.appVersion);
document.write("<br />");
document.write("CookieEnabled=" + x.cookieEnabled);
document.write("<br />");
document.write("CPUClass=" + x.cpuClass);
document.write("<br />");
document.write("OnLine=" + x.onLine);
document.write("<br />");
document.write("Platform=" + x.platform);
document.write("<br />");
document.write("UA=" + x.userAgent);
document.write("<br />");
document.write("BrowserLanguage=" + x.browserLanguage);
document.write("<br />");
document.write("SystemLanguage=" + x.systemLanguage);
document.write("<br />");
document.write("UserLanguage=" + x.userLanguage);
</script>

<script type="text/javascript">
function detectBrowser()
{
var browser=navigator.appName
var b_version=navigator.appVersion
var version=parseFloat(b_version)
if ((browser=="Netscape"||browser=="Microsoft Internet Explorer") && (version>=4))
  {alert("您的浏览器够先进了！")}
else
  {alert("是时候升级您的浏览器了！")}
}
</script>




12. cookie
cookie 是存储于访问者的计算机中的变量。
三个函数:设置，读取，检查
<script type="text/javascript">
function setCookie(c_name,value,expiredays)
{
var exdate=new Date()
exdate.setDate(exdate.getDate()+expiredays)
document.cookie=c_name+ "=" +escape(value)+
((expiredays==null) ? "" : ";expires="+exdate.toGMTString())
}

function getCookie(c_name)
{
if (document.cookie.length>0)
  {
  c_start=document.cookie.indexOf(c_name + "=")
  if (c_start!=-1)
    {
    c_start=c_start + c_name.length+1
    c_end=document.cookie.indexOf(";",c_start)
    if (c_end==-1) c_end=document.cookie.length
    return unescape(document.cookie.substring(c_start,c_end))
    }
  }
return ""
}

function checkCookie(c_name)
{
username=getCookie(c_name)
if (username!=null && username!="")
  {alert('Welcome again '+username+'!')}
else
  {
  username=prompt('Please enter your name:',"")
  if (username!=null && username!="")
    {
    setCookie('username',username,365)
    }
  }
}
</script>
13. JavaScript 表单验证
被 JavaScript 验证的这些典型的表单数据有：
    * 用户是否已填写表单中的必填项目？
    * 用户输入的邮件地址是否合法？
    * 用户是否已输入合法的日期？
    * 用户是否在数据域 (numeric field) 中输入了文本？
13.1 用户是否已填写表单中的必填项目？
function validate_required(field,alerttxt)
{
    with(field)
    {
        if(value==null||value=="")
            {
                alert(alerttxt);
                return false
        }
        else{
            return true
        }
    }
}
13.2 用户输入的邮件地址是否合法？
输入的数据必须包含 @ 符号和点号(.)。同时，@ 不可以是邮件地址的首字符，并且 @ 之后需有至少一个点号
function validate_email(field,alerttxt)
{
    with (field)
    {
        apos=value.indexOf("@")
        dotpos=value.lastIndexOf(".")
        if (apos<1||dotpos-apos<2)
        {
            alert(alerttxt);
            return false
        }
        else {
            return true
        }
    }
}
13.3 验证调用
function validate_form(thisform)
{
    with (thisform)
    {
        if (validate_email(email,"Not a valid e-mail address!")==false)
        {
        email.focus();
        return false
        }
    }
}
14. JavaScript 动画
窍门是：使用 JavaScript 通过不同的事件来切换不同的图像。
15. JavaScript 图像地图
<img src="eg_planets.gif" width="" height="" usemap="#planetmap"/>
<map id ="planetmap" name="planetmap">
<area shape ="rect" coords ="0,0,82,126" onMouseOver="writeText('a1')" href ="a1.html" target ="_blank" alt="Sun" />
</map>
//

if shape="rect" then
coords="left,top,right,bottom"

if shape="circ" then
coords="centerx,centery,radius"

if shape="poly" then
coords="x1,y1,x2,y2,..,xn,yn"
<<<
16. JavaScript 计时
setTimeout()
    var t=setTimeout("javascript语句",毫秒)
//setTimeout() 方法会返回某个值。在上面的语句中，值被储存在名为 t 的变量中。假如你希望取消这个 setTimeout()，你可以使用这个变量名来指定它。

clearTimeout(t)
//t是setTimeout()的返回值

<script type="text/javascript">
var c=0;
var t;
function timedCount()
{
    document.getElementById("show_times").value = c+"";    //似乎不能传递id进来

    c=c+1;
    t=setTimeout("timedCount()",1*1000);    //递归

    if(c == 5){
        clearTimeout(t);    //停掉循环

    }
}
</script>
17. 创建你自己的 JavaScript 对象
<script type="text/javascript">
function person(firstName, age){    //构造函数

    this.name=firstName;
    this.age=age;
    this.newName=newName;    //添加方法,必须实现之，参数可省略

}
function newName(new_name){    //方法实现

    this.name=new_name;
}
var jack=new person("jack", 25);    //创建新对象

alert(jack.name);    //测试新对象

jack.newName("Hubert");
alert(jack.name);
</script>
18. 标签内容
innerHTML
<span id="info">abcdef</span>
document.getElementById(info).innerHTML="aaaaaaaaaaaaaaa";