ecmascript

Question

ecmascriptでjQueryのこちらのコードを書きたいのですがどのように書くのか教えていただけないでしょうか？

$("a[href=#]").click(function(){
    return false;
});

Answer 1

Array.from( document.querySelectorAll( 'a[href="#"]' ), ele => {
	ele.addEventListener( 'click', function( ev ){
		console.log( ev );
		return false;
	}, false );
} );
```**動くサンプル：**[https://jsfiddle.net/866bonz1/](https://jsfiddle.net/866bonz1/)

【document.querySelectorAll - Web API インターフェイス | MDN】
[https://developer.mozilla.org/ja/docs/Web/API/Document/querySelectorAll](https://developer.mozilla.org/ja/docs/Web/API/Document/querySelectorAll)

【querySelectorAllで帰ってきたNodeListを外部ライブラリを使わずにforEachしたい - Qiita】
[http://qiita.com/yugo-yamamoto/items/b87470f118ac62dc6a8d](http://qiita.com/yugo-yamamoto/items/b87470f118ac62dc6a8d)

Answer 2

jQueryを使わずいわゆるvanillaで書きたいっていうことだと推察して回答します。

document.addEventListener('click',function(e){
  if(e.target.getAttribute('href')==="#"){
    return false;
  };
},false);

Comments

[YunaIwamura]

functionの引数の e は何のためにあるのでしょうか？？

[NatsumiOki]

クリックしたターゲットを特定するためですが、実際には直接[href="#"]のセレクタを見たほうがいいので、kei344さんの回答のほうが適切だと思います。

Answer 3

そもそも、JavaScript自体がEcmaScriptに機能を追加したものですし、純粋なEcmaScriptにはDOMがありませんので、同等の操作を書くことは不可能です。

「EcmaScriptで」というのがどのような文脈なのか、詳細を記載していただければ幸いです。

Comments

[YunaIwamura]

私の勉強不足でした。
ES6の仕様でJavascriptを書きたいので、先ほどのコードをJavascriptで書きたいと思っています。

[maisumakun]

JavaScriptは処理系がいつアップデートするかわからない以上、「Don't break the web」と呼ばれるように、過去との互換性を重視して開発が行われています。もちろん、jQueryもES6環境と共存できます（jQuery 3未満ではjQueryのPromiseがES6のPromiseと非互換であるなど、いくつか問題はありますが）。