极客观点
项目管理
HarmonyOS
<!DOCTYPE html>
<html lang="en">
<link rel="stylesheet" type="text/css" href="styleFile.css" />
<head>
<meta charset="UTF-8">
<title>Dear Js</title>
</head>
<body>
<p id="timer"></p>
<a id="volumeChangeLink">
<img id="speakerImage" src="images/volumeWhite3.png" />
</a>
<audio id="rainAudio" src="rain.m4a" autoplay="autoplay" >
</audio>
<script src="test.js"></script>
</body>
</html>
经过探究我发现我只能使用document.getElementById("rainAudio").volume = 我想要的音量大小;来改变音量而不能使用document.getElementById("rainAudio").setAttribute("volume", "我想要的音量大小");来改变, 这是为什么呢?
HTML中属性有分两种：标签属性（attribute）、DOM属性（property）
标签属性（attribute）
attribute可以说是HTML标签的特性，attribute可以通过
getAttribute和setAttribute进行获取或修改。这里
id和src是HTML标签<audio>的特性。DOM属性（property）
property就是一个属性，如果把DOM元素看成是一个普通的Object对象，那么property可以通过对象访问属性的方式
.来修改或获取。这里
volume是audioDOM对象的属性。audio
w3school Audio 标签介绍
w3school Audio DOM对象介绍
通过上面2个详细介绍链接可发现，
<audio>所有的标签属性中并没有volume，而volume是DOM对象属性。