編輯整個網頁

我們都知道網頁的內容是生成的，我們只能讀，并不能直接修改，如果想修改就得打開控制臺進行修改。

但是我最近發現一個方法，那就是設置 document.body.contentEditable='true' 就可以直接在頁面上編輯整個網頁啦！！！

獲取設備網速

navigator.connection.downlink 屬于 NetworkInformation 接口，這個 API 能獲取當前設備的網速，也就是 下行寬帶，它返回一個數字，單位是 Mb/s。

我們來看看 MDN 上對于 navigator.connection.downlink 的介紹：

但是這個 API 的兼容性比較一般，大家在使用的時候記得要兜底哦~

控制手機振動

navigator.vibrate 這個 API 能控制手機進行振動，你可以傳入兩種參數（單位都是 ms）：

• 數字：控制振動的持續時間
• 數組：控制振動間歇的持續時間

這個 API 的兼容性也是比較一般，所以大家也要做好設備判斷和兜底哦~

禁止網頁自動拼寫校驗

在網頁的輸入框中我們可以看到，當我們輸入的字母串不符合單詞檢測的時候，會有紅線警告：

那怎么去掉呢？我們可以給 body 標簽的 spellcheck 設置為 false 即可：

禁止粘貼文本到你的網頁

有時候你不想要用戶從別的地方粘貼一些文本到你的網頁中去，那么可以通過監聽 paste 這個事件，并且阻止它的默認行為，從而達到阻止粘貼的效果。

隱藏 DOM 元素

說到隱藏 DOM 元素，我們會想到幾種方式：

• display: none
• visibility: hidden
• opacity: 0
• DOM 銷毀

但是其實 HTML 標簽其實本身就自帶了一個屬性 hidden 去控制 DOM 元素是否隱藏（無法隱藏偽元素）：

唯一 ID 變成全局變量

有時候在寫一個 DOM 節點的時候，會給它賦上一個 ID：

其實我們想要獲取這個 DOM 并不需要使用 API 去獲取，直接輸出 content 這個全局變量即可：

百變 console

可能大家在使用 console 的時候只用過 console.log，但其實很多人不知道，console 可不止 log 這個方法，它非常的強大！！！

(1) console.table

console.table 可以將一個數組輸出成一個表格：

(2) console.group & console.groupEnd

console.group 顧名思義就是分組的意思，它可以將一些 console.log 給分組起來，便于查看日志：

(3) console.time & console.timeEnd

console.time 用來計算代碼運行的時間：

(4) console.warn & console.error

顧名思義，console.warn 就是輸出警告信息，console.error 就是輸出報錯信息：