如何在包含粗体和斜体标签时获取字符串的第一个文本节点

How to get first text node of a string while containing bold and italic tags?

本文关键字：字符串 获取 第一个 节点 文本 标签 包含粗 斜体      更新时间：2023-09-26

  1. 字符串是动态的

  2. 它起源于用户单击dom中任意位置时的onclick事件

  3. 如果字符串的第一部分是：

    "login<b>user</b>account"

被包含在这样的一些元素中：

"<div>login<b>user</b>account</div>"，

那么我可以用这个得到它：

alert($(s).find('*').andSelf().not('b,i').not(':empty').first().html());
// result is : login<b>user</b>account
但是，当它没有被包含在任何元素中时，在这种情况下，

即当它没有被封闭在任何元素中时，我如何获得相同的结果？

我尝试了下面的代码，当第一部分不包含任何<b></b>时，它工作正常，但只有当它包含这些标签时，它才会给出"登录"。

 var s = $.trim('login<b>user</b> account<tbody> <tr> <td class="translated">Lorem ipsum dummy text</td></tr><tr><td class="translated">This is a new paragraph</td></tr><tr><td class="translated"><b>Email</b></td></tr><tr><td><i>This is yet another text</i></td> </tr></tbody>');
    if(s.substring(0, s.indexOf('<')) != ''){
       alert(s.substring(0, s.indexOf('<')));
    }

注意：建议一个不特定于上述字符串的通用解决方案。它应该适用于有粗体标签和没有粗体标签的情况。

所以这只是一个b或i，呵呵？

递归函数始终是要走的路。而这一次，这可能是最好的方式。

var s = function getEm(elem) {
    var ret = ''
    // TextNode? Great!
    if (elem.nodeType === 3) {
        ret += elem.nodeValue;
    }
    else if (elem.nodeType === 1 &&
        (elem.nodeName === 'B' || elem.nodeName === 'I')) {
        // Element? And it's a B or an I? Get his kids!
        ret += getEm(elem.firstChild);
    }
    // Ain't nobody got time fo' empty stuff.
    if (elem.nextSibling) {
        ret += getEm(elem.nextSibling);
    }
    return ret;
}(elem);

Jsfiddle演示了这一点：http://jsfiddle.net/Ralt/TZKsP/

PS：使用正则表达式或自定义标记器解析HTML是不好的，不应该这样做。

您正在尝试检索所有文本，直到第一个不是<b>或<i>的元素，但此文本可以包装在元素本身中。这是超级棘手的。我觉得有一种更好的方法来实现您要完成的任何事情，但这里有一个有效的解决方案。

function initialText(s){
  var test  = s.match(/(<.+?>)?.*?<(?!(b|'/|i))/);
  var match = test[0];
  var prefixed_element = test[1];
  // if the string was prefixed with an element tag
  // remove it (ie '<div> blah blah blah')
  if(prefixed_element) match = match.slice(prefixed_element.length);
  // remove the matching < and return the string
  return match.slice(0,-1);
}

你很幸运，我发现这个问题很有趣，也很有挑战性，因为这又是荒谬的。

不客气;-）

试试这个：

if (s.substring(0, s.indexOf('<')) != '') {
  alert(s.substring(0, s.indexOf('<tbody>')));
}
相关文章：