JS(javascript)で要素を取得する方法

## [https://qiita.com/mizu16/items/76d72bdeca706e04ca43](https://qiita.com/mizu16/items/76d72bdeca706e04ca43)

ID
document.getElementById(”);

タグ
document.getElementsByTagName(”);
element.getElementsByTagName(”);

クラス
document.getElementsByClassName(”);

名前(name)
document.getElementsByName(”);

カスタムデータ
document.querySelectorAll(‘data-xxx’);

セレクタ
document.querySelector(‘#main .article h1’);

すべてのセレクタ
document.querySelectorAll(‘a’);

—

データの中身を表示

console.dir(配列名);

—

## jqury 要素の値を取得する方法一覧

・データ（data-*）を取得　data()

・Classを取得　hasClass()　add/removeClass()

　特定クラス名がセットされているか、ではなく、クラス名そのものが欲しい場合　そんな文字列をclassで賄おうとせず、data-xxxで別属性として定義する。

・value　val()

・textareaに入力された値　val()

　タグの中といってtext()やhtml()を使う必要はありません。

・checkboxやradiobuttonがチェックされているかどうかを知りたい　prop(‘checked’)

　attr()で”checked”と比較しない

・checkboxやradiobuttonをチェックしたいor外したい　prop(‘checked’, true|false)

　attr()や、ましてやremoveAttr()などは論外です。

・disabledかどうかを知りたい　prop(‘disabled’)

　attr()で”disabled”と比較するのはギルティーです。

・disabledにしたいor外したい　prop(‘disabled’, true|false)

　attr()や、ましてやremoveAttr()などは論外です。

・aタグにおけるhrefや、imgにおけるsrc等のアドレスのパスについて

　絶対パスが必要　prop()

　相対パスが必要　attr()

　ただし、htmlに絶対パスとして記述されている場合は絶対パスになります。

・上記以外の属性を取得　HTML標準の属性の場合　prop()

　HTML標準ではない、勝手に命名した属性　attr()

　または data-xxxxとした上で、data()を使ってください。