Question

如何将占位符的颜色更改为白色？我知道我必须使用-moz-placeholder但我不知道如何将其格式化为JAVASCRIPT。我需要以javascript的格式匹配下面的代码。

           //User Name Input
            var inputUserName = document.createElement("input");
            inputUserName.type = "text";
            inputUserName.style.bottom = "220px";
            inputUserName.style.width = "170px";
            inputUserName.style.height = "20px";
            inputUserName.style.left = "50px";
            inputUserName.style.textAlign = "center";
            inputUserName.style.display = "none";
            inputUserName.style.backgroundColor = "transparent";
            inputUserName.style.borderBottom = "2px solid black";
            inputUserName.style.borderTop = "transparent";
            inputUserName.style.borderLeft = "transparent";
            inputUserName.style.borderRight = "transparent";
            inputUserName.placeholder = "User Name";
            inputUserName.style.color = "white";
            inputUserName.style.position = "absolute";
            inputUserName.className = "UserNameSignUp";
            inputUserName.UserNameSignUp = "-moz-placeholder";
        //input.className = "css-class-name"; // set the CSS class
        formArea.appendChild(inputUserName); // put it into the DOM

Answer 1

-moz-placeholder 是一个伪类，因此不直接作为DOM的一部分，因此您无法以相同的方式编辑它或为其添加内联样式。

解决方法是动态更改样式表，如

document.styleSheets[0].insertRule('#xyz:-moz-placeholder { background-color: white; }', 0);

考虑到它有一些id（＆＃34;＃xyz＆＃34;）。

请参阅此文档以供参考： https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet/insertRule

如何以javascript格式更改占位符的颜色？

1 个答案: