您可以使用JS更改所选文本输入的css代码吗

Question

让我说清楚。我正在询问如何更改选定文本的CSS代码。不像复选框或诸如此类的东西。

var txtarea = document.getElementById("txtarea");
var selected = window.getSelection();
if (selected) {
//Change CSS Code
}

提前谢谢。

Answer 1

您可以使用活动类实现新样式，因此您将能够在ID为txtarea的每个元素中使用它，通过单击该元素，您将在常见的txtarea和txtarea-active之间切换

如果您有一个元素，例如一个ID为txtarea的文本区域标签

document.querySelector('#txtarea').addEventListener('click', ctrlAddItem);

现在你必须创建一个循环：

document.querySelectorAll("#txtarea").forEach(function () {
this.addEventListener("click", ctrlAddItem);
});

现在你必须创建一个函数，所以每次你点击元素时，它都会添加或删除ID活动:

var ctrlAddItem = function(e) {
e.target.classList.toggle("active");
}

Answer 2

您可以这样做：

var txtarea = document.getElementById("txtarea");
txtarea.style.width = '200px';
txtarea.style.height = '200px';
txtarea.style.color = 'grey';
txtarea.style.fontSize = '18px';

请记住，如果所选元素在DOM中不存在，JavaScript将抛出错误，因此您不需要使用if语句来测试它是否存在