我正在网上搜索,但没有找到任何东西。我正在尝试使用javascript更新文本框的占位符颜色,但是我该怎么做呢?我有一个颜色选择器,颜色正在变化。
如果我的CSS中有类似的内容,该如何更新?
::placeholder { color: red; } <input placeholder="placeholder" />
是否有JavaScript命令可以对此进行编辑?就像是
document.getElementById('text').style.placeholderColor = newColor;
使用CSS变量。您还可以仅定位所需的元素
function update() { document.querySelector('input[type=text]').style.setProperty("--c", "blue"); } ::placeholder { color: var(--c, red); } <input type="text" placeholder="I will be blue"> <input type="number" placeholder="I will remain red"> <button onclick="update()">change</button>
CSS变量在修改您无法使用JS之类的伪类/伪元素(例如:before/ :after/ ::placeholer/::selection等)时非常有用。您只需使用可以轻松在元素上更新的变量来定义属性。
:before
:after
::placeholer/::selection