Mini jQuery Lab

邊做邊學jQuery 3,4,5集已經上線了,有興趣的人可以連上去看看:

  • jQuery 常用的Javascript 技巧
  • 神奇的 jQuery Selector
  • jQuery 的樣式、屬性、欄位內容存取語法
  • 有看Demo影片的人應該會發現我寫了一個好東西(至少我自己覺得很好用啦!)--Mini jQuery Lab!

    在我學習測試jQuery的過程,常需要寫個一兩行測一下某個函數或某段Javascript寫法是否OK。在這種情況下,即便是在Visual Studio 2008中,也要歷經寫Code、存檔、View In Browser的過程,對一般人來說已經很方便,但對懶惰又性急的我來說總覺得太繁瑣太緩慢了,需要是發明之母,所以我又做了潛盾機出來,這跟當年開發Mini C# Lab心路歷程差不多。(謎之聲: 很少看到這種一路走來,始終如一的懶人...)

    介面分成三區,可以分別輸入CSS、Body HTML以及Script,Script的部分會被自動包在$(function() {  });中,而jQuery 1.3.1已載入,$給它直接用下去就對了。修改完成按下Execute直接看結果,很爽快吧!

    上方有個View HTML Source的按鈕,按下可以看到HTML內容,透過SyntaxHighlighter可以將HTML輕鬆Copy出來將結果另存檔案留念。

    我難得有工具還提供教學錄影實際操作示範,這裡就不多廢話了。

    最後一定要提一點,jQuery真的夠簡潔! MiniJQueryLab.htm的全部功能,HTML含Script不到150行就打死,比我原先預期的還少,不虧是省Code一哥。

    歡迎推文分享:
    Published 12 February 2009 03:51 AM 由 Jeffrey
    Filed under: , ,
    Views: 18,173



    意見

    # singular said on 11 February, 2009 07:19 PM

    邊做邊學jQuery 第5集關於outerHeight、outerWidth的說明中,預設應該是"包含" border 及 padding。

    以下為jQuery官網Documentation

    docs.jquery.com/.../outerHeight

    docs.jquery.com/.../outerWidth

    # Jeffrey said on 11 February, 2009 08:51 PM

    to singular, 謝謝指正,的確是我打錯了(應是剪下貼上惹的禍)。我會請微軟儘快幫忙更正,可能需要點時間完成,在此向大家致歉。

    # Elijah Manor said on 12 February, 2009 09:50 AM

    Is there a link to this jquery lab?

    # Jeffrey said on 12 February, 2009 10:43 AM

    to Elijah, the Mini jQuery Lab is a tool for the demo and testing purpose in my jQuery tutorials on MSDN Taiwan, you can get them from the jQueryDemo*.zip.  For example, go msdn.microsoft.com/.../dd452442.aspx and download jQueryDemo5.zip at the bottom of the page, then you will find MiniJQueryLab folder inside the zip file.  Have fun! :P

    # wangaguo said on 12 February, 2009 11:43 AM

    這些jQuery tutorials on MSDN Taiwan,進入某文章後,沒有相關文章的連結,在上面Searh "jQuery"也找不到文章,實在很難用,不知如何好好的找出您的文章。

    另外,MiniJQueryLab,不知License是什麼?我是否可以找地方放上去變成online Tools呢? 不過MiniJQueryLab少了些About darkthread,可以的話,我也會再把它補上。

    # K said on 12 February, 2009 01:05 PM

    微軟那篇的標題把query打成qeury了

    # can said on 01 June, 2009 06:37 PM

    拿來改成prototype版的好了....

    # 笑筑 said on 23 July, 2010 06:30 AM

    以前一直不屑JS框架,看了兄台MSDN上的JQUERY系列,决定要好好学学JQUERY了。。

    # Jeffrey said on 23 July, 2010 04:31 PM

    to 笑筑,歡迎加入jQuery戰士的行列,享受用衝鋒槍殺敵的快感~~

    你的看法呢?

    (必要的) 
    (必要的) 
    (選擇性的)
    (必要的) 
    (提醒: 因快取機制,您的留言幾分鐘後才會顯示在網站,請耐心稍候)

    5 + 3 =

    搜尋

    Go

    <February 2009>
    SunMonTueWedThuFriSat
    25262728293031
    1234567
    891011121314
    15161718192021
    22232425262728
    1234567
     
    RSS
    創用 CC 授權條款
    【廣告】
    twMVC

    Tags 分類檢視
    關於作者

    一個醉心技術又酷愛分享的Coding魔人,十年的IT職場生涯,寫過系統、管過專案, 也帶過團隊,最後還是無怨無悔地選擇了技術鑽研這條路,近年來則以做一個"有為的中年人"自許。

    文章典藏
    其他功能

    這個部落格


    Syndication