Fatal编程技术网

从文本区域编辑Javascript

javascript html css

从文本区域编辑Javascript,javascript,html,css,Javascript,Html,Css,我设法在上创建了一个HTML/CSS编辑器，但我无法管理它使用Javascript。我不知道为什么，所有的代码都是有效的。例如，继续并键入以下代码： <script> function dothis(){ document.getElementById("thewow").innerHTML = "poop!"; } </script> <button type="button" onclick="dothis()">Hi</button> &l

我设法在上创建了一个HTML/CSS编辑器，但我无法管理它使用Javascript。我不知道为什么，所有的代码都是有效的。例如，继续并键入以下代码：

<script>
function dothis(){
 document.getElementById("thewow").innerHTML = "poop!";
}
</script>
<button type="button" onclick="dothis()">Hi</button>
<p id="thewow">Hi</p>


函数dothis（）{
document.getElementById（“thewow”）.innerHTML=“poop！”；
}
你好
你好
从理论上讲，它应该会起作用，是吗？即使在我右键单击>inspect元素时，它也会显示有一个有效的标记。这个怎么了

如果您没有注意到，我的问题是Javascript现在正在使用我的live HTML编辑器。

您应该使用Javascript中的
eval（）
函数

此处有更多文档：

然后，一个表单用于JavaScript，另一个表单用于html

注意eval（）可能存在的安全问题（XSS漏洞等）。

试试这个

<button type="button" onclick="document.getElementById('thewow').innerHTML = 'poop!'">try me</button>

试试我
嗨

---附加的---

使用此脚本播放您的代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR...nsitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<style type="text/css">
textarea, iframe {width:200px;height:200px;}
td {vertical-align:top;text-align:center;}
</style>

<script type="text/javascript">
function tryit()
{
var html = document.getElementById("code").value;

ifrm = document.getElementById("output");
var doc = ifrm.contentDocument || ifrm.contentWindow.document;
doc.open();
doc.write(html);
doc.close();
}
</script>
</head>

<body>

<table cellspacing="4" cellpadding="0" border="0">
<tr>
<td>
<textarea id="code"><html><body>Hello World!</body></html></textarea>
<br />
<button onclick="tryit();">Do it!</button>
</td>
<td>
<iframe id="output"></iframe>
</td>
</tr>
</table>

</body>
</html>


text区域，iframe{宽度：200px；高度：200px；}
td{垂直对齐：顶部；文本对齐：中心；}
函数tryit（）
{
var html=document.getElementById（“代码”）.value；
ifrm=document.getElementById（“输出”）；
var doc=ifrm.contentDocument | | ifrm.contentWindow.document；
doc.open（）；
doc.write（html）；
doc.close（）；
}
你好，世界！


做吧！
资料来源

难道没有办法将所有内容都放在一种形式中吗？是的，但我可以看到它使用了iframe之类的东西。eval（）是危险的东西。试用iframe@lovetostrike你能告诉我正确的方向吗？你应该读一读：我不想使用一个单独的域，我想使用iframe。有什么建议吗？如果你想把所有内容都放在一个框架内，请参考这个公认的答案。它将用户输入发送到服务器端。然后可以在编辑器的iframe中显示此页面。但是要确保你知道安全问题。