Home  >  Article  >  Web Front-end  >  jQueryPad Practical jQuery testing tool (supports IE, chrome, FF)_jquery

jQueryPad Practical jQuery testing tool (supports IE, chrome, FF)_jquery

WBOY
WBOYOriginal
2016-05-16 18:26:391128browse

First, let’s take a look at the running interface of the software:
jQueryPad Practical jQuery testing tool (supports IE, chrome, FF)_jquery
The left is HTML code, the right is jQuery code, and it also supports code folding and syntax highlighting (but there is no code prompt, which feels a bit unpleasant, but jQuery After using it for a long time and getting familiar with it, it shouldn’t matter.) After writing, you can directly press F5 to view the actual effect. At the same time, you can click the chrome, ff, and ie buttons below to view the results in the three browsers. The actual effect, if you think it is possible, you can save it as HTML. jQueryPad will automatically merge the jQuery code and HTML code into HTML, which can be run directly by double-clicking. The generated code is as follows:

Copy the code The code is as follows:






jQueryPad Preview</ title> <br><script type="text/javascript" src="file:///D:/Documents and Settings/kyo/Local Settings/Application Data/jQueryPad/9bdfde77-f688-4bca-8a6a-aee5635fae9a/ Jquery.js"></script> <br><style type="text/css"> <br>body <br>{ <br>font-family: Segoe UI; <br>font-size : 10pt; <br>background: white; <br>} <br></style> <br><script type="text/javascript"> <br>$(document).ready( <br> function() { <br>$("#hello").html("Hello world!"); <br>}); <br></script> <br></head> <br>< ;body> <br><div id="hello"> <br></div> <br></body> <br></html><br> </div> <br>How? Does this look good? I think it is a tool that can replace VS in daily development, because after all, VS is too big. If you need to write some basic code, you can use this tool. <br><br> Another highlight of this tool is that it supports templates (using NVelocity). When you open Templates in the program directory, you will see JQuery.js and Default.vm, of which Default.vm is actually generated. The HTML template can be defined by the user. Anyone who has used NVelocity can basically customize the template by himself, so that he can customize the template according to his own needs. (Sigh: The template engine is really good. I didn’t think it was used before. It’s superfluous. I’ve been using it for a while now and I think it’s really good. If you haven’t used it before, you can quickly learn it. It doesn’t have to be NVelocity, you can also learn T4 that comes with VS) <br><br> Tips: Use this When using the tool, you can use the Ctrl Tab key to switch between HTML and jQuery code input, which greatly speeds up writing without taking one hand off the keyboard. <br><br>Download address <a href="http://www.jb51.net/jiaoben/26718.html" target="_blank">jQueryPad, a compact jQuery development and testing tool (supports IE, chrome, FF) </a></div><div class="nphpQianMsg"><div class="clear"></div></div><div class="nphpQianSheng"><span>Statement:</span><div>The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn</div></div></div><div class="nphpSytBox"><span>Previous article:<a class="dBlack" title="json formatting/compression tool Chrome plug-in extension_javascript skills" href="http://m.php.cn/faq/21871.html">json formatting/compression tool Chrome plug-in extension_javascript skills</a></span><span>Next article:<a class="dBlack" title="json formatting/compression tool Chrome plug-in extension_javascript skills" href="http://m.php.cn/faq/21873.html">json formatting/compression tool Chrome plug-in extension_javascript skills</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>Related articles</h2><em><a href="http://m.php.cn/article.html" class="bBlack"><i>See more</i><b></b></a></em><div class="clear"></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="fluid" data-ad-layout-key="-6t+ed+2i-1n-4w" data-ad-client="ca-pub-5902227090019525" data-ad-slot="8966999616"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><ul class="nphpXgwzList"><li><b></b><a href="http://m.php.cn/faq/1609.html" title="An in-depth analysis of the Bootstrap list group component" class="aBlack">An in-depth analysis of the Bootstrap list group component</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/faq/1640.html" title="Detailed explanation of JavaScript function currying" class="aBlack">Detailed explanation of JavaScript function currying</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/faq/1949.html" title="Complete example of JS password generation and strength detection (with demo source code download)" class="aBlack">Complete example of JS password generation and strength detection (with demo source code download)</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/faq/2248.html" title="Angularjs integrates WeChat UI (weui)" class="aBlack">Angularjs integrates WeChat UI (weui)</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/faq/2351.html" title="How to quickly switch between Traditional Chinese and Simplified Chinese with JavaScript and the trick for websites to support switching between Simplified and Traditional Chinese_javascript skills" class="aBlack">How to quickly switch between Traditional Chinese and Simplified Chinese with JavaScript and the trick for websites to support switching between Simplified and Traditional Chinese_javascript skills</a><div class="clear"></div></li></ul></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5902227090019525" data-ad-slot="5027754603"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><footer><div class="footer"><div class="footertop"><img src="/static/imghwm/logo.png" alt=""><p>Public welfare online PHP training,Help PHP learners grow quickly!</p></div><div class="footermid"><a href="http://m.php.cn/about/us.html">About us</a><a href="http://m.php.cn/about/disclaimer.html">Disclaimer</a><a href="http://m.php.cn/update/article_0_1.html">Sitemap</a></div><div class="footerbottom"><p> © php.cn All rights reserved </p></div></div></footer><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.length ){ //如果已经获取到了,就直接执行函数 func && func.call(this); } else { _iIntervalID = setInterval(function() { if(!_times) { //是0就退出 clearInterval(_iIntervalID); } _times <= 0 || _times--; //如果是正数就 -- _self = $(_selector); //再次选择 if( _self.length ) { //判断是否取到 func && func.call(_self); clearInterval(_iIntervalID); } }, _interval); } return this; } $("table.syntaxhighlighter").wait(function() { $('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>"); }); $(document).on("click", ".cnblogs_code_footer",function(){ $(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide(); }); $('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}}); </script></body></html>