William Jiang

JavaScript,PHP,Node,Perl,LAMP Web Developer – http://williamjxj.com; https://github.com/williamjxj?tab=repositories

Tag Archives: prototype

Prototype, jQuery in Dreamweaver

JavaScript framework (library) is indispensability in today’s web developing, the popular 2 are Prototype, jQuery. Both Prototype and jQuery’s Ajax are super, which can satisfy mostly users requirements.
For me, I use proximately Prototype 50% and jQuery 10% in my developing, mixed with pure JavaScript 30% and others 10%.

Meanwhile, ususally I use Dreamweaver as developing platform. Dreamweaver has its JavaScript framework Spry which integrates into the GUI environment.
So it is natural and inevitable to use Spry functions such as ‘Menu Bar’, ‘Tabbed Panel’, and ‘Accordion’ for quick application (actually they are simply to use, just click the men button!).

So as a web/ajax developer in ‘Dreamweaver’ environment, the possible combination of JavaScript are:

  • Pure JavaScript
    the simplest way, such as for validation: if(/^\s+$/.test(form.field.value)) { alert(…); return false;}
  • Prototype
    for Ajax, of course, also with a lot of other utility methods, and modules. It’s smaller and quicker than jQuery, besides, with its famous UI interface extension http://script.aculo.us/.
  • jQuery
    XPath, Ajax, DOM, Events, Effects, other plugins, etc.
  • Spry
    yes, quick app for tabbed Panel which I used mostly.
  • Prototype + Spry
    create prototype objects to access Spry’s tabs.
  • jQuery + Spry
    create jQuery objects to access Spry’s tabs.
  • Others
    such as js window.

Prototype is my first choice, I used the following functions:

  • Autocompleter
  • InPlaceEditor / InPlaceCollectionEditor
  • Draggable
  • Effect.* series

plus the outstanding UI interface functions, animation effects, they are really cool.

jQuery’s most favorite features are listing here:

  • searching for elements using CSS selectors
    This is most I like jQuery

    $(“li[a:contains(‘Register’)]”);
    $(“input[@type=radio][@checked]”)
    $(“ul/li/dl/li”)
    $(‘#myForm :input’)
  • operations implicitly applied to all found elements
  • ability to chain operations
    Suppose how much work we can do to use just a single statement!

    $(‘div1 div2 div3’).removeClass(”).addClass(”).show().accordion().sortable({});

No matter which framework you prefer to, in Dreamweaver environment, there are 2 very useful extension plugins from http://xtnd.us/dreamweaver/.

  1. Prototype API extension for Dreamweaver
  2. jQuery API extension for Dreamweaver

They will give auto-remindering box when typing, by using them, Coding Prototype and jQuery are pretty easy and faster in Dreamweaver.