Maison >interface Web >js tutoriel >Méthode JavaScript pour obtenir le prochain nœud de compétences dom_javascript

Méthode JavaScript pour obtenir le prochain nœud de compétences dom_javascript

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBoriginal
2016-05-16 16:37:011472parcourir

Utilisez javascript pour écrire une méthode permettant d'additionner des nombres en cliquant sur les boutons d'ajout et de soustraction de la page.

Le simple HTML est probablement comme ça. Comprenez simplement et ne vous inquiétez pas de ces détails

<input type="button" value="+" onclick="jia(this)" />
<label class="num">0</label>
<input type="button" value="-" onclick="jian(this)" />

Ça ressemble à ça

Le code javascript est le suivant

<script type="text/javascript">
function jia(a)
{
var nextnode = a.nextElementSibling;//获取下一个节点

alert(nextnode.innerHTML);
var a = parseInt(nextnode.innerHTML)
a += 1;
nextnode.innerHTML = a;
}
function jian(a) {
var previousnode = a.previousElementSibling;
var a = parseInt(previousnode.innerHTML)
a -= 1;
a = a > 0 &#63; a : 0;
previousnode.innerHTML = a;
}
</script>

Expliquez :

fonction jian(a) et

la fonction jia(a) est l'objet actuellement cliqué. Ajoutez ceci à la méthode d'événement onclick ;

- nextElementSibling Obtient le nœud suivant du nœud actuel (obtient le nœud frère suivant)
- previousElementSibling obtient le nœud précédent du nœud actuel

Remarque : IE ignorera les nœuds de document d'espace (tels que les caractères de nouvelle ligne) générés entre les nœuds, mais Mozilla ne le fera pas - FF lira les éléments de mise en page tels que l'espace et les caractères de nouvelle ligne en tant que nœuds, donc l'élément de nœud suivant qui peut être lu en utilisant nextSibling dans IE doit être écrit comme ceci dans FF : nextElementSibling.

L'explication ci-dessus signifie utiliser nextElementSibling et previousElementSibling pour obtenir le nœud frère suivant et le nœud frère précédent. Vous pouvez supprimer les sauts de ligne, les espaces, etc., et trouver directement notre élément d'étiquette. Mais les deux suivants

suivantSibling
previousSibling fait également référence au nœud frère suivant et au nœud frère précédent, mais il est facile à utiliser dans IE
--------------------Explication des mots-clés

fonction de conversion parseInt.

a = a > 0 ? a : 0;----expression ternaire.

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn