获取文本的第一行中的一个元素的jQuery

我有一个这样的例子元素：获取文本的第一行中的一个元素的jQuery

<div id="element"> 
    Blah blah blah. 
    <div>Header</div> 
    ... 
</div>

它也可以是这样的：

<div id="element"> 
    <span>Blah blah blah.</span> 
    <h4>Header</h4> 
    ... 
</div>

我想的第一行（在元素内部松散地定义行）（Blah blah blah。）。它可能被包装在一个子元素中，或者只是裸体的textnode。我怎么做？谢谢。

来源

2011-09-11 Harry

使用contents()^[docs]方法来获取所有儿童，包括文本节点，过滤掉所有空（或空白只）节点，然后抢了先设定的。

var first_line = $("#element") 
         .contents() 
         .filter(function() { 
          return !!$.trim(this.innerHTML || this.data); 
         }) 
         .first();

文本节点：http://jsfiddle.net/Yftnh/

元素：http://jsfiddle.net/Yftnh/1/

来源

2011-09-11 20:41:12 user113716

谢谢，虽然对我来说，这返回一个对象而不是文本，我应该只是first_line [0]？ – Harry

是的，这会为您提供一个带有元素或文本节点的jQuery对象。如果你想要的文字内容，使用'first_line.text（）'。如果你想修剪掉前后的空格，执行'$ .trim（first_line.text（））'。 – user113716

嗨，你能解释你为什么回来!!？什么是！！？ – Harry

-1

首先获取元件

var content = $('#element').html();

的内容然后使用换行符

tmp = content.split("\n");

所述阵列的所述第一部分是所述元件的第一行划分的文本到一个数组

var firstLine = tmp[0];

来源

2011-09-11 20:33:12 clem

我首先想到的，有什么断行，但我外汇看到至少有。依靠危险依然存在。这里是第一行：'alert（$（“＃element”）。text（）。split（/ \ n /）[1]）'[0] th是一个空字符串... http：// jsfiddle .net/mplungjan/QquSp/ – mplungjan

没有换行 – Harry

这里是你的想法。当然，如果有H4元素线之前，你想：

var content = $('#element').html(); 
var arr = content.split('<h4>'); 
console.log(arr[0]);

来源

2011-09-11 20:33:53 simoncereska

没有h4保证，这只是一个例子 – Harry

var myElement = $("#element"); 
while(myElement.children().length > 0) 
{ 
    myElement = myElement.children().first(); 
} 
var firstText = myElement.text();

假设文本正确包裹在一个元素中，当然。你可能会检查是否第一个元素之前有文字：

/\s*</.test(myElement.html())

来源

2011-09-11 20:34:05

不适用于第一种情况我相信，这将匹配标题，而不是等等等等等等等（也许应该选择更好的例子文字大声笑） – Harry

如果你得到

mytext

它变得非常困难。我想你需要递归穿越DOM的东西。它必须如何防弹？ –

获取文本的第一行中的一个元素的jQuery

回答

相关问题