1 javascript语法基本要素：
标识符 关键字 数据类型 变量 注释 运算符和表达式 语句
for(var i=1;i<=9;i++){ //console.log(i); for(var j=1;j<=i;j++){ document.write(i+"*"+j+"="+i*j+" "); } document.write("<br/>"); }
var i=30; switch(i){ case 10: document.write(i); break; case 20: document.write(i); break; default: alert(i); break; }
var unsorted = [1,2,15,12,65]; for (var i = 0; i < unsorted.length; i++){ for (var j = i; j < unsorted.length; j++){ if (unsorted[i] > unsorted[j]) { int temp = unsorted[i]; unsorted[i] = unsorted[j]; unsorted[j] = temp; } } } for(var a=0;a<unsorted.length;a++){ document.writeln(unsorted[a]); }
2 javascript本地对象：
Array对象：使用单独的变量名存储一系列的值，利用索引来区分它们。
var sub = ["html","css","javascript"]; //join() document.write(sub.join()+"<br/>"); //sort() sub.sort(); document.write(sub.sort()+"<br/>"); //concat() var sub2 = ["chinese","english","math"] var subresult = sub.concat(sub2); document.write(subresult+"<br/>"); //slice() 0表示起始位置 2两个元素 document.write(subresult.slice(0,2)); //其它数组对象的方法 toString() reverse() splice() push() pop() unshift() shift()
Date对象：获取日期和时间
//声明一个当前时间 var myDate = new Date(); //日期to方法组 toString toTimeString toDateString toGMTString toUTCString toLocalString toLocalTimeString toLocalDateString document.write(myDate.toDateString()); //日期get方法组 getDate getDay getMonth getFullYear getYear getHours getMinutes getSeconds getMilliseconds getTime //日期set方法组 setDate setMonth setFullYear setYear setHours setMinutes setSeconds setMilliseconds setTime
String对象：unicode字符系列
//String属性 var str = "hello world"; document.writeln(str.length); //String的方法: //charAt indexOf lastIndexOf substr substring match replace search split //charCodeAt concat fromCharCode loacleCompare slice document.writeln(str.charAt(0)); document.writeln(str.indexOf("o")); document.writeln(str.lastIndexOf('o'));
Global对象:它是预定义对象，可以访问其它预定义的对象函数和属性，它的所有成员都是静态的。
document.write(isNaN(123));//非数字检测 var x= 10; document.write(eval("x+17"));//计算字符串 //parseFloat parseInt 字符串转换 //解码某个编码url decodeURI 字符串编码encodeURI
Math对象
document.write("数学圆周率:"+Math.PI+"自然对数："+Math.E);
document.write("2的自然对数："+Math.LN2);
document.write("10的自然对数："+Math.LN10);
document.write("返回2为底的e的对数："+Math.LOG2E);
document.write("返回10为底的e的对数："+Math.LOG10E);
document.write(Math.SQRT2);//返回2的平方根
document.write(Math.round(15.6));//四舍五入 //向上取整 ceil floor向下取整 max最高值 min最低值 random随机数 //sqrt某数的平方根 abs绝对值 pow(x,y)x的y次幂 exp(x) x的指数 log(x)自然对数底为e sin cos asin acos tan
Function对象:
RegExp对象:正则表达式，用一个特殊字符串去验证另一个字符串的合法性。
3 javascript宿主对象：
BOM
window对象时顶层对象模型，代表一个浏览器窗口或者一个框架。window对象是全局对象。
//alert() var name = window.prompt("请输入你的名字：",""); if(name!=null&&name!=""){ document.write("hello"+name); } var r = confirm("是否关闭浏览器"); if(r==true){ window.close(); } window.open("http://www.sina.com"); window.open("http://www.sina.com"); //setInterval clearInterval setTimeout clearTimeout //scrollBy 按指定像素值滚动内容 scrollTo把内容滚动到指定坐标 blur focus print
//clsed name opener parent self top status window screenX screenY screenLeft screenTop //document history location navigator screen frames
navigator对象有浏览器中脚本运行时引擎自动创建，包含有关客户机浏览器的信息。
screen对象同样是引擎自动创建，包含浏览器显示屏幕的有关信息。
history对象由一系列url组成，它们是用户在一个浏览器窗口内已访问的url
DOM：文档对象模型采用层次化树形结构，以树节点的方式组织文档中的内容。应用dom可以对文档节点进行访问和修改。
//1 all集合属性仅有ie浏览器具有 if(document.all){ alert("ie浏览器"); }else{ alert("其它浏览器"); } // 2title属性生成网页标题 document.title = "dom文档对象模型"; // 3body访问body元素 var i = document.body.offsetWidth; alert(i); // 4domain cookie referer URL
//1获取文档节点 getElementById getElementsByName getElementsByTagName //2输出html内容 document.write("<hr/>");
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>获取元素</title>
</head>
<body>
<input type="text" id="text1" name="txtName" value="1"/>
<script>
var i = document.getElementById("text1");
alert(i.value);
</script>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>获取元素修改元素</title>
</head>
<body>
<a href="#">hello world</a>
<a href="#" id="tmall">淘宝</a>
<script>
//获取页面元素的内容
var objJP = document.getElementsByTagName("a");
alert(objJP[0].innerText);
alert(objJP[0].innerHTML);
//修改html的元素内容
document.getElementById("tmall").innerHTML = "helo";
</script>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>获取元素修改元素</title>
</head>
<body>
<a href="#">hello world</a>
<a href="#" id="tmall">淘宝</a>
<a href="#">京东</a>
<script>
document.getElementById("tmall").style.color = "orange";
var _a = document.getElementsByTagName("a");
for(var i=0;i<_a.length;i++){
_a[i].style.textDecoration = 'none';
}
</script>
</body>
</html>
scrollLeft水平滚动距离
scrollTop垂直滚动距离
clientWidth网页可见区域宽度
clientHeight网页可见区域高度
4 自定义对象
5 事件驱动编程