質問: ### 前提・実現したいこと inputでボックスを作り(必ずしもinputでやらなくてもいいのかもしれませんが、この方法しかまだ学んでいないのでおそらくこの方法でやるのだと思います)、その中に書かれた文字とそのURLを下の段に追加するという課題をやっております。 例: リンク名:Google URL:https://www.google.co.jp リンク追加(ボタン。これをクリックすると下にURLつきの文字が出る仕組み) ↓ Google(クリックするとgoogleのurlに飛べる状態。下線あり) ### 発生している問題・エラーメッセージ ``` コードを書いたのですが、出てくるのはlink(下線付き)の文字でGoogleという文字は出ていなく、URLもGoogleのものではありませんでした。 ``` ### 該当のソースコード ``` リンク名: URL: リンク追加 ``` ### 試したこと おそらくaddElement内で「newDiv.innerHTML =」以降が間違っているんだろうなと思っていますが調べても書き方がわからず困っています。 間違っている箇所が分かっているので自力で何とかやりたくていくつか思うように書き直してみたのですが結局解決はできませんでした。 JavaScriptを勉強している最中でこれ以上難しい内容を勉強していないのでこのぐらいの難易度でシンプルな書き方があればご教示願いたいです。 ### 補足情報(FW/ツールのバージョンなど) CodeCampで勉強中ですがバージョンの情報はわかりません。
回答: テキストでHTMLを作ると、想定していない形のHTMLを不正に作る**XSS**という攻撃がありますので、できるだけHTMLを書いて起こす方式は避けるべきです。 ``` function addElement() { var link = document.getElementById('link'); var url = document.getElementById('url'); var newAnchor = document.createElement('a'); newAnchor.textContent = link.value; newAnchor.href = url.value; // 修正済み box.appendChild(newAnchor); } ```