JavaScript 第四章作业

1.使用JavaScript创建一个对象student，表示一个学生对象，添加属性：姓名，年龄，自我介绍，添加方法:输出该学生的姓名，年龄和自我介绍
实现代码如下:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		<div id="div"></div>
		<script type="text/javascript">
			var student = new Object();
			student.name = "工藤新一";
			student.age = 17;
			student.intro = "我叫工藤新一，我是一名高中二年级学生，我非常喜欢推理和足球！";
			student.showIntro = function(){
				var list = "姓名:" + this.name+"<br/>年龄:"+this.age+"<br/>自我介绍:"+this.intro;
				return list;
			}
			document.getElementById("div").style.lineHeight="35px";
			document.getElementById("div").innerHTML=student.showIntro();
		</script>
	</body>
</html>

2.创建一个构造函数Student,添加属性和方法，在方法中使用createElement()创建p标签，使用innerHTML把姓名，年龄和自我介绍显示在此p标签中，使用return返回p标签，使用new创建两个学生对象，使用getElementById()和appendChild()把创建的学生对象信息追加到页面中去
实现代码如下:

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>

	<body>
		<div id="div"></div>
		<script type="text/javascript">
			function Student(name, age, intro) {
				this.name = name;
				this.age = age;
				this.intro = intro;
				this.showIntro = showIntro;
			}

			function showIntro() {
				var p = document.createElement("p");
				var list = "姓名：" + this.name + "<br/>年龄：" + this.age + "<br/>自我介绍：" + this.intro;
				p.innerHTML = list;
				return p;
			}
			var student1 = new Student("王小明", 16, "我是高中一年级的学生，身高1.8米，很帅，我喜欢学习语文和英语。");
			var student2 = new Student("黄妞妞", 6, "我今年6岁了，常可爱，马上就可以上小学了，就可能有好多好多的小朋友了。");
			document.getElementById("div").appendChild(student1.showIntro());
			document.getElementById("div").appendChild(student2.showIntro());
		</script>
	</body>

</html>

5.创建一个构造函数Animal使用继承完成输出动物的自我介绍
实现代码如下:

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>

	<body>
		<div id="div"></div>
		<script type="text/javascript">
			function Animal(name, color, age) {
				this.name = name;
				this.color = color;
				this.age = age;
			}

			function inherit(name, color, age, leg) {
				Animal.call(this, name, color, age);
				this.leg = leg;
			}
			inherit.prototype = new Animal();
			inherit.prototype.info = function() {
				var p = document.createElement("p");
				var list = "我是一个" + this.color + "的" + this.name + "，我已经" + this.age + "岁了，我有" + this.leg + "条腿";
				p.innerHTML = list;
				return p;
			};
			var inherit1 = new inherit("小狗狗", "灰色", 1, 4);
			var inherit2 = new inherit("茶杯猫", "白色", 2, 4);
			var inherit3 = new inherit("母鸡", "红色", 1, 2);
			document.getElementById("div").appendChild(inherit1.info());
			document.getElementById("div").appendChild(inherit2.info());
			document.getElementById("div").appendChild(inherit3.info());
		</script>
	</body>

</html>

JavaScript 第四章 作业

猜你喜欢

JavaScript 第四章作业