1. Trouvez les éléments:
document.getElementById ("id"); Trouvez selon ID et trouvez au plus un;
var a = docunment.getElementById ("id"); Placez l'élément trouvé dans la variable;
document.getElementsByName ("name"); Trouvez selon le nom et le tableau est trouvé;
document.getElementsByTagName ("nom"); Trouvez le tableau en fonction du nom de balise;
document.getElementsByClassName ("nom") Trouver selon ClassName, et le tableau est trouvé;
2. Contenu de l'opération:
1. Éléments non formels:
(1) Obtenir du contenu:
alerte (a.innerhtml); Le code HTML et le texte de la balise sont obtenus et tous les contenus de la balise sont obtenus.
Par exemple: il y a une telle div dans le corps:
<div id = "me"> <b> essayez-le </b> </div>
Utilisez InnerHTML pour obtenir le contenu dans le div dans le script:
var a = document.getElementById ("me");
alerte (a.innerhtml);
Les résultats sont les suivants:
alerte (a.innertext); ne prenez que le texte à l'intérieur
alerte (a.outerhtml); Comprend le contenu de la balise elle-même (compréhension simple)
(2) Définir le contenu:
a.innerhtml = "<font color = red> bonjour world </font>";
Si le résultat est le suivant avec le code de contenu de paramètre, le contenu du div est remplacé:
A.InnerText présentera le contenu tel qu'il est
Effacer le contenu: affectez une chaîne vide
2. Formulaires d'éléments:
(1) Il existe deux façons d'obtenir du contenu:
var t = document.f1.t1; formulaire Form Form Form ID est entrée avec T1 dans F1;
var t = document.getElementById ("id"); Obtenez-le directement avec ID.
alerte (t.value); Obtient la valeur de la valeur en entrée;
alerte (t.innerhtml); Obtenez la valeur ici <TextArea> </ TextArea>;
(2) Définir le contenu: t.value = "Content Change";
3. Un petit point de connaissance:
<a href = "http://www.baidu.com" onclick = "return false"> Tournez-le à baidu </a>; Si Return Flase est ajouté, il ne sautera pas, la valeur par défaut est Retour True. Il en va de même pour les boutons. Si Return Flase est défini dans le bouton, la soumission ne sera pas faite. Cela peut être utilisé pour contrôler le saut de soumission.
3. Propriétés de l'opération
Tout d'abord, utilisez l'ID de l'élément pour trouver l'élément et le stocker dans une variable:
var a = document.getElementById ("id");
Ensuite, vous pouvez fonctionner sur les propriétés de l'élément:
A.SetAttribute ("Attribut Name", "Attribut Value"); Définissez un attribut, ajoutez ou modifiez-le;
a.getAttribute ("Nom d'attribut"); Obtenez la valeur de l'attribut;
A.RemoveAttribute ("Nom d'attribut"); supprimer un attribut.
Exemple 1: Faites une question. Si la réponse d'entrée est correcte, elle apparaîtra correctement et l'erreur apparaîtra par les erreurs;
Voici un attribut Daan écrit dans le texte, qui contient la valeur de réponse. Lorsque vous cliquez pour vérifier la réponse, l'entrée de contenu par Cheak est la même que la réponse:
Code dans le corps:
<Form> En quelle année a été la fondation de la République de Chine? <input type = "text" daan = "1912" value = "" id = "t1" name = "t1" /> <input type = "bouton" onClick = "check ()" id = "t2" name = "t2" value = "check the réponse" /> </ form>
Code dans JS:
Fonction Check () {var a = document.getElementById ("T1"); var a1 = a.value; var a2 = a.getAttribute ("daan"); if (a1 == a2) {alert ("Félicitations pour avoir répondu correctement!"); } else {alert ("idiot!"); }}Résultats Lorsque la réponse est correcte:
Exemple 2: Le bouton d'accord, compte à rebours à 10 secondes, le bouton Accept devient soumis. Ici, l'attribut d'opération: Désactivé est utilisé pour modifier l'état du bouton. Lorsque Disabled = "Disabled" n'est pas disponible.
Code dans le corps:
<form> <input type = "soumi" id = "b1" name = "b1" value = "d'accord (10)" Disabled = "Disabled" /> </ Form>
Code dans JS:
var n = 10; var a = document.getElementById ("b1"); fonction bian () {n--; if (n == 0) {A.RemoveAtTribute ("Disabled"); a.value = "d'accord"; retour; } else {a.value = "d'accord (" + n + ")"; window.setTimeout ("bian ()", 1000); }} window.setTimeout ("bian ()", 1000);Résultats de la course:
4. Style d'opération
Tout d'abord, utilisez l'ID de l'élément pour trouver l'élément et le stocker dans une variable:
var a = document.getElementById ("id");
Ensuite, vous pouvez fonctionner sur les propriétés de l'élément:
un. ; Faire fonctionner les propriétés de ce style d'identification.
Le style est un style en CSS, et tous les styles peuvent être utilisés avec du code.
document.body.style.backgroundColor = "Color"; Couleur d'arrière-plan de toute la fenêtre.
Classe d'opération Style: A.ClassName = "ClassName in Style Sheet" exploite un lot de styles
Exemple 1: Commutation automatique et manuelle des images d'affichage;
Le code dans le corps, pour faire une div avec des objets d'image d'arrière-plan et de contrôle des deux côtés:
<div id = "tuijian" style = "background-image: url (imges / tj1.jpg);"> <div id = "p1" onclick = "dodo (-1)"> </v> <div id = "p2" onclick = "dodo (1)"> </v> </v>
Code dans Stylesheet:
<style type = "text / css"> * {margin: 0px auto; rembourrage: 0px; Font-Family: "Microsoft Yahei"; } #TUijian {width: 760px; hauteur: 350px; République de fond: sans répétition; } .pages {top: 200px; Color d'arrière-plan: # 000; Position d'arrière-plan: Centre; République de fond: sans répétition; Opacité: 0,4; Largeur: 30px; hauteur: 60px; } # p1 {background-image: url (imges / prev.png); flottant: à gauche; marge: 150px 0px 0px 10px; } # p2 {background-image: url (imges / next.png); flottant: à droite; marge: 150px 10px 0px; } </ style>Le code en JS appelle principalement la fonction Huan () toutes les 3 secondes pour modifier le style de l'image d'arrière-plan. En cliquant sur l'interrupteur gauche et droit, il sera commuté manuellement et l'interrupteur automatique s'arrête:
<script linguisse = "javascript"> var jpg = new Array (); jpg [0] = "url (imges / tj1.jpg)"; jpg [1] = "url (imges / tj2.jpg)"; jpg [2] = "url (imges / tj3.jpg)"; var tjimg = document.getElementyid ("Tuijian"); var xb = 0; if (xb == jpg.length) {xb = 0; } tjimg.style.backgroundImage = jpg [xb]; if (n == 0) {var id = window.setTimeout ("Huan ()", 3000); }} fonction dodo (m) {n = 1; xb = xb + m; if (xb <0) {xb = jpg.length-1; } else if (xb> = jpg.length) {xb = 0; } tjimg.style.backgroundImage = jpg [xb]; } window.setTimeout ("Huan ()", 3000); </cript>L'effet est le suivant:
5. Opérations d'éléments connexes:
var a = document.getElementById ("id"); trouver un;
var b = a.NextSibling, trouvez l'élément pair suivant de A, faites attention aux espaces contenant;
var b = a.previousSibling, trouvez l'élément homologue précédent de A, faites attention aux espaces contenant;
var b = a.parentNode, trouvez l'élément parent précédent de a;
var b = a.childnodes, le tableau est trouvé, et l'élément enfant de niveau suivant de A est trouvé;
var b = a.firstchild, le premier élément enfant, LastChild Last, ChildNodes [n] trouve le nombre du premier;
alert (nœuds [i] instance de texte); Déterminez s'il s'agit de texte, renvoie vrai, pas Flase, utilisez si pour déterminer si sa valeur est fausse et vous pouvez supprimer les espaces.
6. Création, addition et suppression d'éléments:
var a = document.getElementById ("id"); trouver un;
var obj = document.CreateElement ("Nom de balise"); Créer un élément
obj.innerhtml = "Hello World"; Lors de l'ajout, vous devez d'abord créer un élément.
A.APPENDCHILD (OBJ); Ajoutez un élément enfant à a.
A.Removechild (OBJ); supprimer un élément enfant.
A.SelectedIndex dans la liste: le nombre de sélectionnés;
//a.options ·a.selectIndex] Supprimez l'objet d'option de l'indice en fonction de l'index.
7. Fonctionnement de la chaîne:
var s = new String (); ou var s = "aaaa";
var s = "Hello World";
alerte (s.tolowercase ()); à minuscules touppercase () en majuscules
alerte (S.Substring (3,8)); intercepter de la troisième position à la huitième position
alerte (S.Substr (3,8)); commence à intercepter de la troisième position, intercepter huit caractères et n'écrivez pas les nombres suivants à la fin.
S.Split (''); Démonter les caractères en fonction des caractères spécifiés, les mettre dans un tableau et les trier automatiquement
S.Length est la propriété
S.Indexof ("Monde"); la première occurrence du monde dans la chaîne ne revient pas -1
S.LastIndexof ("o"); o où la dernière occurrence de S.LastIndexof ("O"); o dans la chaîne
8. opération de date et d'heure
var d = new Date (); heure actuelle
D.setlyar (2015,11,6); / * soustrait 1 Réglage du mois que vous souhaitez définir * /
D. Meilleur: prenez l'année;
D.getMonth (): Prenez le mois et moins les moins que vous obtenez sont retirés;
D.GetDate (): Prenez le ciel;
D.GetDay (): Prenez le jour de la semaine
D.Gethours (): Prenez l'heure;
D.getMinutes (): prenez des minutes; D. GetSeconds (): Prenez quelques secondes
D.Setlyar (): Réglez l'année et faites attention à -1 lors de la définition du mois.
9. Fonctionnement des fonctions mathématiques
Math.ceil (); Le plus petit entier supérieur à la décimale actuelle
Math.floor (); Le plus grand entier du nombre décimal actuel des petits poissons
Math.sqrt (); carré ouvert
Math.round (); rond(); rond
Math.Random (); Nombre aléatoire, entre 0-1
10. Quelques conseils
Double Quotes à l'extérieur et les citations doubles à l'intérieur sont changées en citations simples;
Lorsque vous définissez la hauteur de la ligne dans le div, quelle que soit la hauteur du réglage, la ligne occupée est en position centrale par défaut (au milieu des zones supérieures et inférieures de la div - [par défaut] centrée verticalement).
La valeur retirée de la zone de texte est une chaîne et doit être convertie en nombre à l'aide de parseInt ().
S.Match (Reg); S représente une chaîne, Reg représente une chaîne et les deux correspondants. Si les deux chaînes ne correspondent pas, un null est retourné.
L'explication détaillée ci-dessus de l'objet JavaScript-Dom Operation-Window.Document est tout le contenu que je partage avec vous. J'espère que vous pourrez vous faire référence et j'espère que vous pourrez soutenir Wulin.com plus.