A. 什麼是JavaScript
Javascript是一種由Netscape的LiveScript發展而來的腳本語言,主要目的是為了解決伺服器終端語言,比如Perl,遺留的速度問題。當時服務端需要對數據進行驗證,由於網路速度相當緩慢,只有28.8kbps,驗證步驟浪費的時間太多。於是Netscape的瀏覽器Navigator加入了Javascript,提供了數據驗證的基本功能。
歷史
在1992年,Nombas開始開發一種嵌入式腳本語言,叫做C-minus-minus(Cmm)。[待續...
能夠具有交互性,能夠包含更多活躍的元素,就有必要在網頁中嵌入其它的技術。如:Javascript、VBScript、Document Object Model(文件目標模塊)、Layers和 Cascading Style Sheets(CSS),這里主要講Javascript。那麼Javascript是什麼東東?Javascript就是適應動態網頁製作的需要而誕生的一種新的編程語言,如今越來越廣泛地使用於Internet網頁製作上。 Javascript是由 Netscape公司開發的一種腳本語言(scripting language),或者稱為描述語言。在HTML基礎上,使用Javascript可以開發互動式Web網頁。Javascript的出現使得網頁和用戶之間實現了一種實時性的、動態的、交互性的關系,使網頁包含更多活躍的元素和更加精彩的內容。 運行用Javascript編寫的程序需要能支持Javascript語言的瀏覽器。Netscape公司 Navigator 3.0以上版本的瀏覽器都能支持 Javascript程序,微軟公司 Internet Explorer 3.0以上版本的瀏覽器基本上支持Javascript。微軟公司還有自己開發的Javascript,稱為JScript。 Javascript和Jscript基本上是相同的,只是在一些細節上有出入。 Javascript短小精悍, 又是在客戶機上執行的,大大提高了網頁的瀏覽速度和交互能力。 同時它又是專門為製作Web網頁而量身定做的一種簡單的編程語言。
雖然,在Dreamweaver的Behaviors可以為我們方便地使用Javascript程序而不用編寫代碼,但我們自己了解了Javascript的編程方法後,將能更加方便靈活地應用,也使Javascript的代碼更簡練。本專題通過對一系列典型程序的剖析,使你快速地掌握Javascript的編程技巧,設計出質量上乘的動態網頁打下堅實的基礎。在此之前,我們先了解一些Javascript 的基本概念。
JavaScript 有什麼特點
JavaScript 使網頁增加互動性。JavaScript 使有規律地重復的HTML文段簡化,減少下載時間。JavaScript 能及時響應用戶的操作,對提交表單做即時的檢查,無需浪費時間交由 CGI 驗證。JavaScript 的特點是無窮無盡的,只要你有創意。
Java 與 JavaScript 有什麼不同
很多人看到 Java 和 JavaScript 都有「Java」四個字,就以為它們是同一樣東西,連我自己當初也是這樣。其實它們是完完全全不同的兩種東西。Java,全稱應該是 Java Applet,是嵌在網頁中,而又有自己獨立的運行窗口的小程序。Java Applet 是預先編譯好的,一個 Applet 文件(.class)用 Notepad 打開閱讀,根本不能理解。Java Applet 的功能很強大,可以訪問 http、ftp等協議,甚至可以在電腦上種病毒(已有先例了)。相比之下,JavaScript 的能力就比較小了。JavaScript 是一種「腳本」(「Script」),它直接把代碼寫到 HTML 文檔中,瀏覽器讀取它們的時候才進行編譯、執行,所以能查看 HTML 源文件就能查看JavaScript 源代碼。JavaScript 沒有獨立的運行窗口,瀏覽器當前窗口就是它的運行窗口。它們的相同點,我想只有同是以 Java 作編程語言一點了。
開發 JavaScript 該用什麼軟體
一個 JavaScript 程序其實是一個文檔,一個文本文件。它是嵌入到 HTML 文檔中的。所以,任何可以編寫 HTML 文檔的軟體都可以用來開發 JavaScript。在此我推薦大家用 FrontPage 2000 附帶的 Microsoft 腳本編輯器(在 FrontPage 菜單 | 工具 | 宏 | Microsoft 腳本編輯器)。它是個像 Visual Basic / C++ 一樣的程序開發器,能對正在輸入的語句作出簡要提示。配合 FrontPage 2000,使工作量大大減少。
一、Javascript在網頁的用法
Javascript加入網頁有兩種方法:
1、直接加入HTML文檔
這是最常用的方法,大部分含有Javascript的網頁都採用這種方法,如:
<script language="Javascript">
<!--
document.writeln("這是Javascript!採用直接插入的方法!");
//-Javascript結束-->
</script>
在這個例子中,我們可看到一個新的標簽: <script>……</script>,而<script language="Javascript」> 用來告訴瀏覽器這是用Javascript編寫的程序,需要調動相應的解釋程序進行解釋。
HTML的注釋標簽<!--和-->:用來去掉瀏覽器所不能識別的Javascript源代碼的,這對不支持 Javascript 語言的瀏覽器來說是很有用的。
//-Javascript結束:雙斜杠表示 Javascript的注釋部分,即從//開始到行尾的字元都被忽略。 至於程序中所用到的document.write()函數則表示將括弧中的文字輸出到窗口中去, 這在後面將會詳細介紹。 另外一點需要注意的是,<script>……</script>的位置並不是固定的,可以包含在<head>......</head> 或<body>.....</body>中的任何地方。
2、引用方式 如果已經存在一個Javascript源文件(以js為擴展名),則可以採用這種引用的方式,以提高程序代碼的利用率。其基本格式如下:
<script src=url language="Javascript"></script>
其中的Url就是程序文件的地址。同樣的,這樣的語句可以放在HTML文檔頭部或主體的任何部分。 如果要實現「直接插入方式」中所舉例子的效果,可以首先創建一個Javascript源代碼文件「Script.js」,其內容如下:
document.writeln("這是Javascript!採用直接插入的方法!");
在網頁中可以這樣調用程序:<script src="Script.js" language="Javascript"></script> 。
二、Javascript基本概念
在這里只作簡單介紹,在以後的例子中結程序再作具體解釋其作用。
1、運算符
運算符就是完成操和的一系列符號,它有七類:
賦值運算符、算術運算符、比較運算符、邏輯運算符、條件運算、位操作運算符和字元串運算符。
2、表達式
運算符和操作數的組合稱為表達式,通常分為四類:賦值表達式、算術表達式、布爾表達式和字元串表達式。
3、語句
Javascript程序是由若干語句組成的,語句是編寫程序的指令。Javascript提供了完整的基本編程語句,它們是:
賦值語句、switch選擇語句、while循環語句、for循環語句、do while循環語句、break循環中止語句和continue循環中斷語句。
4、函數
函數是命名的語句段,這個語句段可以被當作一個整體來引用不著和執行。使用函數要注意以下幾點:
1)函數由關鍵字function定義;
2)函數必須先定義後使用,否則將出錯;
3)函數名是調用函數時引用的名稱,它對大小寫是敏感的,調用函數時不可寫錯函數名;
4)參數表示傳遞給函數使用或操作的值,它可以是常量,也可以是變數;
5)return語句用於返回表達式的值,也可以沒有。
5、對象
Javascript的一個重要功能就是基於對象的功能,通過基於對象的程序設計,可以用更直觀、模塊化和可重復使用的方式進行程序開發。
一組包含數據的屬性和對屬性中包含數據進行操作的方法,稱為對象。比如要設定網頁的背景顏色,所針對的對象就是document,所用的屬性名是bgcolor,如document.bgcolor="blue",就是表示使背景的顏色為藍色。
6、事件
用戶與網頁交互時產生的操作,稱為事件。絕大部分事都由用戶的動作所引發,如:用戶按滑鼠的按鈕,就產生onclick事件,若滑鼠的指針的鏈接上移動,就產生onmouseover事件等等。在Javascript中,事件往往與事件處理程序配套使用。
學習Javascript比較快速有效的方法是先熟悉一些基本概念,然後找幾個別人設計好的程序認真仔細地分析一遍,再稍作改動,再看看能否達到預期目的,不斷地舉一反三,既可以加深對一些參數、設計方法的理解,又可以快速地提高自己的水平。另外,再提醒一下:Javascript對大小寫是敏感的,特別是一些對象、方法、屬性的大小寫一定要一致,要養成一種良好的習慣,否則在調試程序時可要累死你了。
7、變數
如 var myVariable = "some value";
B. JavaScript實現頁面跳轉的幾種常用方式
按鈕式:
<INPUT name="pclog" type="button" value="GO" onClick="location.href='www.2345.com/?k23052790'">
鏈接式:
<a href="javascript:history.go(-1)">返回上一步</a>
直接跳轉式:
<script>window.location.href='www.2345.com/?k23052790';</script>
開新窗口:
<a href="javascript:" onClick="window.open(『www.2345.com/?k23052790』)」>
C. javascript常用的技巧
1) 使用!!將變數轉換成布爾類型
有時,我們需要檢查一些變數是否存在,或者它是否具有有效值,從而將它們的值視為true。對於做這樣的檢查,你可以使用||(雙重否定運算符),它能自動將任何類型的數據轉換為布爾值,只有這些變數才會返回false:0,null,"",undefined或NaN,其他的都返回true。我們來看看這個簡單的例子:
function Account(cash) {
this.cash = cash;
this.hasMoney = !!cash;
}
var account = new Account(100.50);
console.log(account.cash); // 100.50
console.log(account.hasMoney); // true
var emptyAccount = new Account(0);
console.log(emptyAccount.cash); // 0
console.log(emptyAccount.hasMoney); // false
在這個例子中,如果account.cash的值大於零,則account.hasMoney的值就是true。
2) 使用+將變數轉換成數字
這個轉換超級簡單,但它只適用於數字字元串,不然就會返回NaN(不是數字)。看看這個例子:
function toNumber(strNumber) {
return +strNumber;
}
console.log(toNumber("1234")); // 1234
console.log(toNumber("ACB")); // NaN
這個轉換操作也可以作用於Date,在這種情況下,它將返回時間戳:
console.log(+new Date()) // 1461288164385
3) 短路條件
如果你看到過這種類似的代碼:
if (conected) {
login();
}
那麼你可以在這兩個變數之間使用&&(AND運算符)來縮短代碼。例如,前面的代碼可以縮減到一行:
conected && login();
你也可以用這種方法來檢查對象中是否存在某些屬性或函數。類似於以下代碼:
user && user.login();
4) 使用||設置默認值
在ES6中有默認參數這個功能。為了在舊版瀏覽器中模擬此功能,你可以使用||(OR運算符),並把默認值作為它的第二個參數。如果第一個參數返回false,那麼第二個參數將會被作為默認值返回。看下這個例子:
function User(name, age) {
this.name = name || "Oliver Queen";
this.age = age || 27;
}
var user1 = new User();
console.log(user1.name); // Oliver Queen
console.log(user1.age); // 27
var user2 = new User("Barry Allen", 25);
console.log(user2.name); // Barry Allen
console.log(user2.age); // 25
5) 在循環中緩存array.length
這個技巧非常簡單,並且在循環處理大數組時能夠避免對性能造成巨大的影響。基本上幾乎每個人都是這樣使用for來循環遍歷一個數組的:
for (var i = 0; i < array.length; i++) {
console.log(array[i]);
}
如果你使用較小的數組,那還好,但是如果處理大數組,則此代碼將在每個循環里重復計算數組的大小,這會產生一定的延遲。為了避免這種情況,你可以在變數中緩存array.length,以便在循環中每次都使用緩存來代替array.length:
var length = array.length;
for (var i = 0; i < length; i++) {
console.log(array[i]);
}
為了更簡潔,可以這么寫:
for (var i = 0, length = array.length; i < length; i++) {
console.log(array[i]);
}
6) 檢測對象中的屬性
當你需要檢查某些屬性是否存在,避免運行未定義的函數或屬性時,這個技巧非常有用。如果你打算編寫跨瀏覽器代碼,你也可能會用到這個技術。例如,我們假設你需要編寫與舊版Internet Explorer 6兼容的代碼,並且想要使用document.querySelector()來通過ID獲取某些元素。 但是,在現代瀏覽器中,這個函數不存在。所以,要檢查這個函數是否存在,你可以使用in運算符。看下這個例子:
if ('querySelector' in document) {
document.querySelector("#id");
} else {
document.getElementById("id");
}
在這種情況下,如果在document中沒有querySelector函數,它就會使用document.getElementById()作為代替。
D. javascript常用的特效有哪些
javascript
一種由Netscape的LiveScript發展而來的腳本語言,它提高與Java的兼容性。JavaScript採用HTML頁作為其介面
一、Javascript在網頁的用法
Javascript加入網頁有兩種方法:
1、直接加入HTML文檔
這是最常用的方法,大部分含有Javascript的網頁都採用這種方法,如:
<script language="Javascript">
<!--
document.writeln("這是Javascript!採用直接插入的方法!");
//-Javascript結束-->
</script>
在這個例子中,我們可看到一個新的標簽: <script>……</script>,而<script language="Javascript」> 用來告訴瀏覽器這是用Javascript編寫的程序,需要調動相應的解釋程序進行解釋。
HTML的注釋標簽<!--和-->:用來去掉瀏覽器所不能識別的Javascript源代碼的,這對不支持 Javascript 語言的瀏覽器來說是很有用的。
//-Javascript結束:雙斜杠表示 Javascript的注釋部分,即從//開始到行尾的字元都被忽略。至於程序中所用到的document.write()函數則表示將括弧中的文字輸出到窗口中去,這在後面將會詳細介紹。另外一點需要注意的是,<script>……</script>的位置並不是固定的,可以包含在< head>......</head> 或<body>.....</body>中的任何地方。
2、引用方式 如果已經存在一個Javascript源文件(以js為擴展名),則可以採用這種引用的方式,以提高程序代碼的利用率。其基本格式如下:
<script src=url language="Javascript"></script>
其中的Url就是程序文件的地址。同樣的,這樣的語句可以放在HTML文檔頭部或主體的任何部分。 如果要實現「直接插入方式」中所舉例子的效果,可以首先創建一個Javascript源代碼文件「Script.js」,其內容如下:
document.writeln("這是Javascript!採用直接插入的方法!");
在網頁中可以這樣調用程序:<script src="Script.js" language="Javascript"></script> 。
E. javascript中有哪些方法
建議常看API文檔
F. JavaScript在網頁製作中的用途 以及常用方法
二級導航的特效,利用滑鼠觸發的使層隱藏和可見
常用於一些特效,如tab的切換等,主要增加網頁的動態感
G. JavaScript中window對象常用的屬性、方法
javascript中window對象的集合屬性和方法
Window對象的集合
frames[] 取得Window對象中所有已命名的frame
Window對象的屬性
closed 窗口是否關閉
defaultStatus 窗口狀態欄的默認文本
document Document對象
history History對象
length Window對象的frame個數
location Location對象
name Window對象的名稱
opener 打開當前Window的窗口的引用
parent 父窗口
self 返回當前窗口的引用
status 窗口狀態欄文本
top 最頂層窗口
Window對象的方法
alert([Message]) 顯示帶有警告信息Message的窗口,並有「確定」按鈕
blur() 移除本窗口的焦點
clearInterval(iIntervalID) 取消先前用setInterval方法開始的標識為iIntervalID的間隔事件
clearTimeout(iTimeoutID) 取消先前用setTimeout方法開始的標識為iTimeoutID的超時事件
close() 關閉當前窗口
confirm([message]) 顯示帶有確認信息message的窗口,有「確定」和「取消」按鈕
createPopup() 創建彈出窗口,返回該窗口對象的引用
focus() 使本窗口獲得焦點
moveBy(x,y) 將窗口的位置移動到指定的x和y偏移值
moveTo(x,y) 將窗口左上角的屏幕位置移動到指定的x和y位置
open() 打開新窗口,顯示指定的頁面
print() 列印與窗口關聯的文檔
prompt([message][,defaultValue]) 顯示提示對話框,帶有提示消息message和默認值defaultValue的
輸入框,返回用戶輸入的字元串
resizeBy(x,y) 更改窗口的當前位置縮放指定的x和y偏移量
resizeTo(x,y) 將窗口的大小更改為指定的寬度值x和高度值y
scrollBy(x,y) 將窗口滾動x和y偏移量
scrollTo(x,y) 將窗口滾動到指定的x和y偏移量
setInterval(code,ms[,language]) 每經過ms毫秒後執行代碼code,language指定語言屬性。返回整形標
識,以便clearInterval方法取消該定時器
setTimeout(code,ms[,language]) 經過ms毫秒後執行代碼code,language指定語言屬性。返回整形標識
,以便clearTimeout方法取消該定時器
H. javascript使用技巧
js很靈活的主要還是由人,多些一些,常用的方法和類,能讓你在開發的時候速度更快一些
I. javascript是什麼
javascript
一種由Netscape的LiveScript發展而來的腳本語言,它提高與Java的兼容性。JavaScript採用HTML頁作為其介面
為了使網頁能夠具有交互性,能夠包含更多活躍的元素,就有必要在網頁中嵌入其它的技術。如:Javascript、VBScript、 Document Object Model(文件目標模塊)、Layers和 Cascading Style Sheets(CSS),這里主要講Javascript。那麼Javascript是什麼東東?Javascript就是適應動態網頁製作的需要而誕生的一種新的編程語言,如今越來越廣泛地使用於Internet網頁製作上。 Javascript是由 Netscape公司開發的一種腳本語言(scripting language),或者稱為描述語言。在HTML基礎上,使用Javascript可以開發互動式Web網頁。Javascript的出現使得網頁和用戶之間實現了一種實時性的、動態的、交互性的關系,使網頁包含更多活躍的元素和更加精彩的內容。運行用Javascript編寫的程序需要能支持 Javascript語言的瀏覽器。Netscape公司 Navigator 3.0以上版本的瀏覽器都能支持 Javascript程序,微軟公司 Internet Explorer 3.0以上版本的瀏覽器基本上支持Javascript。微軟公司還有自己開發的Javascript,稱為JScript。 Javascript和Jscript基本上是相同的,只是在一些細節上有出入。 Javascript短小精悍,又是在客戶機上執行的,大大提高了網頁的瀏覽速度和交互能力。同時它又是專門為製作Web網頁而量身定做的一種簡單的編程語言。
雖然,在Dreamweaver的Behaviors 可以為我們方便地使用Javascript程序而不用編寫代碼,但我們自己了解了Javascript的編程方法後,將能更加方便靈活地應用,也使 Javascript的代碼更簡練。本專題通過對一系列典型程序的剖析,使你快速地掌握Javascript的編程技巧,設計出質量上乘的動態網頁打下堅實的基礎。在此之前,我們先了解一些Javascript 的基本概念。
JavaScript 有什麼特點
JavaScript 使網頁增加互動性。JavaScript 使有規律地重復的HTML文段簡化,減少下載時間。JavaScript 能及時響應用戶的操作,對提交表單做即時的檢查,無需浪費時間交由 CGI 驗證。JavaScript 的特點是無窮無盡的,只要你有創意。
Java 與 JavaScript 有什麼不同
很多人看到 Java 和 JavaScript 都有「Java」四個字,就以為它們是同一樣東西,連我自己當初也是這樣。其實它們是完完全全不同的兩種東西。Java,全稱應該是 Java Applet,是嵌在網頁中,而又有自己獨立的運行窗口的小程序。Java Applet 是預先編譯好的,一個 Applet 文件(.class)用 Notepad 打開閱讀,根本不能理解。Java Applet 的功能很強大,可以訪問 http、ftp等協議,甚至可以在電腦上種病毒(已有先例了)。相比之下,JavaScript 的能力就比較小了。JavaScript 是一種「腳本」(「Script」),它直接把代碼寫到 HTML 文檔中,瀏覽器讀取它們的時候才進行編譯、執行,所以能查看 HTML 源文件就能查看JavaScript 源代碼。JavaScript 沒有獨立的運行窗口,瀏覽器當前窗口就是它的運行窗口。它們的相同點,我想只有同是以 Java 作編程語言一點了。
開發 JavaScript 該用什麼軟體
一個 JavaScript 程序其實是一個文檔,一個文本文件。它是嵌入到 HTML 文檔中的。所以,任何可以編寫 HTML 文檔的軟體都可以用來開發 JavaScript。在此我推薦大家用 FrontPage 2000 附帶的 Microsoft 腳本編輯器(在 FrontPage 菜單 | 工具 | 宏 | Microsoft 腳本編輯器)。它是個像 Visual Basic / C++ 一樣的程序開發器,能對正在輸入的語句作出簡要提示。配合 FrontPage 2000,使工作量大大減少。
一、Javascript在網頁的用法
Javascript加入網頁有兩種方法:
1、直接加入HTML文檔
這是最常用的方法,大部分含有Javascript的網頁都採用這種方法,如:
<script language="Javascript">
<!--
document.writeln("這是Javascript!採用直接插入的方法!");
//-Javascript結束-->
</script>
在這個例子中,我們可看到一個新的標簽: <script>……</script>,而<script language="Javascript」> 用來告訴瀏覽器這是用Javascript編寫的程序,需要調動相應的解釋程序進行解釋。
HTML的注釋標簽<!--和-->:用來去掉瀏覽器所不能識別的Javascript源代碼的,這對不支持 Javascript 語言的瀏覽器來說是很有用的。
//-Javascript結束:雙斜杠表示 Javascript的注釋部分,即從//開始到行尾的字元都被忽略。至於程序中所用到的document.write()函數則表示將括弧中的文字輸出到窗口中去,這在後面將會詳細介紹。另外一點需要注意的是,<script>……</script>的位置並不是固定的,可以包含在< head>......</head> 或<body>.....</body>中的任何地方。
2、引用方式 如果已經存在一個Javascript源文件(以js為擴展名),則可以採用這種引用的方式,以提高程序代碼的利用率。其基本格式如下:
<script src=url language="Javascript"></script>
其中的Url就是程序文件的地址。同樣的,這樣的語句可以放在HTML文檔頭部或主體的任何部分。 如果要實現「直接插入方式」中所舉例子的效果,可以首先創建一個Javascript源代碼文件「Script.js」,其內容如下:
document.writeln("這是Javascript!採用直接插入的方法!");
在網頁中可以這樣調用程序:<script src="Script.js" language="Javascript"></script> 。
二、Javascript基本概念
在這里只作簡單介紹,在以後的例子中結程序再作具體解釋其作用。
1、運算符
運算符就是完成操和的一系列符號,它有七類:
賦值運算符、算術運算符、比較運算符、邏輯運算符、條件運算、位操作運算符和字元串運算符。
2、表達式
運算符和操作數的組合稱為表達式,通常分為四類:賦值表達式、算術表達式、布爾表達式和字元串表達式。
3、語句
Javascript程序是由若干語句組成的,語句是編寫程序的指令。Javascript提供了完整的基本編程語句,它們是:
賦值語句、switch選擇語句、while循環語句、for循環語句、do while循環語句、break循環中止語句和continue循環中斷語句。
4、函數
函數是命名的語句段,這個語句段可以被當作一個整體來引用不著和執行。使用函數要注意以下幾點:
1)函數由關鍵字function定義;
2)函數必須先定義後使用,否則將出錯;
3)函數名是調用函數時引用的名稱,它對大小寫是敏感的,調用函數時不可寫錯函數名;
4)參數表示傳遞給函數使用或操作的值,它可以是常量,也可以是變數;
5)return語句用於返回表達式的值,也可以沒有。
5、對象
Javascript的一個重要功能就是基於對象的功能,通過基於對象的程序設計,可以用更直觀、模塊化和可重復使用的方式進行程序開發。
一組包含數據的屬性和對屬性中包含數據進行操作的方法,稱為對象。比如要設定網頁的背景顏色,所針對的對象就是document,所用的屬性名是bgcolor,如document.bgcolor="blue",就是表示使背景的顏色為藍色。
6、事件
用戶與網頁交互時產生的操作,稱為事件。絕大部分事都由用戶的動作所引發,如:用戶按滑鼠的按鈕,就產生onclick事件,若滑鼠的指針的鏈接上移動,就產生onmouseover事件等等。在Javascript中,事件往往與事件處理程序配套使用。
學習Javascript比較快速有效的方法是先熟悉一些基本概念,然後找幾個別人設計好的程序認真仔細地分析一遍,再稍作改動,再看看能否達到預期目的,不斷地舉一反三,既可以加深對一些參數、設計方法的理解,又可以快速地提高自己的水平。另外,再提醒一下:Javascript對大小寫是敏感的,特別是一些對象、方法、屬性的大小寫一定要一致,要養成一種良好的習慣,否則在調試程序時可要累死你了。
7、變數
如 var myVariable = "some value";
參考資料:http://www.mophisoft.com