JavaScriptのdocument.writeについての質問 | ページ表示後に文字を追加する方法

このQ&Aのポイント
  • JavaScriptのdocument.writeを使用してページ表示後に文字を追加する方法について質問があります。
  • 上記のプログラムでは、ページを読み込んだ後にプロンプトを表示し、『y』と入力するとサンプルという文字列が表示されます。
  • しかしこの方法では、最初に表示されていたページの内容が消えてしまうため、最初に表示されていたページに文字を追加する方法を知りたいです。
回答を見る
  • ベストアンサー

promptからのdocument.write

javascriptのdovument.writeについての質問です。 まず以下のプログラムを見て頂きたいのですが・・・ window.onload=function moji(){   YorN=window.prompt('文字を表示しますか?','');   if(YorN=='y'){    document.write('サンプル');   } } 上記のプログラムのように、ページを読み込んだらプロンプトを表示し、『y』と入力したらdocument.writeで文字列を表示させるというようなことを考えているんですが、 上記のプログラムですと、プロンプトが表示されて『y』と入力すると、サンプルという文字しか表示されず、最初に見えていたページの内容が消えてしまいます。 最初に見えていたページに文字を付加するという形にしたいのですが、方法を思いつきません。 どなたかご存知の方よろしくお願いいたします。 ブラウザはIE8です。 ちなみにjavascriptは外部ファイルとして<head>内で読み込ませています。

質問者が選んだベストアンサー

  • ベストアンサー
  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.1

document.writeしてしまってはソースが上書されちゃいますね。 どこの位置に書き込むかなど調整が必要でしょう <script> window.onload=function moji(){ YorN=window.prompt('文字を表示しますか?',''); if(YorN=='y'){ document.getElementById('hoge').innerHTML='サンプル'; } } </script> test <div id="hoge"></div> test

yukisin19
質問者

お礼

回答ありがとうございます。 お礼が遅れて申し訳ありません。 やはり上書きされてしまいますか・・・ ご教授頂いたように先にidをつけた<div>タグを書き込ませてそこに文字を表示させたいと思います。 ありがとうございました。

関連するQ&A

  • promptメソッドの働きについて

    こちらのサイトを参考にjavascript勉強中の初心者です。 http://www.red.oit-net.jp/tatsuya/java/prompt2.htm ユーザが入力したパスワードが正しければ 指定したページにジャンプさせるというプログラムです。 その中に、 myPassWord = prompt("パスワードを入力してください", ""); という個所があり、どうも変数myPassWordに ユーザが入力した文字列を代入しているみたいなんですが 分からない事が2点あります。 【質問1】 リファレンスをひくと『prompt』というメソッドは 「指定したウィンドウに文字ダイアログを表示する」と書いてありました。 『prompt』にはダイアログ表示以外に、 入力された文字を抜き出すという機能もあるのですか? この一行で、なぜユーザが入力した値が取得できるのかわかりません。 【質問2】 リファレンスには、promptの書式として ウィンドウ名.prompt(); とあったのですが、ウィンドウ名(window.)は 省略されていると考えていいんですよね? 質問は以上です。 リファレンスの見方もまだ十分に理解できておらず 初歩的な質問で申し訳ありません。 お詳しい方からのご回答、お待ちしております、 初心者にもわかるよう噛み砕いて解説してくださると助かります。 よろしくお願いいたします。

  • promptを使用した年齢認証

    javascriptを勉強し始めたばかりで参考書のとおりに打っているのですが、疑問が解決しなくて困っています。 以下のようなif else文があったとすると、コマンドにちゃんと数字を入力してくれたらそれで判定ができるんですが、数字ではなくて文字を入力されてしまっても通ることがわかり、何とか解決できないかと悪戦苦闘しています。 javaのことがよくわからなくて、本当にすみませんが、よろしくお願いします。 <script type="text/javascript"> var nenrei; nenrei=parseInt(prompt("年齢を入力してください。")); if(nenrei<18){ document.write("18禁です。"); } else{ document.write("入場できます。"); } </script>

  • document.writeについて

    document.writeについて document.writeのテキストで文字を表示するじゃんけんゲームを作っています。 文字をグーを表示させると全画面がきえてしまいます。 消えない様にその場所のみ替えるようするには、どうしたらよいでしょうか? また、document.writeで一旦表示されたらものをそこだけ消す 表示方法なども教えて下さい。 <script language="JavaScript"> <!-- function msg() { document.write("グー!"); } function msg2() { document.write("<br>チョキ!"); } function msg3() { document.write("<br>パー!"); } //--> </script> </head> <body> <br><br><br><br><br><br> <p onMouseup="msg()">グー</p><p onMouseup="msg2()">チョキ</p><p onMouseup="msg3()">パー</p> </body>

  • JavaScript document.writeについて

    <ul id="font-size-change"> <li><a href="javascript:void(0)" onclick="setActiveStyleSheet('default'); return false;" />標準</a></li> <li><a href="javascript:void(0)" onclick="setActiveStyleSheet('large'); return false;" />大</a></li> </ul> 上記を、JavaScriptの「document.write」を使って表示しようと、下記のコードを書きました。 function fontSizeChange(){ document.write('<ul id="font-size-change">'); document.write('<li><a href="javascript:void(0)" onclick="setActiveStyleSheet'); document.write("('default'); "); document.write('return false;" />標準</a></li>'); document.write('<li><a href="javascript:void(0)" onclick="setActiveStyleSheet'); document.write("('large'); "); document.write('return false;" />大</a></li>'); document.write('</ul>'); } とっても効率が悪い記述だと思うのですが、 もっとシンプルで効率の良い書き方はないでしょうか。 よろしくお願いします。

  • ホームページ内に直接書込がしたい

    ホームページ内のボタンをクリックすると、javascriptの入力画面が表示されて、 そこに「ABC」と入力すると、ホームページ上に「ABC」と書き込まれる。 <button onclick="a()">書込</button> <script type="text/javascript"> <!-- function a(){ var b=prompt("入力",""); document.write(b); } //--> </script> 上記のプログラムを書いてみたのですが、別ページが開いて、そこに「ABC]と書き込まれます。 同じページに書き込みたいのですが、良い方法があったら教えてください。 初心者ですので、よろしくお願いします

  • ネスケでdocument.write

    質問があります。 <html> <head> <script type="text/javascript"> <!-- str = "a"; function func(){ document.open(); document.write( str ); document.close(); } --> </script> </head> <body onload = "func()"> </body> </html> というソースを組んだのですが、IE6なら正常に表示できたのにNetscape7だと表示されませんでした。 document.write("a")と記述すると表示できたのですが・・・。 本来組みたいソースは上記のstrが長文かつ多用するために簡略化したいのですが、何か良い方法はあるでしょうか?

  • Document.Writeの使い方を教えてください

    初心者であまり詳しくないので教えてください 最近VBSでDocument.Writeをつかって表とかをタグを含んだ 文字列を書いたりしていたんですけど ”がはいった文字列を指定するとうまくいきません たとえばボタンを表示させようとして Document.Write"<input type=button name=dobtn value="検索">" とやると表示されません ”で指定するものって多いとおもうんですけどどうやって指定するんでしょうか?

  • document.write と Firefoxの戻り動作

    document.writeを使ってhtmlを書き込むことで新たなページを表示した場合、Firefoxではブラウザの「戻りボタン」で戻ると元のページの表示位置(元のページがスクロールされていた場合のスクロール位置)ではなく、元のページの先頭から表示されます。 (IEでは、元のページの元の表示位置に戻ります。) FirefoxでもIEのように元のページの元の表示位置に戻るようにしたいのですが、何が問題か、ご指摘いただけないでしょうか? (下方にサンプルを記載します) ・行いたいこと  以下の例のfunction_test()内に別ページのhtmlを記述して、onlickで呼び出しそのhtmlを表示。そのhtml表示後、ブラウザの戻りボタンや、history.backを使って、元のページに普通に戻りたい。 <html> <head> <TITLE>test</TITLE> <script type="text/javascript"> <!-- function function_test() { document.write("<html><body>"); document.write("test"); document.write("<\/body><\/html>"); document.close(); } // --> </script> </head> <body> これはテスト<br> <br><br><br><br><br><br><br><br><br><br><br><br><br><br> <form> <input type='button' value='test' onclick='function_test()'> </form> <br><br><br><br><br><br><br><br><br><br><br><br><br><br> </body> </html>

  • cgiでdocument.writeの書き出し

    簡単な一行伝言を作成していますが、トップページに「sample.js」のログファイルであるjavascritpファイルを読み込んで表示させます。 そこで、Perlによる管理者専用フォームから登録したデータをsample.jsファイルとしてログで書き込む方法がわかりません。 通常テキストファイルなのであれば、 $datafile='./data.txt'; open(FH,">$datafile"); print FH "$in{'name'}"; close(FH); とこんな感じでいいと思いますが、 sample.jsファイル内に document.write("ooooooooo"); document.write("ooooooooo"); document.write("ooooooooo"); ・ ・ ・ ・ とログを残していきたいのですが、どうすればよいでしょうか? また、参考になるようなURLやフリーで配布されているようなものがあれば、教えてください

  • document.writeの文字列が実行されるタイミング

    javascriptで<script>タグの表示をdocument.writeで行ったところ、 直後に、<script>ソースの関数呼び出しでリンク切れになったのですが、 なぜでしょうか。 document.writeの文字列が実行されるタイミングっていつなんでしょうか。 <script> document.write('<script type="text/javascript" src="hoge.js"></script>'); hoge(); </script> ※hoge()はhoge.js内で定義されています。

専門家に質問してみよう