jQuery 1.3 - Issue with Setting an Attribute Value

Question

This is my first stackoverflow question, so try to be nice. ;-D

My issue is this, I am refactoring some existing javascript code and using jQuery to do it. In several places I've come across javascript code similar to the following:

// some js code working with the customAttribute value
javascriptElementObject.customAttribue = void(0);

The javascriptElementObject is now a jQuery object and I have been attempting to use the following code to do the same thing:

// some js code working with the customAttribute value
javascriptElementObject.attr("customAttribute", void(0));

However, this does not seem to be doing anything. The following code works however:

javascriptElementObject.get(0).customAttribute = void(0);

I'm aware of jQuery's removeAttr() function, but have not used it so far because I don't know if it's equivalent to setting the attribute value to void(0).

So I guess that really means I have 2 questions:

1. Why doesn't the first jQuery version work?
2. Are .get(0).customAttribue = void(0); and .removeAttr("customAttribute); equivalent?

Thanks.

Answer 1

What are you trying to accomplish?

If the goal is to remove the value in the name/value pair, you might as well just remove the attribute entirely. I'm not aware of any intrinsic value in maintaining an attribute that has no value; in less standards-compliant browsers it may even cause a problem.

In general, the syntax of $(selector).attr(name, value) and $(selector).removeAttr(name) work very well (at least I've never seen it fail.)

If you're trying to use void(0) to keep A HREFs from firing you'd be better off using a "return false" as the click event on those A tags.

Answer 2

Uhmm, try this:

javascriptElementObject.attr("customAttribute", void(0));
var _void = javascriptElementObject.attr("customAttribute");
alert(_void);

Answer 3

jQuery likes to overload its methods so:

obj.attr( name ) //retrieves the attribute value
obj.attr( name, value ) //sets the attribute

obj.attr( name, void(0) ) == obj.attr( name, null ) == obj.attr( name ) //i.e retrieving the attribute

You might want to try the following if you want to set an empty attribute

obj.attr( name, '' )

This will also apply to other methods jQuery.html() for example

Answer 4

The only way to work with custom attributes via jQuery objects is:

obj.get(0).myCustomAttr = 'some value';

That is because jQuery's attr() method will not work with custom attributes (except while applied on a XML-document).

Note also that meouw's answer regarding jQuery overloading functions is not precisely correct, because jQuery checks for the parameters passed to it in such a manner that:

jQuery.funcname(param)

and

jQuery.funcname(param, null)

differ, becacuse null !== undefined. For example:

var params_test = function(a) {
    if (a === undefined) {
        return 'called with no parameters';
    } else {
        return 'called with one parameter: ' + a;
    }
};
params_test(); // results in 'called with no parameters'
params_test(null); // results in 'called with one parameter: null'