Javascript：关闭字符串中打开的 HTML 标记答案

【问题标题】：Javascript : Close open HTML tags in a stringJavascript：关闭字符串中打开的 HTML 标记
【发布时间】：2013-02-07 10:39:48
【问题描述】：

我有一个包含 HTML 代码的 javascript 字符串。我显示它，并根据字数附加了一个阅读更多/更少的切换器。问题是，当我缩小 HTML 代码时，它可能有开放标签，假设

<p>A computer is a general purpose device that can be <b>programmed</b> to carry out a finite set of arithmetic or logical operations</p>

当缩小成为

<p>A computer is a general purpose device that can be <b>programmed...more</p>

由于粗体标签未闭合，以下数据变为粗体。

我想要一个 javascript 解决方案来关闭字符串中未关闭的标签。任何形式的帮助都将受到高度赞赏。提前谢谢大家。

【问题讨论】：

将所有内容显示为字符串？服务器不会处理任何代码或标签并显示为字符串。
How to close unclosed HTMl Tags?的可能重复
在缩小之前找出您拥有的标签数量（即p、br、b 等）。现在你知道有多少标签了。如果您有 1 p 和 1 br 标签，那么您总共有 4 个标签，包括结束标签。缩小后看看你是否有相同的标签。如果没有在适当的位置附加不存在的标签。
一种方法是将字符串加载到 DOM 节点（例如隐藏的 div）中并仅在该节点内操作 文本节点，而其他节点（标签）保持不变。
您也可以避免剪切文本，并使用 CSS 将其隐藏，例如使用 max-height 和 overflow:hidden。

标签： javascript

【解决方案1】：

使用此代码

function fixHtml(html){
  var div = document.createElement('div');
  div.innerHTML=html
  return (div.innerHTML);
}

使用

var fixed = fixHtml("<b>some text")

将返回

 <b>some text</b>

【讨论】：

啊，这样可以节省很多时间。谢谢:)

【解决方案2】：

“...更多”甚至不应该出现在段落中。尝试在段落之外单独添加它。

您可能希望将所有内容都包装在 div 中，然后将其缩小。

<div class="shrinkable">

    <p>A computer is a general purpose device that can be <b>programmed</b> to carry out a finite set of arithmetic or logical operations</p>
    <span class="see-more">...more</span>

</div>

【讨论】：

【解决方案3】：

我遇到了同样的问题并使用了以下解决方案。我根据您的示例对其进行了调整。

var divContent = document.createElement('div');

从要缩小的 div 中获取 html

var get_html = $('.shrinkable').html();

使用innerHTML，这会处理html中的所有打开标签

divContent.innerHTML = get_html;

替换html并添加see

$('.shrinkable').html(divContent.innerHTML).append('<span class="see-more">...more</span>');

【讨论】：