快捷導(dǎo)航

jQueryPad 實(shí)用的jQuery測(cè)試工具(支持IE,chrome,FF)

更新時(shí)間：2010年05月22日 02:38:10 作者：

這個(gè)jQueryPad也是我無(wú)意中在網(wǎng)上看頁(yè)面的時(shí)候看到的，下載下來試用了下，感覺很好，這個(gè)軟件是使用WPF開發(fā)的（不過不開源，需要安裝.NET Framework 3.5），整體界面很簡(jiǎn)潔。

首先來看下軟件的運(yùn)行界面：

左邊為HTML的代碼，右邊為jQuery代碼，同時(shí)支持代碼折疊，語(yǔ)法高亮（但是就是沒有代碼提示，感覺有點(diǎn)不爽，不過jQuery使用的時(shí)間長(zhǎng)了基本的熟悉后應(yīng)該就無(wú)所謂了），在編寫好后就可以直接按F5就可以查看實(shí)際效果，同時(shí)可以點(diǎn)擊下面的chrome,ff,ie按鈕來查看在3個(gè)瀏覽器中的實(shí)際效果，如果覺得可以就可以保存成HTML，jQueryPad會(huì)自動(dòng)把jQuery代碼和HTML代碼合并成HTML，可以直接雙擊運(yùn)行，生成的代碼如下：

復(fù)制代碼代碼如下:

<!-- 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>

怎么樣看上去很不錯(cuò)把？我覺得是一個(gè)可以日常開發(fā)中可以替代VS的工具，因?yàn)楫吘筕S太大了，如果平時(shí)要寫些基本的代碼可以就用這個(gè)工具。

這個(gè)工具還有個(gè)亮點(diǎn)就是支持模板（采用的是NVelocity），打開程序目錄下的Templates下就會(huì)看到有個(gè)JQuery.js和Default.vm，其中Default.vm是實(shí)際生成HTML的模板這個(gè)可以由用戶自己定義，只要用過NVelocity的基本都可以自己定制好模板，這樣就可以根據(jù)自己的需求來定制模板了（感嘆下：模板引擎真是好，以前沒怎么用的時(shí)候覺得多此一舉，現(xiàn)在用了一段時(shí)間覺得真不錯(cuò)，大家如果沒用過的可以趕快去學(xué)習(xí)下，不一定要是NVelocity，也可以學(xué)習(xí)下VS自帶的T4）

小貼士：使用這個(gè)工具的時(shí)候可以使用Ctrl+Tab鍵來切換HTML和jQuery代碼的輸入，這樣大大加快了編寫速度，不用讓一只手離開鍵盤。

下載地址 jQueryPad 小巧的jQuery開發(fā)測(cè)試工具(支持IE,chrome,FF)