2009-05-25 9 views
6

Ich habe dieses html:Wie wählt man nur den obersten Elementtext aus?

<span class="price"> 
     $61.00 
       <span class="detailFreeShipping">With Free Shipping</span> 
    </span> 

Wie ein jQuery-Selektor zu schreiben, die mir den Preis Text geben nur „61,00 $“?

Ich möchte es so generisch wie ich kann, weil in einigen Fällen gibt es keine innere Spannweite, nur die Elternteil.

Antwort

11

Sie dies tun können:

jQuery.fn.extend({ 
    textOnly: function() { 
     // make a clone of this object so we are not changing the actual DOM 
     var obj = $(this).clone(); 

     // remove all the children, i.e. any DOM objects 
     obj.children().remove(); 

     // get the text value after all DOM elements are removed 
     return obj.text(); 
    } 
}); 

dann können Sie es nennen wie dieser

var price = $(".price").textOnly(); 

werden Sie den Wert erhalten, den Sie wollen.

+0

ersetzen Sie einfach die "textOnly =" durch "textOnly:" –

+0

Danke, ich hatte es als eigenständige Funktion, aber beschlossen, es auf die letzte Minute zu erweitern. –

0

Ich weiß nicht, jQuery, aber nur um Pseudo reagieren Ihre Frage, können Sie dies tun, indem:

var elem = document.getElementById('yourid'); // or document.getElementsByTagName('span')[0]; 
var text = elem.innerHTML; 
text = text.substr(0, (text.indexOf('<') > -1 ? text.indexOf('<') : text.length)); 
0

ein Versuch:

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<head> 
    <script type="text/javascript" src="http://www.google.com/jsapi"></script> 
    <script type="text/javascript" charset="utf-8"> 
     google.load("jquery", "1.3"); 
    </script> 
    <script type="text/javascript" charset="utf-8"> 
     $(document).ready(function(){ 
      var white_out = $("span[class=price] :first-child").text(); 
      var all = $("span[class=price]").text(); 
      var price = all.replace(white_out, ""); 
      alert(price); 
     }); 
    </script> 
</head> 
<body> 
    <span class="price"> 
      $61.00 
       <span class="detailFreeShipping">With Free Shipping</span> 
     </span> 
</body> 
</html> 

, wo die Linien:

  var white_out = $("span[class=price] :first-child").text(); 
      var all = $("span[class=price]").text(); 
      var price = all.replace(white_out, ""); 

könnte die Arbeit tun, für ein einzelnes Element.

+0

Was ist, wenn der Preis im Element an zweiter Stelle steht? der ursprüngliche Autor bat darum, dass es so allgemein wie möglich sei. –

+0

dann funktioniert es immer noch, weil das erste Kind gelöscht wird, da in Ihrer (eleganteren) Lösung alle Kinderelemente gelöscht werden. die Reihenfolge spielt keine Rolle, noch ob es überhaupt ein Kindelement gibt; Ich halte es für "generisch wie möglich" für das vorgestellte Problem ... – miku

Verwandte Themen