html页面创建对象,javascript创建html dom对象的四种方法

javascript创建html dom对象的四种方法

1.使用new关键字创建对象

var obj = new Object();//new关键字创建对象

obj.name="Bill";

obj.age=65;

obj.eyecolor="blue";

document.write("姓名："+obj.name+"
年龄："+obj.age+"
眼睛色泽："+obj.eyecolor);

2.使用字面量创建对象

var obj={//字面变量创建对象

name:"Bill",

age:22,

eyecolor:"blue"

}

document.write("姓名："+obj.name+"
年龄："+obj.age+"
眼睛色泽："+obj.eyecolor);

3.使用工厂模式创建对象

function person(name,age,eyeColor){//工厂模式需要先用new创建对象

var obj = new Object();

obj.name=name;

obj.age=age;

obj.eyeColor=eyeColor;

obj.getName=function(){alert("我的名字叫"+this.name);}

return obj;

}

var zhang = person("zhang","22","blue");

document.write("姓名："+zhang.name+"
年龄："+zhang.age+"
眼睛色："+zhang.eyeColor+"
");

zhang.getName();

4.使用构造函数创建对象

function Person(name,age,eyeColor){//构造函数创建需首字母大写，调用时需要使用new关键字进行调用

this.name=name;

this.age=age;

this.eyeColor=eyeColor;

this.getName=function(){alert("我的名字叫"+this.name);}

}

var zhang = new Person("zhang","22","blue");

document.write("姓名："+zhang.name+"
年龄："+zhang.age+"
眼睛色："+zhang.eyeColor+"
");

zhang.getName();//构造函数创建时需要使用new关键字调用函数，并且函数需大写，无返回值