HTML5快速入門（四）—— JavaScript

前言：

1.HTML5的發(fā)展非常迅速截驮，可以說已經(jīng)是前端開發(fā)人員的標(biāo)配桦沉，在電商類型的APP中更是運(yùn)用廣泛定枷，這個系列的文章是本人自己整理蟀瞧，盡量將開發(fā)中不常用到的剔除沉颂，將經(jīng)常使用的拿出來，使需要的朋友能夠真正快速入門悦污，如果有哪些不清楚的地方或者錯誤铸屉，歡迎聯(lián)系我
2.更新時間沒有規(guī)律，一般會在3天左右更新一篇（全系列預(yù)計(jì)會有12篇）因?yàn)樾枰ぷ髑卸耍灾荒茉陂e暇之余整理彻坛，如果有喜歡的朋友可以關(guān)注我，將會第一時間獲得更新信息
3.如果有需要Reactive Native + H5跨平臺開發(fā)的朋友，可以聯(lián)系我昌屉，在本系列結(jié)束之前會根據(jù)需求的程度決定是否繼續(xù)
4.全系列文章最后盡可能地附上綜合實(shí)例钙蒙，幫助朋友更好地理解
5.此系列會涉及到HTML、CSS间驮、JavaScript等
6.如果文章的圖片無法顯示或頁面顯示不全躬厌，煩請轉(zhuǎn)至簡書查閱：簡書

JS簡介

javaScript是一門廣泛用于瀏覽器客戶端的腳本語言
由Netspace公司設(shè)計(jì)，與Sun公司合作竞帽，所以起名叫javaScript（抱大腿嫌疑）,一般都叫它JS
常見用途
- HTML DOM操作（節(jié)點(diǎn)操作）如：增扛施、刪、改節(jié)點(diǎn)
- 給HTML網(wǎng)頁增加動態(tài)功能屹篓，如：動畫
- 事件處理 —— 如：監(jiān)聽鼠標(biāo)點(diǎn)擊疙渣、滑動等
Node.js：一個JavaScript運(yùn)行環(huán)境（runtime），是對google V8引擎進(jìn)行了封裝
- V8引擎執(zhí)行javaScript速度非潮埃快昌阿，性能非常好
- Node.js優(yōu)勢
  - 可作為后臺語言
  - 單線程 —— 在不新增外線程的情況下，依然可以對任務(wù)進(jìn)行并行處理（采用事件輪詢）
  - 非阻塞的輸入輸出（I/O）恳邀、V8虛擬機(jī)懦冰、事件驅(qū)動

JS書寫形式

頁內(nèi)JS：在當(dāng)前網(wǎng)頁的script標(biāo)簽中書寫
```
    <script type="text/javascript">
    </script>
```
外部JS
```
<script src="index.js"></script>
```

JS基本數(shù)據(jù)類型

在JS中，定義變量需要使用var關(guān)鍵字來修飾

要想看到console.log輸出的信息谣沸，需要在網(wǎng)頁內(nèi)右擊選擇檢查（查看元素）刷钢，選擇菜單內(nèi)的控制器即可（本人用的是mac版的火狐，其它瀏覽器的還請自己找下）


    // 可以不用加’;‘號但是為了代碼更清晰乳附，還是加上比較好
    // 定義變量
    var name = '張三';
    var name2 = '狗蛋';
    var age = 23;
    var score = 33.0;
    var height = null;

    // 輸出變量
    console.log(name, name2, age, score, height);

    // 查看數(shù)據(jù)類型
    console.log(typeof name, typeof name2, typeof age, typeof score, typeof height);

結(jié)果：

查看console.log輸出的信息.gif

接下來内地，我們來看看在JS里面變量怎么進(jìn)行拼接

  var name = '張三';
      var name2 = '狗蛋';
   
    var newName = name + name2;
    var newName2 = name + name2 + '王二麻子';

    console.log(newName, newName2);
    
    // 不同類型的變量進(jìn)行拼接
    var string = 10 + '10';
    var string2 = 10 + 10 + '10';
    var string3 = '10' + 10 + 10;
   
    var string4 = 10 + 20.0 + '30';
    
    console.log(string, string2, string3, string4);

結(jié)果：

JS變量拼接.png

結(jié)論：從上面可以看出，JS的運(yùn)算規(guī)則是從左向右進(jìn)行拼接的赋除，且如上面所示阱缓，任何類型的變量與String類型進(jìn)行拼接最終都會被強(qiáng)轉(zhuǎn)為String類型

定義數(shù)組

var array = [10, '張三', 30.0, ['數(shù)組中的數(shù)組', 8.0]];

console.log(typeof array, array);

// 取值：JS和其它語言一樣，數(shù)組都是使用下標(biāo)來取值
// 遍歷
for(var i = 0; i<array; i++) {

    console.log(i, array[i]);
}

for(var i in array) {

    console.log(i, array[i]);
}

// 刪除和插入元素
var array1 = [10, 20, 30];

// 插入元素
array1.push(40);

console.log(array1);

// 刪除元素
array1.pop();

console.log(array1);

結(jié)果：

數(shù)組結(jié)果.png

從上面的示例中可以看出在JS里面举农，數(shù)組可以放任何類型的數(shù)據(jù)

類庫(Math):與數(shù)學(xué)相關(guān)的運(yùn)算都在這個庫里面

    // 類庫 Math(與數(shù)學(xué)相關(guān)的運(yùn)算都在這個庫里面)
    // 取最小值轉(zhuǎn)換為整數(shù)
    console.log('floor' + Math.floor(7.1, 10, 20, 30.0, 40));

    // 取最小值
    console.log('min' + Math.min(1, 2, 3, 4, 5));

    // 取最大值
    console.log('max' + Math.max(1, 2, 3, 4, 5));

結(jié)果：

計(jì)算結(jié)果.png

JS函數(shù)的定義和使用

需要注意的是JS的函數(shù)不用甚至返回類型就可以直接返回?cái)?shù)據(jù)

格式：

格式

 // 定義
    function sum(a, b) {

        return a + b;
    }

    // 調(diào)用
    console.log('和為:' + sum(10, 20));

結(jié)果：

函數(shù)使用一.png

其實(shí)在JS里荆针，本身就自帶一個數(shù)組，一般稱它為內(nèi)置數(shù)組（arguments）,在開發(fā)中它的作用非常大颁糟，因?yàn)槲覀儌鬟M(jìn)來的東西都會存放進(jìn)這個數(shù)組中

    <script>
        // 這里我們利用這個特性將數(shù)組中的所有元素相加
        // 函數(shù)的內(nèi)置數(shù)組 --> arguments
        function sum2() {
            var count = 0;
            // 遍歷
            for (var i = 0; i<arguments.length; i++) {
                count += arguments[i];
            }
            return count;
        }

        // 調(diào)用
        console.log('和為:', sum2(1,2,3));
    </script>

結(jié)果：

函數(shù)使用二.png

匿名函數(shù)：匿名函數(shù)有個注意點(diǎn)是必須要有接收者

    var test = function () {

        console.log('匿名函數(shù)被調(diào)用');
    }
    
    // 調(diào)用
    test();

結(jié)果：

匿名函數(shù)使用.png

對象

先來簡單創(chuàng)建一個對象

```
    // 創(chuàng)建對象
    var person = {
        // 名字
        name : '狗蛋',
        // 年齡
        age : 18,
        // 行為
        action : ['eat', 'run', 'jump'],
        
        eat : function (something) {
            // 想要使用對象里面的屬性航背，可以使用this關(guān)鍵字來獲取
            console.log(this.name + '吃' + something);
        }
    };
    
    
    // 調(diào)用對象
    console.log(person.name, person.age, person.action[1], person.eat('面包'));

```

結(jié)果：

對象使用一.png

通過構(gòu)造函數(shù)來批量產(chǎn)生對象

在JS中，如果我們需要批量產(chǎn)生對象棱貌，需要使用構(gòu)造函數(shù)來實(shí)現(xiàn)玖媚，構(gòu)造函數(shù)可以看成Objective-C中的類，而Objective-C生成對象是通過alloc -> init或者new婚脱，在JS中今魔，就是用new來創(chuàng)建對象

    // 構(gòu)造函數(shù)
    // 方式一：
    function Person() {
        // 因?yàn)?this 在那個地方勺像，那它就指向誰相當(dāng)于 Objective-C 中的self
        this.name = null;
        this.age = 18;
        this.action = [];
        // 注意，函數(shù)需要我們實(shí)現(xiàn)里面的邏輯
        this.eat = function (something) {
            console.log(this.name + '吃' + something);
        }
    }

    // 生成對象
    var ps1 = new Person();
    ps1.name = '張三';

    var ps2 = new Person();
    ps2.name = '狗蛋';
    
    // 方式二：
    function Person2(name, age, action, eat) {

        this.name = name;
        this.age = age;
        this.action = action;

        this.eat = function (something) {
            console.log(this.name + '吃' + something);
        };
    }
    
    // 生成對象
    var ps3 = new Person2('王二麻子', '19', ['eat', 'jump', 'run']);
    
    console.log(ps1, ps2, ps3);

結(jié)果：

批量生成對象.png

JS中的兩大內(nèi)置對象之window

window：全局的內(nèi)置對象错森，只要是全局的東西咏删，它都能調(diào)用
- 所有的全局變量都是window的屬性
- 所有的全局函數(shù)都是window的方法
```
var name = '張三';

// 調(diào)用
console.log(age, window.age);

function person() {
    var name = '狗蛋';
}

// 調(diào)用
person();
window.person();
```
動態(tài)跳轉(zhuǎn)：通過JS的配合，可以動態(tài)在某個地方實(shí)現(xiàn)跳轉(zhuǎn)问词，在移動開發(fā)中，經(jīng)常用來傳值
```
window.location.;
```

JS中的兩大內(nèi)置對象之document

document
- 可以動態(tài)獲取當(dāng)前頁面的所有標(biāo)簽
- 可以對拿到的標(biāo)簽進(jìn)行增刪改查（CRUD）操作
```
    <script>
        // 插入
        document.write('hello world');
        document.write('<input type = 'color'>');
    </script>
```

DOM操作

這里我們結(jié)合上面的document來進(jìn)行比較有趣的DOM操作
需求：頁面顯示一張圖片嘀粱，和一個按鈕激挪，當(dāng)我們點(diǎn)擊按鈕時，改變原本顯示的圖片
要改變圖片我們需要拿到<img>標(biāo)簽锋叨，還需要監(jiān)聽<button>標(biāo)簽的點(diǎn)擊垄分，這個時候就需要用到document這個內(nèi)置對象
- document幾種常用的獲取標(biāo)簽的方式
  - getElementsByClassName
  - getElementsByName
  - getElementById:根據(jù)id獲取，與其它方式不同娃磺，它返回的不是一個數(shù)組（原因：因?yàn)閕d是唯一的）
  - getElementsByTagName
  - getElementsByTagNameNS
```
    <body>
        <img src="img/icon.png">
        <button onclick="changeImg();">更改圖片</button>
        
        <script>
            function changeImg() {
            // getElementsByTagName
            var img = document.getElementsByTagName('img')[0];
            // 修改圖片
            img.src="img/lufei.jpg";
            }
        </script>
    </body>
```

效果：

更改圖片.gif

這邊我們增加個需求薄湿，當(dāng)我們不斷點(diǎn)擊按鈕時，讓圖片不斷在2張圖片間切換

補(bǔ)充：在HTML中偷卧，會自動給圖片加上一些前綴以保證路徑完整豺瘤，所以如果簡單的判斷圖片路徑是不可以的，所以下面的判斷中我們會涉及到2個函數(shù)
- indexOf:截取指定區(qū)域的字符听诸，正確會返回任意正數(shù)坐求，錯誤則返回-1
- lastIndexOf:獲取尾部區(qū)域字符，正確會返回任意正數(shù)晌梨，錯誤則返回-1

    <body>
    <img id="iconImg" src="img/icon.jpg" width="100" height="100">
    <button class="btn">更改圖片</button>

        <script>
            var img = document.getElementById('iconImg');
            var btn = document.getElementsByClassName('btn')[0];

            btn.onclick = function changeImg() {
        
                if (img.src.lastIndexOf("img/icon.jpg") != -1) { // 當(dāng)前圖片為img/icon.jpg
                    img.src = 'img/lufei.jpg';
                } else {
                img.src = 'img/icon.jpg';
                }
            }
        </script>
    </body>

效果：

圖片來回切換效果.gif

DOM事件

DOM事件有個有趣的規(guī)則 —— 所有的事件都是以on開頭桥嗤，這樣方便我們記憶和使用

下面會介紹幾種常用的事件

    <body>
        <img name="icon" src="img/icon.jpg" width="100" height="100">

        <script>
            // 當(dāng)window加載時調(diào)用
            window.onload = function () {

                var img = document.getElementsByName('icon')[0];

                // 鼠標(biāo)進(jìn)入圖片
                img.onmouseover = function () {
                    console.log('鼠標(biāo)進(jìn)入圖片');
                }

                // 鼠標(biāo)在圖片上移動
                img.onmousemove = function () {
                    console.log('鼠標(biāo)在圖片上移動');
                }

                // 鼠標(biāo)離開圖片
                img.onmouseout = function () {
                console.log('鼠標(biāo)離開圖片');
                }

                // 圖片被點(diǎn)擊
                img.onclick = function () {
                    console.log('圖片被點(diǎn)擊');
                }
            }
        </script>
    </body>

效果：

DOM事件示例一.gif

順帶提一下，記得之前的文章中仔蝌，我們使用偽類來監(jiān)聽<input>標(biāo)簽獲取焦點(diǎn)時的事件泛领，學(xué)習(xí)JS后，我們可以使用JS來實(shí)現(xiàn)敛惊，記住這么一句話 —— JS是萬能的

    <body>
        <input class="input" type="text" placeholder="我是文本框">

        <script>
            // 獲取input標(biāo)簽
            var input = document.getElementsByClassName('input')[0];

            window.onload = function () {
                // 當(dāng)input獲取焦點(diǎn)時
                input.onfocus = function () {
                    console.log('獲取到焦點(diǎn)');
                }
            }
        </script>
    </body>

效果：

DOM事件示例二.gif

綜合示例一

圖片瀏覽器

需求：分別點(diǎn)擊上一頁和下一頁按鈕可以切換不同圖片

    <body>
        <button class="lastbtn">上一頁</button>
        <img class="img" src="img/icon.jpg" width="100" height="100">
        <button class="nextbtn">下一頁</button>

        <script>
            window.onload = function () {
                // 獲取標(biāo)簽
                var lastBtn = document.getElementsByClassName('lastbtn')[0];
                var nextBtn = document.getElementsByClassName('nextbtn')[0];
                var img = document.getElementsByClassName('img')[0];

                lastBtn.onclick = function () {
                    if (img.src.lastIndexOf('img/icon.jpg') != -1) {
                        img.src = 'img/lufei.jpg';
                    }else {
                        img.src = 'img/icon.jpg';
                    }
                }

                nextBtn.onclick = function () {
                    if (img.src.lastIndexOf('img/icon.jpg') != -1) {
                        img.src = 'img/lufei.jpg';
                    }else {
                        img.src = 'img/icon.jpg';
                    }
                }
            }
        </script>
    </body>

效果：

綜合示例一.gif

綜合示例二

倒計(jì)時

需求：點(diǎn)擊按鈕即開始倒計(jì)時渊鞋，當(dāng)?shù)褂?jì)時結(jié)束時顯示文字標(biāo)題

    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style type="text/css">

            .title{
                /*字體大小*/
                font-size:120px;
                /*字體顏色*/
                color: green;
                /*居中*/
                text-align: center;
                /*隱藏*/
                display:none;
            }

            .countdown{
                font-size:100px;
                color: green;
                text-align: center;
            }
        </style>
    /head>
    <body>
        <div class="title">感謝您的支持</div>
        <div class="countdown">5</div>
        <center><button class="start">開始倒計(jì)時</button></center>

        <script>
            window.onload = function () {
                // 獲取標(biāo)簽
                var countdown = document.getElementsByClassName('countdown')[0];
                var title = document.getElementsByClassName('title')[0];
                var start = document.getElementsByClassName('start')[0];

                // 設(shè)置定時器(需要傳兩個參數(shù),第一個是函數(shù)<也就是要執(zhí)行的方法>, 第二個是執(zhí)行間隔<單位為毫秒:1s==1000ms>)
                start.onclick = function () {
                    // 使用this修飾timer讓其成為全局,方便內(nèi)部使用
                    this.timer = setInterval(function () {

                        countdown.innerText -= 1;

                        if (countdown.innerText == 0) {
                            // 清除定時器
                            clearInterval(this.timer);
                            // 隱藏倒計(jì)時(要設(shè)置css,就需要先獲取style屬性才能獲取到css內(nèi)的屬性進(jìn)行設(shè)置)
                            countdown.style.display = 'none';
                            // 顯示標(biāo)題
                            title.style.display = 'block';
                        }
                    }, 1000);
                }
            }
        </script>
    </body>

效果：

綜合示例二.gif

補(bǔ)充

上面講到了JS的外部樣式，具體操作在這邊補(bǔ)充一下
- 首先,我們確認(rèn)了外部JS文件名后直接現(xiàn)在頭部書寫外部鏈接
```
<script src="JS/index.js"></script>
```
- 接下來在項(xiàng)目中新建JS文件豆混，取名為index ——> 完成詳情可以參考下面的動態(tài)圖

外部JS的操作.gif

還有一點(diǎn)需要注意的是：<script>一般都寫在body的末尾篓像，因?yàn)榻馕銎魇菑纳贤陆馕龅模绻旁谇懊婊蛘?code><head>內(nèi)皿伺，會出現(xiàn)一些不想看到的問題员辩，具體的后續(xù)文章會講解

上面只講了DOM的增和改2個操作，這邊就對DOM的操作再做一下補(bǔ)充

增：這里我們用2種方法給頁面添加<button>標(biāo)簽

// 方式一
document.write('<button>按鈕</button>');

效果：

DOM操作增一.png

還有一種方式鸵鸥，就是拿到相應(yīng)的標(biāo)簽奠滑，往標(biāo)簽內(nèi)新增一個新標(biāo)簽丹皱，我們先給頁面初始化一個div標(biāo)簽

    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style type="text/css">
            .background{
                background: yellow;
                width: 200px;
                height: 200px;
            }
        </style>
    </head>
    <body>
        <div class="background"></div>
        
        <script src="JS/index.js"></script>
    </body>

效果：

DOM操作增二-一.png

接著，在index.js文件中往div內(nèi)添加新的標(biāo)簽

    // 方式二
    // 獲得標(biāo)簽
    var background = document.getElementsByClassName('background')[0];

    // 創(chuàng)建一個新按鈕標(biāo)簽
    var newButton = document.createElement('button');
    newButton.innerText = '新按鈕';
    // 將標(biāo)簽注入div
    background.appendChild(newButton);

效果：

DOM操作增二-二.png

改：上面我們就已經(jīng)使用了多次改的操作宋税，就不再敘述了
- 刪：刪除的話這里介紹最好用的一個
```
    // 刪
    newButton.remove();
```
效果：

DOM操作刪.png

- 查：
    - getElementsByClassName摊崭、getElementsByName、getElementById杰赛、getElementsByTagName上面都說過了
    - 這邊介紹一下怎么查看標(biāo)簽內(nèi)包含的子標(biāo)簽
    <br><br>
    
    ```
        // 查
        var check = background.childNodes;
        console.log(check);
    
    ```

效果：

DOM操作查.png

最后編輯于：2017.12.03 07:46:29

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者

人面猴
序言：七十年代末呢簸，一起剝皮案震驚了整個濱河市，隨后出現(xiàn)的幾起案子乏屯，更是在濱河造成了極大的恐慌根时，老刑警劉巖，帶你破解...
沈念sama閱讀 218,640評論 6贊 507
死咒
序言：濱河連續(xù)發(fā)生了三起死亡事件辰晕，死亡現(xiàn)場離奇詭異蛤迎，居然都是意外死亡，警方通過查閱死者的電腦和手機(jī)含友，發(fā)現(xiàn)死者居然都...
沈念sama閱讀 93,254評論 3贊 395
救了他兩次的神仙讓他今天三更去死
文/潘曉璐我一進(jìn)店門替裆，熙熙樓的掌柜王于貴愁眉苦臉地迎上來，“玉大人窘问，你說我怎么就攤上這事辆童。” “怎么了南缓？”我有些...
開封第一講書人閱讀 165,011評論 0贊 355
道士緝兇錄：失蹤的賣姜人
文/不壞的土叔我叫張陵胸遇，是天一觀的道長。經(jīng)常有香客問我汉形，道長纸镊，這世上最難降的妖魔是什么？我笑而不...
開封第一講書人閱讀 58,755評論 1贊 294
?港島之戀（遺憾婚禮）
正文為了忘掉前任概疆，我火速辦了婚禮逗威，結(jié)果婚禮上，老公的妹妹穿的比我還像新娘岔冀。我一直安慰自己凯旭，他們只是感情好，可當(dāng)我...
茶點(diǎn)故事閱讀 67,774評論 6贊 392
惡毒庶女頂嫁案：這布局不是一般人想出來的
文/花漫我一把揭開白布使套。她就那樣靜靜地躺著罐呼，像睡著了一般。火紅的嫁衣襯著肌膚如雪侦高。梳的紋絲不亂的頭發(fā)上嫉柴，一...
開封第一講書人閱讀 51,610評論 1贊 305
城市分裂傳說
那天暇藏，我揣著相機(jī)與錄音箩言，去河邊找鬼。笑死，一個胖子當(dāng)著我的面吹牛缕贡，可吹牛的內(nèi)容都是我干的蝌麸。我是一名探鬼主播式曲，決...
沈念sama閱讀 40,352評論 3贊 418
雙鴛鴦連環(huán)套：你想象不到人心有多黑
文/蒼蘭香墨我猛地睜開眼囚枪，長吁一口氣：“原來是場噩夢啊……” “哼！你這毒婦竟也來了陈轿？” 一聲冷哼從身側(cè)響起圈纺，我...
開封第一講書人閱讀 39,257評論 0贊 276
萬榮殺人案實(shí)錄
序言：老撾萬榮一對情侶失蹤，失蹤者是張志新（化名）和其女友劉穎麦射，沒想到半個月后赠堵，有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體，經(jīng)...
沈念sama閱讀 45,717評論 1贊 315
?護(hù)林員之死
正文獨(dú)居荒郊野嶺守林人離奇死亡法褥，尸身上長有42處帶血的膿包…… 初始之章·張勛以下內(nèi)容為張勛視角年9月15日...
茶點(diǎn)故事閱讀 37,894評論 3贊 336
?白月光啟示錄
正文我和宋清朗相戀三年，在試婚紗的時候發(fā)現(xiàn)自己被綠了酬屉。大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片半等。...
茶點(diǎn)故事閱讀 40,021評論 1贊 350
活死人
序言：一個原本活蹦亂跳的男人離奇死亡，死狀恐怖呐萨，靈堂內(nèi)的尸體忽然破棺而出杀饵，到底是詐尸還是另有隱情，我是刑警寧澤谬擦，帶...
沈念sama閱讀 35,735評論 5贊 346
?日本核電站爆炸內(nèi)幕
正文年R本政府宣布切距，位于F島的核電站，受9級特大地震影響惨远，放射性物質(zhì)發(fā)生泄漏谜悟。R本人自食惡果不足惜，卻給世界環(huán)境...
茶點(diǎn)故事閱讀 41,354評論 3贊 330
男人毒藥：我在死后第九天來索命
文/蒙蒙一北秽、第九天我趴在偏房一處隱蔽的房頂上張望葡幸。院中可真熱鬧，春花似錦贺氓、人聲如沸蔚叨。這莊子的主人今日做“春日...
開封第一講書人閱讀 31,936評論 0贊 22
一樁弒父案辙培，背后竟有這般陰謀
文/蒼蘭香墨我抬頭看了看天上的太陽蔑水。三九已至，卻和暖如春扬蕊，著一層夾襖步出監(jiān)牢的瞬間搀别，已是汗流浹背。一陣腳步聲響...
開封第一講書人閱讀 33,054評論 1贊 270
情欲美人皮
我被黑心中介騙來泰國打工厨相，沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留领曼，地道東北人鸥鹉。一個月前我還...
沈念sama閱讀 48,224評論 3贊 371
代替公主和親
正文我出身青樓，卻偏偏與公主長得像庶骄，于是被迫代替她去往敵國和親毁渗。傳聞我的和親對象是個殘疾皇子，可洞房花燭夜當(dāng)晚...
茶點(diǎn)故事閱讀 44,974評論 2贊 355

HTML5快速入門（四）—— JavaScript

JS簡介

JS書寫形式

JS基本數(shù)據(jù)類型

JS函數(shù)的定義和使用

對象

通過構(gòu)造函數(shù)來批量產(chǎn)生對象

JS中的兩大內(nèi)置對象之window

JS中的兩大內(nèi)置對象之document

DOM操作

DOM事件

綜合示例一

綜合示例二

補(bǔ)充

推薦閱讀更多精彩內(nèi)容