JS复习总结

3种输出效果
在html中：
1.

2.

3.

JS：
document.write(“hello”);
alert(“world”);
console.log(“lalala”);

5种数据类型undefined null string number boolean
测试类型：
var a=1;
alert(typeof(a));
弹框运算：
var b=parseInt(prompt(“请输入数字”)) ;
alert(a+b);
数组类型增强for循环
//b是下标，a是数组
var a=[1,2,3,4,5];
for(var b in a){
document.write(a[b]+"   “);
}
函数三种方式
1.无参
function test(){
document.write(“hello
”);
//br 换行
}
test()
2.有参
function test2(a,b){
document.writeln(a+b+”
");
}
test2(1,2);
3.带返回值
function test3(a,b){
return a*b;
}
var x=test3(2,5);
document.writeln(x);
事件 匿名函数
1.点击事件

aa

点击确定，生成内容 “你好” 第一种方式： //只有一个事件时更方便，只用一个函数 html: 确定

JS:
function test(){
var one=document.getElementById(‘one’);//获取对象ID地址
one.innerHTML=“你好”;
}//再给对象赋值

第二种方式：
不要onclick，用id来获取
html:
确定

JS：
window.οnlοad=function(){
var sure=document.getElementById(‘sure’);//按钮的id
var one=document.getElementById(‘one’);//对象ID

1个事件的函数：
sure.οnclick=function(){
one.innerHTML=“你好”;
}

//多个事件操作时用第二种
}
2.鼠标事件
鼠标放上变样式，离开后恢复
html:

王旭
JS：
匿名函数中：
window.οnlοad=function(){
var wx=document.getElementById(‘wx’);
wx.οnmοuseοver=function(){
//鼠标放上字体变大，下划线消失
//wx.style.fontSize=“30px”;
//wx.style.textDecoration=“none”;
//样式可以在网页中用css改

	wx.className="wx";
}

//鼠标离开恢复原来样式
wx.οnmοuseοut=function(){
//wx.style.fontSize=“16px”;
//wx.style.textDecoration=“underline”;
//同上，没有消除样式，只能恢复设置与原来一样的样式

	wx.className="wx2";
}

}
3.回车事件
document.οnkeydοwn=test4;
function test4(){
if(event.keyCode===13){
alert(“你按下了回车键”);
}
}
4.改变事件
html:
姓名：

JS：
var username=document.getElementById(‘username’);
内容改变就会有窗口
username.οnchange=function(){
alert(username.value);
}
5.焦点事件
html:
姓名：

JS：
var username=document.getElementById(‘username’);
//点击进去背景变红
username.οnfοcus=function(){
username.style.backgroundColor="#f00";
}
点出来背景变绿
username.οnblur=function(){
username.style.backgroundColor="#0f0";
}
节点访问
window.οnlοad=function(){
var wx=document.getElementById(‘wx’);
var
//设计节点
body=document.getElementsByTagName(‘body’)[0];
//在body中寻找
alert(wx.previousElementSibling.innerHTML);
alert(wx.nextElementSibling.innerHTML);
alert(body.firstElementChild.innerHTML);
alert(body.lastElementChild.innerHTML);
}
节点操作
添加节点

添加节点 JS： var aaa,a;

function addNode(){
aaa=document.getElementById(‘aaa’);
//创建a
a=document.createElement(‘a’);
a.innerHTML=“周洋”;
a.style.fontSize=“30px”;
//把a放到aaa中
aaa.appendChild(a);
}
删除节点

var aaa,a; 删除节点 function delNode(){ aaa.removeChild(a); }

window操作
关闭

在匿名函数中：
var guanBi=document.getElementById(‘guanBi’);
guanBi.οnclick=function(){
close();
}
删除
JS:
function del(){
if(confirm(“是否删除？”)){
alert(“删除”);
}else{
alert(“取消删除”);
}
}
打开
JS:
daKai=document.getElementById(‘daKai’);
daKai.οnclick=function(){
// 直接打开窗口
open(“点名系统.html”);
// 设计窗口格式
open(“点名系统.html”,"",“width=500,height=500”);
// 设计窗口位置
open(“点名系统.html”,"",“width=500,height=500,top=300,left=800”);
}
document操作
性别：男
女

JS：
function getSex(){
var sex=document.getElementsByName(‘sex’);
//第一种方式：
alert(sex[0].value+" "+sex[1].value);
//第二种形式，选项多了可以用循环
for(var i=0;i<sex.length;i++){
alert(sex[i].value);
}
}

JS：
function getContent(){
var content=document.getElementsByTagName(‘button’);
//得出所有标签的内容
for(var i=0;i<content.length;i++){
alert(content[i].innerHTML);
}
}
location
刷新

function flush(){
location.reload();
}
跳转
function go1(){
location.href="";
}
function go2(){
window.location="";
}
替换
function flush(){
location.relace("");
}
时间
window.οnlοad=function(){
a=setInterval(time,1000);
function time(){
var d=new Date();
var year=d.getFullYear();
var month=d.getMonth()+1;
var day=d.getDate();
var hour=d.getHours();
var minute=d.getMinutes();
var second=d.getSeconds();
var one=document.getElementById(‘one’);
one.innerHTML=year+"-"+month+"-"+day+" “+hour+”:"+minute+":"+second;
}
}
function stop(){
clearInterval(a);
}
随机数
Math.random()
0-1之间随机数
function random2(){
var a=Math.random;
alert(a);
}

2-99之间随机整数，向下转型
function random2(){
var a=Math.floor(Math.random()*98+2);
alert(a);
}