有没有替代方案<xml> ,<pre> , or escaping HTML tags to display HTML tags on a web page for a typing game program?</pre></xml>

Question

I am working on a typing test for programming codes. The problem that is encountered is that everything works fine for other code aside from HTML and JavaScript and as you can guess, it is because of the behavior of browser to parse those codes even if enclosed with those.

问题是，源代码来自客户端，我用htmlentities显示它。 之后，我使用 javascript 进行突出显示、计时器、准确性和 wpm。 现在的问题是<html> 、 <body> 、 <head>和<script>没有显示在文本中，而其他标签显示为文本。 我尝试了 xml 方法，有时它不起作用。 至于<pre>和<code>标签，它们根本不起作用。 对于 escaping 的 HTML 标签，我证明它完全不可能在我的程序中使用，因为它是一个打字游戏。 例如，如果我使用 escaping 方法， <将是< 我不希望我的用户输入< 只是为了得到<正确的。 至于使该区域成为文本区域，我不能这样做，因为我的程序会突出显示要输入的下一个字符。

谁能给我有关如何解决问题的见解？ 我也可以发布一些源代码，但我只会在需要时这样做。

编辑：我很清楚可能的重复，但就我而言，我的情况完全不同。 我想显示 HTML 代码而不转义/替换字符。 如果我这样做了，它将打破我需要输入“<”才能正确输入“<”的游戏概念。

Answer 1

i think you can try this, not sure this can help

 var input = document.getElementById('input'); var output = document.getElementById('output'); var text = output.textContent; input.addEventListener('input', function(e){ var inputText = input.value.toString(); var copy = text.substr(0, inputText.length); var lastText = ''; for(var j=copy.length;j<text.length;j++){ lastText+=text[j]; } if (inputText == copy){ output.innerHTML = '<span class="blue" id="span"></span><span id="newoutput"></span>' var newoutput = document.getElementById('newoutput'); var span = document.getElementById('span'); newoutput.textContent = lastText; span.textContent = copy } })

 #input{ width: 300px; height: 400px; resize: none; }.blue{ background-color: blue; } #output{ width: 400px; } #span{ width: 300px; }

 <div id="output">&ltscript&gt some script &lt/script&gt</div> <textarea id="input"></textarea>

Answer 2

Writing in the HTML File:

  <script>

  var y="<head>";

  $('#customDiv').text(y);

</script>

您可以将自定义<div id="customDiv"></div>放入 html 文件中。

有没有替代方案<xml> ,<pre> , or escaping HTML tags to display HTML tags on a web page for a typing game program?</pre></xml>

问题描述

2 个解决方案

解决方案1
0 已采纳 2019-10-22 06:47:46

解决方案2
0 2019-10-27 07:29:20

有没有替代方案<xml> ,<pre> , or escaping HTML tags to display HTML tags on a web page for a typing game program?</pre></xml>

问题描述

2 个解决方案

解决方案1 0 已采纳 2019-10-22 06:47:46

解决方案2 0 2019-10-27 07:29:20

解决方案1
0 已采纳 2019-10-22 06:47:46

解决方案2
0 2019-10-27 07:29:20