最近百忙之中,抽点周末时间温习下JavaScript
要点一: 概念解释
JavaScript 是世界上最流行的编程语言
可用于 HTML 和 web,更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备
要点二: 如何用
HTML 中的脚本必须位于 <script> 与 </script> 标签之间
脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中
<!DOCTYPE html>
<html>
<body>
.
.
<script>
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph</p>");
</script>
.
.
</body>
</html>
要点三: 简单例子,HTML输出
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<script>
document.write("<p>My First JavaScript</p>");
</script>
</body>
</html>
要点四: JavaScript 语句,代码,代码块,大小写, 空格, 折行
语句
document.getElementById("demo").innerHTML="Hello World";
代码
document.getElementById("demo").innerHTML="Hello World";
document.getElementById("myDIV").innerHTML="How are you?";
顺序执行!!!
代码块
function myFunction()
{
document.getElementById("demo").innerHTML="Hello World";
document.getElementById("myDIV").innerHTML="How are you?";
}
大小写: 敏感
空格: 会自动忽略
折行
document.write("Hello \
World!");
此为正确的折行
![大笑](http://static.blog.csdn.net/xheditor/xheditor_emot/default/laugh.gif)
要点五: 注释
分类: 单行注释 使用符号 // ; 多行注释 /* */ ;
作用: 提高代码可读性; 阻止代码运行;
要点六: 变量
定义: 变量是存储信息的容器
变量的声明语法:
- 变量必须以字母开头
- 变量也能以 $ 和 _ 符号开头(不过我们不推荐这么做)
- 变量名称对大小写敏感(y 和 Y 是不同的变量)
数字(就两种,带小数点与不带小数点的,除此也可以使用科学计数法);
字符串,数组,对象
自定义对象;
变量声明:
var name="Gates", age=56, job="CEO";
以上是多行表达,也可以多行表达;
要点七: 对象
两大特性: 属性与方法;
person=new Object(); person.firstname="Bill"; person.lastname="Gates"; person.age=56; person.eyecolor="blue";
方法: getName()等等;
要点八: 函数
函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块
JavaScript 函数语法
function functionname() { 这里是要执行的代码 }
调用带参数的函数
<button οnclick="myFunction('Bill Gates','CEO')">点击这里</button> <script> function myFunction(name,job) { alert("Welcome " +name
+ ", the " +job
); } </script>
带有返回值的函数
unction myFunction(a,b) { if (a>b) { return; } x=a+b }
要点九: 运算符
算术运算符:
运算符 描述 例子 结果
+ 加 x=y+2 x=7
- 减 x=y-2 x=3
* 乘 x=y*2 x=10
/ 除 x=y/2 x=2.5
% 求余数 (保留整数) x=y%2 x=1
++ 累加 x=++y x=6
-- 递减 x=--y x=4
赋值运算符:
运算符 例子 等价于 结果
= x=y x=5
+= x+=y x=x+y x=15
-= x-=y x=x-y x=5
*= x*=y x=x*y x=50
/= x/=y x=x/y x=2
%= x%=y x=x%y x=0
比较运算符
运算符 描述 例子
== 等于 x==8 为 false
=== 全等(值和类型) x===5 为 true;x==="5" 为 false
!= 不等于 x!=8 为 true
> 大于 x>8 为 false
< 小于 x<8 为 true
>= 大于或等于 x>=8 为 false
<= 小于或等于 x<=8 为 true
逻辑运算符
运算符 描述 例子
&& and (x < 10 && y > 1) 为 true
|| or (x==5 || y==5) 为 false
! not !(x==y) 为 true
if ...else{} 不做介绍,最基础的,顺便可以了解下 三元运算符;
switch,直接看下面实例:
var day=new Date().getDay();
switch (day)
{
case 0:
x="Today it's Sunday";
break;
case 1:
x="Today it's Monday";
break;
case 2:
x="Today it's Tuesday";
break;
case 3:
x="Today it's Wednesday";
break;
case 4:
x="Today it's Thursday";
break;
case 5:
x="Today it's Friday";
break;
case 6:
x="Today it's Saturday";
break;
}
for循环,重点介绍
分类:
- for - 循环代码块一定的次数
- for/in - 循环遍历对象的属性
- while - 当指定的条件为 true 时循环指定的代码块
- do/while - 同样当指定的条件为 true 时循环指定的代码块
for 应用实例:
for (var i=0; i<5; i++)
{
x=x + "The number is " + i + "<br>";
}
for/in 应用实例:
var person={fname:"John",lname:"Doe",age:25};
for (x in
person)
{
txt=txt + person[x];
}
while 应用实例:
while (i<5) { x=x + "The number is " + i + "<br>"; i++; }
do/while应用实例:
do { x=x + "The number is " + i + "<br>"; i++; } while (i<5);
break:语句用于跳出循环
continue:用于跳过循环中的一个迭代
JavaScript 错误 - Throw、Try 和 Catch 不做过多介绍;
要点十: 表单验证
<html>
<head>
<script type="text/javascript">
function validate_required(field,alerttxt)
{
with (field)
{
if (value==null||value=="")
{alert(alerttxt);return false}
else {return true}
}
}
function validate_form(thisform)
{
with (thisform)
{
if (validate_required(email,"Email must be filled out!")==false)
{email.focus();return false}
}
}
</script>
</head>
<body>
<form action="submitpage.htm" οnsubmit="return validate_form(this)" method="post">
Email: <input type="text" name="email" size="30">
<input type="submit" value="Submit">
</form>
</body>
</html>
邮箱验证
<html>
<head>
<script type="text/javascript">
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}
}
}
function validate_form(thisform)
{
with (thisform)
{
if (validate_email(email,"Not a valid e-mail address!")==false)
{email.focus();return false}
}
}
</script>
</head>
<body>
<form action="submitpage.htm"οnsubmit="return validate_form(this);" method="post">
Email: <input type="text" name="email" size="30">
<input type="submit" value="Submit">
</form>
</body>
</html>
更多文章,请关注: http://blog.csdn.net/qq_37022150