Existe-t-il une fonction de téléchargement dans jsFiddle?

Existe-t-il une fonction de téléchargement dans jsFiddle, vous pouvez donc télécharger un HTML avec le CSS, HTML et JS dans un seul fichier, afin que vous puissiez l'exécuter sans jsFiddle à des fins de débogage?

Ok j'ai découvert:

Vous devez mettre /showun après l'URL sur laquelle vous travaillez:
http://jsfiddle.net/<your_fiddle_id>/show/
C'est le site qui affiche les résultats.

Et puis lorsque vous l'enregistrez sous forme de fichier. Tout est dans un seul fichier HTML.

Par exemple:
http://jsfiddle.net/Ua8Cv/show/
pour le site http://jsfiddle.net/Ua8Cv

Nouvelle réponse à une ancienne question:

Méthode 1:

Étape 1 : Vous devez mettre /showaprès le sur URLlequel vous travaillez:

http://jsfiddle.net/<fiddle_id>/show/ 

Il montre la sortie avec un en-tête de résultat.

Étape 2 : Cliquez avec le bouton droit sur le cadre inférieur et sélectionnez Afficher la source du cadre . C'est tout. Vous avez le code html avec des liens JS en ligne, CSS.

Sauvegardez-le.

Par exemple: http://jsfiddle.net/YRafQ/20/show/ pour le site http://jsfiddle.net/YRafQ/20/

Remarque: afficher la source du cadre et non afficher la source de la page

Méthode 2:

Vous pouvez utiliser ce code: view-source:http://fiddle.jshell.net/<fiddle_id>/show/light/

Par exemple: pour mon fiddle_id: YRafQ/20

view-source:http://fiddle.jshell.net/YRafQ/20/show/light/

L'ajout / show ne présente pas un code source pur, c'est un exemple de travail intégré. Pour l'afficher sans aucun script supplémentaire, css et html, utilisez:

http://fiddle.jshell.net/<fiddle id>/show/light/

Un exemple: http://fiddle.jshell.net/Ua8Cv/show/light/

Non, JSFiddle n'a pas de fonction de téléchargement. Cependant, il n'est pas très difficile de contourner cela et de sauvegarder le contenu d'un violon de toute façon.

Depuis la publication de la réponse acceptée, JSFiddle a récemment apporté des modifications à l'interface utilisateur et au backend qui affectent la façon dont un violon doit être téléchargé. Notez les procédures mises à jour ci-dessous.

Méthode de ligne de commande simple

Cette méthode télécharge uniquement le code HTML, JavaScript et CSS du violon dans un seul fichier. Les ressources externes du violon ne sont pas sauvegardées.

Dans la ligne de commande ci-dessous, fiddle_idfait référence au numéro d'identification du violon. Pour un violon avec l'URL " http://jsfiddle.net/<fiddle_user>/<fiddle_id>" ou " http://jsfiddle.net/<fiddle_id>", seul le fiddle_idest nécessaire. Le fiddle_usern'est pas important.

À l'invite du shell, entrez la ligne de commande unique:

fiddleId=fiddle_id; curl "http://fiddle.jshell.net/${fiddleId}/show/" -H "Referer: http://fiddle.jshell.net/${fiddleId}/" --output "${fiddleId}.html"

Le violon sera enregistré dans un fichier nommé " fiddle_id.html".

Méthode de navigation plus longue

Cette méthode télécharge le violon ainsi que ses ressources externes. Les étapes indiquées sont basées sur l'utilisation de Google Chrome. L'utilisation d'autres navigateurs Web devrait également fonctionner, mais ils peuvent utiliser des noms de fichiers différents.

1. Sélectionnez le Share/Embedmenu / lien " " en haut de la page d'édition de JSFiddle. Dans la boîte de dialogue qui apparaît, copiez l'URL indiquée dans le Share full screen resultchamp " ". Ce sera de la forme " http://jsfiddle.net/<fiddle_user>/<fiddle_id>/embedded/result/" ou " http://jsfiddle.net/<fiddle_id>/embedded/result/".
2. Ouvrez une nouvelle fenêtre de navigateur et collez l'URL copiée à l'étape précédente. Chargez cette page.
3. Utilisez la fonction d'enregistrement de votre navigateur pour enregistrer la page et toutes ses ressources sur votre ordinateur local. Pour enregistrer toutes les ressources à l'aide de Google Chrome, par exemple, assurez-vous de sélectionner " Webpage, Complete" dans le Formatmenu " ". Assurez-vous de spécifier un nom pour la page. Disons qu'il s'appelle " fiddle.html" pour cet exemple.
4. Une fois la page enregistrée sur votre ordinateur, vous aurez le fiddle.htmlfichier " " et un répertoire nommé " fiddle_files". Le fichier " fiddle.html" est la page wrapper que JSFiddle utilise pour afficher un en-tête avec un titre "Résultat" et d'autres liens. Il chargera votre violon dans un élément iframe. Pour la plupart, ce fichier peut être ignoré ou même supprimé. Le contenu HTML, JavaScript et CSS de votre violon sera enregistré dans le fiddle_filesrépertoire " " sous la forme d'un seul fichier nommé " saved_resource.html".
5. Copiez " fiddle_files/saved_resource.html" là où vous souhaitez l'utiliser. Si votre violon incluait des éléments sous " External Resources", ceux-ci apparaîtront également dans le fiddle_filesrépertoire " ". Assurez-vous de copier ces fichiers au même endroit où vous avez copié " saved_resource.html", car le fichier HTML fera référence à ces ressources en utilisant des URL relatives.

Comme mentionné précédemment, d'autres navigateurs peuvent nommer les fichiers différemment lors de leur enregistrement. Par exemple, Firefox nomme le fichier combiné HTML / JS / CSS " fiddle_files/a.html".

Toujours aucune fonctionnalité de téléchargement prise en charge .. MAIS .. vous pouvez utiliser le script de nœud jsfiddle-downloader .

Installation :

npm install jsfiddle-downloader -g

Pour télécharger un seul violon à partir de son identifiant :

jsfiddle-downloader -i <fiddle-id> [-o <output file>]

Pour télécharger un seul violon depuis son URL :

jsfiddle-downloader -l <url> [-o <output file>]
jsfiddle-downloader -l jsfiddle.net/<user>/<fiddle-id>
jsfiddle-downloader -l https://jsfiddle.net/<fiddle-id>
jsfiddle-downloader -l https://jsfiddle.net/<user>/<fiddle-id>/show/ -o myfiddle.html

Pour télécharger tous les scripts d'un 'utilisateur' déterminé à partir de jsFiddle.net:

jsfiddle-downloader -u <user> [-o <output file>]

Il téléchargera toutes les sauvegardes dans le répertoire currrent, les scripts jsFiddles seront nommés comme suit:

[<output-folder>/]<id-fiddle>.html

Étape 1:
Accédez à une page de violon commejsfiddle.net/oskar/v5893p61

Étape 2:
Ajoutez «/ show» à la fin de l'URL, commejsfiddle.net/oskar/v5893p61/show

Étape 3:
Faites un clic droit sur la page et cliquez sur la source du cadre de vue . Vous obtiendrez le code HTML incluant CSS dans la balise et Javascript (js) dans la balise. [Le lien source de toutes les bibliothèques sera également ajouté]. Voir la capture d'écran

Étape 4:
Vous pouvez maintenant enregistrer le code source dans un fichier .html.

Le meilleur moyen est:

1. Cliquez avec le bouton droit sur le panneau de sortie.
2. Choisissez la source du cadre de vue, puis tout le code apparaîtra.

Après cela, vous pouvez copier ce code et le coller sur votre ordinateur.

Dans un travail récent, j'ai dû télécharger une liste d'URL de violon et créer un dossier séparé pour chaque violon ayant un fichier html css js séparé pour chacun, j'ai créé le programme de robot suivant pour cela. https://github.com/sguha-work/FiddleCrawler .Il créera un nom de dossier avec une valeur de compteur et chaque dossier aura un html, un css, un js et un fichier de détails. (Le fichier de détails contiendra les liens des ressources externes).

J'ai trouvé un article sous le sujet ci-dessus. Ici, je pourrais prendre le code complet. Je vais le mentionner.

Voici les étapes mentionnées dans l'article:

1. Ajoutez intégré / result / à la fin de l'URL JSFiddle que vous souhaitez récupérer.

2. Afficher le cadre ou le code source du cadre: cliquez avec le bouton droit n'importe où dans la page et affichez le cadre dans un nouvel onglet ou la source tout de suite (nécessite Firefox).

3. Enfin, enregistrez la page dans votre format préféré (MHT, HTML, TXT, etc.) et voilà!

vous pouvez également le trouver: https://sirusdark.wordpress.com/2014/04/10/how-to-save-and-download-jsfiddle-code/

Vous pouvez télécharger en utilisant ce package dans le nœud js,

https://www.npmjs.com/package/jsfiddle-downloader

Vous devez mettre / afficher un après l'URL sur laquelle vous travaillez:

Par exemple:

"http://jsfiddle.net/rkw79/PagTJ/show/"

pour l'URL du champ:

"http://jsfiddle.net/rkw79/PagTJ/"

après cela, enregistrez le fichier et allez dans le dossier show (ou le nom de fichier avec lequel vous avez enregistré) sous ce dossier vous obtiendrez un fichier html show_resource.HTML .c'est votre fichier actuel. maintenant ouvrez-le dans le navigateur et affichez le code source . Bonne chance -------- Ujjwal Gupta

D'accord, le moyen le plus simple, j'ai découvert était simplement de changer l'url (jsfiddle [dot] net) en fiddle [dot] jshell [dot] net / Vous avez un code html clair, sans aucune sorte d'iframe ... Exemple: https: // jsfiddle [point] net / mfvmoy64 / 27 / show / light / -> http: // violon [point] jshell [point] net / mfvmoy64 / 27 / show / light /

( Doit changer le '.' 'En "[point]" à cause du stackeroverflow ...: c ) PS: sry 4 mauvais anglais

Il n'y a pas un moyen aussi approprié de télécharger toutes les choses ensemble à partir de JSFiddle, mais il existe un moyen de le faire. Ajoutez simplement «embarqué /» ou «embarqué / résultat /» à la fin de votre URL JSFiddle !, et vous pourrez ensuite enregistrer la page entière sous forme de fichier HTML + les bibliothèques externes (si vous le souhaitez).

Il y a npm-package jsfiddle-downloader.

Utilisez http://jsfiddle.net/ / show / light /

puis utilisez simplement la fonction inspect element du navigateur. vous obtiendrez le code dans l'onglet iframe. . dans le chrome, faites un clic droit et cliquez sur modifier comme onglet html. et copiez le contenu html. c'est votre véritable code.

Ctrl+ S, enregistre le violon entier, dans le dossier des fichiers se trouve la page propre que vous recherchez