<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
h2 {background:#ccc;}
</style>
</head>
<body>
<h2 style="font-size:40px; color:red; background-color:black;">js控制行内样式</h2>
<script type="text/javascript">
var hh2 = document.getElementsByTagName('h2')[0];
</script>
<script type="text/javascript">
var h2 = document.getElementsByTagName('h2')[0];
console.log( h2.style );
//console.log( h2.style[1] ); //不建议这么用
console.log( h2.style.color );
</script>
</body>
</html>
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
你在控制台，进行输出测试，就可以清除知道它们的关系：
h2是Dom对象，
style既是h2的属性，同时h2.style也是一个对象
而color是style下的属性
所以需要 h2.style.color,这样取 h2.style['color'] 也可以
补充：如何输出
打开浏览器，按F12,调浏览器调试工具。
比如说，你左手大拇指的指甲，用对象属性表示就是
你.左手.大拇指.指甲。如果只说
大拇指.指甲，谁知道是哪一个？又有谁知道是你的……所以定位一个属性，要从我们已知的某个对象(对象引用)开始，往下寻找。
顺便提一下，这里提到的引用，就好比一个代词“你”、“我”、“他”，或者名称“John”之类的，当然程序里一般称为变量。
什么是子对象？
属性和对象不冲突啊。
对象的属性可以是任意类型。因此，对象的属性也可以是一个对象。
style是元素的属性，并不是一个全局对象，需要先通过元素对象获取style属性，