指定の要素を取得する方法

まえがき

引き続き発掘作業中に見つけたメモ書き。
素のJavaScriptでどうにかしなきゃ行けない時にいろいろメモしていたらしい。
以下、jQueryが使えるなら、そっち導入してやる方が良いと思う。

id指定で取得

var test = document.getElementById("idName");
var url = test.getAttribute("href");
url += url + "いじる。加えたり";
test.href = url;  // aタグの位置に戻す

※idはhtml一つのファイルにつき一意となっている。

class指定で取得

• ちょっと調べるのめんどかった。下の方に記述したやり方の方がスマート

var test = document.getElementsByClassName("className");
test = Array.prototype.filter.call(test, function(test){
		return test.nodeName === "A"; // aタグの意。DIVとかもある。この場合は、classNameに一致するaタグという意。
});

for (var i =0; i < test.length; i++) {
    var url = test[i].getAttribute("href");
    url += url + "いじる。加えたり";
    test[i].href = url;  // aタグの位置に戻す
}

• getElementsByClassName()は、 Array.prototypeメソッドに与えて利用することができる
  • https://developer.mozilla.org/ja/docs/Web/API/Element/getElementsByClassName
• test.nodeName === "A"
  • nodeNameでclass内部の要素を指定できる。くわしくはその都度ググるか、コンソール上で名前確認する。
• classは複数指定可能なので、配列で返ってくる。そのためfor文でまわす。

↑よりも、まずタグ指定で要素を配列にまとめて、指定のclassが存在するか確認する方がシンプル

     ① var t = document.getElementTagname('a').... ※うろ覚え
     ② t.getAttribute('class') && t.getAttribute('class').indexOf('クラス名')

タグ指定で取得

var test = document.getElementsByTagName("a");

for (var i =0; i < test.length; i++) {
    var url = test[i].getAttribute("href");
    url += url + "いじる。加えたり";
    test[i].href = url;  // aタグの位置に戻す
}

自分へ

見直しが必要です。暇ができたらやってください。