Builtin object prototypes

[Ari Krupnik]

scripts can add methods to the prototypes of builtin objects in
JaavScript. I can assign functions to String.prototype.*, for
instance. I want to add a method to Node, but when I try to execute
the following IE says "'Node' is undefined." Mozilla works as I
expected it to. Is Node called something else in IE? Does IE not allow
manipulating the prototypes of some builtin objects?

Node.prototype.nt = function() {
return this.nodeType;
}

Ari.

 

[VK]

scripts can add methods to the prototypes of builtin objects in
JaavScript. I can assign functions to String.prototype.*, for
instance. I want to add a method to Node, but when I try to execute
the following IE says "'Node' is undefined." Mozilla works as I
expected it to.

Well, actually Mozilla works in - maybe convenient in some
circumstances - but non-expected way.
prototype is property of a JavaScript object; DOM Node is not a
JavaScript object and it has nothing to do with say Object()
constructor (same way as say DIV element has nothing to do with Array
;-)

IE exposes the base [element] interface via behavior mechanics. This
way you can make say each <p> element to have AJAX interface or each
<div> acting as media player. But in case of Node I really don't know
what to suggest as it is not an element in (X)HTML / XML sense, it is
unit one level below. Are you trying to uniformly augment every single
element on your page? What is your actual aim? (so maybe some solution
is possible).

 

[RobG]

scripts can add methods to the prototypes of builtin objects in
JaavScript. I can assign functions to String.prototype.*, for
instance. I want to add a method to Node, but when I try to execute
the following IE says "'Node' is undefined." Mozilla works as I
expected it to. Is Node called something else in IE? Does IE not allow
manipulating the prototypes of some builtin objects?

Node.prototype.nt = function() {
return this.nodeType;
}

There is a base object for the DOM that implements the Node interface,
in Gecko browsers it's called "Node" and you can mess with the
prototype.

IE doesn't have a Node object, though you can extend DOM objects to
some extend using behaviours:

<URL:
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/behaviors/howto/creating.asp

 

[Richard Cornford]

scripts can add methods to the prototypes of builtin objects in
JaavScript. I can assign functions to String.prototype.*, for
instance. I want to add a method to Node, but when I try to execute
the following IE says "'Node' is undefined." Mozilla works as I
expected it to. Is Node called something else in IE? Does IE not allow
manipulating the prototypes of some builtin objects?

The Node is not a "built in object", it is a "host object" (or at least,
all objects implementing the Node interface in browser DOMs are host
objects), and host objects are not required to facilitate modification
of their prototypes, expose prototypes (even have prototypes) or expose
constructors.

As a result some hosts may provide those facilities (as Mozilla does)
and others may not (like IE). Both alternatives (and everything in
between) are completely in accordance with the javascript language
specification, and no other specifications (such as the W3C DOM, and its
ECMAScript bindings) has attempted to apply any additional constraints
on host objects in the web browser context.

Richard.

 

[Ari Krupnik]

Well, actually Mozilla works in - maybe convenient in some
circumstances - but non-expected way.

I said "the way I expected it to," being fully aware that my
expectation may not be grounded in any reality :=)

Are you trying to uniformly augment every single
element on your page? What is your actual aim? (so maybe some solution
is possible).

I have a bunch of functions that provide XPath-style navigation of the
DOM. Functions like followingSibling(node, predicate) that find the
closest sibling in document order for which the function 'predicate'
returns true. Also functions like textValue(node) that concatenates
all character data within a node. Most of these are not specific to
Element, e.g. textValue() of TextNode is its nodeValue. I wanted to
make these functions methods of Node so I could call them as
node.textValue() instead of textValue(node).

It's not that big of a deal. Thanks for explaining the difference
between String and Node to me. I had not internalized the difference
between builtin types and host objects.

Ari.

 

[RobG]

David Golightly wrote:
[...]

No, what you're looking to do isn't possible directly, but you could
write wrappers that would give you the interface you're looking for.
See for instance jQuery, which is basically a wrapper framework; also,
if you want to use XPath you can use XPath directly - though IE doesn't
expose XPath for HTML documents, there's an LGPL implementation:

http://js-xpath.sourceforge.net/

which tricks IE into thinking the currently loaded HTML document is an
MSXML-loaded document. And Firefox allows XPath natively with HTML.
(Unfortunately there's no easy solution for Safari and Opera.)

The WebKit open source project started releasing XPath support in Aug
06[1], it should be picked up by Safari with OS X 10.5.

That puts Safari more-or-less on par with IE in terms of XPath support,
but unfortunately keeps XPath as practically useless on the web for
another couple of years.

It should start to to be viable for intranet or specialist web
applications though.

1. <URL: http://webkit.org/blog/?p=65 >

 

[Ari Krupnik]

if you want to use XPath you can use XPath directly - though IE doesn't
expose XPath for HTML documents, there's an LGPL implementation:

http://js-xpath.sourceforge.net/

which tricks IE into thinking the currently loaded HTML document is an
MSXML-loaded document.

How does it do that? When I need to run an XSLT transformation on an
HTML document in IE, I walk the HTML DOM and construct an X(HT)ML DOM
based on it that IE can transform natively. Are you saying there is a
way to make IE believe that an MSHTML document is an MSXML document
with corresponding methods on its nodes, without copying it over?

Ari.

 

[Ari Krupnik]

On looking into it a little further, it appears that Opera, much like
IE, has XPath support, but only for XML documents and not HTML. Unlike
IE, fortunately, it's W3DOM compliant.

Could you explain the difference, and how being compliant is
unfortunate? I have no experience with client-side XSLT outside of IE
and FF.

However, for those with huge Ajax apps who don't mind the bandwidth
loss in exchange for the flexibility of XPath, Google's got an
XSLT/XPath implementation entirely in JavaScript which works in all
modern browsers and will if nothing else prove an interesting study:
http://code.google.com/p/ajaxslt/

I thought the way ajaxslt is implemented in browsers without native
XSLT support was by sending a serialized document to a server,
parsing and transforming it there, then serializing it again, sending
it back and parsing it again on the client. Was I wrong? That sounds a
bit complicated for finding the character data content of a node,
which is the type of processing that I need :=)

Ari.

 

[RobG]

Could you explain the difference, and how being compliant is
unfortunate?

You misunderstood: David is saying that that Opera's compliance is
fortunate (i.e. a good thing).

 

[VK]

I have a bunch of functions that provide XPath-style navigation of the
DOM. Functions like followingSibling(node, predicate) that find the
closest sibling in document order for which the function 'predicate'
returns true. Also functions like textValue(node) that concatenates
all character data within a node. Most of these are not specific to
Element, e.g. textValue() of TextNode is its nodeValue. I wanted to
make these functions methods of Node so I could call them as
node.textValue() instead of textValue(node).

It's not that big of a deal. Thanks for explaining the difference
between String and Node to me.

You are welcome

In relevance to your original question you may indeed go for behavior
(please note that in this case US English spelling is implied because
it's the personal method name, not just a dictionary entry). As it's an
early mosning and I'm going to sleep now, I grapped the first .htc file
I found on my disk, just to explain the concept. By Murphy law it
happened to be the ugliest ill-formed crap from tmp dumps But it
seems working for IE up to level to show what do I mean.

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<style type="text/css">
body * {
behavior: url(hover.htc);
}
</style>
</head>
<body>
<p>P</p>
<address>ADDRESS</address>
<div>DIV</div>
</body>
</html

Where hover.htc is:

<PUBLIC:ATTACH EVENT="onmouseover" ONEVENT="Hilite()" />
<PUBLIC:ATTACH EVENT="onmouseout" ONEVENT="Restore()" />
<SCRIPT LANGUAGE="JScript">
function Hilite() {
if (event.srcElement == element) {
innerHTML = "Mouse is OVER me";
}
}

function Restore() {
if (event.srcElement == element) {
innerHTML = "Mouse is OUT of me";
}
}
</SCRIPT>

Now each and every HTML element on your page became mouse listener by
default (hover to see it).

 

[Ari Krupnik]

You misunderstood: David is saying that that Opera's compliance is
fortunate (i.e. a good thing).

So I did. Thank you for pointing this out. The way I read it made no
sense.

Ari.

 

[VK]

In relevance to your original question you may indeed go for behavior

All method names are abstract tokens. Having hard feelings about this
country or that dominating the development effort is hilarious. Hard
feelings about a particular dialect of English dominating the effort
is even more hilarious. English is not my first language and my WHOIS
information needs updating - I no longer live in Edinburgh.

Gosh... :-0 All I meant to say is that this Microsoft
technologies is called "behavior" (not "behaviour") so you may have
hard time googling for "Microsoft behaviours" and attaching
behaviour:url(something.htc) will not work. So I just pointed to the
*required* spelling (without discussing is it correct one or not for a
particular country).

Behaviors seem like an interesting concept. Over on the xml-dev
mailing list there was some discussion about CSS and XML and how it
never took off because there was no way to do HREF-style links in
XML+CSS and how behaviors could have solved the problem.

Yes, I know. This problem is successfully solved for a long time
already for any UA supporting behaviors (IE) or bindings (Firefox,
Netscape 8, Camino). If you are interested I can post the code (it's a
few liner).

But I think
for what I'm doing I'll just stick with stand-alone
functions. Bifurcating the code and introducing non-standard
mechanisms sounds like it will create more problems than it would
solve.
ACK

Thanks for the advice and the examples. I certainly have a better
understanding of the issues now.

You are welcome.

 

[Ari Krupnik]

In relevance to your original question you may indeed go for behavior
(please note that in this case US English spelling is implied because
it's the personal method name, not just a dictionary entry).

All method names are abstract tokens. Having hard feelings about this
country or that dominating the development effort is hilarious. Hard
feelings about a particular dialect of English dominating the effort
is even more hilarious. English is not my first language and my WHOIS
information needs updating - I no longer live in Edinburgh.

As it's an early mosning and I'm going to sleep now, I grapped the
first .htc file I found on my disk, just to explain the concept.

Now each and every HTML element on your page became mouse listener by
default (hover to see it).

Behaviors seem like an interesting concept. Over on the xml-dev
mailing list there was some discussion about CSS and XML and how it
never took off because there was no way to do HREF-style links in
XML+CSS and how behaviors could have solved the problem. But I think
for what I'm doing I'll just stick with stand-alone
functions. Bifurcating the code and introducing non-standard
mechanisms sounds like it will create more problems than it would
solve.

Thanks for the advice and the examples. I certainly have a better
understanding of the issues now.

Ari.

 

[VK]

I'd be curious to see the solution for FF. The feeling on xml-dev was
that there wasn't much one could do without modifying the browsers, as
there is no standard way to attach a script to an XML file (in the way
that the xml-stylesheet processing instruction can attach a CSS
stylesheet to a document).

I'm not sure I understood the nature of these difficulties... Rather
than spend time on explanations I better post our solution here (but
only after my lunch and you tell me if it works for you or not.

 

[Ari Krupnik]

Yes, I know. This problem is successfully solved for a long time
already for any UA supporting behaviors (IE) or bindings (Firefox,
Netscape 8, Camino). If you are interested I can post the code (it's a
few liner).

I'd be curious to see the solution for FF. The feeling on xml-dev was
that there wasn't much one could do without modifying the browsers, as
there is no standard way to attach a script to an XML file (in the way
that the xml-stylesheet processing instruction can attach a CSS
stylesheet to a document).

Ari.

 

[VK]

Behaviors seem like an interesting concept. Over on the xml-dev

I'd be curious to see the solution for FF. The feeling on xml-dev was
that there wasn't much one could do without modifying the browsers, as
there is no standard way to attach a script to an XML file (in the way
that the xml-stylesheet processing instruction can attach a CSS
stylesheet to a document).

OK, here we go: just a word of preface.
XML is *pure data*, so the only things one attaches to it are external
and internal DTD plus XSL transformation template. Only after being
parsed/transformed it becomes a *perceptually available data*.
Respectively in XML you don't have any links at all: you have abstract
data nodes which can become links, text, SVG drawing, aural narration
and anything else depending on the nature of the used transformation.
This way XML doesn't have the concept of Document with big letter "D"
like say HTML/XHTML do. What you see on your screen is a momentary
interpretation of given data transformed in the given way. I'm putting
this preface because from my observations many developers are still
mixing XHTML and XML so trying to squeeze more presentational data
(other than XSL template) into XML so make it more "cozy" and more
similar to the data/layout/styling cocktail they used to in (X)HTML.
To avoid any misunderstanding: I do *not* mean anyone personally,
especially you. But in case anyone else will read this thread: there
cannot be questions like "but how to format my links in XML itself".
You cannot format links in XML, because there are not any "links" in
there.

OK, enough of blah-blah...

<http://jsnet.sourceforge.net/tmp/bx2/index.xml> demonstrates (one of
possibilities of) how to output links (Check on IE, Firefox, Camino,
Netscape 8)
As a personal gift I also added Zebra behavior to paint even/odd
rows differently.

<http://jsnet.sourceforge.net/tmp/bx2/demo.zip> archive contains all
involved files.

 

[Ari Krupnik]

OK, here we go: just a word of preface.
<http://jsnet.sourceforge.net/tmp/bx2/index.xml> demonstrates (one of
possibilities of) how to output links (Check on IE, Firefox, Camino,
Netscape 8)

Right! Thanks. I didn't know about Mozilla bindings. I understand what
you were talking about now. I'll be reading more about that. Pity it's
not portable.

As a personal gift I also added Zebra behavior to paint even/odd
rows differently.

Thanks. As a personal gift :=) here's the zebra in XSLT:

<xsl:for-each select="bx2/item">
<xsl:sort select="name"/>
<tr>
<xsl:if test="count(preceding-sibling::item) mod 2">
<xsl:attribute name="class">even</xsl:attribute>
<!-- alternatively, use a style attribute -->

XML is *pure data*, so the only things one attaches to it are external
and internal DTD plus XSL transformation template.

You can attach a CSS stylesheet in the same way[1]:
<?xml-stylesheet type="text/css" href="style.css"?>
I guess that means you can attach behaviors and bindings in the same
way.


Ari.

[1] http://www.w3.org/TR/xml-stylesheet/

 

[VK]

OK, here we go: just a word of preface.

Right! Thanks. I didn't know about Mozilla bindings. I understand what
you were talking about now. I'll be reading more about that. Pity it's
not portable.

That's an evangelistic question of what is a "portable" solution. The
proposed way currently covers 95%-97% of potential visitors so for me
it is as much portable as something can be for an open Web solution.
But of course it can be other numbers to calculate the portability (1%,
no one potential user at all) and then it is not portable of course.

As a personal gift :=) here's the zebra in XSLT:

<xsl:for-each select="bx2/item">
<xsl:sort select="name"/>
<tr>
<xsl:if test="count(preceding-sibling::item) mod 2">
<xsl:attribute name="class">even</xsl:attribute>
<!-- alternatively, use a style attribute -->
</xsl:if>

Hey, thanks I personally prefer to have XSL structuring data and
CSS taking care of presentation: I feel better when everyone does the
job it was made for But your code definitely goes to my piggy-bank.


P.S. As you may notice the table caption in Firefox is shifted to the
right a bit. It is the unfamous "Caption Jog" bug:
<https://bugzilla.mozilla.org/show_bug.cgi?id=333643>

It is cured by negative margins but negative margin in caption nukes
Opera display: thus normally it is another binding to fix the caption
position for Firefox only. I didn't put it into here so do not make the
demo any more complicated as needed.

Also if you wondering if bindings can solve another famous problem of
long URL messing the page layout on Gecko engines: yes they can in any
requested way from trimming overflow part and up to an IE's-like
ellipsis emulation. This way I'm getting a bit sadistic pleasure of
reading the relevant complains in ciwas and ciwah. I'm not posting
though as I believe that the "laziness of mind" has to be punished
Yes, I'm bad, I know...

 

[Ari Krupnik]

That's an evangelistic question of what is a "portable" solution.

What I meant by 'portable' was that you need different mechanisms,
different files and different code in different browsers - one for IE,
one for FF, and a graceful degradation from others.

Hey, thanks I personally prefer to have XSL structuring data and
CSS taking care of presentation

I can relate to that sentiment. Using 'class' instead of 'style' may
not go far enough for some. The benefit is that this requires no
proprietary mechanisms and relies only on W3C-standard machinery. This
is sort of going off-topic here, because it's a solution that doesn't
involve JavaScript :=)

Also, you can use test="position() mod 2" which is shorter and looks
more intuitive, but the semantics may surprise you. Position()
includes all nodes in the context, including whitespace nodes--if you
haven't stripped them--as well as comments and processing
instructions--if the parser reports them to the processor. It is
equivalent to count(preceding-sibling::node()).

Ari.