< Back

jQueryの$ってDOM扱ってるっぽくて安心するのでVannila JSに導入する

$はとても安心する

今回は$はとても安心するを主題に執筆を開始しますが、そのなぜ安心するかというのは主に

  • 長期間のjQuery使用による 刷り込み 慣れ

だとは思います。
今回はVannila JSで$を素敵に扱っていきたいと思います。

やり方

Mac をお使いの皆様は ⌘ + ⌥ + I (コマンド　&& オプション && アイ) をおもむろに打ち込み開発者ツールを開いてください。

次に以下のスクリプトを流し込んでください。

const $ = identifier => {
  if (identifier.substr(0,1) === '#')
    return document.getElementById(identifier.substr(1))
  else 
    return document.querySelectorAll(identifier)
}

もしES6対応していない環境をお使いのみなさまは、

var $ = function(identifier) {
  if (identifier.substr(0, 1) === '#')
    return document.getElementById(identifier.substr(1));
  else
    return document.querySelectorAll(identifier);
};

こんな感じでいいと思います。

$("h1")[0].innerText = "jQuery最高！！！！"

いかがでしょうか。これでjQueryで作られている環境にjQueryっぽい何かの導入ができました。社内からjQueryを撲滅するためにこっそり新機能のページはES6で置き換えるのもいいかもしれませんね！！！

VanillaJS の公式ドキュメント http://vanilla-js.com/

それではよいJSライフを！！