Discussion :

[kunpen]

Bonjour,

Malheureusement nul en JS, j'ai besoin d'aide pour créer un bouton 2 en 1 (bouton on/off) qui fait appel à un JS externe.

Ce bouton fait correctement appel à un JS non lancé au démarrage de la page pour économiser des requêtes et ressources.
Par contre, je n'arrive pas à faire le contraire, c'est à dire arrêter le JS appelé et le "décharger".
J'ai tenter avec le bouton toggle cependant je ne crois pas qu'il enlève le JS en fond de tâche.

Idéalement j'ai besoin d'un bouton marche/arrêt qui appel et retire le JS externe.
Si c'est impossible, 2 boutons marche/arrêt pourrais faire l'affaire.

JS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
function loadScript(script_url){
    var head= document.getElementsByTagName('head')[0];
    var script= document.createElement('script');
    script.type= 'text/javascript';
    script.src= script_url;
    head.appendChild(script);
}
 
function toggleDiv(divId) {
   $("#"+divId).toggle();
}

HTML

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<input type="button" onclick="loadScript('http://4bc5875dcd.url-de-test.ws/v5/js/sakura.js');" value="Start" />
<input type="button" onclick="javascript:toggleDiv('sakura');" value="Toggle" /> 
<p>
<div onclick="loadScript('http://4bc5875dcd.url-de-test.ws/v5/js/sakura.js');">Bouton 2 en 1</div>

Possibilité de tester et modifier sur http://codepen.io/anon/pen/Grpnb

Merci pour votre temps.

[SylvainPV]

Qu'est-ce que tu veux dire par "décharger un script" ? Un script c'est comme un texte, on le lit de haut de bas en suivant les instructions. A la rigueur, si le script met des variables en RAM, tu peux manuellement les dés-instancier pour demander à ce que la RAM soit libérée mais à part ça, je ne vois pas trop l'intérêt...

En tout cas ça n'a strictement rien à voir avec la fonction toggle de jQuery, qui se contente d'afficher/masquer un élément HTML.

[kunpen]

Merci pour ta réponse SylvainPV
En effet j'ai un peu de mal à assimiler le mécanisme car d'habitude on met
- un JS mélé dans le code html (ou autres) d'une page qui va se lancer au chargement de la page.
ou
- on appel un fichier script.js à part qui ca également se lancer au chargement de la page.
Il existe des techniques pour assurer un chargement de page rapide et exécuter le JS avant la balide </body> ou alors un chargement asynchrone, etc...

La différence ici c'est que la page se charge sans lancer le JS en même et c'est ce que je souhaite.
Puis quand on appuis sur un bouton on appel un fichier script.js à part qui se lance.
Le script est lu et exécuté, jusque la c'est parfait.

Puis j'aimerai bien qu'en appuyant sur ce même bouton, le JS soit arrêté et qu'il ne prenne plus de ressources,
d'ou ce que j'appel de "décharger" c'est à dire retirer le JS externe qu'on à appelé précédemment.
Ou tout simplement l'arrêter totalement devrais suffire normalement enfin tout dépend des JS je crois.

Quand au toggle, tu a raison, ça ne fait que afficher ou masquer et du coup ça prend des ressources car le script tourne en fond quand même et
c'est justement ce que je ne souhaite pas.

Une solution les ga ?

[SylvainPV]

en appuyant sur ce même bouton, le JS soit arrêté et qu'il ne prenne plus de ressources

Je pense que tu as une mauvaise conception de comment fonctionne JavaScript. "Arrêter le JS" ne veut pas dire grand chose, tu peux certes stopper l'exécution d'un script au milieu entre deux instructions, mais une fois que le moteur a exécuté toutes les instructions du script, il ne prend plus de ressources CPU puisqu'il n'y a plus d'instructions à exécuter.

Après, un script exécuté laisse toujours une empreinte : variables déclarées dans la RAM, attachement d'écouteurs d’événements sur le document, timers etc... Faire le nettoyage complet de cette empreinte est très compliqué et, à vrai dire, plutôt inutile. Le garbage collector des moteurs JavaScript fait très bien le boulot à notre place.

[kunpen]

Si le JS est chargé dans la RAM ce n'est pas bien grave, par contre le JS exécuté prend des ressources CPU , il doit bien exister une méthode pour stopper son exécution non ?
un truc du genre ça pourra marcher ?
http://www.developpez.net/forums/d11...on-javascript/

ou j'ai ajouté ce script qui à l'air de fonctionner qu'une seule fois et je suis obligé de faire un 2ème bouton
HTML

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<button onclick="myFunction()">Stop</button>

JS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
function myFunction()
{
var list=document.getElementById("sakura");
list.removeChild(list.childNodes[0]);
}

removeChild() semble être la solution, cependant comment faire un bouton 2 en 1 ? Et comment s'assurer que le bouton stop fonctionne à chaque fois ?

Possibilité de tester et modifier sur http://codepen.io/anon/pen/wGLnl

[kunpen]

Je viens de trouver la fonction remove ça à l'air de mieux fonctionner, par contre je ne sait si c'est "propre" comme code ^^
Il reste plus qu'a faire le bouton 2 en 1, des solutions SVP ?

Résultat visible sur http://codepen.io/anon/pen/wGLnl Bouton "retirer"