appendChild is not a Function 10

Another day another rant. Now it is time for me ranting how bad IE DOM/COM objects and ActiveX objects integrate with JScript.

Given:

var f = document.body.appendChild;
f.call(document.body, document.createTextNode('Huh?'));

This throws an exception because DOM/COM methods are not really instance of Function. Why is this an issue you might ask? Assume we have an ActiveX object that takes variable number of arguments:

object.method(arg0, arg1, arg2, ...)

… and then we want to create a JS function that also takes variable arguments and calls the method of the ActiveX object:

function doSomething(message) {
  print(message);
  var args = Array.prototype.slice.call(arguments, 1);
  object.method.apply(object, args);
}

This is a pretty common scenario that horrendously fails for DOM/COM and ActiveX objects.

Thankfully, Aaron solved this problem in 2000

  • Steve

    Erik,

    This may be irelivant here, but if I recall correctly… the structure of appendChild is:

    appendChild( arg_0 );

    (e.g. arity == 1)

    That, coupled with the fact that appendChild is a “method” on a DOM node, this scenario is a bit whacky.

    Finally, you can’t add a text node, to {document}… if you wanted to, you could add it to say… document.getElementsByTagName(‘body’)[0]

    E.g.

    document.getElementsByTagName(‘body’)[0].appendChild(document.createTextNode(‘Huh?’));

    Now, that all said, the following code, as you mentioned, still doesn’t work. ;-)

    var f = document.getElementsByTagName(‘body’)[0].appendChild;
    alert(f); //Native Function…
    alert(f.arity); //1 (only 1 argument expected)…
    f.call( document.createTextNode(‘Huh?’) );

    Cheers,
    Steve

  • http://erik.eae.net Erik Arvidsson

    Steve: Yes, that is irrelevant… text node in document was just an example… badly chosen… It would have been better to use document.body.

    I’ll change the example.

  • http://www.nczonline.net/ Nicholas

    It has always bugged me that DOM and BOM elements don’t derive from the native JavaScript objects. Why IE chose to implement DOM methods as something other than JS functions is completely beyond me. And while we’re on the subject, why can’t DOM elements inherit from Object? Maybe someday.

  • http://erik.eae.net Erik Arvidsson

    All objects, DOM and other browser objects, inherits from Object in Mozilla.

  • http://dhtmlkitchen.com/ Garrett Smith

    In IE, no JS object properties/methods are not available on COM objects.

    valueOf, hasOwnProperty, et c. Not avaliable.

    Interestingly, toString is available.

    What is even more interesting: acts like a “DontEnum” property, so for(prop in node) , “toString” won’t be exposed.

    IE doesn’t actually implement the internal “DontEnum” property correctly (at least in my interpretation of the ECMAScript Spec.

    so

    Carp = {
    “toString” : function(){ return “Carp, carp, carp”; }
    }

    for(var prop in Carp)
    alert(Carp[prop]);
    }

    IE thinks that the “toString” defined in Carp has a DontEnum property on it, and this is what I think is incorrect. I think IE is iterating through a list of strings (“toString”, “valueOf”) and skips any prop that matches the string.

  • http://dhtmlkitchen.com/ Garrett Smith

    alert(document.body.toString())

    I’m still trying to find a practical use for IE’s implementation of toString on COM’s…

  • http://erik.eae.net Erik Arvidsson

    A couple of hours ago I went through the painful process o filing exactly this bug to MSFT. The problem as I see it is that they do not check the DontEnum flag on the right object (if any proto has it, the property is not enumerated). The same problem occurs if you create a new String and changes replace for example

  • http://splintor.wordpress.com splintor

    “it looks like native methods don’t get listed when enumerating the members of an object”
    from http://blog.monstuff.com/archives/000287.html

  • http://www.tercumesiteleri.com ingilizce tercume

    I’m still trying to find a practical use for IE’s implementation of toString on COM’s…

  • http://www.prestijtercume.com çeviri

    All objects, DOM and other browser objects, inherits from Object in Mozilla…