Maison  >  Article  >  interface Web  >  Introduction à l'utilisation de jQuery (code)

Introduction à l'utilisation de jQuery (code)

不言
不言avant
2019-03-23 15:54:012345parcourir

Cet article vous apporte une introduction à l'utilisation de jQuery (code). Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il vous sera utile.

Partie code

<script>
        window.jQuery=function(nodeOrSelector){
            let nodes={}
            let node1=[]
            if(typeof nodeOrSelector==='string'){
               let temp=document.querySelectorAll(nodeOrSelector)
               for(let i=0;i<temp.length;i++){
                   node1[i]=temp[i]
               }
            
            }else if(nodeOrSelector instanceof Node){
                node1={
                    0:nodeOrSelector,
                    length:1
                }
            }
            nodes.addClass=function(classes){
                classes.forEach(value => {
                    for(let i=0;i<node1.length;i++){
                        node1[i].classList.add(value)
                    }
                })
            
            }

             nodes.setText=function(text){
                for(let i=0;i<node1.length;i++){
                    node1[i].textContent=text
                }
            }
            return nodes   
        }
        window.$=jQuery
        var $p=$(&#39;p&#39;)
        $p.addClass([&#39;red&#39;])
        $p.setText(&#39;hi&#39;)
</script>

Idée

Déclarez d'abord la fonction jQuery() et déclarez un objet qui encapsule deux fonctions dans la fonction pour ajouter des classes aux éléments et à la fonction d'ajouter du texte;
Ensuite, déterminez si le paramètre passé est une chaîne ou un nœud dans la fonction
Ensuite, écrivez les méthodes addClass et setText
Enfin, renvoyez les nœuds de l'objet, et vous pouvez appeler le méthode dans l’objet, et vous avez terminé.

Cet article est terminé ici. Pour un contenu plus passionnant, vous pouvez faire attention à la colonne JQuery Video Tutorial du site Web PHP chinois !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer