客戶端腳本語言javascript


2015.11.27  客戶端腳本語言javascript

(叫這個名字的原因。想要攀高枝,希望變得和他一樣通用。關於名字之間的關系類似於雷鋒和雷峰塔,巴基斯坦和卡巴斯基,蘇格拉底跟格拉蘇蒂的關系一樣。阿迪王 和阿迪達斯)康師傅和康帥博

也是javaweb中的一個環節,javascript現在做的也很強大。主要應用於b/s部分的b也就是瀏覽器客戶端的部分。

1、javascript語言,在運行的時候是不需要服務器的,只有瀏覽器就可以對js代碼進行解釋。

2、腳本語言:自身無法獨立在瀏覽器端運行,必須依附在html頁面上。

3、js還是一個弱類型語言,var i=2,i ="2342";//int i=9;

4、面向對象的開發語言

5、js的作用:

1)可以不經過服務器就可以讓程序和用戶產生交互

2)動態的改變頁面的內容(動態操作html的標簽,甚至樣式)

3)對表單進行數據的格式驗證

6、js嵌入到html頁面中的方式:

1)頁內

a.行級

b.head中寫明

2)外部文件

7、數組

1)js 中數組元素可以是任意類型(但是建議只使用一種類型),數據遍歷的時候會更加方便。

2)js 中數組的長度是可以無限增大的。

 

總結:javascript 的概念,嵌入方式,變量的定義和使用,方法的定義和使用 js內置對象和方法。如何獲取輸入框的值 包括id name innerhtml 數組。

 

作業:1、寫一個計算器。(eval())

案例一的啟示,三種引入js的方式。

外部引入和head中寫的script輸出兩者只能存活一個?先存在的會被留下?

 

案例二:可以在腳本中獲得document對象,document.write(“”);優先於html中的語句先被輸出。

案例三:java中:int a,b,c=3;三個變量都是int類型的。

但是在javascript里面,var a,b,c=3;三個變量未必是同一個類型,他們類型的確定,是在賦值之后確定的。那么類型確定之后可以更改么?並且類型確定之后可以更改。

 

<script type="text/javascript">
    var a,b,c=3;
    alert(c);
    c="我是李飛";
    alert(c);
</script>

 

再瀏覽器中得到的結果是:先輸出一遍3,在輸出一個“我是李飛”。

javascript里面把html看做是document對象,html里面的每一個標簽都看做是一個節點node對象。比如<body><table>

 

案例四:從頁面中的得到的數據都被看做是String類型的。

 

<script type="text/javascript">
    var price = prompt("請輸入一個數:");
    price=price+100;
    alert(price);
    price+=100;
    alert(price);
    price=parseInt(price)+100;
    alert(price);
</script>

 

輸出的結果分別是100100,100100100,100100200.

案例五:

<script type="text/javascript" >
    //全局變量
    var number1=1;
    //全局變量
    number2=2;
    function function1(){
        alert(number1+number2);
    }
    function function2(){
        //局部變量
        var number3=4;
        //打折的全局變量
        number4=8;
        alert(number1+number2+number3+number4);
    }
//    alert(number1+number2+number3+number4);
    function1();
    function2();
</script>

這里面所有的內容除了打折的全局變量意外都是可以被理解的。這里主要說明一下區別於java的一些特性。只有當function被調用以后,number4才是全局可到達的。否則,number4一直不可以被使用。作為一個javaer還是不建議這么用。變量要有聲明。統一寫成數字1和數字3的形式。

被注釋的那句話,取消注釋之后,並不會看到結果。因為。會報出number3未定義。

查看方式:

打開瀏覽器后,按F12查看。默認進入Elements需要手動切換到console面板。

 

案例六:

var function1=function (){    
        alert("我們把一個函數的定義賦給一個叫做function1的變量。故,function1就是這個函數的函數名。");
    }
    function1();
    
    for(i=0;i<5;i++){
        
    }
    alert(i);

在循環里面不要糾結,沒有一種定義方式可以把i變成局部的。但是可以騙自己的寫成var i=0。還有一句話一定要給初值。

 

案例七:

算了先上代碼吧:

<script type="text/javascript">
    function function1(){
        var number1 = document.getElementById("number1").value;
        var number2 = document.getElementById("number2").value;
        var result=parseInt(number1)+parseInt(number2);
        alert(result);    
    }
</script>
</head>
<body>
<input type="text" id="number1"/>+
<input type="text" id="number2"/>=
<input type="button" value="計算" onclick="function1()"/>
</body>

這里面會忘記兩個事情,一個是number1上面記得加雙引號,再然后記得加.value.

報這個錯誤是因為沒有加"".

不是一個數字,是因為沒有加value.

還有一個bug。在360里面用飛秋截圖,看不到這個javaScript的提醒(360提醒里面有提示框,但是框里面沒有內容。),但是在chrome里面就能截到完整的這個提醒。

 

並不是所有的聯想都會給出。有些內容的確是有,但是聯想不到。可能這個dreamwaver畢竟只有幾十兆的原因。比如在innerText innerHTML這個屬性上,只有后一個,前面一個並沒有。

可能parseDouble的確沒有 但是 parseFloat是有的。

 

想要給輸出加一個顏色的話,需要下面這種寫法:

<script type="text/javascript">
    function function1(){
        var number1 = document.getElementById("number1").value;
        var number2 = document.getElementById("number2").value;
        var result=parseInt(number1)+parseFloat(number2);    
        document.getElementById("number3").innerHTML="<font color='red'>"+result+"</font>";
    }
</script>
</head>
<body>
<input type="text" id="number1"/>+
<input type="text" id="number2"/>=
<span id="number3"></span>
<input type="button" value="計算" onclick="function1()"/>

容易忘記的點在於:document.getElementById("number3").innerHTML=后面要組拼一下,並且要記得加""進行組拼。

 

案例8:如果要提交的東西,有操作數1、運算符1、操作數2,和提交按鈕,四個值,為什么不加一個表單呢。

 

數組比較好理解,老師當時也講得比較清楚,這里就不寫了。

計算器,不大會做啊。。

什么是JavaScript

JavaScript是一種腳本語言,提供用戶交互,動態更改內容,數據驗證。

主要功能是:1、數據驗證 2、網頁特效 3js是腳本語言,所以它的代碼也成為js腳本。

數據類型:

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM