conseguir la primera línea de texto en un jQuery elemento

Question

que tienen un elemento de ejemplo así:

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

también puede tener este aspecto:

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

Quiero conseguir la primera línea (definiendo la línea libremente) (Blah blah blah.) de texto dentro del elemento. Puede estar envuelto dentro de un elemento secundario o simplemente estar desnudo textnode. ¿Cómo puedo hacer eso? Gracias.

Answer 1

Utilice el método contents()^[docs] para obtener todos los niños, incluidos los nodos de texto, filtrar cualquier nodos vacío (sólo o espacios en blanco), y luego agarre la primera de la serie.

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

nodo de texto:http://jsfiddle.net/Yftnh/

elemento:http://jsfiddle.net/Yftnh/1/

Answer 2

primero obtener el contenido del elemento

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

luego dividir el texto en una matriz mediante salto de línea

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

la primera parte de la matriz es la primera línea del elemento

var firstLine = tmp[0]; 

Answer 3

Aquí está la idea para usted. Por supuesto, si no hay elemento h4 antes de la línea que desea obtener:

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

Answer 4

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

Suponiendo que el texto se ajusta correctamente dentro de un elemento, por supuesto. Es posible comprobar si hay texto antes del primer elemento:

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