為什么這個 JavaScript 書簽會清除頁面？

Question

我正在試驗 JavaScript 書簽代碼。 我想要

1. 清除選項卡內容
2. 改變背景顏色
3. 更改字體顏色
4. 使元素可編輯

當我運行這段代碼時

javascript:document.body.style.background='darkslategray';
document.body.style.color='linen';
document.body.innerHTML='';
document.body.contentEditable=true;

我得到一個白頁。 使用命令的順序無關緊要。 當我在控制台中一個一個地運行它們時，我得到了我想要的結果。 我可以輸入的帶有淺色字體的灰色頁面。

Answer 1

Bookmarklet 不能運行一系列語句，除非它們在一個函數中，該函數在調用 bookmarklet 時被調用。

答案是將命令包裝在一個匿名函數中。

此小書簽代碼將在調用書簽時作為書簽運行，或在單擊鏈接時作為頁面中的鏈接運行。 它清除選項卡 html，並插入一個 div 以鍵入。

javascript:(function(){ 
  document.body.innerHTML = 'make notes here'; 
  document.title='your new note';
  var divvy = document.createElement("div"); 
  document.body.appendChild(divvy); 
  divvy.style.background='darkslategray'; 
  divvy.style.color='linen'; 
  divvy.contentEditable=true; 
  divvy.textContent = 'write here' 
})()