[英]How to escape HTML inside <span> or <div> tag
<h4>
<span class="title">
<textarea rows="4" cols="50"> How are you. </textarea>
</span>
</h4>
How to consider <textarea rows="4" cols="50"> How are you. </textarea>
如何考虑
<textarea rows="4" cols="50"> How are you. </textarea>
<textarea rows="4" cols="50"> How are you. </textarea>
as a string and not HTML. <textarea rows="4" cols="50"> How are you. </textarea>
作为字符串而不是 HTML。 I don't want HTML to render, I just want whatever comes into div or span it should render.我不希望 HTML 呈现,我只想要它应该呈现的 div 或 span 中的任何内容。
EXPECTED RESULT : <textarea rows="4" cols="50"> How are you. </textarea>
预期结果:
<textarea rows="4" cols="50"> How are you. </textarea>
<textarea rows="4" cols="50"> How are you. </textarea>
With JQuery just use text() instead of html() to insert the code:使用 JQuery 只需使用 text() 而不是 html() 来插入代码:
$('span').text('<textarea rows="4" cols="50"> How are you. </textarea>');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <h4> <span class="title"></span> </h4>
Using pure JavaScript, without any library, you can use a function to insert the code as a text node in some container.使用纯 JavaScript,无需任何库,您可以使用函数将代码作为文本节点插入某个容器中。
function insertAsText( containerId, text ) { var container = document.getElementById( containerId ); var textNode = document.createTextNode( text ); container.appendChild( textNode ); } insertAsText( "myDiv", "<p><textarea>test</textarea></p>");
<div id="myDiv"></div>
I just added an ID to the target textarea
for convenience:为方便起见,我只是在目标
textarea
添加了一个 ID:
console.log(document.getElementById('txtArea'));
<h4> <span class="tip" 4 "=" cols="50" original-title="title"> Hi hello <span class="title"><textarea rows="4" cols="50" id="txtArea"> How are you. </textarea></span> </span> </h4>
You need to escape the html you want to show您需要转义要显示的 html
< is <
" is ""
> is >
There is an online tool that can do this for you here , but you can find many scripts that can do it for in runtime.
这里有一个在线工具可以为您执行此操作,但您可以找到许多可以在运行时执行此操作的脚本。
<h4> <span class="title"> <textarea rows="4" cols="50"> How are you. </textarea> </span> </h4>
Pure JavaScript:纯 JavaScript:
document.getElementsByClassName("title")[0].innerHTML = "<div>HI!</div>";
//Result will be "HI!"
document.getElementsByClassName("title")[0].innerText = "<div>HI!</div>";
//Result will be "<div>HI!</div>"
JQuery:查询:
$(".title").html("<div>HI!</div>");
//Result will be "HI!"
$(".title").text("<div>HI!</div>");
//Result will be "<div>HI!</div>"
As a final comment, those ways are get/set.作为最后的评论,这些方法是 get/set。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.