Question

主要是当我们缩短/截断文本内容时，我们通常只是在特定字符索引处截断它。无论如何，HTML已经很复杂，但我想使用不同的措施截断我的HTML内容（使用内容可编辑的div生成）：

我会定义字符索引N，它将用作截断起点限制
算法将检查内容是否长度至少N个字符（仅文本;不计算标签）;如果不是，它将只返回整个内容
然后检查从N-X到N+X字符位置（仅文本）并搜索块节点的末尾; X是预定义的偏移值，可能约为N/5到N/4;
如果多个块节点在此范围内结束，算法将选择最接近限制索引的N
如果没有块节点在此范围内结束，则它将在相同范围内找到最接近的字边界，并选择最接近N的索引并截断该位置。
使用有效的HTML返回截断的内容（所有标记最后都关闭）

我的内容可编辑生成内容可能包含段落（带换行符），预先格式化的代码块，块引号，有序和无序列表，标题，粗体和斜体（这些是内联节点，在截断时不应计算）最终的实现当然会定义哪些元素具体是可能的截断候选者。标题即使它们是块HTML元素也不会算作截断点，因为我们不想要寡居标题。段落，列出单个项目，整个有序和无序列表，块引号，预格式化块，无效元素等都是好的。标题和所有内联块元素都不是。

实施例

让我们把这个stackoverflow问题作为我想要截断的HTML内容的一个例子。我们将截断限制设置为 1000 ，偏移量为 250 个字符（1/4）。

从示例可以看出，两个块节点与字符1000之间最近的截断边界在</OL>和P之间（我的内容可编辑生成。 .. 的）。这意味着我的HTML应该在这两个标记之间被截断，这将导致内容文本明显少于1000个字符，但保留截断的内容是有意义的，因为它不会截断某些文本中间的某个地方通道。

我希望这能解释与此算法相关的工作方式。

问题

我在这里看到的第一个问题是我正在处理像HTML这样的嵌套结构。我还必须检测不同的元素（只有块元素，没有内联元素）。最后但并非最不重要的是，我必须只计算字符串中的某些字符并忽略那些属于标记的字符。

可能的解决方案

我可以通过创建表示内容节点及其层次结构的对象树来手动解析我的内容
我可以将HTML转换为更容易管理的内容，例如markdown，然后只搜索最接近我提供的索引N的新行并转换回HTML
使用类似HTML Agility Pack的东西并用它替换我的＃1解析然后以某种方式使用XPath来提取块节点并截断内容

第二个想法

我确信我可以通过＃1做到这一点，但感觉我正在重新发明轮子。
我不认为＃2有任何C＃库，所以我也应该手动为Markdown做HTML，或者将pandoc作为外部进程运行。
我可以使用HAP，因为它非常适合操纵HTML，但我不确定使用它是否足够简单。我担心我的自定义代码中的大部分处理仍然在HAP之外

如何处理这种截断算法？我的头脑似乎太累了，无法达成共识（或解决方案）。

Answer 1

以下是一些可以截断内部文本的示例代码。它使用InnerText属性和CloneNode方法的递归功能。

    public static HtmlNode TruncateInnerText(HtmlNode node, int length)
    {
        if (node == null)
            throw new ArgumentNullException("node");

        // nothing to do?
        if (node.InnerText.Length < length)
            return node;

        HtmlNode clone = node.CloneNode(false);
        TruncateInnerText(node, clone, clone, length);
        return clone;
    }

    private static void TruncateInnerText(HtmlNode source, HtmlNode root, HtmlNode current, int length)
    {
        HtmlNode childClone;
        foreach (HtmlNode child in source.ChildNodes)
        {
            // is expected size is ok?
            int expectedSize = child.InnerText.Length + root.InnerText.Length;
            if (expectedSize <= length)
            {
                // yes, just clone the whole hierarchy
                childClone = child.CloneNode(true);
                current.ChildNodes.Add(childClone);
                continue;
            }

            // is it a text node? then crop it
            HtmlTextNode text = child as HtmlTextNode;
            if (text != null)
            {
                int remove = expectedSize - length;
                childClone = root.OwnerDocument.CreateTextNode(text.InnerText.Substring(0, text.InnerText.Length - remove));
                current.ChildNodes.Add(childClone);
                return;
            }

            // it's not a text node, shallow clone and dive in
            childClone = child.CloneNode(false);
            current.ChildNodes.Add(childClone);
            TruncateInnerText(child, root, childClone, length);
        }
    }

一个示例C＃控制台应用程序将废弃此问题作为示例，并将其截断为500个字符。

  class Program
  {
      static void Main(string[] args)
      {
          var web = new HtmlWeb();
          var doc = web.Load("http://stackoverflow.com/questions/30926684/truncating-html-content-at-the-end-of-text-blocks-block-elements");
          var post = doc.DocumentNode.SelectSingleNode("//td[@class='postcell']//div[@class='post-text']");
          var truncated = TruncateInnerText(post, 500);
          Console.WriteLine(truncated.OuterHtml);
          Console.WriteLine("Size: " + truncated.InnerText.Length);
      }
  }

运行时，它应显示：

<div class="post-text" itemprop="text">

<p>Mainly when we shorten/truncate textual content we usually just truncate it at specific character index. That's already complicated in HTML anyway, but I want to truncate my HTML content (generated using content-editable <code>div</code>) using different measures:</p>

<ol>
<li>I would define character index <code>N</code> that will serve as truncating startpoint <em>limit</em></li>
<li>Algorithm will check whether content is at least <code>N</code> characters long (text only; not counting tags); if it's not it will just return the whole content</li>
<li>It would then</li></ol></div>
Size: 500

注意：我没有在字边界处截断，只是在字符边界处，并且没有，根据我的评论中的建议，它根本没有： - ）

Answer 2

   private void RemoveEmpty(HtmlNode node){
       var parent = node.Parent;
       node.Remove();
       if(parent==null)
           return;
       // remove parent if it is empty
       if(!parent.DescendantNodes.Any()){
           RemoveEmpty(parent);
       }
   }



private void Truncate(DocumentNode root, int maxLimit){

    var n = 0;
    HtmlTextNode lastNode = null;

    foreach(var node in root.DescendantNodes
         .OfType<HtmlTextNode>().ToArray()){
       var length = node.Text.Length;

       n+= length;
       if(n + length >= maxLimit){
            RemoveEmpty(node);
       }

    }
}

// you are left with only nodes that add up to your max limit characters.

Answer 3

我将遍历整个DOM树并继续计算出现的文本字符数。每当我达到极限（N）时，我将删除该文本节点的额外字符，从那里我将删除所有文本节点。

我相信这是一种保持所有HTML + CSS结构同时只保留N个字符的安全方法。

截断文本块末尾的HTML内容（块元素）

实施例

问题

可能的解决方案

第二个想法

3 个答案: