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动态创建表格,删除行列的小例子
Jul 20 Javascript
JavaScript中的原型链prototype介绍
Dec 30 Javascript
jQuery应用之jQuery链用法实例
Jan 19 Javascript
JS递归遍历对象获得Value值方法技巧
Jun 14 Javascript
微信小程序 缓存(本地缓存、异步缓存、同步缓存)详解
Jan 17 Javascript
JavaScript 事件流、事件处理程序及事件对象总结
Apr 01 Javascript
jQuery实现键盘回车搜索功能
Jul 25 jQuery
JS函数节流和函数防抖问题分析
Dec 18 Javascript
Vue 父子组件数据传递的四种方式( inheritAttrs + $attrs + $listeners)
May 04 Javascript
vue: WebStorm设置快速编译运行的方法
Oct 18 Javascript
详解vue 自定义marquee无缝滚动组件
Apr 09 Javascript
JS中循环遍历数组的四种方式总结
Jan 23 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
推荐5款跨平台的PHP编辑器
2014/12/25 PHP
php生成RSS订阅的方法
2015/02/13 PHP
Yii2增加验证码步骤详解
2016/04/25 PHP
php版阿里云OSS图片上传类详解
2016/12/01 PHP
学习YUI.Ext 第四天--对话框Dialog的使用
2007/03/10 Javascript
javascript类继承机制的原理分析
2009/09/12 Javascript
JavaScript中URL编码函数代码
2011/01/11 Javascript
JavaScript 处理Iframe自适应高度(同或不同域名下)
2013/03/29 Javascript
Event altKey,ctrlKey,shiftKey属性解析
2013/12/18 Javascript
jquery.form.js实现将form提交转为ajax方式提交的方法
2015/04/07 Javascript
全系IE支持Bootstrap的解决方法
2015/10/19 Javascript
浅析JavaScript声明变量
2015/12/21 Javascript
jquery zTree异步加载简单实例讲解
2016/02/25 Javascript
js实现登录与注册界面
2017/11/01 Javascript
详解jQuery设置内容和属性
2019/04/11 jQuery
React优化子组件render的使用
2019/05/12 Javascript
JavaScript面向对象程序设计中对象的定义和继承详解
2019/07/29 Javascript
如何在selenium中使用js实现定位
2020/08/18 Javascript
原生js生成图片验证码
2020/10/11 Javascript
[01:01]青春无憾,一战成名——DOTA2全国高校联赛开启
2018/02/25 DOTA
python抓取网页中图片并保存到本地
2015/12/01 Python
Linux下将Python的Django项目部署到Apache服务器
2015/12/24 Python
利用Python-iGraph如何绘制贴吧/微博的好友关系图详解
2017/11/02 Python
python 最简单的实现适配器设计模式的示例
2020/06/30 Python
python3 中使用urllib问题以及urllib详解
2020/08/03 Python
python 5个实用的技巧
2020/09/27 Python
解决Pycharm 运行后没有输出的问题
2021/02/05 Python
老公给老婆的道歉信
2014/01/10 职场文书
大学生在校学习的自我评价
2014/02/18 职场文书
合作协议书范本
2014/04/17 职场文书
管理提升方案
2014/06/04 职场文书
个人收入证明模板
2014/09/18 职场文书
商务司机岗位职责
2015/04/10 职场文书
源码解读Spring-Integration执行过程
2021/06/11 Java/Android
python编程简单几行代码实现视频转换Gif示例
2021/10/05 Python
VUE递归树形实现多级列表
2022/07/15 Vue.js