JavaScript中的DOM操作之标签的样式_js如何一个标签的样式-CSDN博客

本文链接：https://blog.csdn.net/MixedSignals/article/details/105189332

①给标签设定样式：标签对象.style.属性 = 属性值
②获取标签的样式：标签对象.style.属性

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
div{
font-size: 50px;
color: green;
}
</style>
</head>

<body>
<div style="background:blue">北京</div>
<script>
var oDiv = document.querySelector('div');
console.log( oDiv.style.color ); //非行内样式获取空字符串
console.log( oDiv.style.background ); //行内样式可以正常获取
console.log( oDiv.style.fontSize ); //非行内样式获取空字符串
</script>
</body>

在这里插入图片描述
获取标签执行的样式属性，不管行内还是非行内，获取的是最终执行的样式属性值
例如：外部样式被行内样式优先级覆盖，获取的结果就是最终执行的行内样式

还有一些不写在body内的特殊标签

        // body标签
        // document.body
        console.log(document.body);

        // head标签
        // document.head
        console.log(document.head);

        // titile标签
        // document.title
        console.log(document.title);

        // html标签
        // document.documentElement
        console.log(document.documentElement);