I haven't had time to watch prototype. Now it's fine, it has been updated to 1.5 pre1. Haha, I have to learn powerful functions. This is another shortcut to improving my JS capabilities.
1. What is Prototype?
Maybe you haven't used it yet, it's a JavaScript package written by Sam Stephenson. This idea of writing a well-compliant piece of code that is compatible with standards will bear the burden of creating fat clients, highly interactive WEB applications. Easily add Web 2.0 features.
If you have recently experienced this package, you will most likely find that documentation is not one of its strengths. Like all developers before me, I could only dive into the source code head-on and experiment with every part of it. I think it would be great to take notes and share them with others when I was studying him.
I also provide unofficial references to objects, classes, methods and extensions for this package.
2. General method
This package contains many predefined objects and universal methods. The obvious purpose of writing these methods is to reduce your massive repetitive encodings and idioms.
Starting from the Prototype 1. version, you can more conveniently operate the DOM object as shown in the following code:
var ele = $("myelement");
(); //Hide DOM object comparison in the previous version var ele = $("myelement");
(ele); //Hide DOM object
What are the benefits of such a change? I think it is more object-oriented, and secondly, it is to facilitate future code prompts in IDEs.
2.1. Use the $() method
The $() method is a convenient abbreviation for using too frequently in the DOM method. Just like this DOM method, this method returns the element of the id passed in the parameter.
This is better than the method in DOM. You can pass in multiple ids as parameters and then $() returns an Array object with all the required elements. The following examples will describe these to you.
<HTML>
<HEAD>
<TITLE> Test Page </TITLE>
<script src="prototype-1.3."></script>
<script>
function test1()
{
var d = $('myDiv');
alert();
}
function test2()
{
var divs = $('myDiv','myOtherDiv');
for(i=0; i<; i++)
{
alert(divs[i].innerHTML);
}
}
</script>
</HEAD>
<BODY>
<div >
<p>This is a paragraph</p>
</div>
<div >
<p>This is another paragraph</p>
</div>
<input type="button" value=Test1 onclick="test1();"><br>
<input type="button" value=Test2 onclick="test2();"><br>
</BODY>
</HTML>
Another benefit of this method is that you can pass in the id string or the element object itself, which makes it very useful when creating methods that can pass in any form of parameters.
2.2. Use the $F() method
The $F() method is another very popular abbreviation. It can return the value of any input form control, such as a text box or a drop-down box. This method can pass in the element's id or the element itself.
<script>
function test3()
{
alert( $F('userName') );
}
</script>
<input type="text" value="Joe Doe"><br>
<input type="button" value=Test3 onclick="test3();"><br>
2.3. Use the () method
() method makes it very easy to implement the requirement that when you want to call different methods until one of them succeeds, it takes a series of methods as parameters and executes these methods one by one in order until one of them is successfully executed, returning the return value of the method that was successfully executed.
In the following example, it is good in some browsers, but it works properly in others. Using the() method we can get the return value of the method that works normally.
<script>
function getXmlNodeValue(xmlNode){
return (
function() {return ;},
function() {return ;)
);
}
</script>