Created
March 25, 2020 16:52
-
-
Save okunokentaro/d63b5f938df532c13629f8e7b77e50c2 to your computer and use it in GitHub Desktop.
DOM Elementとconsole.dirの組み合わせが便利だったので伝えたい
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
2015/08/18 にQiitaに投稿した記事のアーカイブです | |
--- | |
@armorik83です。`console.log()`はおなじみですが`console.dir()`っていつ使うの?とずっと疑問でした。今回ようやく「便利!」と感じたので共有しておきます。(Chrome 44, Firefox 40, Safari 8にて確認) | |
# あまりlogとdirの違いはない | |
![img1](https://qiita-image-store.s3.amazonaws.com/0/17959/093ec450-dad0-d10f-8d53-6b9ab46085d7.png) | |
`var ob = {a: 1, b: 2};`を与えるくらいなら、`console.log()`で十分。 | |
# DOM Elementをdirに渡すと見やすい | |
**console.log** | |
![img2](https://qiita-image-store.s3.amazonaws.com/0/17959/5e0e1805-c81e-25a2-c33e-885dffd82351.png) | |
どの描画と対応しているか、mouseoverで色を付けてくれる。これはこれで便利。 | |
**console.dir** | |
![img3](https://qiita-image-store.s3.amazonaws.com/0/17959/e9606a0c-8f78-870c-c0b6-5ad1af386530.png) | |
`console.log`とは異なり、Element内のプロパティがズラズラっと表示される。欲しかったのはこれだよ! | |
--- | |
現場からは以上です。 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment