- ベストアンサー
innerHTMLを使い、文章を書き換えたい方法
- innerHTMLを使って要素の内容を書き換える方法について説明します。
- JavaScriptの記述を正しく配置することで、要素の内容を書き換えることができます。
- 関数化させてidを指定したタグが表示されてから命令を実行させることが必要です。
- coltellosan
- お礼率100% (2/2)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
>><SCRIPT Laguage="JavaScript"><!-- >>document.getElementById('testid').innerHTML >> = "この文章に書き換える"; >>--></SCRIPT> >> >><div id='testid'>元の文章</div> このままでは、<div>が生成される前に、JavaScriptが実行されるため、エラーになるのだと思います。 JavaScriptを関数化し、<body>のonloadで実行してやればよいと思います。 <SCRIPT Laguage="JavaScript"><!-- function htmlChange(){ document.getElementById('testid').innerHTML = "この文章に書き換える"; } --></SCRIPT> <body onload="htmlChange();"> <div id='testid'>元の文章</div>
その他の回答 (1)
- yyr446
- ベストアンサー率65% (870/1330)
どのタイミングで書き換えたいんか解らんが、 別に<body>の中に<script>があっても違反じゃないんで、 最初のまま <div id='testid'>元の文章</div> <script type="text/javascript"> document.getElementById('testid').innerHTML = "この文章に書き換える"; </script> でもよいと思う。
お礼
ご回答ありがとうございます。 ページを読み込む際に自動で書き換えてくれて、閲覧者は最初から書き換えられた文章を目にする形にしたかったです。 経緯としては、外部のサービスを使っている中で、あるHTMLファイルを編集する権限が部分的にしかないため、いじれない部分をinnerHTMLで書き換えたかったのでした。 具体的には、 ■■■■■■■■■■■■ <html> <head> (私は編集できない) </head> <body> <!--私が編集できる部分ここから--> ★ここにinnerHTMLと、差し替えるべき文章を入れたい <!--私が編集できる部分ここまで--> <!--私が編集できない部分ここから--> <div id='testid'>元の文章</div> <!--私が編集できない部分ここまで--> </body> </html> ■■■■■■■■■■■■ となっており、<div id='testid'>を先に持ってくることができないのでした。 尚、書き換える行為が規約に違反するとか、そういうことはありませんのでご安心を。
お礼
ご回答ありがとうございます。 上記の方法でできました! ですので解決といたしますが、もし気が向いたらでまったく構わないのですが、 <body onload>を使わない方法があるようでしたらご教示いただけたらうれしいです。 というのも、私にbodyタグの編集権限がないからです。 (詳細は2番目の回答者様へのレスに書かせていただきます。) 実際にはブラウザがうまく判断してくれているのですが、 記述としては、 <body> <SCRIPT Laguage="JavaScript"><!-- function htmlChange(){ document.getElementById('testid').innerHTML = "この文章に書き換える"; } --></SCRIPT> <body onload="htmlChange();"> <div id='testid'>元の文章</div> </body> と、bodyが重複している状況でして。