Javascript：基礎（輸出/編輯內容、編輯屬性、事件響應、輸入驗證），javascript編輯
Javascript是目前最流行的伺服器指令碼語言，使用Javascript可以為網頁添加豐富的邏輯和更加複雜動態效果。
代碼整理自w3school：http://www.w3school.com.cn
：
範例程式碼：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta http-equiv="Content-Language" content="zh-cn" /><title>Javascript 簡介</title><head type="text/css"> <style> body {background-color:#e0e0e0} p.nowrap {display:inline;padding-left:10px} </style></head><body> <h3>（一）寫入 HTML 輸出</h3> <script> document.write("<h2>This is a h2-line.</h2>"); document.write("<p>This is a paragraph.</p>"); </script> <h3>（二）事件響應</h3> <p>JavaScript 能夠對事件作出反應。比如對按鈕的點擊：</p> <button type="button" onclick="alert('Welcome!')">點擊這裡</button> <h3>（三）改變 HTML 內容</h3> <p id="test_content">這是一行作為樣本的文字</p> <script> function changeHtmlContent(){ x = document.getElementById("test_content"); x.innerHTML = "Hello Javascript!"; } </script> <button type="button" onclick="changeHtmlContent()">點擊按鈕，改變網頁內容</button> <h3>（四）改變 HTML 元件的屬性</h3> <p>點擊燈泡，控制開關狀態：</p> <img id="light" src="images/eg_bulboff.gif" width="80px" height="120px" onclick="changeImage()"> <script> function changeImage(){ element = document.getElementById("light"); if (element.src.match("bulbon")){ element.src="images/eg_bulboff.gif"; }else{ element.src="images/eg_bulbon.gif" } } </script> <p id="text_to_changeColor">點擊按鈕，改變文字顏色<p> <button type="button" onclick="changeColor()">改變顏色</button> <script> function changeColor(){ element = document.getElementById("text_to_changeColor"); element.style.color="#FF0000" } </script> <h3>（五）驗證輸入</h3> <input id="numberText" type="text"/> <input type="submit" value="確認" onclick="testInput()"/><p class="nowrap" id="isOK"></p> <script> function testInput(){ var x = document.getElementById("numberText").value; if (x==""){ alert("請輸入內容") }else if(isNaN(x)){ alert("不是數字類型！") }else{ document.getElementById("isOK").innerHTML="輸入正確"; } } </script> </body></html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
