JavaScrip练习

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<!--javascript的特点：
    1. 跨平台
    2. 安全性。 （javascript的代码不能直接访问硬盘的内容） 

javascript与java之间区别 ：
    1. javascript是属于网景公司产品， java是sun公司的产品。
    2. javascript是基于对象的语言，java是面向对象的语言。
    3. javascript是解释型语言，java是解释、编译型语言。
    4. javascript是弱类型语言， java 是强类型语言。

    java中声明变量 的时候必须要明确该变量的数据类型。
    javascript声明变量不需要明确是何种数据类型， 任何的变量都是使用一个关键字var去声明即可。

如何编写javascript的代码。

    方式1：可以使用<script>标签体内进行编写。

        格式：
            <script type="text/javascript">
                    js代码;;
            </script>    

    方式2：引入外部的javascript文件。

        格式：
            <script src="1.js" type="text/javascript"></script>

        注意：
            1.<script>是有开始标签与结束标签的，千万不要在一个标签中结束了。
            2.如果<script>已经用于引入了js文件，那么该<script>标签体就不能再写js代码了，

javascript常用的函数：

    alert("显示的内容..") ; 弹出框    

    document.write("数据") ; //向页面输出数据...

页面的注释：

    html <!--  注释的内容

    css的注释  /* 注释的内容*/  

    javascript：  //注释的内容  单行注释          /* 注释的内容*/ 多行注释

-->

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>javascript简介</title>
</head>

<body>
<script src="1.js" type="text/javascript">

</script>

<script type="text/javascript">
    alert("呵呵");
</script>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>javascript的变量声明</title>
</head>

<body>
<script>
/*
javascript的变量声明：
    格式：
        var 变量名 = 数据;

    声明变量要注意的事项：
        1. 在javascript中声明变量是 使用var关键字声明的，javascript中的变量可以存储任意的数据类型数据.
        2. javascript中变量数据类型是根据存储的值决定的，可以随时更改存储数据的类型。
        3. 定义了多个同名的变量是，后定义的同名变量是覆盖前面定义的同名变量。
        4. 声明变量的时候可以省略var关键字，但是不建议省略。

javascript的数据类型：

    typeof 查看变量的数据类型。

    使用格式：

            typeof 变量名        

javascript的数据类型：

    number 小数与整数

    string 字符串 注意： javascript中没有字符的概念，只有字符串，字符串可以写在单引号或双引号中。

    boolean 布尔数据类型，

    undefined  undefined代表该变量没有定义。

*/
    document.write("10数据类型是"+(typeof 10)+"<br/>");
    document.write("3.14数据类型是"+(typeof 3.14)+"<br/>");
    document.write("a数据类型是"+(typeof ‘abc‘)+"<br/>");
    document.write("abc数据类型是"+(typeof "abc")+"<br/>");
    document.write("abc数据类型是"+(typeof true)+"<br/>");

    document.write("a变量数据类型是"+(typeof a)+"<br/>");

    </script>

</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>字符串转数字</title>
</head>

<body>
<script type="text/javascript">
/*
    字符串转数字
        parseInt()  可以把一个字符串转换成整数。
        parseFloat() 可以把一个字符串转换成小数。
*/
    var a = "12";
    a = 12.64;

    a = "123abc123"; /* parseInt方法如果接收的字符串含有非数字的字符，那么parseInt方法会从字符串的首个字符开始寻找，一直找到非数字字符为止，然后就使用前面的数字字符转换成数字， */
    a = "a123";  // NaN not a number(不是一个数字)

    a = "012"; /* 12 如果首位是0，那么就想祛除0再进行转换。*/

    a = "0x10"; /* 如果一个字符串是以0x开头，那么会把字符串中的内容当成十六进行的数据处理的。 */
    var b = parseInt(a);
    document.write("结果："+b+"<br/>");

    var c= "3.14";
    c = "10";   // 如果是一个字符串是整数的，那么使用parseFloat还是转换 成整数 。
    c = "100a";
    c = "abc123";
    c = parseFloat(c);
    document.write("结果："+c+"<br/>");

/*
     javascript提供一个IsNaN的方法让我们判断该字符串是否是 一个数字。

      is not a muber  不是一个数字。

      不是一个数字返回true，是一个数字返回false.
*/

    document.write(isNaN("123")+"<br/>");

    document.write(isNaN("abc123"));

</script>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>运算符</title>
</head>

<body>
<script type="text/javascript">
/*
    运算符:
        +(加法、正数、 连接符)

        true 是1. false是0

    var a = 1;
    document.write((1+true)+"<br/>");
    document.write((1+false)+"<br/>");
    document.write("hello"+1); // hello1

    除法：

    var a = 10;
    var b = 3;
    document.write("除法运算是："+(a/b)+"<br/>"); //如果两个整数相除不能整数的时候结果还是小数。

    比较运算符

字符串与字符串的比较规则是：

    情况1： 能找到对应位置上的不同字符，那么就比较第一个不同字符的大小。

    情况2： 不能找到对应位置上的不同字符，这时候比较的是两个字符串的长度。

    document.write("10大于3吗？"+(10>3)+"<br/>");
    document.write("10字符串大于3字符串吗？"+("190">"19")+"<br/>"); //字符串与字符串比较
    document.write("10大于字符串9吗？"+( 10 > "9")+"<br/>"); /* 字符串还可以与数字进行比较。  凡是数字与字符串 进行比较，会先把字符串转换成数字再进行比较 的。

    逻辑运算符:    

    //没有单与的。
    document.write((true&&true)+"<br/>");
    document.write((true&&false)+"<br/>");
    document.write((false&&true)+"<br/>");
    document.write((false&&false)+"<br/>");

    document.write((true||true)+"<br/>");
    document.write((true||false)+"<br/>");
    document.write((false||true)+"<br/>");
    document.write((false||false)+"<br/>");

三目运算符    

    布尔表达式?值1:值2;
*/        

    var age = 10;

    document.write(age>18?"成年人":"未成年人");

</script>

</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>控制流程语句</title>
</head>
<body>
    <script type="text/javascript">
/*
控制流程语句

    if语句

    格式：
        if(判断条件){
            符合条件执行的代码
        }    

    if语句的特殊之处：
        1. 在javascript中的if语句条件不单止可以写布尔表达式，还可以写任何的数据。

        number  非0为true, 0为false.
        string  内容不能空是true， 内容空的时候是false。
        undefined：false
        NaN:    false

    */

    var workAge = 0;
    var str ="";
    var b;
    if(b){
        document.write("明天过来面试！！");
    }else{
        document.write("不要在投我们公司了，不要你！");
    }
</script>
<br>
<script type="text/javascript">
/*    

选择语句：
    switch语句

        switch(变量){
            case 值1:&nbsp;

                break;
            case 值2：

                break;
            case 值3:

                break;

            .....

            default：

                break;

        }

    特殊之处：
        1.     在javascript中case后面可以跟常量与变量还可以跟表达式。

*/

    var option = "A";

    var a = "A";
    var score =98;
    switch(option){
        case score>=90?"A":"B":
            document.write("java");
            break;
        case "B":
            document.write("ps");

        case "C":
            document.write("javascript");
            break;
        case "D":
            document.write("C++");
            break;
    }

</script>

</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>循环语句</title>
</head>

<body>
<script type="text/javascript">

/*
if 

switch

switch语句的特殊之处: case后面可以跟常量与变量或者是表达式。

循环语句：

    while

        格式：
            while(判断的条件){
                循环体内容
            }

    var count = 0 ;
    while(count<5){
        document.write("hello world<br/>");
        count++;
    }

需求： 计算1~100的总和。

    var num = 1;
    var result = 0;
    while(num<=100){
        result +=num;
        num++;
    }

    document.write("结果："+result);

do-while循环语句

    do{
        循环语句；
    }while(判断条件);

需求；计算1~100奇数的总和。

    var num = 1;
    var result = 0;
    do{
        if(num%2!=0){
            result +=num;
        }
        num++;
    }while(num<=100);

    document.write("结果："+result);

for循环语句:

    格式：
        for(初始化语句; 判断的条件 ; 循环后的语句){
            循环体语句；
        }

需求；计算1~100偶数的总和。
*/    

    var result = 0 ;
    for(var i =  1 ; i<=100 ; i++){
        if(i%2==0){
            result +=i;
        }
    }    

    document.write("结果："+result);

</script>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>循环语句练习</title>
</head>

<body>
<script type="text/javascript">
//需求1：显示"*"为正方形，5行5列。

    for(var i = 0 ; i<5;  i++){ // 控制行数
        for(var j  = 0 ; j<5 ; j++){ //控制列数
            document.write("*&nbsp;");
        }
        //换行
        document.write("<br/>")
    }

    document.write("<hr/>")

/*
输出一个直角三角形

*
**
***
****
*****

*/

    for(var i = 0 ; i<5; i++){

        for(var j  =0 ; j<=i ; j++){
            document.write("*&nbsp;");
        }
        document.write("<br/>");
    }

    document.write("<hr/>")

//打印九九乘法表
    for(var i = 1 ; i<= 9 ; i++){
        for(var j = 1 ; j<=i ; j++){
            document.write(i+"*"+j+"="+(i*j)+"&nbsp;&nbsp;");
        }
        document.write("<br/>");
    }

</script>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>for-in语句</title>
</head>

<body>
<script type="text/javascript">

/*
for-in语句：

    for-in语句的格式：

        for(var 变量名 in 遍历的目标){

        }

for-in语句的作用：
    1. 可以用于遍历数组的元素。  注意： 使用for-in语句遍历数组元素的时候遍历出来是数组的下标。

    2. 可以用于遍历对象的所有属性数据。 注意： 使用for-in语句遍历对象的属性的时候，遍历出来的是对象的属性名。
*/

    var arr = [12,13,19,15,16];

/*
for-in语句遍历数组元素
    for(var index in arr){
        document.write(arr[index]+",");
    }

普通的for循环遍历数组的元素

    for(var index = 0 ; index<arr.length ; index++){
        document.write(arr[index]+",");
    }
*/    

    function Person(id , name){
        this.id = id;
        this.name = name;
    }

    //创建一个对象
    var  p = new Person(110,"狗娃");

    for(var property in p){
        document.write(p[property]+",");
    }

</script>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>with语句</title>
</head>

<body>
<script type="text/javascript">
/*
    with语句:有了 With 语句，在存取对象属性和调用方法时就不用重复指定对象。

    格式：
        with(对象){

        }

*/

    with(document){
        for(var i = 0 ; i<5; i++){

            for(var j  =0 ; j<=i ; j++){
                write("*&nbsp;");
            }
            write("<br/>");
        }
        write("<hr/>");
    }

    function Person(id , name){
        this.id = id;
        this.name = name;
    }

    //创建一个对象
    var  p = new Person(110,"狗娃");

    with(p){
        document.write("编号："+ p.id);
        document.write("姓名："+ name);
    }
</script>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>函数</title>
</head>

<body>
<script type="text/javascript">
/*
函数:

函数的定义格式：

    function 函数名(形参列表){
        函数体 ;
    }

javascript的函数要注意的细节：
    1. 在 javascript中函数 定义形参时是不能使用var关键字声明变量 的。
    2. 在javascript中 的函数是没有 返回值类型 的，如果函数需要返回数据给调用者，直接返回即可，如果不需要返回则不返回。
    3. 在 javascript中是没有函数 重载 的概念 的，后定义的同名函数会直接覆盖前面定义同名函数。
    4. 在javascript中任何的函数内部都隐式的维护了一个arguments（数组）的对象，给函数 传递数据的时候，是会先传递到arguments对象中，
    然后再由arguments对象分配数据给形参的。

需求：定义一个函数做两个参数的加法功能。
*/
    function  add(a,b){
        var sum = a+b;
        document.write("两个参数的总和："+ sum);
        //return sum;
    }

    function add(){
        document.write("长度："+arguments.length+"<br/>");
        for(var index = 0 ; index<arguments.length ; index++){
            document.write(arguments[index]+",");
        }

        //var sum  = a+b+c;
        //var sum = 0;
        //document.write("三个参数的总和："+ sum);
    }

    //调用函数
    add(11,21,13,14);

</script>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>函数练习</title>
</head>
<body>
<script>

    function showDay(){
        //找到对应 的标签对象。
        var inputObj = document.getElementById("month");
        //获取input标签数据
        var month = inputObj.value;
        /*
        if(month==1||month==3||month==5||month==7||month==8||month==10||month==12){
            alert("本月是31天");
        }else if(month==4||month==6||month==9||month==11){
            alert("本月是30天");
        }else if(month==2){
            alert("本月是28天");
        }else{
            alert("没有该月份");
        }
        */

        month = parseInt(month);
        switch(month){
            case 1:
            case 3:
            case 5:
            case 7:
            case 8:
            case 10:
            case 12:
                alert("本月是31天");
                break;
            case 4:
            case 6:
            case 9:
            case 11:
                alert("本月是30天");
                break;
            case 2:
                alert("本月是28天");
                break;
            default:
                alert("没有该月份");
                break;

        }

    }

</script>
    月份:<input id="month" type="text" /><input type="button" value="查询" onclick="showDay()" />

</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">

/*
    var str1 = new String("hello");
    var str2 = new String("hello");
    document.write("两个字符串的对象一样吗？"+(str1.toString()==str2.toString()));

创建一个字符串的方式：
方式1：
    new String("字符串的内容");

方式2：
    var str = "字符串的内容";

字符串常用的方法：
    anchor（）   生产锚点
    blink（）     为元素添加blink标签
    charAt()     返回指定索引位置处的字符。
    charCodeAt() 回一个整数，代表指定位置上字符的 Unicode 编码。

    fontcolor()  把带有 COLOR 属性的一个 HTML <FONT> 标记放置在 String 对象中的文本两端

    indexOf()    返回 String 对象内第一次出现子字符串的字符位置

    italics()    把 HTML <I> 标记放置在 String 对象中的文本两端。 

    link()         把一个有 HREF 属性的 HTML 锚点放置在 String 对象中的文本两端。

    replace()      返回根据正则表达式进行文字替换后的字符串的复制

    split()        切割   

    Substr()       截取子串
    toUpperCase()  转大写
    toLowerCase    转小写
*/
    document.write("第五章".anchor("five")+"<br/>");
    document.write("第五章".blink()+"<br/>");
    document.write("abc".charAt(1)+"<br/>");
    document.write("abc".charCodeAt(1)+"<br/>"); //chatCodeAt返回的是索引值对应的字符的码值。
    document.write("第六章".fontcolor("red")+"<br/>"); //fontcolor() 给字符串添加font标签，然后设置color的属性值。
    document.write("abchellohehehello".indexOf("hello")+"<br/>"); //返回指定字符串第一次出现的索引值。
    document.write("第五章".italics()+"<br/>"); //给文本添加一个i标签，把文本内容设置成斜体。
    document.write("你好".link("http://www.itcast.cn")+"<br/>"); // 给文本添加一个a标签，
    document.write("明天会更好".replace("明天","未来")+"<br/>"); // 给文本添加一个a标签，

    var str = "我们-大家-好";
    var arr = str.split("-");
    for(var index = 0 ; index<arr.length ; index++){
        document.write(arr[index]+",");
    }
    document.write("<br/>");
    document.write("abc".toUpperCase()+"<br/>"); //转大写
    document.write("ABC".toLowerCase()+"<br/>");  //转小写

</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
/*
日期对象（Date）

*/
    var date = new Date(); //获取到当前的系统时间
    document.write("年："+ date.getFullYear()+"<br/>");
    document.write("月："+ (date.getMonth()+1)+"<br/>");
    document.write("日："+ date.getDate()+"<br/>");

    document.write("时："+ date.getHours()+"<br/>");
    document.write("分："+ date.getMinutes()+"<br/>");
    document.write("秒："+ date.getSeconds()+"<br/>");

    //xxxx年yy月dd日  hh:mm:ss

    //document.write("当前时间是："+date.toLocaleString());
    document.write("当前时间是："+date.getFullYear()+"年"+(date.getMonth()+1)+"月"+date.getDate()+"日 "+
    date.getHours()+":"+date.getMinutes()+":"+date.getSeconds());

</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>

</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
    当前系统时间：<span id="time"></span>
</body>

<script type="text/javascript">

    function getCurrentTime(){
        //获取到当前的系统时间
        var date = new Date();
        //把当前系统时间拼装成我指定的格式。
        var timeInfo =  date.getFullYear()+"年"+(date.getMonth()+1)+"月"+date.getDate()+"日 "+
    date.getHours()+":"+date.getMinutes()+":"+date.getSeconds();

        //找span对象
        var  spanObj = document.getElementById("time");
        //设置span标签体的内容
        spanObj.innerHTML = timeInfo.fontcolor("red");
    }

    getCurrentTime();

    //定时方法.
    window.setInterval("getCurrentTime()",1000); /* setInterval   定时方法，第一个参数要指定调用的代码，第二参数是每                                                隔指定的毫秒数调用指定的代码。*/

</script>

</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
/*
    Number对象。

创建Number对象的方式：    

    方式1：
        var 变量=  new Number(数字)    

    方式2：
        var 变量 = 数字;    

常用的方法：
    toString()  把数字转换成指定进制形式的字符串。
    toFixed()   指定保留小数位,而且还带四舍五入的功能。
*/

    var  num = 10; // 十进制
    document.write("十进制："+num.toString()+"<br/>");
    document.write("二进制："+num.toString(2)+"<br/>");
    document.write("八进制："+num.toString(8)+"<br/>");
    document.write("十六进制："+num.toString(16)+"<br/>");
    document.write("三进制："+num.toString(3)+"<br/>");   // 101
    var num2 = 3.455;
    document.write("保留两位小数:"+num2.toFixed(2))    

</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
/*
Math对象常用的方法：

 ceil         向上取整
 floor（）   向下取整
 random()  随机数方法 //  产生的伪随机数介于 0 和 1 之间（含 0，不含 1），
 round     四舍五入
*/
    document.write("向上取整："+ Math.ceil(3.14)+"<br/>");
    document.write("向下取整："+ Math.floor(3.14)+"<br/>");
    document.write("随机数："+ Math.random()+"<br/>");
    document.write("四舍五入："+ Math.round(3.75)+"<br/>");

</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
/*
Array数组对象:
    创建数组的方式1：
        var 变量名 = new Array();  创建一个长度为0的数组。

    方式2：
        var 变量名= new Array(长度) 创建一个指定长度的数组对象。

    方式3：
         var 变量名 = new Array("元素1","元素2"...);  给数组指定元素创建数组 的对象。

    方式4：
        var 变量名 = ["元素1","元素2"...];

数组要注意的细节：
    1.  在javascript中数组的长度是可以发生变化的。

*/

    var arr = new Array(3); //创建了一个长度为0的数组对象。
    arr[100] = 10;
    document.write("arr长度："+arr.length+"<br/>");

    var arr2 = new Array("狗娃","狗剩","铁蛋");
    arr2 = ["狗娃","狗剩","铁蛋","张三"];
    document.write("arr2长度："+arr2.length+"<br/>");

</script>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>数组对象练习</title>
</head>
<body><script type="text/javascript" >　　　    var arr1 = ["狗娃","狗剩","铁蛋"];
    var arr2 = ["永康","才厚"];

    /*
    arr1 = arr1.concat(arr2); //concat把arr1与arr2的数组元素组成一个新的数组返回。
    for(var index in arr1){
        document.write(arr1[index]+",");
    }

    var elements = arr1.join(","); // join使用指定的分隔符把数组中的元素拼装成一个字符串返回。
    document.write("数组的元素："+elements);

    pop ：移除数组中的最后一个元素并返回该元素。

    document.write("删除最后的一个元素并返回："+arr1.pop()+"<br/>");

    arr1.push("永康"); // 将新元素添加到一个数组中，并返回数组的新长度值。

    arr1.reverse(); //翻转数组的元素

    document.write("删除第一个元素并返回："+arr1.shift()+"<br/>"); //移除数组中第一个元素，并且返回。

    var subArr = arr1.slice(1,2); //指定数组 的开始索引值与结束索引值截取数组的元素，并且返回子数组。
    document.write("子数组的元素："+subArr.join(",")+"<br/>");

    arr1 = [19,1,20,5];
    arr1.sort(sortNumber);  //排序，排序的时候一定要传入排序的方法。

    function sortNumber(num1,num2){
        return num1-num2;
    }

    arr1.splice(1,1,"张三","李四","王五"); //第一个参数是开始删除元素的 索引值， 第二参数是删除元素的个数，往后的数据就是插入的元素。

    */

    document.write("数组的元素："+arr1.join(","));

</script>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
/*
自定义对象:

在javascript没有类的概念，只要有函数即可创建对象。

    自定义对象的方式1： 使用无参的函数创建对象。

    例子：

        function Person(){}
        var p = new Person(); //创建了一个Person对象了
        p.id = 110;
        p.name = "狗娃";

    方式2：使用带参的函数创建对象。

        function Person(id,name){
            this.id = id;
            this.name = name;
            this.say = function(){
                alert(name+"呵呵");
            }
        }

        var p = new Person(110,"狗剩");    //创建对象

    方式3： 使用Object函数创建对象

        var p = new Object();
        p.id = 110;
        p.name = "铁蛋";

    方式4：使用字面量的方式创建.

        var p = {
            id:110,
            name:"狗娃",
            say:function(){
                alert(this.name+"呵呵");
        }
    }        。

*/    

    var p = {
        id:110,
        name:"狗娃",
        say:function(){
            alert(this.name+"呵呵");
        }
    }    

    document.write("编号："+ p.id+" 姓名："+ p.name);
    p.say();

</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
</body>
</html>
时间： 2024-10-09 06:46:26

JavaScrip练习的相关文章

5.24 javascrip简介及语法整理

Javascipt 一．位置1. 写在 head 里面 2.写在BODY里面 3.写在</html>之后 二．语法格式 <scrip language=”javascrip”>代码写在此处</scrip> 常简写为<scrip></scrip> 三．常用对话框 1. Alert 警告对话框, 写在/HTML后,先读取body里面的字符.从上到下读取. 写在head里,1.弹出对话框.2.点击确定后出现body内字符 写在body里,字符前先出现字

关于浏览器不能运行JavaScrip问题的反思

今天在一篇博客(http://blog.csdn.net/u011043843/article/details/27959563)的时候,写着用于演示的Javascript代码不能再浏览器运行,很是忧伤.代码贴上: <html> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <script type="text

javascrip中的confirm小技巧

jsp页面中的一个标签: <a href="javascript:void(0)" onclick="confirmDelete('<%=request.getContextPath() %>/master/sysUser_deleteUserById.action?sysUserId=${each.sysUserId }');">删除</a> javascript中的confirm函数: <script>   fun

(转)妙味课堂—JavaScrip中级课程笔记

DOM基础概念.操作 DOM的概念及节点类型 childNodes children nodeType attributes 子节点和兄弟节点的操作 firstChild firstElementChild lastChild.lastElementChild nextSibling.previousSibling 父节点 parentNode offsetParent 元素位置宽高 offsetLeft.offsetTop offsetWidth.offsetHeight getPos() 操

JavaScrip实现3D旋转动态效果

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

Android基础入门教程——7.5.2 WebView和JavaScrip交互基础

Android基础入门教程--7.5.2 WebView和JavaScrip交互基础 标签(空格分隔): Android基础入门教程 本节引言: 在上一节中我们对Android的WebView(网页视图)进行了学习,相信已经了解了WebView的基本用法: 而本节我们要学习的就是通过:HTML -> JS ->Java来完成HTML5端与Android手机间的 互访!好的,话不多说,有吗有真相,让我们通过编写代码来体验这种微妙的联系吧~ PS:为了方便,本节用到的HTML都是以文件的形式放到a

关于javascrip 类继承封装

下面这段代码是javascrip inherit 的一段继承的代码我倒持了一早上才搞明白其中的道理,最主要是里面有一些平时我们不怎么使用的函数和方法.比较迷惑人.现在我就针对这些代码做一些自己的注解:(当然他也有一些英文注解,但是不够清楚明白,我们也可以后期改造这个方法,让他更适合我们自己的使用) /* Simple JavaScript Inheritance * By John Resig http://ejohn.org/ * MIT Licensed. */ // Inspired by

JavaScrip:Function

1.自定义函数定义 1.函数通过function关键字创建,函数创建格式: function 函数名称([参数,...]){ 代码段; return 返回值; } 注意事项: 函数名称不要包含特殊字符 函数名称最好含义明确 函数名称最好遵循驼峰标记法或者下划线法 函数名称严格区分大小写 函数名称如果重复会产生覆盖 函数可以有参数也可以没有参数,可以有一个参数也可以有多个参数 函数通过return加返回值,如果没有return 默认返回undefined 函数不调用不执行 匿名函数 函数表达式可以

JavaScrip笔记

数据类型转换 1.转换成数值类型 隐式转换:在数据运算过程中,系统自动把不同数据类型转换成相同类型进行运算. //字符串转数字,输出结果为100alert('101'-1); 2.显式转化 1)parseInt()只能将数字字符串类型转化成整数,其他类型转化都将得到NaN parseInt的转化过程是,从第一个字符开始,依次进行判断,如果发现字符不是一个数字字符,将停止转化(parseInt(‘123a4’)转化结果为123) 2) parseFloat()将浮点数字符串转化成浮点数(parse

web前端 --- JavaScrip基础

avaScrip基础 JavaScrip简介 第一个JavaScrip代码 数据类型 运算符 数据类型转换 流程控制 常用内置对象 一.JavaScrip简介 1.JavaScrip历史背景介绍 布兰登 ? 艾奇(Brendan Eich,1961年-),1995年在网景公司,发明的JavaScript. 一开始JavaScript叫做LiveScript,但是由于当时Java这个语言特别火,所以为了傍大牌,就改名为JavaScript. 同时期还有其他的网页语言,比如VBScript.JScr