<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title></title>

    <script type="text/javascript">

        function btnClick() {

            var div = document.getElementById("divMian");

            var input = document.createElement("input"); //根据标签名创建DOM

            input.type = "button";

            input.value = "动态创建按钮";

            div.appendChild(input);

        }

        function btnClick1() {

            var link = document.getElementById("Link1");

            alert(link.innerHTML);

            alert(link.innerText);

        }

        function createTable() {

            //冒号的前面为Key

            var data = { "百度": "http://www.baidu.com", "新浪": "http://www.sina.com" };

            var div = document.getElementById("table");

            for (var Key in data) {

                var tr = document.createElement("tr");

                var value = data[Key];

                var td1 = document.createElement("td");

                td1.innerText = Key;

                tr.appendChild(td1);

                var td2 = document.createElement("td");

                td2.innerHTML = "<a href='" + value + "'>" + value + "</a>";

                tr.appendChild(td2);

                div.appendChild(tr);

            }

        }

        function key() {

            var data = { "百度": "http://www.baidu.com", "新浪": "http://www.sina.com" };

            for (var va in data) {

                alert(va);

            }

        }

    </script>

</head>

<body>

    <div id="divMian">

    </div>

    <input type="button" onclick="btnClick()" value="创建按钮" />

    <a href="http://baidu.com" id="Link1">传<font color="red">智</font>播客</a>

    <input type="button" onclick="btnClick1()" value="innerText与innerHTML" />

    <br />

    <table id="table">

    </table>

    <input type="button" value="创建" onclick="createTable()" /><br />

    <input type="button" value="输出key" onclick="key()" />

</body>

</html>

javascript动态创建对象的更多相关文章

  1. Unity3D入门之JavaScript动态创建对象

    接着上一篇Unity3D入门文章,这里继续使用JavaScript脚本语言. 调试:Unity集成了MonoDevelop编辑器,在代码某行的左侧点击,即可下一个断点.然后先关闭Unity编辑器,在M ...

  2. 深入理解JavaScript中创建对象模式的演变（原型）

    深入理解JavaScript中创建对象模式的演变(原型) 创建对象的模式多种多样,但是各种模式又有怎样的利弊呢?有没有一种最为完美的模式呢?下面我将就以下几个方面来分析创建对象的几种模式: Objec ...

  3. javascript中创建对象的方式总结

    javascript中创建对象的方式总结 具体代码如下: //创建对象的方式: //创建方式一 var person=new Object(); person.name='jack'; person. ...

  4. 【javascript 动态添加数据到 HTML 页面】

    今天简单的学习了一下有关对象字面量的定义和 javascript 如何取出对象字面量的值的知识,javascript 动态添加数据到 HTML 页面的问题. [学习目标]有如下的一组数据通过 Ajax ...

  5. javascript中创建对象的几种不同方法

    javascript中创建对象的几种不同方法 方法一:最直白的方式:字面量模式创建 <script> var person={ name:"小明", age:20, s ...

  6. 用Javascript动态添加删除HTML元素实例 (转载)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. C# 中反射获取某类的子类和根据类型名动态创建对象

    有时候,为了快速批量处理已经实现某个基类或者某个接口的子类,需要通过反射的方式获取到他们的类类型(Type),然后再通过 1 Activator.CreateInstance(objType); 或者 ...

  8. JavaScript动态改变表格单元格内容的方法

    本文实例讲述了JavaScript动态改变表格单元格内容的方法.分享给大家供大家参考.具体如下: JavaScript动态改变表格单元格的内容,下面的代码通过修改单元格的innerHTML来修改单元格 ...

  9. swift如何动态创建对象

    前言: 在一些大型的项目中常常在加载页面的时候根据服务器请求下来的数据动态创建视图控制器对象,最近的一个项目就有这一方面的需求,加载页面之前需要先请求服务器的数据得到一个JSON字典,根据里面字符串的 ...

随机推荐

  1. Web 前沿——HTML5 Form Data 对象的使用（转）

    XMLHttpRequest Level 2 添加了一个新的接口——FormData.利用 FormData 对象,我们可以通过 JavaScript 用一些键值对来模拟一系列表单控件,我们还可以使用 ...

  2. TRI 解题报告

    题目大意: 在一个平面上有N(N <= 1000)个点,其中任意三点不共线,求这些点组成的三角形的面积和每和三角形内部含的点数的个数和. 数据范围: 20%的数据 N <= 50, 30% ...

  3. C++之类和对象——C++ primer plus学习（一）

    一.类的构造函数和析构函数 1.构造函数:    1)试图将类成员名称用作构造函数的参数名是错误的.    2)构造函数的参数表示的不是类成员, 而是赋给类成员的值.    3)为了避免这种混乱,一种 ...

  4. （原+转）ubuntu16中安装opencv2.4.11

    转载请注明出处: http://www.cnblogs.com/darkknightzh/p/5638117.html 参考网址: http://www.cnblogs.com/jeakon/arch ...

  5. Lucene学习总结之五：Lucene段合并(merge)过程分析

    一.段合并过程总论 IndexWriter中与段合并有关的成员变量有: HashSet<SegmentInfo> mergingSegments = new HashSet<Segm ...

  6. 淘管 ERP项目与淘宝对接中产生的若干问题及处理办法

    现象:ERP绑定淘宝后,下载商品数据时如果成功,ajax不断尝试重发. 原因:  /app/taoapi/lib/top/TopClient.php 中的curl()方法成功后,返回空值,而前端收到空 ...

  7. SQL Server 查看空间使用情况的 5 种方法

    解决方法: 方法 1.sp_spaceused 方法 2.dbcc sqlperf 方法 3.dbcc showfilestats 方法 4.dbcc showcontig 方法 5.sys.dm_d ...

  8. wordpress教程之在非single.php页面调用文章的信息

    使用Wordpress的朋友可能遇到这样的问题,在非single.php页面中我们有时候想要调用当前文章的标题.内容等信息,而Wordpress在生成文章页的时候在各个页面中唯一不变的只有当前的文章I ...

  9. Windows7里的“计算器”你真的会用吗？

    “计算器”是不同Windows版本中的必备工具,虽然功能单一,但的确是人们日常工作中不可缺少的辅助工具,本文就来谈谈它的使用. 一.标准型和科学型两种面板 我们既可从Windows附件菜单中启动它,也 ...

  10. Linux实现SSH无密码登录（对目录权限的设置非常详细，可以参考一下）

    假设服务器IP地址为192.168.1.1,机器名:cluster.hpc.org 客户端IP地址为172.16.16.1,机器名:p470-2.wangrx.sioc.ac.cn 客户端用户yzha ...