• 0

jQuery Question


Question

I was wondering if someone could help me to understand the following code:

http://pastebin.com/mvQ9y6mZ

I need to understand how the second function is able to gain access to the numberToShow attribute of the first function. I have no clue how it does that because none of my html tags carries that attribute. I am confused. It would be greatly appreciated. Thank you.

EDIT: Nevermind. I believe I figured it out. The following line of code:

$(id).attr('numberToShow', numberToShow);

from the first function creates the attribute and then the second function or any other function can retrieve it. I figured it out because I found out that in jQuery, any attributes (including invalid attributes) can be added to elements for later use. That is actually a very handy functionality. I hope that they keep it. Thank you anyway. :)

Link to comment
Share on other sites

2 answers to this question

Recommended Posts

  • 0

The code here is somewhat deceptive because it uses JQuery's "attr" function, which by definition "[Gets or sets] the value of an attribute...". This is kind of a lie, since what it actually does is read or write a specified DOM object property (NOTE: A DOM object is how a HTML tag is represented in JavaScript), and because of how JavaScript works, you can assign anything as an "attribute" using the attr function. What happens in your code is that the first function assigns a make-believe attribute called "numberToShow" the value of the numberToShow function parameter (line 2), which then can be accessed by the second function. It's perfectly valid :).

If I wanted to, I could use the following code:

function assignFoobarAttribute(id) {
    var htmlTag = document.getElementById(id);
    htmlTag.foobar = "blah";
    readFoobar(id);
}

function readFoobar(id) {
    var htmlTag = document.getElementById(id);
    alert(htmlTag.foobar);
}

Hope that makes sense. :)

Link to comment
Share on other sites

  • 0

The code here is somewhat deceptive because it uses JQuery's "attr" function, which by definition "[Gets or sets] the value of an attribute...". This is kind of a lie, since what it actually does is read or write a specified DOM object property (NOTE: A DOM object is how a HTML tag is represented in JavaScript), and because of how JavaScript works, you can assign anything as an "attribute" using the attr function. What happens in your code is that the first function assigns a make-believe attribute called "numberToShow" the value of the numberToShow function parameter (line 2), which then can be accessed by the second function. It's perfectly valid :).

If I wanted to, I could use the following code:

function assignFoobarAttribute(id) {
    var htmlTag = document.getElementById(id);
    htmlTag.foobar = "blah";
    readFoobar(id);
}

function readFoobar(id) {
    var htmlTag = document.getElementById(id);
    alert(htmlTag.foobar);
}

Hope that makes sense. :)

Yes, that does make sense. Thank you. :)

Link to comment
Share on other sites

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.