为什么我不能直接设置“样式”

Question

Let's suppose I have a <div> . I set its style to color:red .

<div style="color:red">text</div>

Why can't I set style through javascript like so:

document.getElementsByTagName("div")[0].style="color:blue";

But only can set property of style:

document.getElementsByTagName("div")[0].style.color="blue";

Answer 1

document.getElementsByTagName("div")[0].style.cssText = "color: blue;"

src： http ： //www.w3schools.com/jsref/prop_style_csstext.asp

Answer 2

This is dom model. What js debug tool do you use? Run this in your browser console:

document.getElementsByTagName("div")[0].style

This will be result:

So, this command returned object. By this:

document.getElementsByTagName("div")[0].style="color:blue";

You redefining object. It is not correct at all.

That's it and you can't do anything with it.

If you want to have a tool to manage css properties better you can use jQuery : prop() function