js如何运行pre内容.像textarea一样可以预览效果！

86y 2011-03-01 10:16:41

我发现pre只能用innerHTML输出来但是不能显示其效果。如果用innerText只能在IE中显示其效果！



<!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>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>无标题文档</title>

<script type="text/javascript">

function runCode(obj) {   

	 var box = document.getElementById(obj); //获到文本框对象   

	 

	 var winname = window.open('', "_blank", 'toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no'); //打开一个新窗口

	 winname.document.open('text/html', 'replace'); //replace 新文档覆盖历史列表里的当前文档   

	 winname.opener = null // 防止代码对弹出页面修改   

	 winname.document.write(box.innerText); //把代码框里的值写入到该窗体   

	 winname.document.close(); //关闭文档操作   

 } 

</script>

</head>



<body>

Html代码 <a class="runcode" href="javascript:runCode('adfafd')">运行</a>

<pre class="html" id="adfafd" name="code" style="display:none;">

<html> 

<head>      

<script> 

  function showMenu(){document.getElementById("myMenu").style.display="block";}

  function hiddMenu(){document.getElementById("myMenu").style.display="none";}

</script> 

</head> 

<body oncontextmenu="showMenu();return false;" onFocus="hiddMenu();return false"> 

<div id="myMenu" style="display:none;"> 

menu<br> 

menu<br> 

</div> 

</body> 

</html>

</pre>

</body>

</html>