<img height="1" width="1" style="display:none;" alt="" src="https://px.ads.linkedin.com/collect/?pid=299788&amp;fmt=gif">
Skip to content

By Justin Freeman

I have already talked about jQuery and Dojo. The last library I will talk about is the Prototype library.

I know it would be more appropriate to talk about YUI (Yahoo’s library) or some other framework, but since I don’t have the experience with those I will stick with what I am familiar with.


The Prototype library is pretty simple to set up. All you need to do is download the one js file - which is appropriately named prototype.js! Once you include that file you are ready to start using Prototype.

Comparing this library to Dojo and jQuery, the Prototype library is significantly smaller while still filled with a lot of good features that solve the basic needs of your website without leaving a big footprint.


Prototype has a few notations. The first notation is it uses the $ notation. Those who are familiar with Java will recognize this $ notation from your JSPs for displaying values. Well now you can use the same notation in JavaScript! Though it does have a slightly different meaning. It is used mostly for accessing objects in the DOM.

For example:

[js]${“someobject”}.setStyle({color: red})[/js]
is a lot simple than:

[js]document.getElementById(‘someobject’).style.color = red;[/js]
I personally like this notation better because it's less code and far easier to read. Let’s go back to the request example from jQuery and Dojo. Here is how you would make a request in Prototype:

new Ajax.Request("senddaction", {
parameters: $(aform).serialize(true),
onSuccess: function(response){
console.log(“response:”, response);
onFailure: function() {
console.log(“Request failed”);


Unfortunately Prototype does not return you an error like Dojo or jQuery does. It is up to the client to display an appropriate error message when a request is made. There are a few other notations I would like to mention briefly.

The $$ notation is like a search and replace notation. It allows you to search for a group of elements and manipulate them. For example:

$${p} – will return a collection of all elements with a tag in your page.

This is useful if you want to manipulate the CSS class on multiple fields. The $F() returns the value of a requested form element. Normally you would use:


Now you can change that to:


Again, the goal of this library is reduce the sheer amount of JavaScript and make things easier to understand and read.


As you can see, Prototype is simple and has a lot of the basic functions that both Dojo and jQuery have. It does not have some of the more advanced features. This is why some people hesitate to use it. It is also not very popular currently in the crowded JavaScript space so it doesn’t get the attention that Dojo and jQuery have.

Consequently the documentation and examples on the web are a little on the light side. But if you are willing to learn the library and work with it, you will find it is very easy to learn and use.

I personally like Prototype for its simplicity and for my work as a consultant. Most businesses are looking for simplicity and ease of maintenance. I think Prototype is a perfect choice to meet those goals.

Managing JIRA at Scale White Paper

See More From These Topics