JavaScript入门-基础认识
什么是JavaScript？
JavaScript是一种脚本语言，所以它的代码也称为JS脚本，它是运行在客户端的。
1.从功能上来说：
对用户输入的数据进行验证。
网页特效。
动态更改内容
JavaScript是客户端语言，那么他写在哪里呢？有两种方式：
1.使用 <script> 标签将语句嵌入文档
2.将 JavaScript 源文件链接到 HTML 文档中
例如：
以上test.js中的内容如下：
简单语法：
JavaScript语法和C语言类似，只是语法关键字等细节不同。
变量的命名，只要你会一种一种，例如C，或者Java，C++,那么它的命名基本就掌握了。
变量：
变量的使用和C语言是一样的，分为先声明，给变量赋值。
变量的作用域，可以简单的记住，一个变量，如果声明带有var的，那么这个变量即为局部变量，如果没有带var，则这个变量为全局变量。
把下面的例子跑一下就什么都明白了
注释：可以使用//进行行注释，也可以使用/**/进行块注释。
运算符：跟C语言是非常类似的，在这里就不废话了。
函数：
举个例子：
函数的定义形式如下：
function 函数名( 参数1,参数2，… ){
语句;
}
例如：
function sum ( one, two)
{
var result = one + two;
return result;
}
函数的调用形式如下：
函数调用一般和表单元素的事件一起使用，调用格式为： 事件名＝"函数名"
<INPUT name="add" type="button" value="加法"
onClick="sum(2，5)">
下面看一个完整的例子：
JS对数组的支持：
声明数组
var 数组名 = new Array(数组大小);
例： var emp = new Array(3)
添加元素
emp[0] = "AA";
emp[1] = "BB";
emp[2] = "CC";
也可以声明数组并赋初值：
例： var emp = new Array("AA"，"BB"，"CC")；
常用的属性：
length
常用的方法：
join 将数组中的元素组合成字符串
reverse 颠倒数组元素的顺序，使第一个元素成为最后一个，而最后一个元素成为第一个
sort 对数组元素进行排序（按照String类型进行）
小例子：
通过上述的小例子说明了for的用法，其他的do while ,while,if等条件循环判断语句，还是一句话，只要你会任何一门语言，那么我想这个对你们来说，简直是小菜一碟啊，因为你们都是大神。。。
JS两个最常见的内置函数：
eval 函数： 用于计算字符串表达式的值
isNaN 函数：用于验证参数是否为 NaN（非数字）
JS事件：
onClick 鼠标单击
onChange 文本内容或下拉菜单中的选项发生改变
onFocus 获得焦点，表示文本框等获得鼠标光标。
onBlur 失去焦点，表示文本框等失去鼠标光标。
onMouseOver 鼠标悬停，即鼠标停留在图片等的上方
onMouseOut 鼠标悬停，即鼠标停留在图片等的上方
onMouseMove 鼠标移动，表示在<DIV>层等上方移动
onLoad 网页文档加载事件
onSubmit 表单提交事件
onMouseDown 鼠标按下
onMouseUp 鼠标弹起
下面挑选几个举例：
onChange
onFocus和onBlur
onMouseOver和 onMouseDown事件
onLoad事件
此章节先暂时到这，未完待续。。。
JavaScript是一种脚本语言，所以它的代码也称为JS脚本，它是运行在客户端的。
1.从功能上来说：
对用户输入的数据进行验证。
网页特效。
动态更改内容
JavaScript是客户端语言，那么他写在哪里呢？有两种方式：
1.使用 <script> 标签将语句嵌入文档
2.将 JavaScript 源文件链接到 HTML 文档中
例如：
<html>
<head>
<script Language ="JavaScript">
// JavaScript Appears here.
alert("这是第一个JavaScript例子!");
alert("欢迎你进入JavaScript世界!");
alert("今后我们将共同学习JavaScript知识！");
</script>
</Head>
</Html>
<script language="JavaScript" src= "test.js"> </script>
以上test.js中的内容如下：
document.write("喂！你好吗? ");
简单语法：
JavaScript语法和C语言类似，只是语法关键字等细节不同。
变量的命名，只要你会一种一种，例如C，或者Java，C++,那么它的命名基本就掌握了。
变量：
变量的使用和C语言是一样的，分为先声明，给变量赋值。
//声明变量 var a; //赋值 a=12; //同时声明和初始化变量 var a= 10; //声明多个变量 var x, y, z = 10;
变量的作用域，可以简单的记住，一个变量，如果声明带有var的，那么这个变量即为局部变量，如果没有带var，则这个变量为全局变量。
把下面的例子跑一下就什么都明白了
<script language="javascript">
var quanju ="1";
function getStr(){
var quanju = 5;
alert(quanju);
}
function getInt(){
quanju = 3;
alert(quanju);
}
function getBool(){
alert(quanju);
}
</script>
注释：可以使用//进行行注释，也可以使用/**/进行块注释。
运算符：跟C语言是非常类似的，在这里就不废话了。
函数：
举个例子：
<SCRIPT language = "JavaScript">
function calcu( ){
//获取form表单calc中元素的name为num1的值。
var numb1= document.calc.num1.value;
//获取form表单calc中元素的name为num2的值。
var numb2= document.calc.num2.value;
//由于上述获得的都是String类型的，因此需要调用JS的内置函数进行转换parseFloat转换为Float类型，然后进行相乘。
var total=parseFloat(numb1)*parseFloat(numb2);
document.calc.result.value=total;
}
</SCRIPT>
....
//onClick="calcu( )"给的元素的单击触发事件绑定为calcu函数。
<INPUT name="getAnswer" TYPE="button" onClick="calcu( )" value="计算看看/>
函数的定义形式如下：
function 函数名( 参数1,参数2，… ){
语句;
}
例如：
function sum ( one, two)
{
var result = one + two;
return result;
}
函数的调用形式如下：
函数调用一般和表单元素的事件一起使用，调用格式为： 事件名＝"函数名"
<INPUT name="add" type="button" value="加法"
onClick="sum(2，5)">
下面看一个完整的例子：
<HEAD>
<SCRIPT language="JavaScript" >
function compute(op)
{
var num1,num2;
num1=parseFloat(document.myform.num1.value);
num2=parseFloat(document.myform.num2.value);
if (op=="+") {
document.myform.result.value=num1+num2 ;
}
if (op=="-")
{
document.myform.result.value=num1-num2 ;
}
if (op=="*")
{
document.myform.result.value=num1*num2 ;
}
if (op=="/" && num2!=0)
{
document.myform.result.value=num1/num2 ;
}
}
</SCRIPT>
</HEAD>
<FORM action="" method="post" name="myform" >
<P>第一个数<INPUT name="num1" type="text">
<BR>第二个数<INPUT name="num2" type="text">
</P>
<P>
<INPUT name="addButton" type="button" value="＋"
onClick="compute('+')">
<INPUT name="subButton" type="button" value="－"
onClick="compute('-')">
<INPUT name="mulButton" type="button" value="×"
onClick="compute('*')">
<INPUT name="divButton" type="button" value="÷"
onClick="compute('/ ')">
</P>
<P>计算结果 <INPUT name="result" type="text">
</P>
</FORM>
JS对数组的支持：
//例如，数组的声明有三种方式。 arrayObj = new Array(); arrayObj = new Array([size]) arrayObj = new Array([element0[, element1[, ...[, elementN]]]]) //arrayObj : 必选项。要赋值为 Array 对象的变量名。 //Size : 可选项。数组的大小。由于数组的下标是从零开始， // 创建的元素的下标将从零到 size -1。 //element0,...,elementN : 可选项。要放到数组中的元素。这将创建 // 具有n + 1 个元素的长度为 n + 1 的数组。使用该语法时 // 必须有一个以上元素。
声明数组
var 数组名 = new Array(数组大小);
例： var emp = new Array(3)
添加元素
emp[0] = "AA";
emp[1] = "BB";
emp[2] = "CC";
也可以声明数组并赋初值：
例： var emp = new Array("AA"，"BB"，"CC")；
常用的属性：
length
常用的方法：
join 将数组中的元素组合成字符串
reverse 颠倒数组元素的顺序，使第一个元素成为最后一个，而最后一个元素成为第一个
sort 对数组元素进行排序（按照String类型进行）
小例子：
//打印金字塔型的直线
<HTML>
<HEAD>
<TITLE>For 循环演示</TITLE>
<SCRIPT LANGUAGE = "JavaScript">
document.write("<H2 align=center>打印金字塔直线</H2>");
for (var i= 0; i<100; i=i+5){
document.write("<HR align=center width=" + i+"%>");
}
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
通过上述的小例子说明了for的用法，其他的do while ,while,if等条件循环判断语句，还是一句话，只要你会任何一门语言，那么我想这个对你们来说，简直是小菜一碟啊，因为你们都是大神。。。
JS两个最常见的内置函数：
eval 函数： 用于计算字符串表达式的值
isNaN 函数：用于验证参数是否为 NaN（非数字）
<SCRIPT LANGUAGE = "JavaScript">
<SCRIPT LANGUAGE = "JavaScript">
var str1=prompt("输入一个表达式，我给您计算，如：1+1", "");
var result=eval(str1);
document.write(str1+"="+result);
var x = prompt("输入一些数据,我来告诉您是不是数字","0");
if (isNaN(x)){
alert (x + " 不是一个数字");
}
else{
alert (x + " 是一个数字");
}
</SCRIPT>
JS事件：
onClick 鼠标单击
onChange 文本内容或下拉菜单中的选项发生改变
onFocus 获得焦点，表示文本框等获得鼠标光标。
onBlur 失去焦点，表示文本框等失去鼠标光标。
onMouseOver 鼠标悬停，即鼠标停留在图片等的上方
onMouseOut 鼠标悬停，即鼠标停留在图片等的上方
onMouseMove 鼠标移动，表示在<DIV>层等上方移动
onLoad 网页文档加载事件
onSubmit 表单提交事件
onMouseDown 鼠标按下
onMouseUp 鼠标弹起
下面挑选几个举例：
onChange
<script language="javascript">
function changeBg()
{
if(document.form1.bgColorList.value!="")
{
document.body.style.backgroundColor=
document.form1.bgColorList.value;
}
}
</script>
<select name="bgColorList" onChange="changeBg()">
<option value="">---------</option>
<option value="#FFCCFF">粉红浪漫</option>
<option value="#6699FF">蓝色忧郁</option>
<option value="#9966FF">紫色诱惑</option>
<option value="#009966">绿色环保</option>
</select>
onFocus和onBlur
<HEAD>
<SCRIPT language="JavaScript" >
function myfun1( )
{
if (document.myform.card.value=="请注意格式：10xxxxxx")
document.myform.card.value="" ;
}
function myfun2( )
{
var a=document.myform.card.value;
if (a.substr(0,2)!="10" || isNaN(a))
{
alert("格式错误，请重新输入") ;
document.myform.card.focus();
}
}
</SCRIPT>
<STYLE type="text/css">
Input { background-color: #55FFFF; font-size: 20px;
border: 1px solid;}
</STYLE>
<BODY>
<FORM name="myform">
卡号：<INPUT name="card" type ="text"
value="请注意格式：10xxxxxx"
onFocus="myfun1( )"
onBlur="myfun2( )" />
<BR/>
密码： <INPUT name ="pass" type ="text" />
</FORM>
</BODY>
onMouseOver和 onMouseDown事件
<HTML>
<HEAD>
<TITLE>图片切换</TITLE>
</HEAD>
<BODY>
<A href="http://www.mycom.cn">
<IMG src="dog1.jpg" name="picture"
width="400" height="155"
onMouseOver=" src=‘dog2.jpg’ "
onMouseOut=" src=‘dog1.jpg’ "/>
低价转让哈士奇弟弟
</A>
<H1> 移过来看看俺啊</H1>
</BODY>
</HTML>
onLoad事件
<script language="javascript">
alert("页面没有显示完");
function over()
{
alert("页面已经全部显示");
}
</script>
<body onLoad="over()" >
……
此章节先暂时到这，未完待续。。。