如何在不更改 HTML 的情况下在谷歌浏览器中设置 ContentEditable 选项？答案

【问题标题】：how do I set the ContentEditable option in google chrome, without changing the HTML?如何在不更改 HTML 的情况下在谷歌浏览器中设置 ContentEditable 选项？
【发布时间】：2020-07-26 11:12:08
【问题描述】：

因此，如果我可以将所有块/内联元素设置为具有此属性，那就太酷了。

当然可以用.setAttribute()来设置，但是CSS可以做到吗？

【问题讨论】：

标签： contenteditable

【解决方案1】：

contenteditable 是一个 HTML 属性，这意味着它需要使用 HTML (<h2 contenteditable=true>This can be changed</h2>) 或 JavaScript (`el.setAttribute("contenteditable", true) 进行设置。这就是您拥有代码的原因以上不起作用，因为您尝试使用无效的 CSS 声明它。

如果您正在寻找一种以编程方式一次将其添加到多个元素的方法，而不必将其输入，您可以使用 document.querySelector() 选择元素，它允许您使用 CSS 样式的选择器（例如 @987654324 @) 并返回一个元素数组，您可以对其进行迭代并使用 JavaScript 设置属性。

编辑：

所以回答您更新的问题，没有可编辑的内容的 CSS 属性。它是一个 HTML 属性，只能从元素的标签内设置，或者从 JS 中设置，不能从 CSS 中设置。

您可以使用上面提到的document.querySelector 来使用 CSS 选择器选择元素，并在每个元素上调用 setAttribute，这可能是完成您的目标的最佳方式。

【讨论】：