HTML 腳本
JavaScript は HTML ページをより動的でインタラクティブにします。
HTML <script> タグ
<script> は、JavaScript などのクライアント側(cè)のスクリプトを定義するために使用されます。
<script> 要素には、スクリプト ステートメントを含めることも、src 屬性を通じて外部スクリプト ファイルを指定することもできます。
JavaScript は、畫像操作、フォーム検証、動的コンテンツ更新に最も一般的に使用されます。
インスタンス
次のスクリプトは、「お元気ですか?」をブラウザに出力します:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <script> document.write("你好嗎?") </script> </body> </html>
プログラムの実行結(jié)果:
お元気ですか?
JavaScript チュートリアルの詳細(xì)については、JavaScript チュートリアルをご覧ください。
HTML<noscript> タグは、スクリプトが使用できない場合に代替コンテンツを提供します。ブラウザ スクリプトが無効になっている場合、またはブラウザがクライアント側(cè)のスクリプトをサポートしていない場合。 <noscript> 要素には、通常の HTML ページの body 要素にあるすべての要素を含めることができます。 ブラウザがスクリプトをサポートしていない場合、またはスクリプトが無効になっている場合にのみ、<noscript> 要素のコンテンツが表示されます:
Example
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <script> document.write("Hello World!") </script> <noscript>抱歉,你的瀏覽器不支持 JavaScript!</noscript> <p>不支持 JavaScript 的瀏覽器會使用 <noscript> 元素中定義的內(nèi)容(文本)來替代。</p> </body> </html>
プログラムの実行結(jié)果:
JavaScript體験(當(dāng)サイトのJavaScriptチュートリアルより)
JavaScriptサンプルコード: JavaScriptイベント応答: プログラムを?qū)g行して確認(rèn)してください JavaScript処理HTMLスタイル:<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
</head>
<body>
<p>
JavaScript 能夠直接寫入 HTML 輸出流中:
</p>
<script>
document.write("<h1>這是一個標(biāo)題</h1>");
document.write("<p>這是一個段落。</p>");
</script>
<p>
您只能在 HTML 輸出流中使用 <strong>document.write</strong>。
如果您在文檔已加載后使用它(比如在函數(shù)中),會覆蓋整個文檔。
</p>
</body>
</html>
プログラム実行結(jié)果:<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
</head>
<body>
<h1>我的第一個 JavaScript </h1>
<p id="demo">
JavaScript 可以觸發(fā)事件,就像按鈕點擊。</p>
<script>
function myFunction()
{
document.getElementById("demo").innerHTML="Hello JavaScript!";
}
</script>
<button type="button" onclick="myFunction()">點我</button>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
</head>
<body>
<h1>我的第一段 JavaScript</h1>
<p id="demo">
JavaScript 能改變 HTML 元素的樣式。
</p>
<script>
function myFunction()
{
x=document.getElementById("demo") // 找到元素
x.style.color="#ff0000"; // 改變樣式
}
</script>
<button type="button" onclick="myFunction()">點擊這里</button>
</body>
</html>