如何把一个HTMLElement转化为字符串？

cpunion 2004-10-11 10:24:44

如下：
<DIV id='div1'>
<table><tr><td>aa</td></tr></table>
</DIV>

想通过不断循环获取div1的children，每次把一个child转化为字符串，比如第一次循环获取到了table标记，就把它转化为[table]<tr><td>aa</td></tr>[/table]，第2次就获取到tr标记了，再转化为[table][tr]<td>aa</td>[/tr][/table]，第3次就转化td标记了，依次类推，最终将把这些标记转化完，div1就不再有children了，循环终止。

我使用的方法是，每次获取innerHTML，再在2端加上转化后的tagName，实现代码如下：
tag.outerHTML = "[" + tag.tagName + "]" + tag.innerHTML + "[/" + tag.tagName + "]"

然而实际操作过程中发现，table标记这样做不行，其它标记没有问题,原因未知。

如何达到我的要求？在线等高手指教。

...全文

1184 9 打赏收藏转发到动态举报

写回复

用AI写文章

9 条回复

切换为时间正序

请发表友善的回复…

发表回复

cpunion 2004-10-11

打赏
举报

to JK_10000(JK) :

我没有使用正则替换是因为我要有选择地替换一些标签，比如：

<font size=2>aa</font>将替换为[size=2]aa[/size]
<font color="#ff0000">bb</font>将替换为bb

因为</font>将替换为不同标签，所以这样不太合适。

“当table标签被替换后，所有的标签都成了非法标签:tbody与/tbody不是对应关系，tr也不是被包在tbody里。”
=============================================
上面那段测试好像只是</table>不正常。
还可以使用all来获取所有的下级标签来处理，这样的话，最下级的标签会先得到，有可能可以解决这个问题。

我要做的实际上就是把HTML代码自动替换成Discuz!论坛使用的代码，不知道有没有更简单的办法来实现。

JK_10000 2004-10-11

打赏
举报

<DIV id='div1'>
<table><tr><td>aa<<></td></tr></table>
</DIV>
<script language="javascript">
alert();
var str=div1.innerHTML;
str=str.replace(/</g,"[");
str=str.replace(/>/g,"]");
alert(div1.innerHTML);
div1.innerHTML=str;
</script>

JK_10000 2004-10-11

打赏
举报

回复人： cpunion(int argc, char** argv) ( ) 信誉：99 2004-10-11 10:43:00 得分: 0
-----------------------------------
程序如下(在你的程序里加了个alert)
当table标签被替换后，所有的标签都成了非法标签:tbody与/tbody不是对应关系，tr也不是被包在tbody里。

<DIV id='div1'>
<table><tr><td>aa</td></tr></table>
</DIV>
<script language="javascript">
while (div1.children.length > 0)
{
var children = div1.children;
for (var i=children.length-1; i>=0; i--)
{
alert("div children num:"+children.length+"\ndiv innerHTML:"+div1.innerHTML);
var child = children[i];
child.outerHTML = "[" + child.tagName + "]" + child.innerHTML + "[/" + child.tagName + "]";
}
}
alert (div1.innerHTML);
</script>

cpunion 2004-10-11

打赏
举报

上面的测试代码我修改了一下：
<DIV id='div1'>
<table><tr><td>aa</td></tr></table>
</DIV>
<script language="javascript">
while (div1.children.length > 0)
{
var children = div1.children;
for (var i=children.length-1; i>=0; i--)
{
var child = children[i];
if (child.tagName.substr (0,1) != "/")
child.outerHTML = "[" + child.tagName + "]" + child.innerHTML;
else
child.outerHTML = child.innerHTML + "[" + child.tagName + "]";
}
}
</script>
这次输出更好，不过不明白为什么</table>没了？？？

cpunion 2004-10-11

打赏
举报

啊？难怪有些代码执行时会有异常，原来如此，这么说我这么做是不行了？

不过我上面的这段测试代码能够执行。

JK_10000 2004-10-11

打赏
举报

The outerHTML property is read-only on the HTML, HEAD, BODY, FRAMESET, TBODY, TD, TFOOT, TH, THEAD, and TR objects.

cpunion 2004-10-11

打赏
举报

唉。我做了个简单的文件来测试，结果又没有问题，可能是我哪个部分写错了吧。谢谢楼上2位，tbody在IE解析HTML时会自动加上，如下代码可以测试：

<DIV id='div1'>
<table><tr><td>aa</td></tr></table>
</DIV>
<script language="javascript">
while (div1.children.length > 0)
{
var children = div1.children;
for (var i=children.length-1; i>=0; i--)
{
var child = children[i];
child.outerHTML = "[" + child.tagName + "]" + child.innerHTML + "[/" + child.tagName + "]";
}
}
alert (div1.innerHTML);
</script>