javascriptで要素を取得するコードのサンプルリスト

javascriptで要素を取得する時のコードリスト。タグ要素の取得は思いつく文だけ書きだしました。思いだしたら追加していきます。

ここでは var で定義した変数に取得した要素を代入しているコードになります。

また、console.log(変数名)は取得した要素の内容の確認用コードです。

特定のIDの要素をjavascriptで取得

var 変数名 = document.getElementById('ID名');
console.log(変数名);

特定のclassの要素をjavascriptで取得

 var 変数名 = document.getElementsByClassName('class名');
console.log(変数名); 

特定のnameの要素をjavascriptで取得

 var 変数名 = document.getElementsByName('name名');
console.log(変数名); 

特定のtagの要素をjavascriptで取得

 var 変数名 = document.getElementsByTagName('タグ名');
console.log(変数名); 

divタグの要素をjavascriptで取得

            var div = document.getElementsByTagName('div');
            console.log(div);
            

spanタグの要素をjavascriptで取得

var span = document.getElementsByTagName('span');
                console.log(span);
                

pタグの要素をjavascriptで取得

var p = document.getElementsByTagName('p');
                    console.log(p);
                    

liタグの要素をjavascriptで取得

var li = document.getElementsByTagName('li');
        console.log(li); 

table関連タグの要素をjavascriptで取得

tableタグの要素をjavascriptで取得

var table = document.getElementsByTagName('table');
console.log(table); 

theadタグの要素をjavascriptで取得

var thead = document.getElementsByTagName('thead');
console.log(thead); 

tfootタグの要素をjavascriptで取得

var tfoot = document.getElementsByTagName('tfoot');
console.log(tfoot); 

tbodyタグの要素をjavascriptで取得

var tbody = document.getElementsByTagName('tbody');
console.log(tbody); 

trタグの要素をjavascriptで取得

var tr = document.getElementsByTagName('tr');
console.log(tr); 

thタグの要素をjavascriptで取得

var th = document.getElementsByTagName('th');
console.log(th); 

tdタグの要素をjavascriptで取得

var td = document.getElementsByTagName('td');
console.log(td); 

h1~h6タグの要素をjavascriptで取得

h1タグの要素をjavascriptで取得

 var h1 = document.getElementsByTagName('h1');
console.log(h1); 

h2タグの要素をjavascriptで取得

 var h2 = document.getElementsByTagName('h2');
console.log(h2); 

h3タグの要素をjavascriptで取得

 var h3 = document.getElementsByTagName('h3');
console.log(h3); 

h4タグの要素をjavascriptで取得

 var h4 = document.getElementsByTagName('h4');
console.log(h4); 

h5タグの要素をjavascriptで取得

 var h5 = document.getElementsByTagName('h5');
console.log(h5); 

h6タグの要素をjavascriptで取得

 var h6 = document.getElementsByTagName('h6');
console.log(h6);