JS 的 contenteditable 属性

问题

看到一个 P 标签，包含了 contenteditable 属性，可以对该标签进行编辑感觉很有意思

然后有个大佬说：

我一般要改网页上的东西都会直接在控制台输入 document.body.contentEditable = true

这儿做一下笔记

解决

• MDN - contenteditable
• MDN - contenteditable

创建一个可编辑的 span 标签，并且观察其变化执行某函数

<span class="observable" contenteditable="true">12345</span>

var observables = document.querySelector('.observable');

var observer = new MutationObserver(function (mutations) {
  mutations.forEach(function (mutation) {
    console.log(mutation);
  });
});

var config = { characterData: true, subtree: true };
observer.observe(observables, config);