利用Javascript向页面中插入元素
2008-01-19 11:54
246 查看
关键字: table, appendChild, IE, Firefox
在项目中偶然遇到一个怪异的问题,我要利用javascript动态的向一个DIV中插入一些个TABLE,Firefox可以正常显示,而在IE下,无论版本是6或7,均无法看到这个TABLE。但是,如果我直接把TABLE的HTML代码写在页面上,一切都能正常显示。最开始出问题的javascript脚本如下:
js 代码
var div = document.getElementById("container");
var table = document.createElement("table");
div.appendChild(table);
var tr = document.createElement("tr");
table.appendChild(tr);
var td = document.createElement("td");
tr.appendChild(td);
乍一看,代码比较干净,为什么在IE下就无法显示呢?其实,问题就出在IE的遍历页面中JS构造的DOM元素的时候,是一个按DOM树结构寻址的。如果漏掉了TABLE的TBODY元素,IE是无法显示这个TABLE的,中间加入一个TBODY元素,问题轻松解决!
js 代码
var div = document.getElementById("container");
var table = document.createElement("table");
div.appendChild(table);
var body = document.createElement("tbody");
table.appendChild(body);
var tr = document.createElement("tr");
body.appendChild(tr);
var td = document.createElement("td");
tr.appendChild(td);
相关文章推荐
- 【原】HTML页面元素加载顺序研究报告(4)----用JavaScript插入图片
- Javascript基础——利用Dom元素对节点进行创建、插入和删除、文档碎片
- 利用Javascript向页面中插入TABLE,IE下无法正常显示
- 利用javascript获取url中的传值并创建页面元素
- JavaScript网站设计实践(四)编写about.html页面,利用JavaScript和DOM,选择性的显示和隐藏DIV元素
- JavaScript网站设计实践(四)编写about.html页面,利用JavaScript和DOM,选择性的显示和隐藏DIV元素
- 用Javascript获取页面元素的位置
- 利用for循环来判断点击或加载的页面元素是否有效
- jQuery和JavaScript节点插入元素的方法对比
- 使用javascript绘制页面元素-->数据列表
- JavaScript 创建、插入和删除元素
- javascript控制页面元素的显示与隐藏
- [转]用Javascript获取页面元素的位置
- jsp页面中用户登录的实现(利用javascript实现非空判断等……)
- 用Javascript获取页面元素的位置
- JavaScript DOM 利用样式实现元素移动位置
- JavaScript DOM 利用样式实现元素移动位置
- jQuery参考实例 1.2 在DOM加载完毕,页面元素完全加载之前运行jQuery/JavaScript代码
- 分享一个自己利用javascript中的window.setInterval()定时器实现页面背景图片变换的特效(同时淡入淡出效果)
- Javascript实现将元素插入到指定位置