JavaScript 编程

来源：互联网发布：如何在Mac上登录icloud 编辑：程序博客网时间：2024/06/06 23:16

第五章文档对象模型DOM

面向对象：

1、

<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <title></title></head><body></body><script type="text/javascript">    var arr = [        {name: "张三", age: 20},        {name: "李四", age: 21},        {name: "赵武", age: 22},        {name: "钱千", age: 23},        {name: "李颖", age: 24},        {name: "周瑶", age: 25},        {name: "吴赛", age: 26},        {name: "郑斌", age: 27},        {name: "王琦", age: 28},        {name: "冯峥", age: 29},    ]    function Student(name, age, count) {        this.name = name;        this.age = age;        this.count = count;    }    var tableEle = document.createElement("table");    tableEle.setAttribute("border", "1");    var _1RowEle = tableEle.insertRow(0);    var _1Row1CellEle = _1RowEle.insertCell(0);    _1Row1CellEle.appendChild(document.createTextNode("序号"));    var _1Row2CellEle = _1RowEle.insertCell(1);    _1Row2CellEle.appendChild(document.createTextNode("姓名"));    var _1Row3CellEle = _1RowEle.insertCell(2);    _1Row3CellEle.appendChild(document.createTextNode("年龄"));    document.body.appendChild(tableEle);    Student.prototype.showInfo = function () {        var _2RowEle = tableEle.insertRow(this.count + 1);        var _2Row1CellEle = _2RowEle.insertCell(0);        _2Row1CellEle.appendChild(document.createTextNode(this.count + 1));        var _2Row2CellEle = _2RowEle.insertCell(1);        _2Row2CellEle.appendChild(document.createTextNode(this.name));        var _2Row3CellEle = _2RowEle.insertCell(2);        _2Row3CellEle.appendChild(document.createTextNode(this.age));        document.body.appendChild(tableEle);    }    for (var count = 0; count < 10; count++) {        var p = new Student(arr[count].name, arr[count].age, count);        p.showInfo();    }</script></html>

结果显示：

2、操作文本：

<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <title></title></head><body>    <div>        <p>haha</p>        <p>hehe</p>    </div></body><script type="text/javascript">    //选择元素    var pEle = document.getElementsByTagName("p")[0];    //改变文本    pEle.firstChild.nodeValue = "heihei";    pEle.firstChild.data = "xixi";</script></html>

0 0

JavaScript 编程

第五章 文档对象模型DOM

第五章文档对象模型DOM