2016-08-08 13 views
2

ich brauche den Wert eines bestimmten TD zu erhalten, die durch den Textwert eines benachbarten THHolen Sie sich den Text in TD von TH inneren Text benachbarten

mit jQuery

Beispiel keine ID oder Klasse hat:

<table> 
    <tbody> 
     <tr> 
      <th>Established</th> 
      <td>1976</td> 
     </tr> 
     <tr> 
      <th>Location</th> 
      <td>Baltimore, Maryland</td> 
     </tr> 
    </tbody> 
</table> 

ich möchte bei der Suche nach „Etablierte“
die Lage der tr/Ordnung ist nicht immer das gleiche Jahr 1976 (mit jQuery) erhalten.

Möglich?

Antwort

3

var year = $("th:contains('Established')").next().text(); 
 

 
console.log(year); // "1976"
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tbody> 
 
     <tr> 
 
      <th>Established</th> 
 
      <td>1976</td> 
 
     </tr> 
 
     <tr> 
 
      <th>Location</th> 
 
      <td>Baltimore, Maryland</td> 
 
     </tr> 
 
    </tbody> 
 
</table>

der obige Code wird die Zeichenfolge Established in diesem Format wird immer gegeben arbeiten (First-Groß, keine Leerzeichen, etc.).
Eine robustere Lösung:

var year = $("th").filter(function(){ 
 
    return /^established$/i.test($.trim($(this).text())); 
 
}).nextAll().filter(function() { // If there's more sibling TD... 
 
    // get all that have exactly 4 numbers as text 
 
    return /^\d{4}$/.test($.trim($(this).text())); 
 
}).first().text(); // ...but get the first one's text. 
 

 
console.log(year); // "1976"
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tbody> 
 
     <tr> 
 
      <th> EstablishEd </th> <!-- Contains spaces and possible uppercase errors? --> 
 
      <td>1976</td> 
 
     </tr> 
 
     <tr> 
 
      <th>Location</th> 
 
      <td>Baltimore, Maryland</td> 
 
     </tr> 
 
     <tr> 
 
      <th>Workers</th> 
 
      <td>3100</td> 
 
     </tr> 
 
    </tbody> 
 
</table>

https://api.jquery.com/contains-selector/
https://api.jquery.com/next/
https://api.jquery.com/text/

+0

Whattttt? so einfach? Sehr schön!! –

+0

@SagiveSEO Thx! Es gibt auch mehr kugelsichere Wege, es zu tun, aber ja, das ist die einfachste –

+0

ersten Mal muss ich warten, bis die Zeit vergeht, um die Antwort zu genehmigen;) - 10x viel. –

2

Ja, ist es möglich. jQuerys .filter(callback) Methode kann verwendet werden, um Elemente basierend auf ihrem Inhalt zu filtern.

  • Select th Elemente
  • Filter ausgewählt th Elemente nur haben "Etablierte" Einsen
  • Wählen Sie die td Elemente, die diese th Elemente folgen

var years = $("th").filter(function() { //Get th elements that has "Established" as their text 
 
    return $(this).text() === "Established"; 
 
}).next("td"); //Get td elements that are next to these th elements; 
 

 
console.log(years.text());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tbody> 
 
    <tr> 
 
     <th>Established</th> 
 
     <td>1976</td> 
 
    </tr> 
 
    <tr> 
 
     <th>Location</th> 
 
     <td>Baltimore, Maryland</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Verwandte Themen