JavaScript学习笔记---07看书学习总结--01JavaScript基础
1.引入外部js文件
- src方式
<script type="text/javascript" src="loaded.js">
</script>
- 伪URL方式
<input type="button" value="提交" onclick="javascript:alert('hello world')" />
- html文档处理程序引入
<head>
<meta charset="UTF-8">
<script type="text/javascript" >
function hint(){
alert(navigator.appName);
}
</script>
</head>
<body>
<input type="button" value="提交" onclick="hint()" />
</body>
2.屏蔽代码
- 使用注释
<!-- 注释掉的代码-->
- noscript方式
<noscript>这里是不用的代码</noscript>
3.六类基本数据类型
其中Function也是一种数据类型
4.组合类型Array类型，Object类型
- Array类型
<script type="text/javascript" >
var score=[1,2,3,4,5];//隐式申明数组并赋值
var score1=new Array(34,5,6,"hello world",23)//显示申明数组并赋值
</script>
- Object类型
<script type="text/javascript" >
document.bgColor;
</script>
5.运算符
- 空运算符
对应关键字 void - 三元运算符
（表达式）? 表达式1：表达式2；
<script type="text/javascript" >
var a=10;
var b=20;
var show=a>b? a:b;
alert(show);
</script>
- 对象运算符 .运算符，new运算符，delete运算符,（）运算符
<script type="text/javascript" >
var color=document.bgColor;
alert(color);
</script>
- typeof运算符
<script type="text/javascript" >
var color="hello world";
alert(typeof(color));
</script>
6.控制语句
with对象操作语句
连续引用一个对象时，为了省略可以用with把响应对象简化引用
<script type="text/javascript" >
document.write("statement1
");
document.write("statement2
");
document.write("statement3
");
//简化为一下做法
with(document){
write("statement1
");
write("statement2
");
write("statement3
");
}
</script>
7.函数
- 基本格式
<script type="text/javascript" >
function funcName([parameters]){
statements;
[return 表达式];
}
</script>
<script type="text/javascript" >
var fun=new Function();
function docaculate(m,n){
alert(m+n);
}
fun=docaculate;
fun(5,6);
</script>
8.事件的一种写法（this及其属性）
1.事件绑定（注册）
<a href="myself.html" onclick="javascript:this.href='http://www.baidu.com'">跳转</a>
2.浏览器事件onload，onfoucus，onblur,onscroll,onresize）
<script type="text/javascript" >
msg="show somthing to me ";
onload=function (){
alert(msg+"load");
}
/*
οnfοcus=function (){
alert(msg+"focus");
}
οnblur=function (){
alert(msg+"blur");
}
*/
onscroll=function (){
alert(msg+"scroll");
}
onresize=function (){
alert(msg+"resize");
}
</script>
3.html元素事件
在button，链接，表单，图片等html元素上的用户动作
4.IE浏览器扩展事件
9.js如何处理事件
1.匿名函数
<html lang="ch">
<head>
<meta charset="UTF-8">
<script type="text/javascript" >
onload=function(){
var msg="show somthing to me ";
document.myform.mybut.onclick=function(){
alert(msg);
}
/*
document.forms[0].mybut.οnclick=function(){
alert(msg);
}
*/
}
</script>
</head>
<body>
<form action="#" name="myform" method="POST">
<input type="button" name="mybut" value="匿名函数">
</form>
</body>
</html>
2.显示声明
<html lang="ch">
<head>
<meta charset="UTF-8">
<script type="text/javascript" >
function showantoher(){
document.all.myimg.src="dress02.png";
}
function showback(){
document.all.myimg.src="dress01.png";
}
</script>
</head>
<body>
<img src="dress01.png" name="myimg"/>
<script type="text/javascript" >
document.all.myimg.onmouseover=showantoher;
document.all.myimg.onmouseout=showback;
</script>
</body>
</html>
3.手动触发
<html lang="ch">
<head>
<meta charset="UTF-8">
<script type="text/javascript" >
function tiggle(){
alert("we click the submit")
}
</script>
</head>
<body>
<form action="#" name="myform" method="POST" onsubmit="tiggle()">
<input type="button" name="mybut" value="匿名函数1" onclick="submit()"><br>
<input type="button" name="mybut." value="匿名函数2" onclick="document.all.myform.submit()">
</form>
</body>
</html>
这几个案例都使用了对象方式来调用具体的控件