javascript 对象的创建

来源:互联网 发布:mac显示终端什么意思 编辑:程序博客网 时间:2024/04/27 21:07
【1】使用Object创建对象:   var obj = new Object()
运用例子:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Object 应用</title><script type="text/javascript">    var obj = new Object();       obj.name = "linjianfeng";    obj.favour = "music";    obj.introduction = function(arg0){        document.write(arg0);    }</script></head><body>第一种object应用方法:<br><br><script type="text/javascript">obj.introduction("lin_jianfeng");</script></body></html>



【2】 使用function创建对象模板
运用例子:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>学生信息处理--1</title><script type="text/javascript">    function Student(name, age, pro)    {        this.name = name;        this.age = age;        this.pro = pro;        this.showmessage = function()        {            alert("Welcome, "+name);        }    }    function s()    {        var name = document.getElementById("name").value;        var age = document.getElementById("age").value;        var pro = document.getElementById("pro").value;               var student = new Student(name, age, pro);        student.showmessage();    }</script></head><body>    <form>        <label>姓名:</label>        <input type="text" id="name" />        <br/>        <label>年龄:</label>        <input type="text" id="age" />        <br/>        <label>专业:</label>        <input type="text" id="pro" />        <br/>        <input type="submit" value="确定" onClick="s()" />    </form></body></html>



【3】使用function构造函数和原型模式的结合形式(使用普遍的对象创建方式)
运用例子:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>学生信息处理--2</title><script type="text/javascript">    function Student(name, age, pro)    {        this.name = name;        this.age = age;        this.pro = pro;    }    Student.prototype={            constructor:Student,            showmessage:function(name)            {                alert("Welcome, "+name);            }    }       function s()    {        var name = document.getElementById("name").value;        var age = document.getElementById("age").value;        var pro = document.getElementById("pro").value;               var s = new Student(name, age, pro);        s.showmessage(name);    }</script></head><body>    <form>        <label>姓名:</label>        <input type="text" id="name" >        <br/>        <label>年龄:</label>        <input type="text" id="age" >        <br/>        <label>专业:</label>        <input type="text" id="pro" >        <br/>        <input type="submit" value="确定" onClick="s()" >    </form></body></html>


【*】使用 .js 文件:

    用例: <script src="../js/s_object.js" type="text/javascript"></script>


原创粉丝点击