<div>部分のみの更新

HTML初心者なので教えて下さい。

<div id="test">
A,B,Cのどれかを表示する処理
</div>

があったとしてすでに処理されているコードを、ボタンを押すことによって<div>の中のみもう一度処理させる事は可能なのでしょうか？
ボタンを押してから表示するのではなく、ページを開いた時に<div>の部分が処理されていて、そこだけを更新したいのです。

よろしくお願いします。

質問者からの補足コメント

• <div id="test">
  <script type="text/javascript">
  <!--
  
  var msg = new Array();
  
  msg[0] = '<b>A</b>';
  msg[1] = '<b>B</b>';
  msg[2] = '<b>C</b>';
  
  var no = Math.floor(Math.random() * msg.length);
  
  document.write(msg[no]);
  
  // -->
  </script>
  </div>
  
  <form>のボタンを押したら上記の処理がもう一度行われ、画面全体は更新されず<div>の中だけが更新される部分的な更新をしたいのです。
  調べてもページが開いた時点では処理が行われておらず、ボタンを押した後に処理が行われるor更新ボタンを押すと画面全体が更新されるものばかりだったので質問させて頂きました。

    補足日時：2017/01/05 02:29

• getElementはとても使えそうですね。
  勉強してきます。ありがとうございました。

    補足日時：2017/01/05 11:35

• getElementはとても使えそうですね。
  勉強してきます。ありがとうございました。

    補足日時：2017/01/05 11:36

No.3 ベストアンサー 回答者： Ogre7077 回答日時： 2017/01/05 09:50

document.write は再利用できないので、HTMLDivElement.innerHTML で置き換えましょう。

表示する処理は再利用するので、関数化しましょう。
関数を呼ぶタイミングとして DOMContentLoaded のイベント処理を書きましょう。
ボタンにも click のイベント処理を書いて、関数を呼びましょう。

例:
<script>addEventListener('DOMContentLoaded', function(){
var Q = function(id){return document.getElementById(id)};
var messages = [ '<b>A</b>', '<b>B</b>', '<b>C</b>' ];
function displayRandomMessage() {
var no = messages.length * Math.random() | 0;
Q('test').innerHTML = messages[no];
}
Q('rewrite').onclick = displayRandomMessage;
displayRandomMessage();
}, false)</script>

No.2 回答者： rukuku 回答日時： 2017/01/05 03:12

＞ページが開いた時点では処理が行われておらず

ページを開いた時点では、情報が全く伝わっていません。デフォルトの表示になります。

フォームの内容に応じて表示を変更する場合には「パラメータ」も一緒に送信すること必要です。
http://www.tam-tam.co.jp/tipsnote/javascript/pos …

No.1 回答者： rukuku 回答日時： 2017/01/05 02:03

こんばんは

HTMLのみではそのような処理はできません。
このソースでは単に「A,B,Cのどれかを表示する処理」が表示されるだけです。

"PHP"や"JavaScript"などの追加の知識が必要となります。


補足要求です。
「ページを開いたときに…」の処理をもう少し詳細に説明していただければ（機密に触れない範囲で）、より具体的な回答が出来ます。