<!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. html中把li前面的的小圆点换成小图片的方法

    li { list-style: none; background: url(../img/li_dis.png) no-repeat left; padding-left: 20px; }

  2. avalon2学习心得(1)

    github上,avalon2的项目描述是这样的:“avalon2是一款基于虚拟DOM与属性劫持的 迷你. 易用. 高性能 的 前端MVVM框架, 适用于各种场景, 兼容各种古老刁钻浏览器, 吸收最新 ...

  3. PHP学习笔记二十八【抽象类】

    <?php //定义一个抽象类.主要用来被继承 //如果一个类继承了抽象类,则它必须实现该抽象类的所有抽象方法(除非它自己也是抽象类) // abstract class Animal{ pub ...

  4. iOS 面试题 3

    0.请写出代码,用blocks来取代上例中的protocol,并比较两种方法的优势.实际应用部分?请写出代码,用blocks取代协议或回调方法 声明: #import <Foundation/F ...

  5. 使用log4net写自定义日志

    在使用log4net写Web服务器端日志的时候,通常需要一些自定义的参数,比如请求的url,method,以及用户名等等,而log4net中默认的Log接口只提供了很少的参数.    在网上找的其他的 ...

  6. 2014年亚洲区域赛北京赛区现场赛A,D,H,I,K题解(hdu5112,5115,5119,5220,5122)

    转载请注明出处: http://www.cnblogs.com/fraud/          ——by fraud 下午在HDU上打了一下今年北京区域赛的重现,过了5题,看来单挑只能拿拿铜牌,呜呜. ...

  7. mysql升级后报Table 'mysql.servers' doesn't exist

    解决Table 'mysql.servers' doesn't exist 今天遇到一事,就是我在升级mysql数据库后进入数据建立一远程用户,结果报错了. mysql> flush privi ...

  8. 用Dockerfile构建docker image

    dockerfile是为快速构建docker image而设计的,当你使用docker build 命令的时候,docker 会读取当前目录下的命名为Dockerfile(首字母大写)的纯文本文件并执 ...

  9. [XMPP]简易的聊天室实现[二](使用CocoaAsyncSocket)

    @import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/c ...

  10. javascript之DOM操作

    一.document.getElementById()    根据Id获取元素节点 <div id="div1"> <p id="p1"> ...