javascript的基本使用

来源：互联网发布：网络调试助手编辑：程序博客网时间：2024/06/05 01:52

一，js简介

JavaScript 是网景（Netscape）公司开发的一种基于客户端浏览器、面向（基于）对象、

事件驱动式的网页脚本语言。

二，js基本格式

1，javaScript脚本程序中不能包含HTML标记代码

2， JavaScript脚本程序须嵌入在网页文件中

3， JavaScript脚本程序可以独立保存为一个外部文件

4，提问：怎样将javascript嵌入到网页之中

当页面载入时，会执行位于 body 部分的 JavaScript

当被调用时，位于 head 部分的 JavaScript 才会被执行

如果想实现某些功能、方法的调用等，一般放在<body>之中

如果想实现对某方法的定义，或页面初始化一些数据，一般放在head之中

<html><head><script type="text/javascript">function message(){alert("该提示框是通过 onload 事件调用的。")}</script></head><body onload="message()"></body></html>

外部的引用

三，javascript语句

JavaScript 语句是发给浏览器的命令。这些命令的作用是告诉浏览器要做的事情。

通常要在每行语句的结尾加上一个分号，分号是可选的（根据 JavaScript 标准），浏览器把行末作为语句的结尾

注释：通过使用分号，可以在一行中写多条语句。

四，javascript注释

JavaScript 注释可用于增强代码的可读性。

单行的注释以 // 开始

多行注释以 /* 开头，以 */ 结尾

五，javascript变量

变量是用于存储信息的容器

JavaScript 变量名称的规则：

变量对大小写敏感（y 和 Y 是两个不同的变量）
变量必须以字母或下划线开始

通过 var 语句来声明 JavaScript 变量 var x;

向未声明的 JavaScript 变量赋值

如果您所赋值的变量还未进行过声明，该变量会自动声明。

这些语句：

x=5;carname="Volvo";

与这些语句的效果相同：

var x=5;var carname="Volvo";

六，javascript运算符

用于字符串的 + 运算符

+ 运算符用于把文本值或字符串变量加起来（连接起来）

txt1="What a very";txt2="nice day";txt3=txt1+txt2;

或者把空格插入表达式中：

txt1="What a very";txt2="nice day";txt3=txt1+" "+txt2;

对字符串和数字进行加法运算

x=5+5;document.write(x);x="5"+"5";document.write(x);x=5+"5";document.write(x);x="5"+5;document.write(x);

结果：10 55 55 55

规则是：如果把数字与字符串相加，结果将成为字符串

七，JavaScript 比较和逻辑运算符

比较和逻辑运算符用于测试 true 或 false

==：等于要求数据的值相同，类型可以不同的 5 “5”

===：全等于要求数据类型相同，值相同

!==：不全等于

逻辑运算符用于测定变量或值之间的逻辑

逻辑运算符

&&：与符号两侧都为真，结果为真

||：或符号两侧有一侧为真，结果为真

!：非返回值如果是true,则返回false 返回值如果是false,返回为true

八，javascript的if...else语句

JavaScript 中的条件语句用于完成不同条件下的行为

if 语句

在一个指定的条件成立时执行代码。

if...else 语句

在指定的条件成立时执行代码，当条件不成立时执行另外的代码。

if...else if....else 语句

使用这个语句可以选择执行若干块代码中的一个。

语法：

if (条件1){条件1成立时执行代码}else if (条件2){条件2成立时执行代码}else{条件1和条件2均不成立时执行代码}

switch 语句

使用这个语句可以选择执行若干块代码中的一个。

语法：

switch(n)   {   case 1:     执行代码块 1     break   case 2:     执行代码块 2     break   default:     如果n即不是1也不是2，则执行此代码   }

九，javascript的消息框

警告框
警告框经常用于确保用户可以得到某些信息。
当警告框出现后，用户需要点击确定按钮才能继续进行操作。
语法：
alert("文本")
确认框
确认框用于使用户可以验证或者接受某些信息。
当确认框出现后，用户需要点击确定或者取消按钮才能继续进行操作。
如果用户点击确认，那么返回值为 true。如果用户点击取消，那么返回值为 false。
语法：
confirm("文本")

十，javascript的函数

将脚本编写为函数，就可以避免页面载入时执行该脚本。

函数包含着一些代码，这些代码只能被事件激活，或者在函数被调用时才会执行。

你可以在页面中的任何位置调用脚本（如果函数嵌入一个外部的 .js 文件，那么甚至可以从其他的页面中调用）。

函数在页面起始位置定义，即 <head> 部分。

例子：

<html><head><script type="text/javascript">function displaymessage(){alert("Hello World!")}</script></head><body><form><input type="button" value="Click me!" onclick="displaymessage()" ></form></body></html>

假如上面的例子中的 alert("Hello world!!") 没有被写入函数，那么当页面被载入时它就会执行。

现在，当用户击中按钮时，脚本才会执行。

我们给按钮添加了 onClick 事件，这样按钮被点击时函数才会执行。

创建函数的语法：

function 函数名(var1,var2,,,){

代码...

}

return 语句

return 语句用来规定从函数返回的值。

因此，需要返回某个值的函数必须使用这个 return 语句

javascript的变量生存期

当您在函数内声明了一个变量后，就只能在该函数中访问该变量。当退出该函数后，这个变量会被撤销。

如果您在函数之外声明了一个变量，则页面上的所有函数都可以访问该变量。

这些变量的生存期从声明它们之后开始，在页面关闭时结束。

十一，javascript的for循环

javascript的循环用来将同一段代码执行指定的次数（或当指定的条件为true时）。

在编写代码时，你常常希望反复执行同一段代码。我们可以使用循环来完成这个功能，

这样就用不着重复地写若干行相同的代码

for循环

在脚本的运行次数已确定的情况下使用 for 循环。

while循环

利用 while 循环在指定条件为 true 时来循环执行代码。

while (变量<=结束值) { 需执行的代码}

do...while循环

do...while 循环为执行至少一遍其中的代码，循环程序在初次运行时会首先执行一遍其中的代码，

然后当指定的条件为 true 时，它会继续这个循环

do{ 需执行的代码} while (变量<=结束值)

十二，break和continue
Continue：跳出本次循环，然后从下一个值继续运行。

Break：跳出整个循环，然后继续执行循环之后的代码（如果循环之后有代码的话）。

例子：

<html><body><script type="text/javascript">var i=0for (i=0;i<=6;i++){if (i==3){continue}document.write("The number is " + i)document.write("<br />")}</script></body></html>

结果：

The number is 0The number is 1The number is 2The number is 4The number is 5The number is 6

十三，javascript的for...in声明

用于对数组或者对象的属性进行循环操作

语法：

for (变量 in 对象){    在此执行代码}

“变量”用来指定变量，指定的变量可以是数组元素，也可以是对象的属性。

十四，javascript事件

事件是javascript可以侦测到的行为

网页中的每个元素都可以产生某些可以触发 JavaScript 函数的事件。

比方说，我们可以在用户点击某按钮时产生一个 onClick 事件来触发某个函数

事件举例：

鼠标点击
页面或图像载入
鼠标悬浮于页面的某个热点之上
在表单中选取输入框
确认表单
键盘按键

注意：事件通常与函数配合使用，当事件发生时函数才会执行。

1，onload和onunload

当用户进入或离开页面时，就会触发onload和onunload事件,

2，onblur，onfocus和onchange

他们通常相互配合用来验证表单

onblur元素失去焦点

onfocus元素获得焦点

3，onsubmit

onSubmit 用于在提交表单之前验证所有的表单域。

当用户单击表单中的确认按钮时，checkForm() 函数就会被调用。假若域的值无效，此次提交就会被取消。

checkForm() 函数的返回值是 true 或者 false。如果返回值为true，则提交表单，反之取消提交。

<form method="post" action="xxx.htm" onsubmit="return checkForm()">