Syntaxe de base JavaScript [dom|bom|es6 nouvelle syntaxe|jQuery|echarts de visualisation de données]

Introduction aux bases de l'informatique

langage de programmation

Bases informatiques

Introduction à JavaScript

Première introduction à JavaScript

Le navigateur exécute le processus js

js se compose de trois parties

js trois positions d'écriture

Commentaire

Instructions d'entrée et de sortie

Introduction aux variables

qu'est-ce qu'une variable

Utilisation de variables

Cas variable

Nom d'utilisateur contextuel à casse variable

Expansion de la syntaxe variable

Convention de dénomination des variables

Transformer les valeurs de 2 variables

Résumé des variables

Introduction aux types de données

Introduction aux types de données

Numéro numérique

estNaN

Type de chaîne

Boîte d'avertissement de page Web contextuelle

Longueur de chaîne et concaténation

Amélioration de l'épissage des cordes

montrer le cas d'âge

booléen ainsi que indéfini et nul

typeof détecte le type de données variable

littéral

Convertir en type chaîne

Convertir en parseInt et parseFloat numériques

Convertir en nombre numérique et conversion implicite

Calculer le cas d'âge

Cas d'additionneur simple

Convertir en booléen

Lectures approfondies sur la différence entre les langages compilés et interprétés

Lectures approfondies : Mots-clés identificateurs Mots réservés

devoirs après les cours

Introduction aux opérateurs

opérateurs arithmétiques

Expressions et valeurs de retour

opérateur d'incrémentation ajouté au début

Opérateur d'incrémentation Postfix

Exercice d'opérateur d'incrémentation

Résumé du pré-incrément et du post-incrément

opérateur de comparaison

Opérateurs logiques

Exercices sur les opérateurs logiques

Interruption logique, ET logique

interruption logique, logique ou

opérateur d'assignation

priorité des opérateurs

Introduction à la structure des branches de contrôle des processus

contrôle de processus

si instruction de branche

Entrez dans le cas des cybercafés

instruction ifelse à double branche

Déterminer les cas d'année bissextile

if else if instruction multibranche

Juger les cas de qualité

expression ternaire

Mallette de remplissage numérique 0

instruction de commutation

Précautions de changement

Rechercher des caisses de fruits

La différence entre switch et ifelseif

Cycle de lecture

but de la boucle

structure de la syntaxe de la boucle

pour le processus d'exécution de boucle

Éteindre le débogage

la boucle for exécute le même code à plusieurs reprises

la boucle for exécute à plusieurs reprises différents codes

la boucle for répète certaines opérations

pour boîtier de boucle

Étude de cas sur la performance des étudiants (Partie 1)

Étude de cas sur la performance des étudiants (Partie 2)

Imprimez cinq étoiles sur une seule ligne

Double processus d'exécution de boucle

Imprimez les étoiles sur 5 lignes et 5 colonnes

Imprimer les étoiles sur n lignes et n colonnes

Imprimer le boîtier triangle inversé

table de multiplication

pour le résumé de la boucle

boucle while

tandis que le cas

faire une boucle while

faire pendant le cas

Résumé du cycle

continuer le mot clé

casser le mot-clé

Convention de dénomination et format de syntaxe

Travail à vélo

Introduction aux tableaux

Qu'est-ce qu'un tableau et comment le créer

Accéder aux éléments du tableau

Tableau de parcours

longueur du tableau

Calculer la somme et la moyenne des tableaux

Trouver la valeur maximale dans un tableau

Convertir un tableau en chaîne

Ajouter un nouvel élément au tableau

Le tableau stocke 1 à 10 valeurs

méthode de tableau de filtrage

Méthode de tableau de filtrage 2

Supprimer l'élément spécifié du tableau (déduplication du tableau)

retourner le tableau

Examiner l'échange de deux valeurs de variable

Principe du tri à bulles

Tri à bulles

Présentation de la fonction

Pourquoi les fonctions sont nécessaires

Utilisation des fonctions

Utilisez des fonctions pour trouver la somme cumulée de 1 à 100

paramètres de fonction

Utilisez des fonctions pour trouver la somme de deux nombres quelconques et la somme cumulée

Problème de correspondance entre les paramètres de fonction et les paramètres réels

valeur de retour de la fonction

Utilisez des fonctions pour trouver le maximum de deux nombres

Utilisez la fonction pour trouver la valeur maximale dans un tableau

return termine la fonction et ne peut renvoyer qu'une seule valeur

2 choses à noter sur les valeurs de retour des fonctions

Voir à travers les fonctions grâce à un presse-agrumes

Utilisation d'arguments

Utilisez des fonctions pour trouver la valeur maximale d'un nombre

Retourner un tableau à l'aide d'une fonction

Tri des bulles d'encapsulation de fonction

Utiliser la fonction pour déterminer l'année bissextile

Une fonction peut appeler une autre fonction

Afficher le nombre de jours en février

Deux façons de déclarer des fonctions

Introduction à la portée

portée javascript

Variables globales et variables locales

javascript n'a pas de portée au niveau du bloc

chaîne de portée

Carter de chaîne de lunette

Guide de pré-analyse JavaScript

préparer

Mallette de préparation

Présentation de l'objet

Que sont les objets et pourquoi sont-ils nécessaires

Créer des objets à l'aide de littéraux d'objet

La différence entre la méthode de fonction d'attribut variable

Créer des objets en utilisant un nouvel objet

Pourquoi avons-nous besoin de constructeurs

Le constructeur crée un objet (partie 1)

Le constructeur crée un objet (partie 2)

La différence entre constructeur et objet

nouveau processus d'exécution des mots clés

Traverser des objets

Résumé et missions

Guide d'objet intégré

Que sont les objets intégrés

Apprenez à interroger la documentation MDN

Méthode mathématique de la valeur maximale d'un objet mathématique

Devinez le jeu des nombres

Utilisation de l'objet Date

Format date année mois jour semaine

Formater la date heures minutes secondes

Date nombre total de millisecondes (horodatage)

Compte à rebours (Partie 1)

Compte à rebours (partie 2)

Deux façons de créer un tableau

Deux façons de détecter s'il s'agit d'un tableau

Ajouter des éléments de tableau

Supprimer les éléments du tableau

tableau de filtres

Tri par tableau

Obtenir l'index des éléments du tableau

Cas de déduplication de baie

Convertir un tableau en chaîne

Types d'emballages de base

La chaîne est immuable

Position de retour basée sur le caractère

Trouver la position et le nombre d'occurrences d'un certain caractère

Renvoie les caractères en fonction de la position

Comptez les caractères les plus fréquents (Partie 1)

Comptez les caractères les plus fréquents (partie 2)

Épissage et interception de chaînes

Remplacer les chaînes et convertir en tableaux

Introduction aux types de données simples et aux types de données complexes

Allocation de mémoire pour les types de données

Passage simple des paramètres de type de données

Passer des paramètres de types de données complexes

Introduction aux API Web

La corrélation entre les deux étapes des bases de js et des API Web

API et API Web

Introduction au DOM

Introduction au DOM

getElementByid récupère l'élément

getElementsByTagName Obtient un certain type d'élément de balise

H5 ajoute une nouvelle façon d'obtenir des éléments

Récupère les éléments body et html

trois éléments de l'événement

Exécuter le processus événementiel

Manipuler des éléments pour modifier le contenu des éléments

La différence entre innerText et innerHTML

Manipuler des éléments - modifier les attributs des éléments

Étui de vœux en temps partagé

Attributs du formulaire de modification d'élément d'opération

Exemple d'imitation de JD.com pour afficher les mots de passe cachés en texte clair (Partie 1)

Exemple d'imitation de JD.com pour afficher les mots de passe cachés en texte clair (Partie 2)

Manipuler les éléments - modifier les attributs de style

Cas d'imitation du code QR de fermeture Taobao

Sprite en boucle

Afficher le contenu de la zone de texte masquée

Utilisez className pour modifier les attributs de style

Informations de vérification de la boîte de mot de passe

Résumé des éléments opérationnels et des missions

Pensée exclusive (algorithme)

Effet resurfaçant de la peau Baidu

Effet de changement de couleur des lignes alternatives du tableau

Formulaire Sélectionner tout Annuler Sélectionner tout (Partie 1)

Formulaire Sélectionner tout Annuler Sélectionner tout (Partie 2)

Obtenir la valeur de l'attribut personnalisé

Définir les propriétés personnalisées de suppression

Analyse de la disposition des changements de barre d'onglets (important)

Production de commutation de barre d'onglets (Partie 1)

Production de commutation de barre d'onglets (Partie 2)

Attributs personnalisés H5

Pourquoi apprendre les opérations des nœuds et l'introduction des nœuds

Le nœud parent de l'opération de nœud

nœud enfant

premier élément enfant et dernier élément enfant

Menu déroulant Sina

Nœud frère de l'opération de nœud

Opérations sur les nœuds : créer et ajouter des nœuds

Version simple du cas de publication d'un message

Nœud de suppression d'opération de nœud

Supprimer le cas du message

Nœud de copie d'opération de nœud

Générer dynamiquement des tableaux - créer des données sur les étudiants

Générer dynamiquement des tableaux - créer des lignes

Générer dynamiquement des tableaux - créer des cellules

Générez dynamiquement des tableaux - remplissez les cellules avec des données

Générer dynamiquement des tableaux - créer et supprimer des cellules

Générer dynamiquement des tables - opérations d'ajout et de suppression

document.write crée des éléments (comprendre)

Comparaison de l'efficacité entre innerHTML et createElement

Noyau de clé DOM

Guide avancé des événements

Deux façons d'enregistrer des événements

événement d'inscription attachEvent

supprimer un événement

Théorie du flux d'événements DOM

Vérification du code de flux d'événements DOM

Qu'est-ce qu'un objet événement

La différence entre e.target et ceci

Bloquer le comportement par défaut

Empêcher les événements de bouillonner

délégation d'événement

Désactivez la sélection de texte et le menu contextuel

Récupérer les coordonnées de la souris sur la page

Ange suivant la souris

Événements de clavier couramment utilisés

keyCode détermine sur quelle touche l'utilisateur a appuyé

Étude de cas de simulation du contenu d'entrée de la clé JD

Simuler la demande de numéro de suivi Jingdong Express (partie 1)

Simuler la demande de numéro de suivi Jingdong Express (partie 2)

Présentation de la nomenclature

Aperçu de la nomenclature

événement de chargement de page

événement de redimensionnement de fenêtre

Timer setTimeout

Fonction de rappel et publicités qui se ferment automatiquement après 5 secondes

effacer la minuterie

Minuterie régléeIntervalle

Effet compte à rebours

effacer la minuterie

Envoyer un cas SMS

cela montre le problème

Synchrone et asynchrone

Processus d'exécution de tâches synchrones et asynchrones

mécanisme d'exécution js

Propriétés communes des objets de localisation

Aller à la page après 5 secondes

Obtenir les paramètres d'URL

Méthodes courantes de localisation

objet navigateur

objet d'histoire

Introduction aux effets spéciaux de pages Web sur PC

offsetLeft et offsetTop obtiennent le décalage de l'élément

offsetWidth et offsetHeight obtiennent la taille de l'élément

La différence entre offset et style

Obtenez les coordonnées de la souris à l'intérieur de la boîte

Faites glisser la boîte modale (en haut)

Faites glisser la boîte modale (au milieu)

Faites glisser la boîte modale (ci-dessous)

Construire une structure de page qui imite l’effet loupe de Jingdong

Effet de loupe imitation Jingdong montrant des barrières cachées et de grandes boîtes

La couche d'occlusion effet loupe Imitation Jingdong suit la souris

L'effet d'imitation de la loupe Jingdong limite la plage de mouvement de la couche d'occlusion

Imitation Jingdong effet loupe grand mouvement d'image

série client

Exécuter la fonction immédiatement

Les principes fondamentaux de l'analyse du code source Taobao flexiJS

Taobao flexibleJS pages d'analyse du code sourceshow event

série de défilement

Barre latérale fixe imitation Taobao (Partie 1)

Barre latérale fixe imitation Taobao (ci-dessous)

Résumé de trois grandes séries

La différence entre le survol et la saisie de la souris

Principes d'animation

Encapsulation de fonction d'animation simple

La fonction d'animation enregistre différentes minuteries pour différents éléments

Principe de facilitation de l'animation

Implémentation du code de base de l'animation d'assouplissement

Faciliter l'animation pour se déplacer entre plusieurs valeurs cibles

Ajouter une fonction de rappel pour faciliter l'animation

Utilisation des fonctions d'animation

Construction de la structure du graphique carrousel de pages Web

Carrousel de pages Web - afficher et masquer les boutons gauche et droit au passage de la souris

Petits cercles générés dynamiquement par carrousel de page Web

Carrousel de page Web - Pensée exclusive en petit cercle

Carrousel de pages Web - cliquez sur le petit cercle pour faire défiler les images

Carrousel de pages Web - défilement transparent avec boutons à droite

Carrousel de pages Web - cloner la première image

Le petit cercle du carrousel de la page web change avec le bouton à droite

Carrousel de pages Web - deux petites solutions de bugs

Production de la fonction du bouton gauche de l'image du carrousel de page Web

Fonction de lecture automatique du carrousel de pages Web

Application de papillon des gaz et d'interruption logique

Retour en haut avec animation

Cas de nuage de saut périlleux

Introduction aux effets spéciaux des pages Web mobiles

Événement tactile mobile

Objet d'événement tactile Mobile TouchEvent

Faites glisser des éléments sur mobile

Construction de structure de diagramme de carrousel de terminal mobile

Analyse de la disposition des graphiques du carrousel mobile

Images mobiles à défilement de carrousel

Défilement fluide du carrousel mobile

opération de nom de classe classList

Graphique carrousel mobile : les petits points suivent les modifications

Graphique carrousel sur terminal mobile - faites glisser le graphique carrousel avec le doigt

Carrousel mobile - faites glisser votre doigt pour lire les images précédentes et suivantes

Effet de rebond d'image de carrousel mobile

Retour vers le haut de la production de modules

Solution au problème de délai de 300 ms des événements de clic sur les terminaux mobiles

utilisation du plug-in faskclick

Fichiers associés à la référence d'utilisation du plug-in Swiper

Image de carrousel mobile – utilisée conformément aux spécifications grammaticales

changement des paramètres d'utilisation du plug-in swiper

Autres plug-ins mobiles et résumé d'utilisation

Utilisation du plug-in vidéo zy.media.js

carrousel d'amorçage

Alibaba montre la production d'images du carrousel

Guide de stockage local

Session de stockage localStockage

localStroge de stockage local

Mémoriser la casse du nom d'utilisateur

Une introduction à jQuery

Bibliothèque JavaScript

Présentation de jQuery

Utilisation de base de la fonction jQuery-entry

objet jQuery de niveau supérieur

Objets DOM et objets jQuery

Convertir les objets DOM et les objets jQuery les uns vers les autres

Guide de l'API commune jQuery

Sélecteurs jQuery basiques et hiérarchiques

itération implicite jQuery

sélecteur de filtre jQuery

méthode de filtre jQuery-sélectionner les éléments parents et enfants

Menu déroulant Sina

jQuery autres méthodes de filtrage

Idée exclusive jQuery

Étui de boutique de vêtements Taobao

Programmation en chaîne jQuery

jQuery modifie la méthode CSS de style

jQuery modifie la classe d'opération de style

Cas de changement de barre d'onglets

La différence entre les opérations de classe jQuery et className

jQuery afficher et masquer les effets

effet de glissement jQuery et commutation d'événements

jQuery arrête la file d'attente d'animation

jQuery apparaît en fondu et met en surbrillance la casse

Méthode d'animation d'animation personnalisée jQuery

Analyse de la disposition du boîtier d'accordéon Honor of Kings

Production d'étuis pour accordéon King of Glory

Manipulation des attributs jQuery

Module de panier d'achat - Sélectionner tout (Partie 1)

Module de panier d'achat - Sélectionner tout (Partie 2)

valeur du texte du contenu jQuery

Module panier - augmenter ou diminuer le nombre d'articles

Module de panier d'achat - Modifier le sous-total du produit (partie 1)

Module de panier d'achat - modifier le sous-total du produit (moyen)

Module de panier d'achat - Modifier le sous-total du produit (partie 2)

jQuery parcourt les objets de chaque méthode

jQuery parcourant les données

Module de panier d'achat - calculer le nombre total et le total

Créer, ajouter, supprimer des éléments

Module de panier d'achat - Nettoyer le panier d'achat

Module de panier d'achat : ajouter une couleur d'arrière-plan aux articles sélectionnés

méthode de taille jQuery

Méthodes de positionnement jQuery

jQuery est passé à la méthode head

Retour en haut avec animation

Cas de navigation dans les ascenseurs-Afficher Masquer la navigation dans les ascenseurs

Cas de navigation d'ascenseur - cliquez pour faire défiler jusqu'à l'emplacement cible

Cas de navigation d'ascenseur - cliquez sur le li actuel pour ajouter la classe actuelle

Cas de navigation par ascenseur : la navigation par ascenseur par page coulissante ajoute automatiquement la classe actuelle

Boîtier de navigation d'ascenseur, papillon des gaz (verrouillage mutex)

Introduction aux événements jQuery

Le traitement des événements sur lie un ou plusieurs événements

on implémente la délégation d'événements et lie les événements à des éléments dynamiques

Cas de publication Weibo

hors événement de déliement

jQuery déclenche automatiquement des événements

objet d'événement jQuery

Introduction aux autres méthodes de jQuery

copyextend de l'objet jQuery (facultatif)

coexistence de plusieurs bibliothèques jQuery

Utilisation du plug-in Waterfall

Technologie de chargement paresseux d’images

Utilisation du plug-in de défilement en plein écran (facultatif)

composant d'amorçage

plugin bootstrapJS

Ali Baixiu

Analyse des exigences fonctionnelles de la mise en page Totolist

idées de base todilist et format de stockage local

todolist appuyez sur Entrée pour lire les données de stockage local

todolist appuyez sur Entrée pour enregistrer les dernières données sur le stockage local

les données de stockage local de todolist sont rendues et chargées dans la page

todolist cliquez sur le bouton Supprimer pour obtenir le numéro d'index actuel

todolist cliquez sur le bouton Supprimer pour terminer l'opération de suppression

Cochez la case pour modifier l'attribut done des données correspondantes

Todolist est en cours et est terminé

todolist compte le nombre d'éléments en cours et terminés

Introduction à la fonction d'enregistrement vidéo

Style de disposition de la zone de points

Style de disposition de la zone de carte

Style de disposition de la zone utilisateur

Style de disposition de la zone de commande

Style de disposition de l'espace de vente

Styles de disposition des canaux et des quarts

Référence du style de disposition de la zone de classement

Introduction aux projets de visualisation de données

Quelle visualisation de données

Aperçu du projet de visualisation de données

Introduction aux ECharts

Utilisation de base d'ECharts

Choisissez différents types de graphiques

Configuration du projet ECharts (Partie 1)

Configuration de la grille ECharts

Configuration liée aux ECharts (au milieu)

Configuration du projet ECharts (Partie 2)

Génération de graphiques de remise et résumé des éléments de configuration

Analyse de la solution d'adaptation du projet de visualisation de données

Plan d'adaptation du projet de visualisation de données

Préparation du projet et suivi du plug-in d'actualisation automatique du navigateur

Production du corps du projet de visualisation et de la fenêtre d'affichage

Conteneur de colonnes de projet de visualisation

Scénarios d'utilisation des images de bordure et principes de découpe

Syntaxe d'utilisation des images de bordure

Production de style panel public (Partie 1)

Production de style panel public (Partie 2)

Appeler l'icône de la police par nom de classe

Production de modules de zone d'aperçu du projet de visualisation de données

Analyse de l'aménagement de la zone de suivi du projet de visualisation des données

Analyse de commutation de barre d'onglets de zone de surveillance de projet de visualisation de données

Projet de visualisation de données - défilement transparent de la zone de surveillance

Disposition du module de point de distribution de points

Tableau d'introduction des points de distribution des points

Signification du paramètre d'info-bulle du graphique à secteurs ECharts

Signification des paramètres de la série de diagrammes circulaires ECharts

Configuration personnalisée du module de distribution de positionnement (partie 1)

Configuration personnalisée du module de distribution de positionnement (partie 2)