2009-11-04 6 views
11

Je voudrais sélectionner un élément dans le td d'une de mes tables mais je ne comprends pas vraiment la syntaxe. C'est ce que j'ai essayé:JQuery sélectionner un élément dans un td

$("table > td:#box") 

Ceci est un exemple de ma structure de la table:

<div id="main"> 
<div id="today"> 
    <table id="list" width="100%" cellpadding="4" cellspacing="0" border="0" style="font-size: 10px; border-collapse:collapse;"> 
    <tr id="109008"> 
    <td class="tdstd"> 
    <a class="box" href="link"></a> 
    </td> 

ou avec l'inspecteur DOM Chrome:

alt text

+0

Veuillez poster le code HTML correspondant et dire quelle partie exactement vous voulez en sortir. – BalusC

+0

Peut-être que vous pouvez afficher un extrait de HTML avec la table et l'élément. L'élément est-il un div avec id "box"? –

+0

d'entreprendre ce que vous avez besoin - vous avez texte et vous voulez obtenir le "texte" ou le "id"? – cupakob

Répondre

17

Eh bien, « #box "signifie un objet DOM avec l'identifiant" boîte ", car il s'agit d'un identifiant unique. Vous pouvez sélectionner celui-là directement. Mais votre code suggère que vous avez plusieurs éléments avec l'identifiant "boîte" que vous devez changer. Vous devez assigner une classe à votre élément à l'intérieur du TD, ou si elle est unique en étant le seul DIV ou SPAN dans la boîte, vous pouvez y accéder comme ceci:

$("table td .box") 

Notez que le sélecteur « > » signifie que TD doit être un enfant direct de TABLE, et je suppose que vous avez au moins un niveau TR entre, donc ça ne marchera pas non plus. Mon exemple ci-dessus correspond à chaque élément avec la classe "box" dans n'importe quel TD qui est un enfant à n'importe quelle TABLE.

Évidemment, je fixerait une classe sur la table aussi bien, et utiliser quelque chose comme ceci:.

$("table.boxes td .box") 

Juste pour que vous ne accidentellement des choses en dehors de sélectionner la portée que vous voulez travailler dans


Vous avez maintenant ajouté HTML Je suis tellement éditer ma réponse:

$("table#list a.box") 
+2

+1 mais il a déjà un ID sur la table qui est considérablement plus efficace de toute façon - $ ('# liste td a.box') est la solution "correcte" ici – annakata

+0

Correct, mais je J'utilise généralement le nom de la balise lorsque je fais des sélections hiérarchiques afin de voir quelle partie de la page je sélectionne. Si l'id avait été "tablelist", je ne l'aurais pas fait, mais "list" est tellement général que je pourrais être confus si mon code jQuery durait longtemps. Mais tout cela dit, vous êtes évidemment correct :) – Sandman

1
$("table tr td .box") 

Devrait faire l'affaire.

-2

Je ne suis pas sûr, mais je pense, vous avez besoin $("td#box") ...

+1

ce n'est pas correct - # signifie le sélecteur d'ID et il n'y a pas d'elment avec un ID de "boîte" laissez seul un td avec tel – annakata

+0

au début était postet seulement ce $ ("table> td: #box") et pas une paix de code :) – cupakob

+0

ouais j'ai remarqué que - c'est pourquoi je ne vous ai pas downvote, simplement commenté :) – annakata

0

Ce sélecteur ...

table td a.box 

dit jQuery pour trouver la balise a avec un attribut class qui contient " boîte". Et cette étiquette a doit être à l'intérieur d'un td qui se trouve à l'intérieur d'un table.

9

Le sélecteur plus efficace serait:

$('#list').find('a.box'); 

ou:

$('a.box', $('#list')[0]); 

En sélectionnant la table id d'abord vous avez défini votre portée juste la table et vous pouvez rechercher l'élément dont vous avez besoin dans cette table.

Le deuxième sélecteur est le même, vous sélectionnez quelque chose et vous donnez la portée comme second paramètre.

Il est simplement plus facile de lire le premier.

Questions connexes