jQueryPad 实用的jQuery测试工具(支持IE,chrome,FF)


Posted in Javascript onMay 22, 2010

首先来看下软件的运行界面:
jQueryPad 实用的jQuery测试工具(支持IE,chrome,FF)
左边为HTML的代码,右边为jQuery代码,同时支持代码折叠,语法高亮(但是就是没有代码提示,感觉有点不爽,不过jQuery使用的时间长了基本的熟悉后应该就无所谓了),在编写好后就可以直接按F5就可以查看实际效果,同时可以点击下面的chrome,ff,ie按钮来查看在3个浏览器中的实际效果,如果觉得可以就可以保存成HTML,jQueryPad会自动把jQuery代码和HTML代码合并成HTML,可以直接双击运行,生成的代码如下:

<!-- saved from url=(0014)about:internet --> 
<!-- the comment above allows the embedded browser to load the document without the ActiveX security prompt --> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
<title>jQueryPad Preview</title> 
<script type="text/javascript" src="file:///D:/Documents and Settings/kyo/Local Settings/Application Data/jQueryPad/9bdfde77-f688-4bca-8a6a-aee5635fae9a/Jquery.js"></script> 
<style type="text/css"> 
body 
{ 
font-family: Segoe UI; 
font-size: 10pt; 
background: white; 
} 
</style> 
<script type="text/javascript"> 
$(document).ready( 
function() { 
$("#hello").html("Hello world!"); 
}); 
</script> 
</head> 
<body> 
<div id="hello"> 
</div> 
</body> 
</html>

怎么样看上去很不错把?我觉得是一个可以日常开发中可以替代VS的工具,因为毕竟VS太大了,如果平时要写些基本的代码可以就用这个工具。

这个工具还有个亮点就是支持模板(采用的是NVelocity),打开程序目录下的Templates下就会看到有个JQuery.js和Default.vm,其中Default.vm是实际生成HTML的模板这个可以由用户自己定义,只要用过NVelocity的基本都可以自己定制好模板,这样就可以根据自己的需求来定制模板了(感叹下:模板引擎真是好,以前没怎么用的时候觉得多此一举,现在用了一段时间觉得真不错,大家如果没用过的可以赶快去学习下,不一定要是NVelocity,也可以学习下VS自带的T4)

小贴士:使用这个工具的时候可以使用Ctrl+Tab键来切换HTML和jQuery代码的输入,这样大大加快了编写速度,不用让一只手离开键盘。

下载地址 jQueryPad 小巧的jQuery开发测试工具(支持IE,chrome,FF)

Javascript 相关文章推荐
js 实现在离开页面时提醒未保存的信息(减少用户重复操作)
Jan 16 Javascript
基于jquery实现的可编辑下拉框实现代码
Aug 02 Javascript
Javascript核心读书有感之表达式和运算符
Feb 11 Javascript
js仿支付宝填写支付密码效果实现多方框输入密码
Mar 09 Javascript
Angular2 多级注入器详解及实例
Oct 30 Javascript
thinkphp标签实现bootsrtap轮播carousel实例代码
Feb 19 Javascript
js实现图片左右滚动效果
Feb 27 Javascript
干货!教大家如何选择Vue和React
Mar 13 Javascript
angularjs2中父子组件的数据传递的实例代码
Jul 05 Javascript
Bootstrap Tooltip显示换行和左对齐的解决方案
Oct 11 Javascript
对Vue.js之事件的绑定(v-on: 或者 @ )详解
Sep 15 Javascript
js原生map实现的方法总结
Jan 19 Javascript
用jQuery打造TabPanel效果代码
May 22 #Javascript
Mootools 图片展示插件(lightbox,ImageMenu)收集集合
May 21 #Javascript
jquery 多级下拉菜单核心代码
May 21 #Javascript
JQuery 学习技巧总结
May 21 #Javascript
Jquery调用webService远程访问出错的解决方法
May 21 #Javascript
ExtJS 下拉多选框lovcombo
May 19 #Javascript
javascript 得到变量类型的函数
May 19 #Javascript
You might like
php 验证码制作(网树注释思想)
2009/07/20 PHP
php增删改查示例自己写的demo
2013/09/04 PHP
PHP简单的MVC框架实现方法
2015/12/01 PHP
浅谈laravel框架与thinkPHP框架的区别
2019/10/23 PHP
javascript 设置文本框中焦点的位置
2009/11/20 Javascript
基于jquery的button默认enter事件(回车事件)。
2011/05/18 Javascript
jQuery中使用了document和window哪些属性和方法小结
2011/09/13 Javascript
缓动函数requestAnimationFrame 更好的实现浏览器经动画
2012/12/07 Javascript
实例讲解JavaScript中instanceof运算符的用法
2016/06/08 Javascript
详解堆的javascript实现方法
2016/11/29 Javascript
详解js的六大数据类型
2016/12/27 Javascript
基于vue-ssr服务端渲染入门详解
2018/01/08 Javascript
Vue表单之v-model绑定下拉列表功能
2019/05/14 Javascript
ES6中异步对象Promise用法详解
2019/07/31 Javascript
基于jQuery实现挂号平台首页源码
2020/01/06 jQuery
[01:20]DOTA2上海特级锦标赛现场采访:谁的ID最受青睐
2016/03/25 DOTA
攻击者是如何将PHP Phar包伪装成图像以绕过文件类型检测的(推荐)
2018/10/11 Python
python 自动重连wifi windows的方法
2018/12/18 Python
Python PyQt5 Pycharm 环境搭建及配置详解(图文教程)
2019/07/16 Python
Python实现图片批量加入水印代码实例
2019/11/30 Python
keras读取h5文件load_weights、load代码操作
2020/06/12 Python
通过实例了解python__slots__使用方法
2020/09/14 Python
HTML5 form标签之解放表单验证、增加文件上传、集成拖放的使用方法
2013/04/24 HTML / CSS
Marmot土拨鼠官网:美国专业户外运动品牌
2018/01/11 全球购物
最新大学毕业求职简历的自我评价
2013/10/18 职场文书
高分子材料与工程专业推荐信
2013/12/01 职场文书
预备党员入党思想汇报
2014/01/04 职场文书
婚庆公司的创业计划书
2014/01/22 职场文书
加入学生会演讲稿
2014/04/24 职场文书
群众路线教育实践活动民主生活会个人检查对照思想汇报
2014/10/04 职场文书
学生考试舞弊检讨书
2015/01/01 职场文书
公司出纳岗位职责
2015/03/31 职场文书
幼儿园见习总结
2015/06/23 职场文书
浅析Python中的套接字编程
2021/06/22 Python
JavaScript前端面试扁平数据转tree与tree数据扁平化
2022/06/14 Javascript
ORACLE中dbms_output.put_line输出问题的解决过程
2022/06/28 Oracle