Cet article partage principalement avec vous un résumé des points de connaissances de base sur js, en espérant aider tout le monde.
Comment écrire votre code js sur un site Web ou une page :
Superposition 1.js (fonction) : jquery (outil) composant (ui) application (app), mvc (backboneJs)
2 Planification .js () : éviter les variables et méthodes globales (espace de noms, fermeture, orienté objet), la modularisation (seaJs, requireJs)
Classes internes couramment utilisées : Data Array Math String
Attributs HTML , Attributs CSS
HTML : attribut.HTML attribut="valeur" ;
CSS : object.style.CSS attribut="valeur";
classe et float
1.class:className
2.float:cssFloat
Obtenir l'objet
id:document.getElementById("id name")
Événement : action de l'utilisateur
Événements de la souris :
onclick : clic
onmouseover : souris vers le haut
onmouseout : souris éloignée
ondbclick : événement de double-clic
onmousedown : souris vers le bas
onmouseup : souris vers le haut
onmousemove mouvement de la souris
Événements de formulaire :
onfocus : se concentrer
onblur : perdre le focus
onsubmit : soumettre l'événement
onchange : lorsque des modifications se produisent
onreset : réinitialiser l'événement
Événements du clavier :
onkeyup : clavier levé
onkeydown : clavier enfoncé
onkeypress : touche du clavier enfoncée une fois
Durée de la fenêtre : événement de chargement
Événement exécuté immédiatement après le chargement de la page
Deux façons :
1.<script> window.onload=init/*Nom de la fonction, sans parenthèses*/;</script>
2.
Modifier le contenu dans p
innerHTML : Tout le contenu de l'objet (contenu du texte et contenu de l'étiquette), fait généralement référence à des doubles étiquettes ou à des conteneurs Balise
innerText : Tout le contenu du texte dans l'objet
document.createElement("tag name");
document.body.appendChild(object);
removeChild(object)
document.body est l'objet de balise body
document.documentElement est l'objet de balise html
ECMAscript, BOM, DOM
1.window : l'objet de niveau le plus élevé
2.BOM : objet navigateur : modèle d'objet de navigateur
3.DOM : modèle d'objet de document : modèle objet du document
4.BOM : il existera dès l'ouverture de la page web
5.DOM : code à utiliser
6.le document est un lien entre DOM et BOM
le document a subordonnés, d'autres n'ont pas de subordonnés [Fenêtres multiples]
window.open("Link", "name", "Settings");
1.width : définit la largeur de la fenêtre
2.height : Définissez la hauteur de la fenêtre
3.left : La distance entre la nouvelle fenêtre et l'extrémité gauche
4.top : La distance entre la nouvelle fenêtre et le haut
5.srollbars : Barres de défilement [oui, non, 1,0】
6.toolbar : Classe d'outils 【oui, non,0】
7.emplacement : Barre d'adresse
window.close : Fermer la fenêtre
window.close()
Créer un minuteur :
Minuterie unique : window.setTimeout("function()", time t)
Exécution : exécuter le code js après le temps t [ne sera exécuté qu'une seule fois]
Temps : En millisecondes
Temporisateur récurrent : window.setInterval("function()", time t)
Temps : en millisecondes
Exécution : Il sera exécuté à chaque fois t Une fois le code js [ n fois]
Effacer la minuterie :
Effacer la minuterie unique : window.clearTimeout(nom de la minuterie)
Effacer la minuterie récurrente : window.clearInterval(nom de la minuterie) )
Remarque : pour effacer le minuteur, vous devez donner le nom du minuteur. Les minuteurs anonymes ne peuvent pas être effacés
Méthode pour trouver l'objet :
di:document.getElementById("id name");
Tag:document.getElementsByTagName. ("nom du tag")//Ce qui est obtenu est une collection (tableau) d'objets
Object.getElementByTagName(nom du tag)
name:document.getElementByName("name");/ /form collection (array)
className:document.getElementByClassName("class name");//Collection (array)[firefox]
document.images;//Obtenir l'objet img (array)
liens de document;//Obtenir le lien. object (array)
document.forms;//Obtenir un objet de formulaire (array)
document.body;//objet de balise body
document.documentElement;//Objet HTML
event : objet d'informations sur l'événement
this : objet actuel
objet de localisation
location.href : renvoie les informations sur l'URL [vous pouvez obtenir des informations sur l'URL ou lui attribuer une valeur pour accéder à la page]
location.assign () : Charger un nouveau document [Page de saut]
location.reload() : Recharger le document actuel [Actualiser la page]
location.replace() : Remplacer le document actuel par un nouveau Document【Page de saut】
La différence entre location.assign et location.replace :
location.assign : générera des enregistrements historiques
location.replace : ne générera pas d'enregistrements historiques
objet historique :
historique . length : Le nombre d'URL consultées
history.back() : Revenir à la page précédente de l'historique
history.forward() : Charger la page suivante de l'historique
history.go(n) : Accédez à la page spécifiée dans l'enregistrement de l'historique. S'il vaut -1, c'est en fait la fonction de history.back()
screen object
screen.height : Obtenez la hauteur de l'écran
screen.height : 🎜>screen.width : Obtenez la largeur de l'écran
screen.availHeight : Obtenez la hauteur sans la barre des tâches
screen.availWidth : Obtenez la largeur sans la barre des tâches
objet navigateur
navigateur .appName : nom du navigateur
navigator.appCodeName : nom de code du navigateur
navigator.appVersion : numéro de version du navigateur et informations sur la plate-forme
navigator.userAgent : informations du navigateur
DOM : décrit la relation entre le divers composants de la page Web
var obj = document.getElementById("id name")
L'espace vide dans Firefox est également compté comme un nœud
parentNode : nœud parent
childNodes : nœud enfant
firstChild : premier nœud enfant
lastChild : le dernier nœud enfant
nextSibling : le nœud frère suivant [Remarque : il doit s'agir de la même relation parent]
previousSiblind : le nœud frère précédent [Remarque : il doit avoir la même relation parentale]
Vérification de connexion :
onsubmit : événement de soumission de formulaire
onsubmit="return function ()"
Recommandations associées :
Explication détaillée des connaissances de base de PHP
Connaissances de base que JavaScript doit connaître
Partage des questions d'entretien de base en JavaScript
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!