[JavaScript]createElementでリンクを追加する
環境
Google Chrome 99.0.4844.51
書式
リンクaタグ作成
const 変数 = document.createElement(“a");
リンクタグの属性(href、target、innerText)を設定します。
使用例
<!DOCTYPE html>
<html>
<body>
<div id="cft"></div>
<p><input type="button" value="追加" onclick="addBtn()" /></p>
<script>
function addBtn() {
//セレクタcftの取得
const gg = document.getElementById("cft");
// 要素の追加
if (!gg.hasChildNodes()) {
//リンクa要素作成
const mm = document.createElement("a");
//リンク先
mm.href = "https://arkgame.com/";
// innerText
mm.innerText = "arkgameサイトのリンク";
mm.target = "_blank";
//子ノードを追加
gg.appendChild(mm);
}
}
</script>
</body>
</html>
実行結果
「追加」ボタンを押すと、「arkgameサイトのリンク」リンクを作成します。