Maison  >  Article  >  interface Web  >  Comment appeler une fonction en javascript externe

Comment appeler une fonction en javascript externe

WBOY
WBOYoriginal
2023-05-09 11:12:072259parcourir

Dans le développement front-end, nous rencontrons souvent des situations où nous devons appeler des fonctions dans des fichiers JavaScript externes. Normalement, nous pouvons référencer la fonction JavaScript externe dans la page Web via la balise 3f1c4e4b6b16bbbd69b2ee476dc4f83a, puis l'appeler directement. Mais que se passe-t-il si nous voulons appeler dynamiquement des fonctions externes dans du code JavaScript ? Cet article explique comment appeler des fonctions dans des fichiers JavaScript externes.

1. Référencer des fichiers JavaScript externes

Avant d'appeler des fonctions JavaScript externes, nous devons référencer des fichiers JavaScript externes dans la page Web. Vous pouvez utiliser le code suivant pour introduire des fichiers JavaScript externes dans la page Web.

<script src="[文件路径]"></script>

Où [chemin du fichier] est le chemin d'accès au fichier JavaScript externe. Notez que le chemin doit être relatif au chemin de la page actuelle. Si le fichier externe se trouve dans le même répertoire de la page, il peut être référencé directement à l'aide du nom du fichier.

Par exemple, si vous souhaitez référencer un fichier JavaScript externe nommé "script.js", vous pouvez utiliser le code suivant pour référencer :

<script src="script.js"></script>

2. Utilisez l'objet window pour appeler des fonctions externes

Après avoir référencé avec succès le fichier externe Fichier JavaScript, nous pouvons utiliser l'objet window pour appeler des fonctions externes. L'objet window est un objet global, qui contient toutes les propriétés et méthodes globales, vous pouvez donc utiliser l'objet window pour appeler des fonctions externes. Voici un exemple de code d'utilisation d'un objet window pour appeler une fonction externe :

//在外部函数文件script.js中定义test函数
function test(){
    alert("这是外部JavaScript文件中的test函数");
}

//在本页面中使用window对象调用test函数
window.test();

Notez que lorsque vous utilisez un objet window pour appeler une fonction externe, vous devez vous assurer que la fonction a été définie et après avoir référencé le fichier externe.

3. Utilisez la technologie AJAX pour appeler des fonctions externes

En plus d'utiliser l'objet window pour appeler des fonctions externes, vous pouvez également utiliser la technologie AJAX pour appeler des fonctions externes. La technologie AJAX peut charger des données de manière asynchrone pour optimiser les performances des pages Web. Voici un exemple de code qui utilise la technologie AJAX pour appeler une fonction externe :

//使用XMLHttpRequest对象加载外部函数文件script.js 
var xhr=new XMLHttpRequest();
xhr.open('GET','script.js',true);
xhr.onreadystatechange=function(){
    if(xhr.readyState==4 && xhr.status==200){
        //将外部函数文件注入页面中
        eval(xhr.responseText);
        //调用外部函数
        test();
    }
}
xhr.send();

Dans cet exemple de code, nous utilisons l'objet XMLHttpRequest pour charger de manière asynchrone le fichier de fonction externe script.js, puis utilisons la fonction eval pour injecter le fichier dans la page, et enfin appeler la fonction externe. Il convient de noter que lorsque vous utilisez la fonction eval pour injecter du code, vous devez vous assurer que le code est sûr, sinon cela nuirait grandement à la sécurité du site Web.

Résumé :

Ce qui précède est une méthode d'appel de fonctions dans des fichiers JavaScript externes, qui peut être réalisée à l'aide d'objets fenêtre ou de la technologie AJAX. Il convient de noter que l'utilisation fréquente de la technologie AJAX pour appeler des fonctions externes dans les pages Web doit être évitée autant que possible pour éviter d'affecter les performances et l'expérience utilisateur de la page Web. Dans le même temps, lorsque vous utilisez la fonction eval pour injecter du code, vous devez garantir la sécurité du code.

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:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn