Comment télécharger un fichier à l'aide de JavaScript

JavaScript comprend un paquet de fonctionnalités, de méthodes et de propriétés intégrées pour répondre aux demandes de l'utilisateur ainsi que des demandes du développeur. Le téléchargement de fichiers est une tâche utile dans n'importe quel navigateur pour déclencher un fichier et le télécharger. JavaScript vous permet de télécharger n'importe quel fichier depuis Internet. Ce message montre divers exemples de téléchargement d'un fichier à l'aide de JavaScript.

• Comment télécharger un fichier en javascript
• Exemple 1: téléchargement d'un fichier depuis Internet
• Exemple 2: Création et téléchargement d'un fichier texte

Comment télécharger un fichier en javascript?

JavaScript fournit un href Attribut pour télécharger un fichier. L'attribut est pris en charge par HTML 5. En utilisant cet attribut, les utilisateurs peuvent utiliser le lien aussi bien que bouton pour télécharger des fichiers en fonction de leurs besoins. Deux exemples sont expliqués en détail pour télécharger du texte ainsi que des fichiers image dans JavaScript.

Exemple 1: téléchargement d'un fichier à partir d'Internet

Un exemple est adapté pour télécharger un Jpg fichier en utilisant un hyperlien en javascript. Le morceau de code est divisé en deux fichiers nommés Html et Javascrip.

Code HTML

<h2> Un exemple pour télécharger le fichier JPGh2>

S'il vous plaît cliquer sur le lien ci-dessous

Lien de téléchargement

Dans ce morceau de code,

• Premièrement, tout le script est écrit dans Tags pour l'alignement central.
• Après ça, une ancre La balise est utilisée pour fournir un lien nommé «Lien de téléchargement."
  Enfin, un fichier image nommé «remotar.jpg " est téléchargé en appuyant sur le "Lien de téléchargement"

Code javascript

// Créer un lien
const download = (p, f) =>
const anchor = document.CreateElement ('A');
ancre.href = p;
ancre.télécharger = f;
document.corps.Annexe (ancre);
ancre.Cliquez sur();
document.corps.Removechild (ancre);
;

La description du code JavaScript est écrite ci-dessous:

• Le télécharger L'attribut est utilisé en passant deux arguments, p et
• Après cela, un ancre L'objet est créé qui est associé au fichier HTML en passant le "un"
• L'argument p spécifie l'emplacement du fichier associé au href
• De plus, l'autre argument F fait référence au nom du fichier téléchargé.
• De plus, le annexe la propriété est utilisée pour déclencher le ancre
• Finalement, le enlever la propriété est utilisée pour supprimer l'événement créé par le Cliquez sur().

Sortir

La sortie renvoie un message avec un «Lien de téléchargement". Après avoir appuyé sur un lien, un fichier image au format JPG est téléchargé.

Exemple 2: Création et téléchargement d'un fichier texte

Un autre exemple est pris en compte pour télécharger un texte fichier en javascript. Dans cet exemple, un bouton est joint pour télécharger un texte déposer. Ici, l'exemple démontre que l'utilisateur peut saisir du texte dans une zone de texte, et le texte sera téléchargé dans un fichier texte. Le nom du fichier téléchargé est «Javascrip.SMS". Le code complet est écrit dans un fichier html.

Code HTML

Un exemple pour télécharger le fichier texte

S'il vous plaît cliquer sur le lien ci-dessous

Bienvenue à JavaScript

La description du code est discutée ci-dessous:

• Une zone de texte est spécifiée à l'aide du Tags dans lesquels l'utilisateur peut modifier les données de téléchargement.
• UN "Bouton de téléchargement" est joint pour télécharger un fichier.

Javascrip

document.GetElementByid ("dwn-btn").addEventListener ("click", function ()
var t = document.GetElementByid ("Val").valeur;
var fn = "javascript.SMS";
dwn (fn, t);
, FAUX);
fonction dwn (fn, t)
var élément = document.CreateElement ('A');
élément.setAttribute ('href', 'data: text / plain; charset = utf-8,' + encodeuriComponent (t));
élément.setAttribute («téléchargement», fn);
élément.style.affiche = 'aucun';
document.corps.APPEDCHILD (élément);
élément.Cliquez sur();
document.corps.Removechild (élément);

Le code est expliqué comme:

• Une propriété addEventListener est employé pour déclencher un fonction() en passant le Cliquez sur valeur du bouton.
• Une méthode dwn est utilisé pour télécharger un fichier en passant FN et t
• Le setAttribute est utilisé pour définir le href et télécharger les attributs.
• Le annexe la propriété est employée pour ajouter des éléments.
• Après cela, le Cliquez sur() la méthode est appliquée à l'élément.
• Enfin, le removechild () La méthode supprime les éléments enfants.

Sortir

La sortie affiche une zone de texte dans laquelle le message "Bienvenue à JavaScript » est écrit. Après avoir appuyé sur le «Bouton de téléchargement », le fichier texte nommé «JavaScript.SMS" est téléchargé, contenant le message dedans.

Conclusion

Le href L'attribut est utilisé pour télécharger un fichier en déclenchant un événement en JavaScript. Basé sur href Attribut, deux exemples sont pratiquement mis en œuvre pour le téléchargement image et texte des dossiers. Dans le premier exemple, un lien hypertexte est joint pour télécharger un image fichier, tandis que dans le deuxième exemple, un bouton est employé pour télécharger un texte déposer. Dans ce guide, vous avez appris les attributs de JavaScript pour le téléchargement d'un fichier.