修改元素自带的属性
1.对象解决
2.通过 setAttribute 方法修改
3.代码演示
<!DOCTYPE html>
<html lang="zh-CN">
<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>
</head>
<body>
<img src="./images2/1.jpg" alt="" id="pic" width="300">
<script>
let pic = document.getElementById('pic') // 返回的就是一个对象
console.log(pic.nodeType);
// 修改元素(只是标签内自带)的属性 ------------- 只能修改标签内自带的css属性
// 对象.属性 = 值
pic.width = "100"
// 添加属性
pic.title = "我是一颗小星星"
// 第二种方法 对象.setAttribute('属性名','属性值') 方法修改
// set--设置 Attribute--属性
// 修改标签属性自带的值
pic.setAttribute('src','./images2/2.jpg')
pic.setAttribute('width','500')
</script>
</body>
</html>
4.注意事项
- 属性和值都要加引号
- 目前两种方式没啥区别
- 更推荐使用对象.属性方式