2、创建6-2.htnl文件,文件中定义对象 dog,其属性有 name、age、breeds. 方法有 shout,遍历 dog 对象,页面输出結果如下图所示。 name:小日 age:3 breeds;边牧 shout;汪汪
时间: 2024-10-19 14:17:46 浏览: 22
你可以创建一个名为`6-2.html`的HTML文件,其中包含JavaScript部分来定义一个名为'dog'的对象。下面是一个简单的示例:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>狗狗信息</title>
</head>
<body>
<h1 id="dogName">name: </h1>
<p id="dogAge">age: </p>
<p id="dogBreeds">breeds: </p>
<button onclick="dog.shout()">Shout</button>
<!-- JavaScript -->
<script>
// 定义 dog 对象
var dog = {
name: "小日",
age: 3,
breeds: "边牧",
// shout 方法
shout: function() {
document.getElementById("dogName").textContent += this.name;
document.getElementById("dogAge").textContent += this.age;
document.getElementById("dogBreeds").textContent += this.breeds;
document.getElementById("dogName").textContent += " 汪汪";
}
};
// 初始化页面显示
dog.shout(); // 首次调用shout方法
</script>
</body>
</html>
```
这个HTML文件中,我们首先定义了三个静态属性(name, age, breeds),然后定义了一个方法shout。当点击按钮时,会触发shout方法,更新页面上对应的id为"dogName", "dogAge", "dogBreeds"的元素内容。
打开这个文件在浏览器中查看,你会看到如下的输出:
- name: 小日
- age: 3
- breeds: 边牧
- 小日 汪汪
阅读全文