getElementById
字面意思，分開四個單詞。通過如下案例，可以改變HTML上的內容：
注意嚴格按照大小寫
<p id="demo">改變 HTML 內容</p>
<button type="button" onclick='document.getElementById("demo").innerHTML = "Hello JavaScript!"'>點擊我</button>
按一下後（onclick）查找 id 爲 demo 的HTML 元素，並把元素內容更改爲（innerHTML） “Hello JavaScript!”
<button onclick="document.getElementById('Image').src=' ' ">點擊我</button>
innerHTML 換爲 src 將可以改變獲取圖片路徑，即改變了 HTML 內 src 的屬性值
<button type="button" onclick="document.getElementById('demo').style.fontSize='66px'">點擊我</button>
指定CSS style 的 fontSize 屬性進行改變其值
<button type="button" onclick="document.getElementById('demo').style.display='none'">點擊我</button>
改變元素 display 屬性值爲 none 可使原本顯示的指定元素隱藏
改變元素 display 屬性值爲 block 可使原本隱藏的指定元素顯示
函數
JavaScript 代碼像 CSS 一樣需在特定標籤內，CSS 爲<style>
JavaScript 代碼必須位於 <script> 與 </script> 標籤之間，如：
<head>
<script>
function myFunction()
{
document.getElementById("demo").innerHTML = "這個段落已被更改";
}
</script>
</head>
<body>
<h2>JavaScript代碼位置</h2>
<p id="demo">一個段落</p>
<button type="button" onclick="myFunction()">點擊我</button>
</body>
function 定義一個函數myFunction，並在 HTML 內引用
代碼亦可放在
<body>元素內，但是建議把腳本置於 元素的底部，可改善顯示速度，因爲腳本編譯會拖慢顯示
外鏈 .js 文件
<script src="xxx.js"></script>
JavaScript 顯示方案
- 使用 innerHTML 寫入 HTML 元素
- 使用 document.write() 寫入 HTML 輸出
- 使用 window.alert() 寫入警告框
- 使用 console.log() 寫入瀏覽器控制檯
- innerHTML 屬性
該屬性可以改變一個 HTML 元素內的內容
- document.write() 屬性
<h1>一張網頁</h1>
<p>一個段落</p>
<button onclick="document.write(5 + 6)">點擊我</button>
由以上案例可以說明在 HTML 文檔完全加載後使用 document.write() 將刪除所有已有的 HTML
- window.alert() 屬性
使用警告框來顯示數據
- console.log() 屬性
使用 console.log() 方法來在控制檯顯示數據
JavaScript語句建議
以分號結束語句不是必需的，但仍然強烈建議這麼做
在運算符旁邊（ = + - * / ）添加空格是個好習慣
常把代碼行控制在 80 個字符以內,如果 JavaScript 語句太長，對其進行折行的最佳位置是某個運算符
在腳本的開頭聲明所有變量是個好習慣
駝峯式大小寫
使用駝峯式大小寫將單詞連接起來作爲標識符，以小寫字母開頭的駝峯大小寫
var x = "8" + 3 + 5; x 值是 835
var x = 3 + 5 + "8"; x值是 88
如果對數字和字符串相加，結果將是字符串
typeof 運算符
typeof 運算符返回變量或表達式的類型
typeof 運算符對數組返回 “object”，因爲在 JavaScript 中數組屬於對象
布爾值 boolean；字符 string；數值 number；函數 function；
沒有值的變量，其值是 undefined，任何變量均可通過設置值爲 undefined 或 null 進行清空，因爲在 JavaScript 中 null 的數據類型是對象，所以使用 null 清空的話值是 null 但是類型仍然是對象
Undefined 與 null 的值相等，但類型不相等
空值與 undefined 不是一回事，空的字符串變量既有值也有類型