HTMLのhrefにjavascriptで値を入れる

HTMLのa要素の属性の1つであるhrefに値を入れます。

このページに辿り着く方はご存知かと思いますが、hrefにはリンク先のURLを指定することができます。

a要素を取得しそのhref属性に値を入れる

a要素を取得しそのhref属性に値を設定するという流れです。

HTMLには下記要素が存在するとします。

‹a id="test" href›テスト‹/a›

idをキーに要素を取得します。

var test;
test = document.getElementById("test");

documentはHTML DOMのdocumentオブジェクトです。

DOMとはDocument Object Modelの略でHTMLをオブジェクトとして扱う仕組みのことで、javascriptなどの言語で扱えます。

documentオブジェクトはウェブブラウザに表示されているHTMLのルートオブジェクトを指しています。

getElementByIdは非常によく使われるものですが、引数にidを指定するとそのidを持つ要素を取得できます。

上記でtestという変数にa要素が入っています。

要素のhrefに値を入れます。

test.href = "http://..."

非常に簡単で要素のhref属性に値を指定してあげるだけです。

特定の要素の特定の属性をどのように扱うかは公式のページにまとまっているので参照しましょう。