javaスクリプト１

準備

前回書いたHTMLを準備しよう
 $<input id="button1" type="button" value="４，ボタンを押して下さい">
    <script>
        let button2=document.getElementById("button1");
        button2.onclick = function(){
            alert("アラート4");
       }
    </script> 
]]></math></code></pre>
</div>     
    </article>    
    
    
    
    
    
    <article>             
    <h3>ocument.getElementByIdで、<p>タグを捕まえて</h3>
    <br>
    <div class="mondai">let ほげ = document.getElementById(名前)　は色々使える。</div>
    <p>段落にid(名前)をつけて、document.getElementByIdで呼び出してみます。<br>
    そうすると、その名前をつけた段落が色をつけたり、中身を変えたり、色々自由に操作できます。<br>
    これで運勢占いが出来ます。<br>
    
<div style="background-color:#EDF7FF;">
<pre><code><math><![CDATA[
    こんにちは！
   <input id="button1" type="button" value="４，ボタンを押して下さい">
    <script>
        let button1=document.getElementById("button1");
        let p1 = document.getElementById("p1");
        let uranai = "兆吉";
        button2.onclick = function(){
            p1.innerHTML = uranai;
       }
    </script> 
]]></math></code></pre>
</div>     
</article>      
        
    <article>    
    <p id="p1">凶の貴方の運勢は！</p>
   <input id="button1" type="button" value="４，ボタンを押して下さい">
    <script>
        let button1=document.getElementById("button1");

        button1.onclick = function(){
            let p1 = document.getElementById("p1");
            let uranai = "超吉です。宝くじが当たるかもしれません。";  
            p1.innerHTML = uranai;
       }
    </script> 
    <BR>
    <BR>
    </article>
    
        
        
    <article>     
    <h3>解説</h3>
    <p id="p1">こんにちは！</p><br>
    として、段落Pにidで唯一の名前p1をつけます。<br>
    消してダブらないように注意<BR>
    次にスクリプトをなおします。<br>
    let p1 = document.getElementById("p1");<br>
    ここでP!が2回出てきますが、前のｐ１はスクリプトの中の入れ物の名前で<BR>
    後ろのP1は、pタグの名前です。<BR>
    違ったものですので、前のp1をelrmentp1とか名前を変えていいのですが、なれてしまえばこの方がわかりやすいと僕は思います。<BR>
    次にもう一つvar<BR>
    let mojiretu ="超吉です。宝くじが当たるかもしれません。";<br>
    これは、文字を格納しておきます。<BR>
    =は、後ろのものを前の入れ物に格納するという意味です。<BR>
    そして、ボタンが押されると<BR>
        myp1.innerHTML = mojiretu;<br>
    が発動して、占いが表示されます。<BR>
    myp1.innerHTML = "大吉" ;<br>
    としても良いのですが、あとで（配列に直して）色々表示できるようにこうやっているのです。
         
    </article>
        
        
    <A class="button2" href="b1_5.html">次の問題へ進む</A><br>
  </div>
<div id="nakakoukoku">

</div>
<script type="text/javascript" src="../../../js/script1_1.js">
</script>
</div>
<!-- main終了 -->
<div id="side">

</div>
</body>
</html>$
ジャバスクリプトの１

準備
