JavaScript_2的笔记
复选框的全选和取消全选操作代码
<!doctype html>
<html>
<head>
<title>复选框的全选和取消全选操作代码</title>
</head>
<body>
<script type="text/javascript">
window.onload = function(){
var aihao = document.getElementsByName("aihao")
var firclk = document.getElementById("firstclk");
firclk.onclick = function(){
for(var i =0 ; i < aihao.length;i++){
aihao[i].checked = firclk.checked;
}
}
var all = aihao.length;
for(var i = 0; i < aihao.length;i++){
aihao[i].onclick = function(){
var count = 0;
for(var i = 0; i < aihao.length;i++){
if(aihao[i].checked){
count++;
}
}
firclk.checked = (all == count);
}
}
}
</script>
<input type ="checkbox" id="firstclk"/><br>
<input type = "checkbox" name ="aihao" value="smoke"/>抽烟<br>
<input type = "checkbox" name ="aihao" value="drink"/>喝酒<br>
<input type = "checkbox" name ="aihao" value="tt"/>烫头<br>
</body>
</html>
选择条
<!doctype html>
<html>
<head>
<title>选择条</title>
</head>
<body>
<script type="text/javascript">
</script>
<select onchange = "alert(this.value)">
<option value ="" >请选择</option>
<option value ="hb" >河北省</option>
<option value ="hn" >河南省</option>
<option value ="hb" >湖北省</option>
</select>
</body>
</html>
Array数组
<!doctype html>
<html>
<head>
<title>Array数组</title>
</style>
</head>
<body >
<script type = "text/javascript">
var arr = [];
var arr2 = [11,2,3,4,32,5,9]
alert(arr.length)
alert(arr2.length)
arr2[9] = text
for(var i = 0; i< arr2.length;i++){
document.write(arr2[i] +"<br>");
}
var a = new Array();//0
var a1 = new Array(3);//3
var a2 = new Array(3,2);//默认元素3，2
document.write("<br>");
var a = [1,2,3,4];
var str = a.join("-");
alert(str);//1-2-3-4
a.push(10);//在数组的末尾添加一个元素（数组长度+1）
alert(a.join("-"))
var endElt = a.pop();//将数组末尾的元素弹出（数组长度-1）
alert(endElt);
alert(a.join("-"))
//JS中的数组可以自动模拟栈数据接口。后进先出，先进后出原则
a.reverse();
alert(a.join("-"));
</script>
</body>
</html>
BOM编程
<!doctype html>
<html>
<head>
<title>BOM编程</title>
</head>
<body >
<script type = "text/javascript">
/*
在BOM编程中，window对象是顶级对象，代表游览器窗口
window在open和close方法，可以开启窗口和关闭窗口
*/
function del(){
// var ok = window.confirm("确认删除数据？");
// if(ok){
// alert("delete date ...")
// };
if(window.confirm("确认删除数据？")){
alert("delete date ...")
}
}
</script>
<input type="button" value ="弹出消息框" onclick="window.alert('消息框')"/>
<input type = "button" value = "删除确认框" onclick="del();"/>
<input type = "button" value = "新窗口" onclick ="window.open('http://www.baidu.com');">
<input type = "button" value = "当前窗口" onclick ="window.open('http://www.baidu.com');,'-self';">
<input type = "button" value = "新窗口" onclick ="window.open('http://www.baidu.com');'-blank';">
<input type = "button" value = "父窗口" onclick ="window.open('http://www.baidu.com');'-parent';">
<input type = "button" value = "顶级窗口" onclick ="window.open('http://www.baidu.com');'_top';">
</body>
</html>
history历史记录，设置游览器地址栏上的URL
<!doctype html>
<html>
<head>
<title>history历史记录，设置游览器地址栏上的URL</title>
</head>
<body >
<script type = "text/javascript">
function goto(){
//var locationgoto = window.location;
//locationgoto.href ="http://www.baidu.com";
//window.location.href = "http://www.baidu.com";
window.location = "http://www.baidu.com";
}
</script>
<a href = "017.html">017页面</a>
<input type = "button" value ="前进" onclick="window.history.go(1)"/>
<input type = "button" value ="百度" onclick="goto()"/>
</body>
</html>
<!--
总结，有哪方法可以通过游览器往服务器发请求？
1.表单form的提交
2.超链接
3.document.location
4.window.location
5.window.open("url")
6.直接在游览器地址栏上输入URL，然后回车
以上所有的请求方式均可以携带数据给服务器，只有通过表单提交的数据才是动态的。
-->
JSON(重要)
<!doctype html>
<html>
<head>
<title>JSON</title>
</head>
<body >
<script type = "text/javascript">
/*
1。什么是JSON，有什么用？
JavaScript Objict Notation,简称JSON。“JavaScript对象标记”(数据交换格式
JSON主要作用是：一种标准的数据交换格式（目前非常流行，90%以上的系统，系统A和系统B交换数据的话，都是采用JSON）
2。 JSON是一种轻量级的数据交换格式。特点是：
体积小，易解析。
3。在世界的开发中有两种数据交换格式。使用最多，其一JSON。另外XML
XML体积较大，解析麻烦，优点是，语法严谨（通常银行相关的系统之间进行数据交换的时候会使用XML）
4。JSON的语法格式
var jsonObj={
“属性名”：“属性值”，
“属性名”：“属性值”，
“属性名”：“属性值”，
“属性名”：“属性值”，
。。。
}；
*/
var studentObj ={
"sno":"110",
"sname":"张三",
"sex":"男"
};
alert(studentObj.sno+","+studentObj.sname+","+studentObj.sex);
document.write("<br>");
var user={
"usercode":110,
"username":"张三",
"sex":true,
"address":{
"city":"北京",
"street":"大兴",
"zipcode":"121212"
}
"hobby":["smoke","drink","tt"]
};
alert(user.name+"居住在"+user.address.city);
</script>
</body>
</html>
<!doctype html>
<html>
<head>
<title>这里也是</title>
</head>
<body >
<script type = "text/javascript">
/*
eval函数的作用是：
将字符串当做一段JS代码解释并执行
*/
window.eval("var i = 100");
alert("i= "+i);
//java连接数据库，查询数据之后，将数据在java程序中拼接成JSON格式的字符串，将//json格式的字符显示到游览器
////也就是说Java响应到游览器上的仅仅是一个“JSON格式的字符串”，还不是json对象
//在JS当中，[]和{}有什么区别？
//[]是数组。
//{}是JSON。
//java中的数组：int[] arr ={1,2,3,4,5};
//JS中的数组: var arr=[1,2,3,4,5];
//JSON: var jsonObj = {"email":"zhangsan@123.com","age":25};
var fromJava = "{\"name\":\"zhangsan\",\"password\":\"123\"}";
window.eval("var jsonObj = " + fromJava);
alert(jsonObj.name+""+jsonObj.password);
var json={
"username":"zhangsan"
};
alert(json.username);
alert(json["username"]);
var data = {
"total":4,
"emps":[
{"empno":7369,"ename":"SMITH","sal":800.0},
{"empno":7777,"ename":"SMITH","sal":900.0},
{"empno":8888,"ename":"SMITH","sal":600.0},
{"empno":9999,"ename":"SMITH","sal":500.0},
]
}
window.onload = function(){
var pathElt = document.getElementById("path");
pathElt.onclick = function(){
var emps = data.emps;
var html = "";
for(var i = 0 ;i < emps.length; i++ ){//这里是+=不是覆盖所有的都走完之后一次性全部给TBODY
var emp = emps[i];
html+="<tr>";
html+="<td>"+emp.empno+"</td>";
html+="<td>"+emp.ename+"</td>";