Q&A
回答した後になんですが、タイトルと内容が繋がりません。結局どういうことですか？
例えば
html
1<body> 2 <script> 3 const img1 = 'https://teratail-v2.storage.googleapis.com/assets/img/common/logo_white.svg?1591062163214320'; 4 5 const text1 = 'テラテイルのロゴ'; 6 </script> 7 8 9 <div class="item"> 10 <p><img src="<script>document.write(img1)</script>" alt=""></p> 11 <p><script>document.write(text1);</script></p> 12 </div> 13</body>
このようなテンプレを作成し、scriptタグの中の定数の部分だけ変更すればいい状態にしたいです。
定数 text1 については、表示されるのですが、
定数 img1 が表示されません。
定数のクォテーションをシングルクォーテーションにしてみましたが動きません。
どのようにすれば表示されるかご教示ください。
回答3件
0
ベストアンサー
※うまくアップされてなかったので再投稿
javascript
1<script> 2window.addEventListener('DOMContentLoaded', ()=>{ 3 const img1 = 'https://teratail-v2.storage.googleapis.com/assets/img/common/logo_white.svg?1591062163214320'; 4 const text1 = 'テラテイルのロゴ'; 5 document.querySelector('#i1').setAttribute('src',img1); 6 document.querySelector('#p1').textContent=text1; 7}); 8</script> 9<div class="item"> 10<p><img src="" alt="" id="i1"></p> 11<p id="p1"></p> 12</div>
投稿2020/06/06 05:12
編集2020/06/06 06:00
総合スコア115001
0
属性値なので単なる文字列として解釈されてるだけです。
根本的なところですが、document.write()使わずにimgのsrc書き換えれば良いのでは。
text1も同じく、innerTextで挿入すべきと思います。
document.write()の出番ってありません。(実務で使ったことない)
投稿2020/06/06 01:58
総合スコア80857
ごく稀に、document.write()で、共通サイドバーの表示をしてるサイトがありますね。（うろ覚え
（例：弊学のHP, WPが流行る前に作成されたサイト
メリットが思い付かないですね。デメリットはたくさん思い付く。
document.write()を使っていたからなのかは分かりませんが、詐欺サイトへのリンクが意図なく追加されていました。
（当方が発見したのですが、それをされる弱さが怖かったです。
0
そういうのは考え方としてはdomの操作です
なのでjavascript dom 操作で検索したらたくさん引っかかるので読みやすいサイトを選んで操作方法の勉強をすることをおすすめします
投稿2020/06/06 01:45
総合スコア6426
あなたの回答
tips
プレビュー
