kaibukuroのブログ

HTML/CSS/JavaScript/PHPなどのアウトプット

JavaScript勉強メモ1

・要素があるかどうか判別したい場合の記述

//querySelectorやgetElementByIdなどの単一要素を取得するメソッドを使った場合
const elem = document.querySelector('.elem');
if(elem !== null){
  /* elemがあれば */
}

//querySelectorAll や getElementsByClassNameなどの複数要素を取得するメソッドを使った場合
if(elem.length > 0){
  /* elemがあれば */
}

【参考にさせていただいたサイト】
こちらのページは、JSの記述について他にもわかりやすくまとめられていてとても良いです。

wemo.tech

・querySelectorAll()で取得した要素をeachで出力する記述


const links = document.querySelectorAll('a');
links.forEach(link => {
  console.log(link.href);
});


確かにこの書き方がわかりやすいのですが、IE11は非対応らしいです。

【参考にさせていただいたサイト】
thr3a.hatenablog.com