Aller au menu - Aller au contenu
Inscris-toi au e-camp "Héberge ton jeu Facebook sur Azure" de Microsoft vendredi 25 mai à 13h30 !

Inclure un fichier .js dans un script js

Pour accéder à cette section
Connectez-vous !
connexion_rpx
Page 1  2  Suivante
Auteur Message
0 visiteur sur ce sujet
Page 1  2  Suivante
Hors ligne MarvelBoy # Posté le 12/10/2008 à 20:26:04
Avatar
Bonjour à tous, ceci est mon premier post.

Je vous passe la présentation du type "je suis un tel... j'aime ceci, cela etc" pour en venir directement au vif du sujet :

j'aimerais savoir s'il existe une fonction (de votre création ou une officielle que je ne connaitrais pas) qui permette d'inclure un fichier .js dans uns script js (un peu comme un include dans une page php, sauf que le fichier à inclure est un script js, à inclure directement dans un autre script js)...

pourquoi cela ? tout simplement pour alléger mon code qui risquerait de devenir fort volumineux (relatif à des réponses pré-programmées sur un modèle de question-réponse)...

merci d'avance pour vos éventuels posts
:)
Publicité # Posté le 12/10/2008 à 20:26:04

Hors ligne seebz # Posté le 12/10/2008 à 20:32:21
zéro zéro seebz
Avatar
Flux RSS
close

Ville : Calais
Pays : France métropolitaine
2 solutions:

1)Code : JavaScript
1
2
3
function include(fileName){
  document.write("<script type='text/javascript' src='"+fileName+"'></script>" );
}


2) tu appelle ton fichier via ajax et tu lance un eval sur la réponse
Seebz.net : Blog Développement Web 2.0 ...
Code.Seebz.net : Ressources pour développeurs ...
Api.Seebz.netImage utilisateur
 
Hors ligne Timot # Posté le 12/10/2008 à 20:33:22
Réfléchir ne tue pas !
Avatar

Ville : Castres
Pays : France métropolitaine
Études : ENS Lyon
Google est ton ami :
Citation : google
Code :
function include(fileName){
document.write("<script type='text/javascript' src='"+fileName+"'></script>" );
}


et ensuite plus qu'à faire:
include('monFichier.js');
Image utilisateur
Image utilisateur
 
Hors ligne MarvelBoy # Posté le 12/10/2008 à 20:40:13
Avatar
hum merci seebz et ne t'inquiète pas timot je viens de passer une heure à chercher cette fonction sur google sans solution apparente (il y a des fonctions qui par exemple ne fonctionne que sur ie7 et pas sur mozilla)...

mais en fait si je teste cette fonction elle va l'ouvrir le script et afficher une page blanche (c'est ce qui se passe)... moi ce que je voudrais, c'est simplement un fonction qui aille chercher dans le script (un include quoi) sans l'ouvrir sur la page en gros... je ne sais pas si c'est clair mais en tout cas cette fonction là (je l'avais déjà testée) ne m'affiche qu'une page blanche lorsqu'une recherche s'apparente au script externe voulu

mais seebz que veux-tu dire exactement par "tu appelle ton fichier via ajax et tu lance un eval sur la réponse "
Édité le 12/10/2008 à 20:42:27 par MarvelBoy
Hors ligne seebz # Posté le 12/10/2008 à 20:45:10
zéro zéro seebz
Avatar
Flux RSS
close

Ville : Calais
Pays : France métropolitaine
Peux-tu expliquer l'histoire de la page blanche, j'avoue ne pas avoir vraiment compris :s
Seebz.net : Blog Développement Web 2.0 ...
Code.Seebz.net : Ressources pour développeurs ...
Api.Seebz.netImage utilisateur
 
Hors ligne MarvelBoy # Posté le 12/10/2008 à 21:00:20
Avatar
bon en gros :

il y a un textarea

lorsque l'on lance une "recherche", on cherche le mot clef de cette recherche à travers une série de conditions en javascript de type
if (document.ondine.question.value.indexOf('uelle est ta couleur préférée')>-1) answer="Violet.";
answer s'affiche automatiquement

c'est schématique

mettons maintenant que cette condition se trouve dans un fichier .js... lorsque je lance une recherche, la page devient complètement blanche avec ton script (si bien sur je ne me suis pas planté)

j'ai mis ta fonction dans un fichier .js à part que j'appelle avant le <body> de ma page html et dc la page .js est incluse comme suit :

/* BDD */
include('jv/bdd.js');


mais apparemment ça ne marche pas


sinn j'avais trouvé cette autre fonction qui elle marche, mais pas sous mozilla :

function include(url)
{
var head = window.document.getElementsByTagName('head')[0];
var script = window.document.createElement('script');
script.setAttribute('src', url);
script.setAttribute('type', 'text/javascript');
head.appendChild(script);
}
Hors ligne Timot # Posté le 12/10/2008 à 21:01:55
Réfléchir ne tue pas !
Avatar

Ville : Castres
Pays : France métropolitaine
Études : ENS Lyon
Beh si, parce que en fait, si tu l'inclus pas au chargement de ta page, il va ecrire sur le document, et donc tout effacer.
Beh il faudrai faire un truc du genre, si tu veux pas le rajouter au chargement de la page :
var header = document.createElement("script");
header.setAttribute("type","text/javascript");
header.setAttribute("src","source du script");
document.getElementsByTagName("head")[0].appendChild(header);
Image utilisateur
Image utilisateur
 
Hors ligne MarvelBoy # Posté le 12/10/2008 à 21:07:06
Avatar
hum je t'avourais timot que je suis plutôt une bille en javascript et que ça me serait plus facile de passer par une fonction...

bon sinn évidemment je pourrais directement écrire toutes les conditions dans mon mm script directement sur le fichier html mais bon, si c'est pour que le client mette trois plombes à charger les 3000 lignes de la page...
Hors ligne Timot # Posté le 12/10/2008 à 21:09:38
Réfléchir ne tue pas !
Avatar

Ville : Castres
Pays : France métropolitaine
Études : ENS Lyon
Tu es sur que la fonction avec le appendChild ne marche pas avec mozilla ?
Il te met quoi comme erreur ?
Image utilisateur
Image utilisateur
 
Hors ligne MarvelBoy # Posté le 12/10/2008 à 21:12:34
Avatar
bah il ne met pas d'erreur précise, il n'affiche simplement pas ce que devrait être en afficher en answer... j'ai une réponse pré-programmée qui se trouve dans le script js du fichier html lui mm et qui donne une reponse donnée (par exemple "heing?") si aucune des conditions n'a été rempli (en gros si la question n'a pas de réponse pré-programmée), or cette réponse existe bien dans le script externe... mais le truc c'est que ça marche très bien sous ie
Édité le 12/10/2008 à 21:14:18 par MarvelBoy
Hors ligne Timot # Posté le 12/10/2008 à 21:14:16
Réfléchir ne tue pas !
Avatar

Ville : Castres
Pays : France métropolitaine
Études : ENS Lyon
Vire les windows. , met directement document. pour voir ?
Image utilisateur
Image utilisateur
 
Hors ligne MarvelBoy # Posté le 12/10/2008 à 21:15:39
Avatar
ça marche toujours sous ie mais pas sour mozilla
Hors ligne Timot # Posté le 12/10/2008 à 21:19:49
Réfléchir ne tue pas !
Avatar

Ville : Castres
Pays : France métropolitaine
Études : ENS Lyon
Est ce que tu aurais un lien de test ?
Parce que je vois pas l'erreur la.
Image utilisateur
Image utilisateur
 
Hors ligne MarvelBoy # Posté le 12/10/2008 à 21:29:01
Avatar
malheureusement je ne l'ai pas mis en ligne... mais je peux t'afficher un exmple de code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Psykanswers - Un canard &agrave; la r&eacute;ponses &agrave; vos questions ;) !</title>

<link rel="stylesheet" type="text/css" href="psykocss.css" media="screen" title="psykanswers" />
<link rel="shortcut icon" href="favicon.gif" type="image/x-icon">

<script type="text/javascript" src="jv/f_include.js"></script>

</head>
<body>

<script language="JavaScript">
var answer = ""
function theAnswers () {
if (document.ondine.question.value.indexOf('uelle est ta couleur préférée')>-1) answer="Violet.";
else {
answer = "heing?";
}

/* BDD */
include('bdd.js');

document.ondine.question.value = "Traduction en cours ...";
timerID=setTimeout("document.gueule.reply.value = answer",500);
}
</script>

<div id="pokeball">
<h5>Posez votre question en Oui/Non.</h5>

<div id="papy">
<form name="ondine" onSubmit="0">
<textarea name="question" cols="42" rows="3" class="question" onfocus="this.value =''">
</textarea><input name="button" type="button" onclick="thekAnswers()" value="OK" class="ok"/></form>
</div>

<div id="psykokwak">
<form name="gueule" onSubmit="0">
<textarea name="reply" cols="52" rows="3" class="reponse">
</textarea>
</form>

</div>

</body>
</html>



voici le code du fichier index.html

celui du fichier f_include.js :

function include(url)
{
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.setAttribute('src', url);
script.setAttribute('type', 'text/javascript');
head.appendChild(script);
}

et celui du fichier bdd.js :

if (document.ondine.question.value.indexOf('slt')>-1)
{
answer = "bonjour";
}
Édité le 12/10/2008 à 21:30:29 par MarvelBoy
Hors ligne Timot # Posté le 12/10/2008 à 21:30:10
Réfléchir ne tue pas !
Avatar

Ville : Castres
Pays : France métropolitaine
Études : ENS Lyon
Essaye de mettre comme contenu de l'include juste une instruction du genre "alert('test')" pour voir s'il est chargé.
Image utilisateur
Image utilisateur
 
Hors ligne MarvelBoy # Posté le 12/10/2008 à 21:32:58
Avatar
hm ça marche sous ie et mozilla... ça voudrait dire qu'il arrive à accéder au fichier comme voulu mais je ne comprends pas dans ce cas pk il n'affiche pas answer correctement
Hors ligne Timot # Posté le 12/10/2008 à 21:34:39
Réfléchir ne tue pas !
Avatar

Ville : Castres
Pays : France métropolitaine
Études : ENS Lyon
Essaye de mettre une id sur le champ de ton formulaire, et accede y avec getElementById("id")
Image utilisateur
Image utilisateur
 
Hors ligne MarvelBoy # Posté le 12/10/2008 à 21:35:41
Avatar
hm je suis plutôt une bille, comme je le disais, en javascript...

pourrais-tu préciser ?
Édité le 12/10/2008 à 21:37:56 par MarvelBoy
Hors ligne Timot # Posté le 12/10/2008 à 21:41:28
Réfléchir ne tue pas !
Avatar

Ville : Castres
Pays : France métropolitaine
Études : ENS Lyon
Comme ca :
<textarea name="question" cols="42" rows="3" class="question" onfocus="this.value =''" id="question">
</textarea>

if (document.getElementById("question").value.indexOf('slt')>-1)
{
answer = "bonjour";
}


Peut etre qu'il n'aime pas le passement de variable d'un script a l'autre aussi ?
Image utilisateur
Image utilisateur
 
Hors ligne MarvelBoy # Posté le 12/10/2008 à 21:45:08
Avatar
bah c'est ce que je me demande vu que ce que tu m'as demandé de faire ne fonctionne pas...

c qund mm dingue que personne n'ait encore trouvé une fonction de ce type en javascript.. moi ça me parait presque essentiel pour bien ordonné un script...
Hors ligne smurf # Posté le 13/10/2008 à 01:16:56
Avatar

Études : ENAC
Bonjour,

C'est quand même dingue ce que les gens peuvent chercher comme fonctions tordues sans utilité...
Donc pour résumer:
- soit on inclut le fichier au chargement de la page avec la bonne vieille balise <script>
- soit on fait un chargement AJAX que l'on évalue

Dans le cas de MarvelBoy qui n'a pas l'air d'avoir des connaissances très poussées en JS, mon conseil serait l'inclusion avec la balise <script>. Avant de faire des choses tordues et vicieuses, il faut d'abord apprendre les rudiments (par exemple la notation document.name n'est plus utilisée depuis longtemps au profit du document.getElementById; onSubmit="0" ne veut strictement rien dire, etc...)
Hors ligne seebz # Posté le 13/10/2008 à 20:34:53
zéro zéro seebz
Avatar
Flux RSS
close

Ville : Calais
Pays : France métropolitaine
Comme c'est le premier topic de MarvelBoy, il fallait quand même le résoudre.

Alors, rien que pour lui, je vous présente une fonction include() en javascript .. qui fonctionne :p


ca mérite un p'tit commentaire ça non ? (voir signature)
Seebz.net : Blog Développement Web 2.0 ...
Code.Seebz.net : Ressources pour développeurs ...
Api.Seebz.netImage utilisateur
 
Connecté Thunderseb # Posté le 13/10/2008 à 22:10:58
Responsable de la validation
Avatar
Validateurs
close

Ville : Liège
Pays : Belgique
OMG, inclure du JS via XHR en faisant un eval o_O

XHR : totalement inutile
eval : dangereux et à utiliser le moins possible car gourmand en ressources

La seule solution acceptable est bêtement d'ajouter un élément SCRIPT :

Code : JavaScript
1
2
3
4
5
6
7
8
9
function include(file) {
	var oScript =  document.createElement("script");
	oScript.src = file;
	oScript.type = "text/javascript";
	document.body.appendChild(oScript);
}

// On l'utilise : 
include("fichier.js");
Hébergemoi - Realfox 4 - zValido - Left 4 Dead - Portal - Jouer Medic
Dynamisez vos sites web avec Javascript !
 
Hors ligne MarvelBoy # Posté le 15/10/2008 à 13:38:24
Avatar
Merci de m'avoir aidé mais puisque qu'aucune de vos alternatives ne marchent (les ayant toutes essayées), j'en reviens à mettre ma fonction entière dans un fichier à part...

encore merci
Hors ligne Timot # Posté le 15/10/2008 à 18:13:23
Réfléchir ne tue pas !
Avatar

Ville : Castres
Pays : France métropolitaine
Études : ENS Lyon
Citation : MarvelBoy
Merci de m'avoir aidé mais puisque qu'aucune de vos alternatives ne marchent (les ayant toutes essayées), j'en reviens à mettre ma fonction entière dans un fichier à part...

encore merci

Mais si ca marche, la preuve c'est que quand tu as mis alert("test") dans le fichier a inclure, ca la fait.
Donc ne dis pas que l'inclusion ne marche pas !
Image utilisateur
Image utilisateur
 
Hors ligne MarvelBoy # Posté le 15/10/2008 à 20:16:46
Avatar
Nan mais je suis d'accord que ça marche, mais pas dans le sens où on aurait trouvé le pourquoi de mon problème

mais je le dis encore une fois : merci
Édité le 15/10/2008 à 20:17:03 par MarvelBoy
Hors ligne Timot # Posté le 15/10/2008 à 20:23:35
Réfléchir ne tue pas !
Avatar

Ville : Castres
Pays : France métropolitaine
Études : ENS Lyon
Oui mais repose ton problème, car maintenant que l'inclusion marche, c'est quoi qui ne marche pas dans ton script ?
Image utilisateur
Image utilisateur
 
Hors ligne RekinMalad # Posté le 20/10/2008 à 13:28:02
Peace and love !
Avatar
Citation : Thunderseb
OMG, inclure du JS via XHR en faisant un eval o_O

XHR : totalement inutile
eval : dangereux et à utiliser le moins possible car gourmand en ressources

La seule solution acceptable est bêtement d'ajouter un élément SCRIPT :

Code : JavaScript
1
2
3
4
5
6
7
8
9
function include(file) {
	var oScript =  document.createElement("script");
	oScript.src = file;
	oScript.type = "text/javascript";
	document.body.appendChild(oScript);
}

// On l'utilise : 
include("fichier.js");


Et si l'on veut faire un eval mais pas d'un fichier, d'une portion de code ... on remplace oScript.src par oScript.text non ?
Image utilisateur
Chat gay gratuit http://www.ganym.org/
 
Hors ligne asfez # Posté le 15/01/2009 à 09:02:47

En fait, il est possible d'importer du javascript grâce à une requête XHR. Et ce n'est pas forcement une mauvaise idée dans certain cas. En utilisant une requête synchrone quipermettra en plus de stopper le code en attendant le fichier. Le problème est de savoir que lors du eval sur le fichier il y aura un problème de scope qui laisse penser que ca ne marche pas.

Si on a un fichier qui déclare une fonction (ou classe), on ne les verra pas ensuite contrairement à un alert("toto") qui sera exécuter immédiatement et qui fonctionnera.

Le fichier à importer
Code : JavaScript
1
2
3
4
function toto()
{
alert("toto")
}


---------

Le code de js d'import
Code : JavaScript
1
2
Import("le fichier");
toto();


ne fonctionnera pas (sous ie en tout cas)

pour que cela fonction il faut modifier le fichier

Code : JavaScript
1
2
3
4
window.toto = function()
{
   ...
}


Et là ca fonctionnera.

Quand à la performance de la fonction eval, le problème est la plupart du temps négligeable. Evidement je mettrais pas dans une boucle à 1000 itérations l'évaluation d'un fichier de 50ko...
Hors ligne Jean-MichelNonglaire # Posté le 23/03/2010 à 16:24:51
Avatar
Dans un fichier js appelé "montage.js" j'ai importé un script js avec
Code : JavaScript
1
2
3
4
5
6
7
8
9
function include(file) {
	var oScript =  document.createElement("script");
	oScript.src = file;
	oScript.type = "text/javascript";
	document.body.appendChild(oScript);
}

// On l'utilise : 
include("js/test.js");


J'ai également changé la facon d'écrire mes fonctions dans le script de base du genre:
Code : JavaScript
1
2
3
4
window.toto = function()
{
   ...
}


Par contre, les variables qui se trouvent dans le fichier importé (test.js) ne sont pas prises en compte dans mon js de base (montage.js). Par exemple, dans mon fichier importé (test.js) j'ai la variable :
var statut = "ferme";
Si je fais, dans mon fichier de base (montage.js):
alert(statut);
cela ne fonctionne pas. Comment rendre des variables "universelle" afin qu'elles soient prises en compte dans mon fichier montage.js ?

Retour au forum "Javascript" ou à la liste des forums

Pour accéder à cette section
Connectez-vous !
connexion_rpx