JavaScript 学习

标签：style   http   color   io   使用   ar   java   for   数据   

参考资料：http://www.w3school.com.cn/js/index.asp 

一、教程

    js是一种轻量级的编程语言，可插入html页面中，并由浏览器执行。

    （1）简介

<script>
    document.write("<h1>标题一</h1>");
    function al(){
//        alert("button clicked.");
//        document.getElementById("aa").innerHTML = "<h2>O(∩_∩)O哈哈~</h2>";
        if(isNaN(document.getElementById("num").value)){
            alert("not num");
        }
    }
    function am(){
        document.getElementById("aa").style.color = "#006060";
    }

</script>
<input type="text" name="num" id="num" />
<input type="button" value="submit" onclick="al()" />
<input type="button" value="submit" onclick="am()" />
<div id="aa"></div>

    （2）实现

// <script>标签， 在html中，使用 。type="text/javascript"，不用添加。JS是现代浏览器以及HTML5中的默认脚本。

// 向html中，输入文本
document.write("<h1>This is a heading.</h1>");
// JS 函数和事件

<script>
    function myFunction(){
// 一定要注意id名字！！！ 将demo写成dome了 ...
        document.getElementById("demo").innerHTML="My First JS Function.";
    }
</script>
<div id="demo"> ... </div>
<button type="button" onclick="myFunction()">Try it.</button>

    （3）语句

// 浏览器会按照编写的顺序来执行每条语句。
// js对大小写敏感

    （4）注释

// 第一种注释方法
/*
第二种注释方法
*/

    （5）变量

// 变量
var x = 2;
var y = 3;
var z = x + y;

// 声明(创建)JS变量
var carname;

// 一条语句，多个变量
var name="Gates", age=56, job="CEO";

// Value = undefined;
var carname; // carname的值将是 undefined

    （6）数据类型

        字符串，数字，布尔，数组，对象，Null，Undefined

        JS拥有动态类型。相同的变量，可用作不同的类型。

var x ;
var x = 6;
var carname = "Bill Gates"; var carname = ‘Bill Gates‘;
var x = true; var y = false;

// 数组
var cars = new Array();
cars[0] = "Audi";
cars[1] = "BMW";
// 或者使用
var cars = new Array("Audi", "BMW");

// 对象
// 对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式(name: value)来定义。属性由逗号分隔
var person = {
    firstname   : "Bill",
    lastname    : "Gates",
    id          : 5566
};
// 对象属性的访问
person.lastname; person["lastname"]

// 声明变量类型
var carname = new String;
var x = new Number;
var y = new Boolean;
var cars = new Array;
var person = new Object;

    （7）对象

        JS中所有事物都是对象：字符串，数字，数组，日期等待

        在JS中，对象时拥有属性和方法的数据。

        属性：与对象有关的值。方法：能够在对象上执行的动作。

// 访问对象的属性
objectName.propertyName

// 访问对象的方法
objectName.methodName

    （8）函数

        函数是由事件驱动的或者当他被调用时执行的可重复使用的代码块。

function functionname(){
    // 执行代码 ...
}

// 调用带参数的函数
function myFunction(var1, var2){
    // 执行代码 ...
}

<button onclick="myFunction("Bill Gates", "CEO")">点击这里</button>

// 带有返回值的函数
function myFunction(){
    // 执行代码 ...
    return x;
}

// 变量的生存期
// 局部变量会在函数运行以后被删除
// 全局变量会在页面关闭后被删除

    （9）运算符

        +，-，*，/，%，++，--

        =，+=，-=，*=，/=，%=

    （10）比较

// 比较运算符
==        等于
===       全等(值和类型)
!=, >, <, >=, <= 

// 逻辑运算符
&&        and
||        or
!         not

// 条件运算符
variablename = (condition)?value1:value2;

    （11）If...Else

if (条件1){
    // ...
}
else if (条件2){
    // ...
}
else {
    // ...
}

    （12）Switch

switch(n){
case 1:
    // ...
    break;
case 2:
    // ...
    break;
// ...
default:
    // ...
}

    （13）For

for (var i=0; i<cars.length; i++){
    document.write(cars[i] + "<br>");
}

    （14）While

while (条件){
    // ...
}


do{
    // ...
}
while(条件);

    （15）Break

        break语句跳出循环。continue用于跳过循环中的一个迭代。

    （16）错误

try     // 语句测试代码块的错误
catch   // 语句处理错误
throw   // 语句创建自定义错误 

try{
    // 在这里运行代码
} catch(err){
    // 在这里处理错误
}

// 简单示例
function mm(){
    try{
        alelrt("welcome guest!"); // alert() 
    } catch(err){
        alert(err.message);
    }
}

    （17）验证

JavaScript 学习

标签：style   http   color   io   使用   ar   java   for   数据   

原文地址：http://my.oschina.net/lpe234/blog/323503