Esiste una funzione di download in jsFiddle, quindi puoi scaricare un HTML con CSS, HTML e JS in un file, in modo da poterlo eseguire senza jsFiddle a scopo di debug?
Esiste una funzione di download in jsFiddle, quindi puoi scaricare un HTML con CSS, HTML e JS in un file, in modo da poterlo eseguire senza jsFiddle a scopo di debug?
Risposte:
Ok ho scoperto:
Devi inserire /show
un dopo l'URL su cui stai lavorando:
http://jsfiddle.net/<your_fiddle_id>/show/
È il sito che mostra i risultati.
E poi quando lo salvi come file. È tutto in un file HTML.
Ad esempio:
http://jsfiddle.net/Ua8Cv/show/
per il sito http://jsfiddle.net/Ua8Cv
http://jsfiddle.net/Ua8Cv
, se si digita semplicemente l'extra/show
nella barra degli indirizzi e premi invio (seguito dal browser mostra il collegamento al codice sorgente) per ottenere l'origine.
<a class="aiButton" id="showjscode" title="Show JavaScript code" href="#showjs"><span class="icon-pencil"></span>Show JS</a>
. Non fa nulla, ma forse arriverà presto
/show
, salva la pagina completa, quindi guarda nella cartella che termina _files
, all'interno dovrebbe esserci un .html
file con il codice sorgente dell'esempio.
Nuova risposta a una vecchia domanda:
Metodo 1:
Step 1 : Devi mettere /show
dopo URL
che stai lavorando:
http://jsfiddle.net/<fiddle_id>/show/
Mostra l'output con un'intestazione del risultato.
Passaggio 2 : fare clic con il pulsante destro del mouse sulla cornice inferiore e selezionare Visualizza sorgente cornice . Questo è tutto. Hai ottenuto il codice html con collegamenti JS online, CSS.
Basta salvarlo.
Ad esempio: http://jsfiddle.net/YRafQ/20/show/ per il sito http://jsfiddle.net/YRafQ/20/
Nota: Visualizza sorgente frame e non Visualizza sorgente pagina
Metodo 2:
Puoi usare questo codice: view-source:http://fiddle.jshell.net/<fiddle_id>/show/light/
Ad esempio: Per il mio fiddle_id: YRafQ/20
view-source:http://fiddle.jshell.net/YRafQ/20/show/light/
Aggiungere / mostrare non presenta un codice sorgente puro, è un esempio funzionante incorporato. Per visualizzarlo senza ulteriori script, CSS e HTML, utilizzare:
http://fiddle.jshell.net/<fiddle id>/show/light/
Un esempio: http://fiddle.jshell.net/Ua8Cv/show/light/
Result
nell'intestazione?
No, JSFiddle non ha una funzione di download. Tuttavia, non è molto difficile evitarlo e salvare comunque il contenuto di un violino.
Dal momento in cui è stata pubblicata la risposta accettata, JSFiddle ha apportato alcune recenti modifiche all'interfaccia utente e al back-end che influiscono sul modo in cui un violino dovrebbe essere scaricato. Nota le procedure aggiornate di seguito.
Questo metodo scarica solo HTML, JavaScript e CSS del violino come un singolo file. Le risorse esterne del violino non vengono salvate.
Nella riga di comando mostrata di seguito, si fiddle_id
riferisce al numero ID del violino. Per un violino con l'URL " http://jsfiddle.net/<fiddle_user>/<fiddle_id>
" o " http://jsfiddle.net/<fiddle_id>
", fiddle_id
è necessario solo il . Ilfiddle_user
è importante.
Al prompt della shell, immettere la singola riga di comando:
fiddleId=fiddle_id; curl "http://fiddle.jshell.net/${fiddleId}/show/" -H "Referer: http://fiddle.jshell.net/${fiddleId}/" --output "${fiddleId}.html"
Il violino verrà salvato in un file chiamato " fiddle_id.html
".
Questo metodo scarica il violino e le sue risorse esterne. I passaggi indicati si basano sull'utilizzo di Google Chrome. Anche l'utilizzo di altri browser Web dovrebbe funzionare, ma potrebbero utilizzare nomi di file diversi.
Share/Embed
menu " " / link nella parte superiore della pagina di modifica di JSFiddle. Nella finestra di dialogo che appare, copia l'URL mostrato nel campo " Share full screen result
". Sarà della forma "http://jsfiddle.net/<fiddle_user>/<fiddle_id>/embedded/result/
" o " http://jsfiddle.net/<fiddle_id>/embedded/result/
".Webpage, Complete
" nel Format
menu " ". Assicurati di specificare un nome per la pagina. Diciamo che si chiama " fiddle.html
" per questo esempio.fiddle.html
" file e una directory chiamata " fiddle_files
". Il file " fiddle.html
" è la pagina wrapper utilizzata da JSFiddle per visualizzare un'intestazione con un titolo "Risultato" e altri collegamenti. Caricherà il violino in un elemento iframe. Per la maggior parte, questo file può essere ignorato o addirittura eliminato. I contenuti HTML, JavaScript e CSS del violino verranno tutti salvati nella " fiddle_files
" directory come un singolo file denominato "saved_resource.html
".fiddle_files/saved_resource.html
" ovunque desideri utilizzarlo. Se il tuo violino includeva elementi in " External Resources
", anche quelli appariranno nella fiddle_files
directory " ". Assicurati di copiare quei file nello stesso posto in cui hai copiato " saved_resource.html
", perché il file HTML farà riferimento a tali risorse usando gli URL relativi.Come accennato in precedenza, altri browser potrebbero denominare i file in modo diverso quando vengono salvati. Ad esempio, Firefox nomina il file HTML / JS / CSS combinato " fiddle_files/a.html
".
Ancora nessuna funzionalità di download supportata .. MA .. puoi usare lo script del nodo jsfiddle-downloader .
Installazione :
npm install jsfiddle-downloader -g
Per scaricare un singolo violino dal suo ID :
jsfiddle-downloader -i <fiddle-id> [-o <output file>]
Per scaricare un singolo violino dal suo 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
Per scaricare tutti gli script di un 'utente' determinato da jsFiddle.net:
jsfiddle-downloader -u <user> [-o <output file>]
Scaricherà tutti i backup nella directory corrente, gli script jsFiddles saranno denominati come:
[<output-folder>/]<id-fiddle>.html
Passaggio 1:
vai a una pagina di violino comejsfiddle.net/oskar/v5893p61
Passaggio 2:
aggiungi "/ show" alla fine dell'URL, ad esempiojsfiddle.net/oskar/v5893p61/show
Passaggio 3:
fare clic con il tasto destro sulla pagina e fare clic su Visualizza sorgente frame . Otterrai il codice HTML incluso CSS nel tag e Javascript (js) nel tag. [Verrà aggiunto anche il link di origine di tutta la libreria].
Vedi screenshot
Passaggio 4:
ora è possibile salvare il codice sorgente in un file .html.
In un recente lavoro ho dovuto scaricare un elenco di URL per violino e creare una cartella separata per ogni violino con file html css js separato per ciascuno, per questo ho creato il seguente programma crawler. https://github.com/sguha-work/FiddleCrawler . Creerà il nome della cartella con valore contatore e ogni cartella avrà un file html, un css, un js e un file di dettagli. (Il file dei dettagli conterrà i collegamenti di risorse esterne).
Ho trovato un articolo sotto l'argomento sopra. Qui potrei prendere il codice completo. Lo citerò.
Ecco i passaggi menzionati nell'articolo:
Aggiungi incorporato / risultato / alla fine dell'URL JSFiddle che vuoi catturare.
Mostra il frame o il codice sorgente del frame: fai clic con il pulsante destro del mouse in un punto qualsiasi della pagina e visualizza il frame in una nuova scheda o il sorgente immediatamente (richiede Firefox).
Infine, salva la pagina nel tuo formato preferito (MHT, HTML, TXT, ecc.) E voilà!
inoltre puoi trovarlo: https://sirusdark.wordpress.com/2014/04/10/how-to-save-and-download-jsfiddle-code/
Puoi scaricare usando questo pacchetto nel nodo js,
Devi inserire / mostrare un dopo l'URL su cui stai lavorando:
Per esempio:
"http://jsfiddle.net/rkw79/PagTJ/show/"
per URL campo:
"http://jsfiddle.net/rkw79/PagTJ/"
dopo di che salva il file e vai nella cartella show (o il nome del file che hai salvato) sotto quella cartella otterrai un file html show_resource.HTML .questo è il tuo file attuale. Ora aprilo nel browser e visualizza il codice sorgente . Buona fortuna -------- Ujjwal Gupta
Ok, il modo più semplice, ho scoperto è stato semplicemente cambiare l'URL (jsfiddle [punto] net) in fiddle [punto] jshell [punto] net / Lì hai un codice HTML chiaro, senza alcun tipo di iframe ... Esempio: https: // jsfiddle [dot] net / mfvmoy64 / 27 / show / light / -> http: // fiddle [dot] jshell [dot] net / mfvmoy64 / 27 / show / light /
( Deve cambiare '.' 'S in "[punto]" a causa dello stackeroverflow ...: c ) PS: sry 4 inglese cattivo
Non esiste un modo così appropriato per scaricare tutte le cose insieme da JSFiddle, ma esiste un modo hack per farlo. Aggiungi semplicemente "incorporato /" o "incorporato / risultato /" alla fine del tuo URL JSFiddle !, e quindi puoi salvare l'intera pagina come file HTML + le librerie esterne (se vuoi).
Usa http://jsfiddle.net/ / show / light /
quindi basta usare la funzione inspect element del browser. otterrai il codice nella scheda iframe. . in Chrome, fai clic con il pulsante destro del mouse e fai clic su Modifica come scheda HTML. e copia il contenuto html. questo è il tuo vero codice.
Ctrl+ S, salva l'intero violino, all'interno della cartella dei file c'è la pagina pulita che stai cercando