JavaScript/DHTML
外观
DHTML(動態網頁)是 JavaScript、CSS 和 HTML 的集合。
alert消息
[编辑]<script language="javascript"> alert('Hello World!'); </script> 將有一個簡單的警告消息對話框。
<script language="javascript"> res = prompt('請問您叫什麼名字?'); </script> 將有一個簡單的提示輸入對話框,res变量会获得在输入框中输入的文字,此时res为String类型。
<script language="javascript"> res = confirm('確認?'); </script> 將有一個簡單的確認消息對話框,res变量会获得确认框的结果,此时res为Boolean类型,true表示确认,false表示取消。
按鈕和警告消息對話框示例
[编辑]有時候單刀直入給出完整代碼是很好的:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <HTML> <HEAD> <TITLE>「按鈕」 - JavaScript</TITLE> <script language="javascript"> x = '你沒有點擊按鈕。'; function bomb(){ alert('噢!世界末日!'); alert('10'); alert('9'); alert('8'); alert('7'); alert('6'); alert('5'); alert('4'); alert('3'); alert('2'); alert('1'); alert('!BOOM!'); alert('祝你早日精通JavaScript :-)'); x = '你點了按鈕!早就叫你別點了!'; } </script> <style type="text/css"> body{ background-color:#00AAC5;color:#990000; } </style> </HEAD> <BODY> <div> <input type="button" value="「按鈕」——請勿按我" onclick="bomb()"><br /> <input type="button" value="點擊這裡查看有沒有點擊「按鈕」" onclick="alert(x)"> </div> 這個腳本均在<a href="http://www.wikipedia.org/wiki/GNU_Free_Documentation_License">GFDL</a>和<a href="http://www.wikipedia.org/wiki/GNU_General_Public_License">GPL</a>下授權。詳見<a href="https://en.wikibooks.org/wiki/JavaScript">Wikibooks</a>。 </BODY> </HTML> 在这个脚本中,我们用onclick属性来使浏览器在单击按钮时运行引号内的脚本。所有同类属性列表如下:
此外,还可以通过脚本来指定onclick属性。
页面的生命周期
[编辑]加载外部数据
[编辑]新版本的浏览器都支持fetch API,可以调用这一API向任意的域名或IP地址发送数据。
以下示例为使用fetchAPI获取两个页面比较的结果,并写入页面的最底部:
data = await fetch("https://zh.wikibooks.org/w/api.php?action=compare&format=json&fromrev=1&torev=3"); text = await data.json() document.write(text.compare["*"])