Embedded Files
ＨＴＭＬテキスト
<body>
<h1>My First Web Page</h1>
<p>HELLO</p>
<button onclick="myFunction()">clickit</button>
<script>
function myFunction() {
document.write("<p>I'm Fine !</p>");
}
</script>
</body>
<body>
<h1>My First Web Page</h1>
<p id="demo">HELLO</p>
<button onclick="myFunction()">click it</button>
<script>
function myFunction() {
x=document.getElementById("demo");
ブラウザー表示
クリック後ブラウザー表示
Ｉ’ｍ Fｉｎｅ ！
<button>タグでボタンを作成。
ボタンの字（今はClick it)は
始タグと終タグの間に書く。
onclick="□"で、クリックしたら
□が起動するという意味。
今回はクリックしたらmyFunction( )
が起動する、と記述した。
mｙFunction( )が起動とはつまり
document.write(" ")でI'm Fine !
が書かれる。
My First Web Page
My First Web Page
ＨＥＬＬＯ
ボタンをクリックすると
→
My First Web Page
My First Web Page
My First Web Page
My First Web Page
ＨＥＬＬＯ
Ｉ’ｍ Fｉｎｅ ！
//Find the element
(1)ではＨＥＬＬＯは最初から
I'm Fine ! に変わっていたけど
(最初からテキストチェンジの
スクリプトが発動していた）、
ここでは、ボタンをクリックしたら
スクリプトが発動するようになって
いる。
x.innerHTML="I'm Fine !";
ボタンをクリックすると
→
//Change the content
}
</script>
</body>
<body>
<h1>My First Web Page</h1>
<p id="demo">HELLO</p>
<button onclick="myFunction()">click it</button>
<script>
function myFunction() {
alert("I'm Fine !");
}
</script>
</body>
My First Web Page
My First Web Page
ＨＥＬＬＯ
ボタンをクリックすると
→
こちらも、（１）では最初からアラートの
小ウィンドウが出現していたけど、
ここでは、ボタンをクリックしたら出現
するよ。
(1)でalertでの計算を取り上げてみましたが、document.writeでも計算できます。
10×20の答えは●です！（●をコンピュータに計算せる） を表示させるにはどう書くかというと。。。。
document.write("10*20の答えは");
document.write(10*20);
document.write("です！");
テキスト部分は" "で囲んで、計算するところは（数字として読むところ）クォーテーション無しで記述します。
これ、1つで書く方法・・・document.write("10×20の答えは" + 10*20 + "です！" ); なんですが
足し算と引き算の時はdocument.write("10+20の答えは" + (10+20) + "です！" ); となります。
『+』でつなげていくため、計算式の中のプラスやマイナスを区別するため、この場合は（ ）に入れてあげるんですね～。
Page updated
Google Sites
Report abuse