如何用javascript创建表？
如何用javascript创建表？
提问于 2009-11-25 14:23:43
我有一个php函数，我想把它转换成javascript函数，但是我不知道如何在javascript中创建一个表。
我想我必须有一个容器(DIV)来使用javascript将表插入其中。
这是一个简化的php函数：(它计算高度和宽度，并重复一个1px的阴影来创建投影效果)
function drpShadow($pic_url){
$pic_display="<table border='0' style='display:inline;' cellspacing='0' cellpadding='0'><tr><td width='4px' height='$height'><img src='/SV/Graphics/drop_shadow_top_left_corner_4x4.jpg'><br>";
for ($i=0; $i<($height-4); $i++){
$pic_display.="<img src='/SV/Graphics/drop_shadow_left_4x1.jpg'><br>";
}
$pic_display.="</td><td width='$width' height='$height'><img src='../temp_images/$pic_url'></td></tr><tr><td colspan='2' height='4px' width='($width+4)'><img src='/SV/Graphics/drop_shadow_left_bottom_corner_4x4.jpg'>";
for ($i=0; $i<=($width-6); $i++){
$pic_display.="<img src='/SV/Graphics/drop_shadow_bottom_1x4.jpg'>";
}
$pic_display.="<img src='/SV/Graphics/drop_shadow_right_bottom_corner_4x4.jpg'></td></tr></table>";
return $pic_display;
}请指导我，或者更好，给我一些代码:)
谢谢
回答 7
Stack Overflow用户
回答已采纳
发布于 2009-11-25 14:54:03
首先，我会看看你是否可以用CSS来做这件事，但是你的JavaScript可能看起来像下面这样，我还没有验证过。
function drpShadow(pic_url, width, height) {
var i;
var pic_display
= "<table border='0' style='display:inline;' cellspacing='0' cellpadding='0'><tr><td width='4px' height='" + height + "'><img src='/SV/Graphics/drop_shadow_top_left_corner_4x4.jpg'><br />";
for (i = 0; i < (height - 4); i++) {
pic_display += "<img src='/SV/Graphics/drop_shadow_left_4x1.jpg'><br />";
}
pic_display +=
"</td><td width='" + width +
"' height='" + height +
"'><img src='../temp_images/" + pic_url + "'></td></tr><tr><td colspan='2' height='4px' width='" + (width + 4) + "'><img src='/SV/Graphics/drop_shadow_left_bottom_corner_4x4.jpg'>";
for (i = 0; i <= (width - 6); i++) {
pic_display += "<img src='/SV/Graphics/drop_shadow_bottom_1x4.jpg'>";
}
pic_display
+= "<img src='/SV/Graphics/drop_shadow_right_bottom_corner_4x4.jpg'></td></tr></table>";
return pic_display;
}Stack Overflow用户
发布于 2009-11-25 14:48:36
试试这个。
<html><head>
<script language =javascript >
function dynamictable()
{
var table1=document.createElement("table");
table1.id="tab1";
table1.border=1;
var tmpRow = null;
var tmpCell = null;
tmpRow=table1.insertRow();
tmpCell=tmpRow.insertCell();
tmpCell.innerText = "Row1 Cell1";
tmpCell=tmpRow.insertCell();
tmpCell.innerText = "Row1 Cell2";
tmpRow=table1.insertRow();
tmpCell=tmpRow.insertCell();
tmpCell.innerText = "Row2 Cell1";
tmpCell=tmpRow.insertCell();
tmpCell.innerText = "Row2 Cell2";
document.getElementById("div1").appendChild(table1);
}
</script></head>
<body onload="dynamictable()">
<div id="div1"></div>
</body>
</html>Stack Overflow用户
发布于 2009-11-25 14:27:55
只需准备好HTML string (就像在PHP中所做的那样)，并将其指定为您想要的任何父元素的innerHTML属性--当然，div是可以的，但实际上它可以是几乎任何东西。您的PHP代码并不会特别插入该HTML --您可以编写一个返回HTML字符串的Javascript函数，它看起来非常相似--不管是哪种情况，只要让该函数什么也不做，您就需要调用它，并将生成的HTML ！-)
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/1795011
复制相关文章
相似问题
腾讯云开发者
