Question

有两种情况

第一种情况：

我有一个html字符串，例如

 var str1="<b>hello how are you</b><h1>how to extract the first 10 characters of a htmlstring without losing the html of the string</h1>";

我必须在不丢失html的情况下提取字符串的前10个字符。这样预期的输出就是

<b>hello how a<b>...

第二种情况：

我有一个简单的字符串，如下所示

var str1="hello how are you.how to extract the first 10 characters of a htmlstring without losing the html of the string";

我必须提取字符串的前10个字符。这样预期的输出就是

hello how a...

我想要一个正则表达式表达式可以应用于这两种情况。

我是regex的新手..我已经尝试了很多，但我没有任何正常工作的代码，所以我可以在这里发布。请帮助。

Answer 1

试试这个：

var str1="<b>hello how are you</b></h1>how to extract the first 10 characters of a htmlstring without losing the html of the string</h1>";
var res = str1.replace(/<(.*?\>)(.{11}).*/, '<$1$2</$1');
console.log(res);

Answer 2

根据your rephrased question;

Regexp不是handeling html的好工具。

正确的方法是解析DOM。杰克给出了一个例子，但假设您要保留的标记是您正在查看的节点的第一个子节点。

上面链接的问题表明情况并非如此。然而杰克的解决方案可以适用于处理任意嵌套。我这样做只需计算节点的字符，直到我到达断点。然后递归修改最终节点。最后，我删除了找到所需数量的字符后发生的所有节点。

function getNodeWithNChars(capture,node)
{
  var len=node.childNodes.length;
  var i=0;
  var toRemove=[];
  for(;i<len;i++)
  {
     if (capture===0)
     {
       toRemove.push(node.childNodes[i]);
     }
    else if (node.childNodes[i].textContent.length<capture)
    {
       capture=capture-node.childNodes[i].textContent.length;
    }
    else
    {
      if(node.childNodes[i].childNodes.length===0)
      {
        node.childNodes[i].textContent=node.childNodes[i].textContent.substring(0,capture);
        capture=0;
      }
      else
      {
        node.childNodes[i]=getNodeWithNChars(capture,node.childNodes[i]);
        capture=0;
      }
    }
  }
  i=0;
  for(;i<toRemove.length;i++)
  {
    node.removeChild(toRemove[i]);
  }
  return node;
}

function getNChars(n,str)
{
  var node = document.createElement('div');
  node.innerHTML = str;
  node=getNodeWithNChars(n,node);
  return node.innerHTML;
}

调用上述函数的示例;

console.log(getNChars(25,"hello how are <b>you</b> <em>how <b>to extract the</b> first 25 characters of a htmlstring without losing the html of the string</em>"));

Answer 3

这个怎么样：

regex = /(<[a-z0-9]+>|)([a-z0-9 ]{0,10})[a-z0-9 ]*(<\/[a-z0-9]+>|).*/

str1 = "hello how are you.how to extract the first 10 characters of a htmlstring without losing the html of the string"
console.log(str1.replace(regex, '$1$2$3'))

str1 = "<b>hello how are you</b><h1>how to extract the first 10 characters of a htmlstring without losing the html of the string</h1>"
console.log(str1.replace(regex, '$1$2$3'))

正则表达式提取字符串的前10个字符

3 个答案: