关于标签属性的获取、修改、添加、删除
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
</style>
</head>
<body>
<img src="../img/sunrise.jpg" alt="日出" index="123" id="img" width="100" height="101">
<script>
// 标签的属性操作
var img = document.querySelector("#img")
// 1-获取标签属性(自有的)
console.log(img.src); // http://127.0.0.1:5500/img/sunrise.jpg
console.log(img.getAttribute('src'));
// 获取标签属性(非自带的)
console.log(img.index); // undfined
console.log(img.getAttribute('index')); // 123
// 2-设置标签属性
img.setAttribute('id','img01') // id是已有的
img.setAttribute('num','999') // num是新添加的
// 3-移除标签属性
img.removeAttribute('index')
</script>
</body>
</html>