在 Javascript 中从 textarea 中删除或隐藏 html 标签答案

【问题标题】：Get rid or hide html tags from textarea in Javascript在 Javascript 中从 textarea 中删除或隐藏 html 标签
【发布时间】：2012-01-03 08:59:41
【问题描述】：

我使用 json 检索了 textarea 的正文，但由于之前设置了一些样式，该文本似乎带有 html 标签。

如何在不显示这些 html 标记的情况下在新文本区域上显示这些文本行？我不想完全摆脱它们，因为我仍然想保留这些样式以备将来使用。

【问题讨论】：

您希望此文本可编辑吗？
参考这个[链接][1]老问题[1]：stackoverflow.com/questions/822452/…
如果 jQuery 与您相关，剥离 HTML 变得微不足道。只需将原始值存储为隐藏输入并在 textarea 中显示时剥离 HTML。见this test case

标签： javascript html json textarea

【解决方案1】：

您需要从 textarea 传入的字符串中转义 html 标签。通过像/<(.|\n)*?>/ 这样的正则表达式，您可以找到开始的html 标记，使用/<(\/.|\n)*?>/，您可以找到结束标记。

这是我的例子：

HTML

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />

</head>
<body>
  <textarea id="input">
    <p>This is html</p>
  </textarea>
  <textarea id="output">

  </textarea>

JavaScript

var input = document.getElementById('input'),
    output = document.getElementById('output');
output.value = input.value.replace(/<(.|\n)*?>/, '').replace(/<\/(.|\n)*?>/, '');

住：JSBin

您可能希望使用以下正则表达式检测像 /> 这样的结束标签：/\/(.|\n)*?>/

【讨论】：

【解决方案2】：

textarea{width:100%;min-height:75px}

<textarea id="input">
    <p>This is html</p>
    <p>This is html</p>
    <p>This is html</p>
</textarea>

<button onClick="removeTags()">Remove</button>

<textarea id="output"></textarea>

<script>
function removeTags(){
  var input = document.getElementById('input');
  var output = document.getElementById('output');
  output.value = input.value.replace(/(<([^>]+)>)/ig,"");
}
removeTags();
</script>

【讨论】：