tbody元素支持嵌套的注意方法

function addMessage(messageID,userName,userCreateDate,articleCount,subject,body,creationDate,modifiedDate)

{

var br;

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

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

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

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

cellTd.appendChild(document.createTextNode("用户名:"+userName));

cellTr.appendChild(cellTd);

cell.appendChild(cellTr);

cellTd = document.createElement("td");

cellTd.appendChild(document.createTextNode("创建时间:+userCreateDate"));

cellTr.appendChild(cellTd);

cell.appendChild(cellTr);

cellTd = document.createElement("td");

cellTd.appendChild(document.createTextNode("发表文章:"+articleCount));

cellTr.appendChild(cellTd);

cell.appendChild(cellTr);

row.appendChild(cell);

cell = document.createElement("td");

cellTr = document.createElement("tr");

cellTd = document.createElement("td");

cellTd.appendChild(document.createTextNode("发表时间:"+creationDate+" "+"修改时间:"+modifiedDate));

cellTr.appendChild(cellTd);

cell.appendChild(cellTr);

cellTr = document.createElement("tr");

cellTd = document.createElement("td");

cellTd.appendChild(document.createTextNode(subject));

br = document.createElement("br");

cellTd.appendChild(br);

cellTd.appendChild(document.createTextNode(body));

cellTr.appendChild(cellTd);

cell.appendChild(cellTr);

row.appendChild(cell);

document.getElementById("messageList").appendChild(row);

}

以上代码在ie中出现"意外的调用了方法或属性访问",错误指向最后一句.望各大侠指点迷津

评价:

你这段代码感觉不优雅~没有重用性~性能底~、

建议:

1>采用函数封装实现重用。

2>对于table的内部嵌套采用如下格式:

<table>

<tbody>

<tr>

<td></td>

...

</tr>

...

</tbody>

<tbody>

</tbody>

...

</table>

对table动态生成,采用从内到外添加的方案。另尽可能少使用document.createTextNode,性能低。

3>如果你的table不是在页面加载时需要执行,建议在<script中添加defer即

<script defer>

</script>

4>另外尽量采取对传值对象的封装,调用一次即可。即,可以将你的表格数据封装成[]或{}(当然内部有模型实现)的策略。

5>如果你js好的话,可以采用prototype做得更完美!

以上意见仅供参考。

(0)

相关推荐

  • tbody元素支持嵌套的注意方法

    function addMessage(messageID,userName,userCreateDate,articleCount,subject,body,creationDate,modifiedDate) { var br; var row = document.createElement("tr"); var cell = document.createElement("td"); var cellTr = document.createElement(&

  • JS获取元素多层嵌套思路详解

    如果一段html嵌套过多,在js中获取还是比较麻烦的,我写了几套方案,大家可以参考参考,如果你有好的方法,也分享出来,让我们瞧瞧. HTML: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>元素多层嵌套,JS获取问题</title> </head> <body> <div

  • js获取浏览器高度 窗口高度 元素尺寸 偏移属性的方法

    如下所示: screen.width screen.height screen.availHeight //获取去除状态栏后的屏幕高度 screen.availWidth //获取去除状态栏后的屏幕高度 一.通过浏览器获得屏幕的尺寸 二.获取浏览器窗口内容的尺寸 //高度 window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight //宽度 window.innerWidth

  • java 中HashMap、HashSet、TreeMap、TreeSet判断元素相同的几种方法比较

    java 中HashMap.HashSet.TreeMap.TreeSet判断元素相同的几种方法比较 1.1     HashMap 先来看一下HashMap里面是怎么存放元素的.Map里面存放的每一个元素都是key-value这样的键值对,而且都是通过put方法进行添加的,而且相同的key在Map中只会有一个与之关联的value存在.put方法在Map中的定义如下. V put(K key, V value); 它用来存放key-value这样的一个键值对,返回值是key在Map中存放的旧va

  • JS获取html元素的标记名实现方法

    常见的获取元素的方法有3种,分别是通过元素ID.通过标签名字和通过类名字来获取. getElementById DOM提供了一个名为getElementById的方法,这个方法将返回一个与之对应id属性的节点对象.使用的时候请注意区分大小写. 它是document对象特有的函数,只能通过其来调用该方法.其使用的方法如下: document.getElementById('demo') //demo是元素对应的ID 该方法兼容主流浏览器,甚至包括IE6+,可以大胆使用. getElementsBy

  • 使用Script元素发送JSONP请求的方法

    使用Script元素发送JSONP请求的方法 // 根据指定URL发送一个JSONP请求 //然后把解析得到的相应数据传递给回调函数 //在URL中添加一个名为jsonp的查询参数,用于指定该请求的回调函数的名称 function getJSONP(url, callback){ //为本次请求创建一个唯一的回调函数名称 var cbnum = "cb"+getJSONP.counter++; var cbname = "getJSONP."+cbnum; if(u

  • 判断数组是否包含某个元素的js函数实现方法

    判断数组是否包含某个元素的js函数实现方法 Array.prototype.contains = function(obj) { var i = this.length; while (i--) { if (this[i] === obj) { return true; } } return false; } 或 Array.prototype.contains = function(element) { for (var i = 0; i < this.length; i++) { if (t

  • JavaScript中获取HTML元素值的三种方法

    JavaScript中取得元素的方法有三种:分别是: 1.getElementById() 方法:通过id取得HTML元素. 2.getElementsByName()方法:通过name取得元素,是一个数组. 3.getElementsByTagName()方法:通过HTML标签取得元素,是一个数组. 如果要取得值可以使用value,如:var x=document.getElementById("id").value; 方法一:getElementById() 方法 可返回对拥有指定

  • js获取元素的偏移量offset简单方法(必看)

    前言:以前一直是看别人写的,然后学习点东西,现在也把自己的学习记录下来,给大家一个学习的机会,欢迎大家多多评论和推荐哈,共同进步.竟然还有六个人关注我了 ,哈哈 开心.我会继续写下去的.. null和undefined都代表没有,但是null是属性存在值不存在,undefined是连这个属性都不存在 //例如 document.parentNode//浏览器天生自带的一个属性:父亲节点的属性 null (因为一个页面中的document已经是最顶级元素了,它没有父亲) document.pare

  • 鼠标拖动改变DIV等网页元素的大小的实现方法

    1.初次实现 1.1 html代码 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>div change

随机推荐