HTMLチュートリアル

HTMLホーム HTMLの紹介 HTMLエディター HTMLベーシック HTML要素 HTML属性 HTML見出し HTML段落 HTMLスタイル HTMLフォーマット HTMLの引用 HTMLコメント HTMLの色 HTML CSS HTMLリンク HTML画像 HTMLファビコン HTMLテーブル HTMLリスト HTMLブロックとインライン HTMLクラス HTMLID HTMLIframe HTML JavaScript HTMLファイルパス HTMLヘッド HTMLレイアウト HTMLレスポンシブ HTMLコンピューターコード HTMLセマンティクス HTMLスタイルガイド HTMLエンティティ HTMLシンボル HTML絵文字 HTML文字セット HTMLURLエンコード HTMLとXHTML

HTMLフォーム

HTMLフォーム HTMLフォーム属性 HTMLフォーム要素 HTML入力タイプ HTML入力属性 HTML入力フォームの属性

HTMLグラフィックス

HTMLキャンバス HTML SVG

HTMLメディア

HTMLメディア HTMLビデオ HTMLオーディオ HTMLプラグイン HTML YouTube

HTML API

HTMLジオロケーション HTMLドラッグアンドドロップ HTMLWebストレージ HTMLWebワーカー HTML SSE

HTMLの

HTMLの例 HTMLクイズ HTML演習 HTML証明書 HTMLの概要 HTMLアクセシビリティ

HTMLリファレンス

HTMLタグリスト HTML属性 HTMLグローバル属性 HTMLブラウザのサポート HTMLイベント HTMLの色 HTMLキャンバス HTMLオーディオ/ビデオ HTMLDoctypes HTML文字セット HTMLURLエンコード HTML言語コード HTTPメッセージ HTTPメソッド PXからEMへのコンバーター キーボードショートカット

HTML JavaScript


JavaScriptは、HTMLページをより動的でインタラクティブにします。


My First JavaScript


HTMLの<script>タグ

HTML<script>タグは、クライアント側のスクリプト(JavaScript)を定義するために使用されます。

要素にスクリプトステートメントが含まれているか、属性<script>を介して外部スクリプトファイルを指している。src

JavaScriptの一般的な用途は、画像の操作、フォームの検証、コンテンツの動的な変更です。

HTML要素を選択するために、JavaScriptはほとんどの場合 document.getElementById()メソッドを使用します。

このJavaScriptの例では、「HelloJavaScript!」と記述しています。id = "demo"のHTML要素に:

<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>

ヒント: JavaScriptについて詳しくは、 JavaScriptチュートリアルをご覧ください


JavaScriptの味

JavaScriptでできることの例を次に示します。

JavaScriptはコンテンツを変更できます:

document.getElementById("demo").innerHTML = "Hello JavaScript!";

JavaScriptはスタイルを変更できます:

document.getElementById("demo").style.fontSize = "25px";
document.getElementById("demo").style.color = "red";
document.getElementById("demo").style.backgroundColor = "yellow";

JavaScriptは属性を変更できます:

document.getElementById("image").src = "picture.gif";


HTMLの<noscript>タグ

HTML<noscript>タグは、ブラウザでスクリプトを無効にしているユーザー、またはスクリプトをサポートしていないブラウザを使用しているユーザーに表示される代替コンテンツを定義します。

<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
<noscript>Sorry, your browser does not support JavaScript!</noscript>

HTML演習

エクササイズで自分をテストする

エクササイズ:

JavaScriptを使用して、要素のHTMLコンテンツ<p>を「HelloWorld!」に変更します。

<body>

<pid = "demo">こんにちは。</ p>

<script>
ドキュメント。( "demo")。innerHTML = "Hello World!";
</ script>

</ body>


HTMLスクリプトタグ

Tag Description
<script> Defines a client-side script
<noscript> Defines an alternate content for users that do not support client-side scripts

利用可能なすべてのHTMLタグの完全なリストについては、HTMLタグリファレンスにアクセスしてください。