獲取文本的第一行中的一個元素的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

回答

相關問題