jquery sélectionner le texte

Question

<div>select this<strong>dfdfdf</strong></div> 
<div><span>something</span>select this<strong>dfdfdf</strong></div> 

Comment utiliser jquery ou tout simplement le javascript pour sélectionner la valeur de la balise div mais ne comprend pas les éléments enfants

//output 
select this 

Answer 1

$("div").contents().each(function(i) { 
    //the function is applied on the node. 
    //therefore, the `this` keyword is the current node. 
    //check if the current element is a text node, if so do something with it 
}); 

Answer 2

Utilisation XPath, vous pouvez sélectionner uniquement le texte noeud enfants de la div. Javascript brut ci-dessous.

var xpr = document.evaluate("//div/text()",document,null, 
    XPathResult.STRING_TYPE, 
    null); 
console.log(xpr.stringValue); 

> select this 

Si vous avez un texte entrecoupé de tags:

<div>select this<strong>dfdfdf</strong>and this</div> 

... vous pouvez itérer sur eux (aide convertit XPathResult en tableau)

function $x(path, context, type) { 
    if (!context) context = document; 
    type = type || XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE; 
    var i,item,arr=[], xpr = document.evaluate(path, context, null, type, null); 
    for (i=0; item=xpr.snapshotItem(i); i++) 
     arr.push(item); 
    return arr; 
} 

var nodes = $x("//div/text()"); 
nodes.forEach(function(item) { 
    console.log(item.textContent); 
}); 

> select this 
> and this 

_{(testé en FF, w/firebug logging)}

Answer 3

version simple JS:

function getDirectTextContent(element) { 
    var text= []; 
    for (var i= 0; i<element.childNodes.length; i++) { 
     var child= element.childNodes[i]; 
     if (child.nodeType==3)       // Node.TEXT_NODE 
      text.push(child.data); 
    } 
    return text.join(''); 
}