JavaScript 簡單介紹

admin發表於2018-05-22
JavaScript

JavaScript是當前最為流行的程式語言之一。

非常適合用於web程式設計，比如頁面HTML元素的操作。

一.JavaScript特點:

（1）.它是一門指令碼語言。

（2）.它是一門輕量級的程式語言。

（3）.JavaScript程式碼可直接插入HTML元素之中。

（4）.以瀏覽器作為執行環境。

二.將從本教程學到的知識:

（1）.JavaScript語法知識。

（2）.JavaScript對DOM元素的操作。

（3）.JavaScript對瀏覽器物件的操作。

特別說明:本版塊只涉及ES5知識，ES2015+相關知識可以參閱ES6教程板塊。

三.JavaScript的構成:

JavaScript是ECMAScript規範在瀏覽器中的具體實現。

ECMAScript是一個標準，定義最基本的行為準則，與特定的宿主環境無關，它為不同的宿主環境提供核心程式設計能力，沒有與使用者互動的功能。除瀏覽器的JavaScript，Flash和Director MX的ActionScript也是它的具體實現。

JavaScript的執行環境是瀏覽器，擴充套件了對瀏覽器window物件（簡稱BOM）相關操作。document物件（簡稱DOM物件）屬於window物件，但是由於JavaScript核心就是對document的操作，所以通常將其獨立出來介紹。所以JavaScript可以認為由如下三部分構成:

a:3:{s:3:\"pic\";s:43:\"portal/201702/26/001902ddvrm9wv93r3fvwk.gif\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

四.程式碼例項:

[HTML] 純文字檢視 複製程式碼執行程式碼
<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
<meta name="author" content="http://www.softwhy.com/" /> 
<title>螞蟻部落</title>
<style>
div {
  width:100px;
  height:100px;
  background-color:#ccc;
}
</style>
<script>
window.onload = function () {
  var obt = document.getElementById("bt");
  var odiv = document.getElementById("ant");
  obt.onclick = function () {
    odiv.style.backgroundColor = "red";
  }
}
</script>
</head> 
<body>
<div id="ant"></div>
<input type="button" id="bt" value="檢視演示"/>
</body>
</html>

點選按鈕可以將div元素的背景顏色設定為紅色；這就是最為基礎的dom元素操作。

[HTML] 純文字檢視 複製程式碼執行程式碼
<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
<meta name="author" content="http://www.softwhy.com/" /> 
<title>螞蟻部落</title>
<style>
div {
  width:400px;
  height:100px;
  background-color:#ccc;
}
</style>
<script>
window.onload = function () {
  var obt = document.getElementById("bt");
  var odiv = document.getElementById("ant");
  obt.onclick = function () {
    odiv.innerHTML = location.href;
  }
}
</script>
</head> 
<body>
<div id="ant"></div>
<input type="button" id="bt" value="檢視演示"/>
</body>
</html>

點選按鈕可以將當前頁面URL地址寫入div，這裡不但涉及DOM操作，也涉及到了BOM操作。

相關文章