css - Get ::placeholder color using Javascript - Stack Overflow

admin管理员组

文章数量:1404927

Is it possible to get current color value of an input placeholder text? Usually I'd use getComputedStyle to get current element style values, but it does not return the placeholder value.

Any workarounds for this apart from parsing the css text and getting the value using regex?

Thanks.

Is it possible to get current color value of an input placeholder text? Usually I'd use getComputedStyle to get current element style values, but it does not return the placeholder value.

Any workarounds for this apart from parsing the css text and getting the value using regex?

Thanks.

• javascript
• css

Share Improve this question Follow edited May 24, 2016 at 10:13 Jakub Matczak 15.7k55 gold badges5151 silver badges6767 bronze badges asked May 24, 2016 at 9:58 SgoldySgoldy 79644 silver badges1515 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

the second parameter of getComputedStyle is pseudoElt selector

so to get placeholder color of your input element:

var styles = window.getComputedStyle(inputEl, ':placeholder');
console.log(styles.getPropertyValue('color'));

It's

window.getComputedStyle(inputEl, '::placeholder').getPropertyValue("color");
// note the DOUBLE colon here ----^^

Works in both Chrome and Firefox

Usually placeholder we have to use a class name and then change the placeholder color

input.text-filed::-webkit-input-placeholder {
   color: red;
}

So u know the class which is have the color

本文标签： cssGet placeholder color using JavascriptStack Overflow