通过一些特殊标签拆分html文本[关闭]答案

【问题标题】：split html text by some special tags [closed]通过一些特殊标签拆分html文本[关闭]
【发布时间】：2017-08-07 07:35:31
【问题描述】：

我有 html 格式的描述。但它需要显示在一行中。在行尾，当它太长时，我们需要显示'...'。我尝试使用 css，例如：

溢出：隐藏；文本溢出：省略号；空白：nowrap;

成功了。但是当我放一些html标签比如p、div时。它不能再工作了。它显示了不止一行:(。我也尝试使用javascript，通过正则表达式模式拆分html文本，我使用了这个模式/?[^>]+>/g，但它也删除了一些标签：b ...，但我不想要它.我只想删除 div, br, p, table... 那你能给我一些想法吗？谢谢。

【问题讨论】：

这个问题的格式不正确。请向我们展示您的代码没有按照您的意愿执行，并说明您期望发生的事情。
我有一个 hml 文本：{code}
Khoai lang ngon nhat
gioi
dang o day ne。麦做麦做{code}。我想展示 Khoai lang ngon nhat。在这种情况下，我删除了一些 div 标签并保留 b 标签。你能理解我吗？
div 和 p 标签是块元素（请检查一下）它们将文本作为新行插入。所以垂直我们不能应用省略号（它可能但不支持所有浏览器），请为此使用javascript库，结帐ftellipsis，stackoverflow问题参考：vertical-ellipsis

【解决方案1】：

尝试拆分连接：

"some text <br />".split("<br />").join("");

如果你有可变标签，你可能应该尝试这样的事情：

var tagString = "someText<div class='someClass'><b><h1>someText<h1><br /></b></div>";
var noTagString = "";
var lastIndex = 0;
var dontRemove = ["<b>", "</b>"];
// iterate over the tagged text
for(var i = 0; i < tagString.length; i++){
   // check for '>'
   if(tagString[i] === "<"){
      // if '<' is found
      noTagString += tagString.substring(lastIndex, i);
      // take the left over
      var leftOver = tagString.substr(i, tagString.length);
      var goOn = false;
      // check for tags to keep
      for(var k = 0; k < dontRemove.length; k++){
         if(leftOver.startsWith(dontRemove[k])){
            goOn = true;
            break;
         }
      }
      if (goOn){
         // we found a tag we want to keep so go on
         continue;
      }
      // iterate over the left over
      for(var j = 0; j < leftOver.length; j++){
         // if closing tag is found
         if(leftOver[j] === ">"){
            // update i and last index
            i = i + j;
            lastIndex = i + 1;
            break;
         }
       }
    }
 }

这没有经过很好的测试，但也许它为您指明了正确的方向。将要保留的标签放在 dontRemove 数组中。

【讨论】：

在html中我们有一些标签换行：br|p|div|h1|h2|h3|h4|h5|h6|nav|ul|ui|div|tr|address|article|除了|blockquote|dd|dir|dl|dt|fieldset|figcaption|figure|footer|hgroup|hr|legend|menu|ol|optgroup|option|pre|section|table，我们需要按模式拆分它们。但是我们有开始标签和结束标签。在这些标签中，我们可以写一些类似 class="abc" 的东西。所以我认为，我们应该为这些标签找到你的模式。 :(
如果它有帮助或说明什么不起作用，您是否介意将此设置为已接受的答案？