溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

JavaScript入門基礎(chǔ)

發(fā)布時(shí)間:2020-07-13 13:03:05 來(lái)源:網(wǎng)絡(luò) 閱讀:245 作者:專注地一哥 欄目:web開發(fā)

一、JavaScript簡(jiǎn)介
JavaScript是一種屬于網(wǎng)絡(luò)的解釋性腳本語(yǔ)言,已經(jīng)被廣泛用于Web應(yīng)用開發(fā),常用來(lái)為網(wǎng)頁(yè)添加各式各樣的動(dòng)態(tài)功能,為用戶提供更流暢美觀的瀏覽效果。通常JavaScript腳本是通過嵌入在HTML中來(lái)實(shí)現(xiàn)自身的功能的。
主要用來(lái)向HTML(標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言下的一個(gè)應(yīng)用)頁(yè)面添加交互行為。
可以直接嵌入HTML頁(yè)面,但寫成單獨(dú)的js文件有利于結(jié)構(gòu)和行為的分離。
跨平臺(tái)特性,在絕大多數(shù)瀏覽器的支持下,可以在多種平臺(tái)下運(yùn)行。
Javascript提供了四種基本的數(shù)據(jù)類型和兩種特殊數(shù)據(jù)類型用來(lái)處理數(shù)據(jù)和文字。而變量提供存放信息的地方,表達(dá)式則可以完成較復(fù)雜的信息處理。
二、為什么要學(xué)JavaScript?
所有主流瀏覽器都支持JavaScript
目前,ThinkMarkets代理申請(qǐng)www.kaifx.cn/broker/thinkmarkets.html,全世界大部分網(wǎng)頁(yè)都使用JavaScript
它可以讓網(wǎng)頁(yè)呈現(xiàn)各種動(dòng)態(tài)效果
三、開始正式學(xué)習(xí)JavaScript

  1. <script>標(biāo)簽
    <script>
    JS代碼在這里
    html代碼不能寫在這里!
    </script>
    <script>標(biāo)簽可被放置在 HTML 頁(yè)面的 <body> 和 <head> 部分中。
    <script> 和 </script> 會(huì)告訴 JavaScript 在何處開始和結(jié)束。
  2. document.getElementById( )
    document.getElementById("id").style.color="color";
    <Button type="Button" onclick="alert('Hello World!')">點(diǎn)我這個(gè)Button!</Button>
    document.getElementById("h2").innerHTML="innerHTML可以替換HTML元素";
  3. 控制臺(tái)輸出
    控制臺(tái)輸出: console.log()
    清除控制臺(tái)信息: console.clear()
  4. 注釋
    HTML注釋 <!-- -->
    JavaScript注釋 // /.../
  5. 數(shù)據(jù)類型
    在 JavaScript 中有 5 種不同的數(shù)據(jù)類型:
    string number boolean object function
    3種對(duì)象類型:
    Object Date Array
    2個(gè)不包含任何值的數(shù)據(jù)類型:
    null undefined
    如果對(duì)象是 JavaScript Array 或 JavaScript Date,我們就無(wú)法通過typeof來(lái)判斷他們的類
    型,因?yàn)槎际欠祷豋bject。
  6. 變量申明
    var a = 666;
    var b = "666 abc";
    1
    2
  7. 數(shù)組
    var person = {
    firstName:"John",
    lastName:"Doe",
    age:50,
    eyeColor:"blue"
    };
  8. 函數(shù)
    function(){
    ...
    }
  9. 內(nèi)嵌函數(shù)
    JavaScript 支持嵌套函數(shù),嵌套函數(shù)可以訪問上一層的函數(shù)變量。
    該實(shí)例中,內(nèi)嵌函數(shù) plus() 可以訪問父函數(shù)的 counter 變量。
    實(shí)例:
    function add() {
    var counter = 0;
    function plus() {counter += 1;}
    plus();
    return counter;
    }
  10. 正則表達(dá)式
    正則表達(dá)式(在代碼中常簡(jiǎn)寫為regex、regexp或RE)使用單個(gè)字符串來(lái)描述、匹
    配一系列符合某個(gè)句法規(guī)則的字符串搜索模式。
    正則表達(dá)式是由一個(gè)字符序列形成的搜索模式。
    當(dāng)你在文本中搜索數(shù)據(jù)時(shí),你可以用搜索模式來(lái)描述你要查詢的內(nèi)容。
    正則表達(dá)式可用于所有文本搜索和文本替換的操作。
    語(yǔ)法
    /正則表達(dá)式主體/修飾符(可選),其中修飾符是可選的。
    實(shí)例:var patt = /runoob/i
    11.js重定向
    <body>
    //都能激活提示框
    <a href="javascript:alert('我是重定向的代碼');">hellow</a>
    <form action="javascript:alert('提交表單');">
    <input type="submit" value="提交表單" />
    </form>
    </body>
    12.判斷
    == 只判斷內(nèi)容,不管類型
    === 全等,既判斷內(nèi)容,又判斷類型
    != 只判斷內(nèi)容,不管類型
    !== 既判斷內(nèi)容,又判斷類型
    13.運(yùn)算
    (1)與運(yùn)算(要求左右兩邊的條件都是true,結(jié)果是true)
    var hd = 11>2 && 3>2;
    (2)或運(yùn)算(左右兩邊條件至少有一邊是true,結(jié)果才是true)
    var hd = 11>20 || 3>21;
    (3)非運(yùn)算(取反,真的變成假的,假的變成真的)
    var hd = !(2>1);
    (4)三元運(yùn)算符/三元表達(dá)式
    (條件)?條件為真的時(shí)候返回的值:條件為假的時(shí)候返回的值;
    (5)轉(zhuǎn)換數(shù)值類型
    Number
    parseFloat
    parselnt
    isNaNAN
    eval
    14.對(duì)象
    (1)構(gòu)造函數(shù)
    <script type="text/javascript">
    // 構(gòu)造函數(shù)(類)
    function ren(){
    this.name = '名字';
    this.sex = '性別';
    this.height = '身高';
    this.weight = '體重';
    this.look = function(){
    alert('能看見東西');
    };
    this.run = function(){
    alert('能跑');
    };
    }
    ren(ren);
    // 通過構(gòu)造函數(shù)實(shí)例化具體對(duì)象
    var xiawa = new ren();
    xiawa.name = '夏娃';
    document.write(xiawa.name);
    xiawa.sex = '女孩';
    document.write(xiawa.sex);
    var yadang = new ren();
    yadang.name = '亞當(dāng)';
    document.write(yadang.name);
    // 執(zhí)行對(duì)象里的方法
    yadang.run();
    // 追加新屬性和新方法
    yadang.wenshen = '兩只皮皮蝦';
    document.write(yadang.wenshen);
    yadang.tree = function(){
    alert('會(huì)爬樹');
    }
    yadang.tree();
    </script>
    (2)遍歷
    <script type="text/javascript">
    var auas = {
    price:'8000元',
    size:'15.6寸',
    weight:'3kg',
    color:'黑色',
    game:function (){
    alert('玩游戲')
    },
    chat:function(){
    alert('聊天')
    }
    };
    // x表示當(dāng)前遍歷到的屬性的屬性名字字符串形式,auas表示提用auas數(shù)組
    for (x in auas) {
    document.write(x+'=>'+auas[x]+'<br />');
    }
    </script>
向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI