- Objective:
- Breadcrumb:
# 概念阐释
## 语义
通过JavaScript来显示、获取和修改HTML元素中的属性。
## 语法
# 实例
## 展示attribute
```js
let showAttribute = () => {
const el = document.querySelector('img');
const paragraph = document.querySelector('p');
// 在p标签中展示img的src内容
paragraph.innerText = el.src;
}
```
## 替换attribute
此属性已经存在于html时
```js
let changeAttribute = () => {
const el = document.querySelector("img");
el.src = "https:// mimo/cat.png"
}
el.href="https://url";
el.type="checkbox";
```
## 添加css页面
```js
let addStyleSheet = () => {
const el = document.querySelector("link");
el.href = "style.css";
}
```
## 获取attribute
```js
let displayAttribute = () => {
const el = document.querySelector("img");
const imageLink = el.getAttribute("src");
//将src的内容展示在p标签下
const p = document.querySelector("p");
p.innerText = imageLink;
}
```
## display attribute
```js
let displayAttribute = () => {
const img = document.querySelector("img");
const imgLink = img.getAttribute("src");
const p = document.querySelector("p");
p.innerText = imgLink;
img.setAttribute("src","https://mimo.app/kittles.png")
}
```
# 相关内容
# 问题
# 问题答案
# 参考资料