JSFiddle - Code Playground

cerca de 1000~20000

504

Dragão na Piscina. espera-se sucesso

2

172.67.158.9

window.dataLayer=window.dataLayer||[];functionanalytics_jsf(){dataLayer.push(arguments);}analytics_jsf("js",newDate());analytics_jsf("config","G-DG76L8EKG3",{pe_path:"/",cookie_prefix:"jsfiddle",})Track={ui:function(action){if(typeof(analytics_jsf)==="function"){analytics_jsf("event","ui_event",{"event_action":action||null})}}}varEditorConfig={shell:false,paths:{forite:"/_make_fourite/",media:"/mooshellmedia/",addResource:"/_add_external_resource/",render:"",seSettings:"/_editor_options/",fork:"/_fork/",se:"/_se/",update:"",loadDependencies:"/_get_dependencies/{lib_id}/",showProfile:"/_show_profile/",fiddlePrivacy:"/fiddles/toggle-private/",},value:{html:"",js:"",css:""},fiddle:{version:"",pastie_id:"",slug:"",boilerplate:false,private:false},panels:{html:"html",js:"jascript",css:"css"},user:{id:"None",username:"",},currentUser:false,isAuthor:false,features:{toggleSidebar:false},is_pro:false}//translationsconstI18n={editor:{panels:{result:"Result",dr_to_reorder:"Drtabstoreorder",tidy:"TidythecodewithPrettify"},sidebar:{toggle_sidebar:"Togglesidebar"},groups:{placeholder_value:"Addtocollections",search_placeholder_value:"Searchforcollections",no_choices_text:"Nomorecollections",no_results_text:"Nocollectionsfound",item_select_text:"Presstoselect",you_he_no_groups:"Youhenocollections"}}}constEditorUISettings={//optionsthatusercanchangelayout:1,themeMode:3,tabSize:2,maJSFiddle - Code PlaygroundtchBrackets:true,lineNumbers:true,lineWrapping:true,keyMap:"default",autoCloseTs:true,autoCloseBrackets:true,indentWithTabs:false,codeLinting:true,autoRun:EditorConfig.currentUser?false:false,autoRunValid:EditorConfig.currentUser?true:false,autoSe:EditorConfig.currentUser?true:false,clearConsole:false,fontSize:1,matchTs:false,foldGutter:true,codeHints:true,editorConsole:true,hotreloadCss:true,hotreloadHtml:false}JSFiddle-CodePlaygroundANRunEmbedGoPROJSFiddle-TestyourJaScript,CSS,HTMLorCoffeeScriptonlinewithJSFiddle.YourrecentfiddlesCollectionsPROSelectcollections:Newcollectionvarresources=[]ResourcesURLcdnjs0PasteadirectCSS/JSURLTypealibrarynametofetchfromCDNJSAsyncrequestsSimulatingasyncrequests:JSON/echo/json/JSONP/echo/jsonp/HTML/echo/html/XML/echo/xml/Seedocsformoreinfo.ChangelogJSFiddleAppsColorPaletteGeneratorSigninCodepaneloptionsChangecodelangues,preprocessorsandpluginsHTMLJaScriptCSSLangueHTMLHAMLDoctypeXHTML1.0StrictXHTML1.0TransitionalHTML5HTML4.01StrictHTML4.01TransitionalHTML4.01FramesetLangueJaScriptCoffeeScriptJaScript1.7Babel+JSXTypeScriptCoffeeScript2VueReactPreactExtensionsAlpine.js2.1.2AngularJS1.1.1AngularJS1.2.1AngularJS1.4.8AngularJS2.0.0-alpha.47Bonsai0.4.1BrickedgeCreateJS2013.09.25CreateJS2015.05.21D33.xD34.13.0D35.9.2Dojo(nightly)Dojo1.4.8Dojo1.5.6Dojo1.6.5Dojo1.7.12Dojo1.8.14Dojo1.9.11Dojo1.10.8Dojo1.11.4Dojo1.12.2Ember(latest)Enyo(nightly)Enyo2.0.1Enyo2.1Enyo2.2.0Enyo2.4.0Enyo2.5.1Enyo2.7.0ExtJS3.1.0ExtJS3.4.0ExtJS4.1.0ExtJS4.1.1ExtJS4.2.0ExtJS5.0.0ExtJS5.1.0ExtJS6.2.0FabricJS1.5.0FabricJS1.7.7FabricJS1.7.15FabricJS1.7.20Inferno1.0.0-beta9JSBlocks(edge)KineticJS4.0.5KineticJS4.3.1Knockout.js2.0.0Knockout.js2.1.0Knockout.js2.2.1Knockout.js2.3.0Knockout.js3.0.0Knockout.js3.4.2Lo-Dash2.2.1Minified1.0beta1MithrilJS0.2.0MithrilJS1.1.6Mootools(nightly)Mootools1.3.2Mootools1.3.2(compat)Mootools1.4.5Mootools1.4.5(compat)Mootools1.5.1Mootools1.5.2Mootools1.5.2(compat)Mootools1.6.0Mootools1.6.0(compat)No-Library(pureJS)OpenUI5(latest,mobile)Paper.js0.22Pixi3.0.11Pixi4.0.0Processing.js1.2.3Processing.js1.3.6Processing.js1.4.1Processing.js1.4.7Prototype1.6.1.0Prototype1.7.3RactiveJS0.7.3Raphael1.4Raphael1.5.2Raphael2.1.0React0.3.2React0.4.0React0.8.0React0.9.0React0.14.3RightJS2.1.1RightJS2.3.1Riot3.7.4Shipyard(nightly)Shipyard0.2Thorax2.0.0rc3Thorax2.0.0rc6Three.jsr54Three.js105Underscore1.3.3Underscore1.4.3Underscore1.4.4Underscore1.8.3Vue(edge)Vue1.0.12Vue2.2.1WebAppInstall0.1XTKedgeYUI2.8.0r4YUI3.5.0YUI3.6.0YUI3.7.3YUI3.8.0YUI3.10.1YUI3.14.0YUI3.16.0YUI3.17.2Zepto1.0rc1jQuery(edge)jQuery1.9.1jQuery2.1.3jQuery2.2JSFiddle - Code Playground.4jQuery3.2.1jQuery3.3.1jQuery3.4.1jQuerySlim3.2.1jQuerySlim3.3.1jQuerySlim3.4.1jTypes2.1.0qooxdoo2.0.3qooxdoo2.1svg.js2.6.5svg.js2.7.1svg.js3.0.5scriptattributeLangueCSSSCSSSASSPostCSS(Ste0+)PostCSS(Ste3+)TailwindCSSResetCSSThisfiddlehaspreviouslyunsedchanges.ApplychangesDiscardKeepJSFiddlerunning.Whitelistusinyourcontentblocker.We'vebeenprovidingwebdevelopers,educators,students,companieswithJSFiddlefreeformanyyears.Yourcanhelpusinoneoftwoways:WhitelistJSFiddleinyourcontentblockerGoPROandgetaccesstoadditionalPROfeatures→Ad-freeAlladsintheeditorandlistingpesareturnedcompletelyoff.Usepre-releasedfeaturesYougettotryandusefeatures(likethePaletteColorGenerator)monthsbeforeeveryoneelse.FiddlecollectionsSortandcategorizeyourFiddlesintomultiplecollections.PrivatecollectionsandfiddlesYoucanmakeasmanyPrivateFiddles,andPrivateCollectionsasyouwish!ConsoleDebugyourFiddlewithaminimalbuilt-inJaScriptconsole.Jointhe4+millionusers,andkeeptheJSFiddledreamalive.Ad-freeAlladsintheeditorandlistingpesareturnedcompletelyoff.Usepre-releasedfeaturesYougettotryandusefeatures(likethePaletteColorGenerator)monthsbeforeeveryoneelse.FiddlecollectionsSortandcategorizeyourFiddlesintomultiplecollections.PrivatecollectionsandfiddlesYoucanmakeasmanyPrivateFiddles,andPrivateCollectionsasyouwish!ConsoleDebugyourJSFiddle - Code PlaygroundFiddlewithaminimalbuilt-inJaScriptconsole.JSFiddleisusedbyyouand4+millionotherdevelopers,inmanycompanies......andtopeducationalinstitutions:ime/svg+xmlJoinasPROColorPaletteGeneratorGenerateacoolcolorpalettewithafewclicksShareorembedfiddleCustomizetheembeddableexperienceforwebsitesTabs:JaScriptHTMLCSSResultVisual:LightDarkEmbedsnippetPreferiframe?:NoautoresizingtofitthecodeRenderblockingoftheparentpeEditorsettingsCustomizethebehiorandfeeloftheeditorBehiorAuto-runcodeOnlyauto-runcodethatvalidatesAuto-secodeAuto-closeHTMLtsAuto-closebracketsLivecodevalidationHighlightmatchingtsHotreloadCSSNEWHotreloadHTMLNEWGeneralLinenumbersWraplinesIndentwithtabsCodehinting(autocomplete)Indentsize:2spaces3spaces4spacesKeymap:DefaultSublimeTextEMACSVimFontsize:DefaultBigBiggerJabbaConsoleConsoleintheeditorClearconsoleonrunYourrecentfiddlesRecentrycreatedfiddles,includingonescreatedwhileloggedoutJSFiddlechangelogAlogofallthechangesmadetoJSFiddle–bigandsmall.NewYourrecentfiddleswhenloggedoutSingafiddle,evenwhenyou'reloggedout,willputitundertheYourrecentfiddlesmodalinthesidebar.Theywilleventuallydisappear(sincethey'reanonymous),butnowyou'llhetimetosethemunderyouruserafterloggingin.NewTailwindCSSAddedTailwindCSStothelistofprecompilers-eventhoughit'sreallyHTML,youcanactivateitfromthedropdownintheCSSpanel.TailwindCSSwouldbebestusedwithHTMLHot-reloadenabled.UpdateCodelintingandformattingWe'vereplacedthedatedcodelinterandformattedwithmoremodernones:StylelintandPrettier.NewJSFiddle3.0The3.0updatesbringsalotofchanges,mostnotablyamodernUIrefresh.Therewasanincreadibleamountofunder-the-hoodchangesforthefront-end,we'vemostlymovedawayfrompre-processors.Thelight/darkthemesareusingamodernlight-dark()approach.Therefactoringallowsformorechangestobemadeinaspediermanner.Inthenewsidebaryoucanfindourmini-apps(rightnowtheColorPaletteGenerator)SystemthemefollowsyourOSsettingsCSSHot-reload-stylesupdateimmidietlyasyoutypeHTMLHot-reload(experimental)-updateHTMLimmidietlyasyoutypeResultspanelcolorfollowstheselectedthemeTitleanddescriptionarenowasinglefieldPublicProfilepeiscompleteltyredesignedandcanbeeasilyusedasyourcodeshowcaseGroupsarenowCollectionsandwehebigplansforthemCollectionsarecompletelyredesignedUserscannowaddgroupsstraightfromtheeditorNewImportfiddlesasmodulesImportfiddlecodeintootherfiddleswithModulesandImports.JSModules:import[name]from'@jsfiddle/[username]/[fiddle].js'CSSImport:@importurl('@jsfiddle/[username]/[fiddle].css')Seehowthisworksinthisfiddle.ChangeFiddlelistingshowslatestversionThefiddlelistings(Public,Private,Titled,etc)willnowdisplaylatestversionsinsteadoftheonessedasBaseversions-thiswascausingmoreconfusionthangood,sowedecidedtochangethislong-standingbehior.ChangeEvaluatecodeintotheconsoleCustomConsolebetaisgettingmorestableandfeature-rich.Justaddedtheabilitytoevaluatecodeintheconsole.NewConsoleintheeditorIntroducingthefirstbetaoftheeditorconsole-it'sgoingtoshowyoulogs,warnings,errorswithouttheneedofopeningfulldevtools.Consoleisaialbleforallusersduringbeta,afterthatit'llbeailableforJSFiddlesupporters.NewMoreuser'ssociallinks(Dev.to,StackOverflow,Medium)Youcanaddmoreofyoursociallinks`Settings/SocialMedia`,forDev.to,StackOverflowandMedium.ThesewillbedisplayedontheprofilesectioninEditor'ssidebarandyourpublicprofile.ChangeRefactoredUnsedDraftsfeatureUnseddraftsfeatureiscompletelyrewrittenwith100%fewerbugsand10xmoremaintainablecodebase–astheauthorofthepreviousone,Ihadhardtimesfiguringoutwhatitdoes🥴constUpdatesWidget=function(options){letelement={trigger:document.querySelector(".sidebarItem.si_changelog"),updates:document.querySelector("#app-updatesli")}letlatestUpdateId=element.updates.dataset.updateIdletlastSeenUpdateId=window.localStore.getItem("JSFIDDLE_last_seen_update")letdismissUpdate=function(){window.localStore.setItem("JSFIDDLE_last_seen_update",latestUpdateId)element.trigger.classList.add("hidden")}//removehiddenclassifuserhasn'tseenthelatestupdateif(lastSeenUpdateId!==latestUpdateId){element.trigger.classList.remove("hidden")}element.trigger.addEventListener("click",dismissUpdate)}window.addEventListener("DOMContentLoaded",UpdatesWidget)AddanewcollectionCollectyourfiddlesincollectionsClassicColumnsBottomresultsRightresultsTabs(columns)Tabs(rows)SystemLightDarkconstloadEditor=function(){Layout.skin="light"$extend(Layout,newEvents())Actions=newEditorActions()Layout.render()Layout.adbd()}letthemeHref="/css/dist-editor.css?9cb090ead8068f91badc8d8a8c8b"letscript=document.createElement("script")script.src="/js/_dist-editor.js?9cb090ead8068f91badc8d8a8c8b"letstyleEditor=document.createElement("link")styleEditor.rel="stylesheet"styleEditor.type="text/css"styleEditor.id="editor-theme"styleEditor.href=themeHrefdocument.body.appendChild(styleEditor)script.onload=loadEditor//styleEditor.onload=function(){//document.body.appendChild(script)//}document.body.appendChild(script)(function(){if(typeof_bsa!=='undefined'&&_bsa){_bsa.init('stickybox','CKYD52JI','placement:jsfiddlenet-custom');}})();