js有关的demo
一、创建JS对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>学习js</title>
<style>
#content1,#content2{
width: 200px;
border:1px solid red;
}
</style>
</head>
<body>
<h1>一、创建JavaScript对象</h1>
<h3>1.定义并创建对象的实例 </h3>
<div id="content1"></div>
<h3>2.使用函数来定义对象,然后创建新的对象实例</h3>
<div id="content2"></div>
</body>
<script>
<!-- 1.定义并创建对象的实例 -->
var student =new Object();
student.class="03";
student.id="04";
student.name="Jane";
student ={class:"04",id:"04",name:"Jane"};
document.getElementById("content1").innerHTML=(student.class+student.id+"是"+student.name);
// 2.使用函数来定义对象,然后创建新的对象实例
// classid,sid,name要与class、id区分开
function classmate(classid,sid,name){
this.classid=classid;
this.sid=sid;
this.sname=name;
}
newStudent=new classmate("01","01","李白");
document.getElementById("content2").innerHTML=(newStudent.classid+newStudent.sid+"是"+newStudent.sname);
</script>
</html>
实现结果:
二、JavaScript for…in循环
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>学习js</title>
<style>
</style>
</head>
<body>
<h2>JavaScript for...in 循环</h2>
<h4>for ..in循环中的代码块将针对每个属性执行一次</h4>
<p>点击下面的按钮,循环遍历对象"person"的属性</p>
<input type="button" onclick="information();" value="点击这里">
<p id="demo"></p>
</body>
<script>
function information(){
var x;
var txt="";
var person={fname:"曹操",dynasty:"东汉末年",job:"丞相"};
for(x in person){
txt=txt+person[x];
}
// for(variable in object){
// 执行的代码。。。
// }
document.getElementById("demo").innerHTML=txt;
}
</script>
</html>
实现结果: