Récupérer le rang d'un nœud dans une nodeList
Bonjour,
Je ne sais pas si c'est la bonne solution mais dans le code suivant, j'aimerais afficher une liste d'options en utilisant le rang de lists et celui de pens à la ligne 21, un truc du genre lists[pens.rang].classList.remove('hidden'). Je ne sais pas si je me fais bien comprendre.
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26
| "use strict";
const
table = document.querySelector('.displCard table')
, lastCols = table.querySelectorAll('td:last-child:not([colspan])')
, lists = table.querySelectorAll('td:last-child select')
, pens = table.querySelectorAll("img[src*='edit.png']")
;
function lastColsOnWindowLoad() {
for (let i=0, max=lastCols.length; i<max; i++) {
lastCols[i].classList.add('hidden');
}
}
window.onload = function(){
lastColsOnWindowLoad();
}
function handleOnClick() {
}
for (let i=0, max=pens.length; i<max; i++) {
pens[i].onclick = handleOnClick;
} |
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24
| <table>
<thead>
<tr><th>Prénom</th><th>Nom</th><th>Date de naissance</th><th>Tél. portable</th><th>Tél. travail</th><th>Courriel</th><th></th><th></th><td></td></tr>
</thead>
<tbody>
<tr>
<td>Prénom1</td><td>Nom1</td><td>01/11/2011</td><td></td><td></td><td></td><td><img src='images/edit.png' title='Modifier la filiation' data-id='63' /></td><td><a href='parentPage.php?childPageKey=7&id=63' title='Effacer'><img src='images/del.png' /></a></td>
<td>
<select name='filiation' data-id='63'>
<option value='2'>Enfant des deux</option><option value='2'>Enfant du contact</option><option value='3'>Enfant du conjoint</option>
</select>
</td>
</tr>
<tr>
<td>Prénom2</td><td>Nom2</td><td>07/03/2016</td><td></td><td></td><td></td><td><img src='images/edit.png' title='Modifier la filiation' data-id='64' /></td><td><a href='parentPage.php?childPageKey=7&id=64' title='Effacer'><img src='images/del.png' /></a></td>
<td>
<select name='filiation' data-id='64'>
<option value='2'>Enfant des deux</option><option value='2'>Enfant du contact</option><option value='3'>Enfant du conjoint</option>
</select>
</td>
</tr>
</tbody>
<tr><td colspan="9" class="center"><input type="submit" value="Nouveau" formaction="parentPage.php?childPageKey=6&relation=9" /></td></tr>
</table> |