お疲れ様です!!!
少しずつスクラッチのjsをJavascript触って行こうと思ってます、岩崎です。
だいぶ初歩的なところかなと思いますが、JavascriptとjQueryの記述をこれからちょっとずつまとめて行きます!!!!!
要素取得
jquery
|
//id const hoge = $(‘#hoge’); //class const hoge = $(‘.hoge’); //tag const hoge = $(‘#hoge’); |
javascript
|
//id const hoge = document.getElementById(‘hoge’); //class const hoge = document.getElementsByClassName(‘hoge’); //tag const div = document.getElementsByTagName(‘div’); |
イベント処理(クリック)
jquery
|
$(‘#hoge’).on(‘click’, function(){ }) |
Javascript
|
document.getElementById(‘hoge’).addEventListener(‘click’, function(){ },false); |
クラス操作
jquery
|
//クラスを確認 $(‘#hoge’).hasClass(‘hogehoge’); //クラスを追加 $(‘#hoge’).addClass(‘hogehoge’); //クラスを削除 $(‘#hoge’).removeClass(‘hogehoge’); //クラスのオンオフ切り替え $(‘#hoge’).toggleClass(‘hogehoge’); |
Javascript
|
//クラスの確認 document.getElementById(‘#hoge’).classList.contains(‘hogehoge’); //クラスの追加 document.getElementById(‘#hoge’).classList.add(‘hogehoge’); //クラスの削除 document.getElementById(‘#hoge’).classList.remove(‘hogehoge’); //クラスのオンオフ切り替え document.getElementById(‘#hoge’).classList.toggle(‘hogehoge’); |
だいぶ雑な感じになってしましましたが、時間あるときにリファクタリングするので、
今回は許してください!!
終わり!