ansaurus

Question

Using colon in html tag and handle its element in javascript

Answer 1

+1 A:

myns:button is not a valid HTML tag and browsers might interpret it differently.

Darin Dimitrov 2010-05-30 09:04:41

Do you have any solution to handle it in javascript in IE ?

Fabien Bernede 2010-05-30 09:06:28

Yes, use standard HTML tags like `<button>`. Browsers have no clue about handling undefined tags.

Darin Dimitrov 2010-05-30 09:07:00

So, how backbase js library do to work in IE ?

Fabien Bernede 2010-05-30 09:08:42

Sorry I don't know this library. What I can tell you is that you need to have valid HTML into the DOM which is constructed by the browser or the result of the rendering is undefined. Another option is to have some proprietary plugin installed that will handle non-standard tags.

Darin Dimitrov 2010-05-30 09:10:08

Answer 2

+1 A:

I'm not sure why the need for a non-standard DOM element, but if the requirement is to make a button with a different look (red text), the common HTML way would be to use a class attribute and style the button with CSS:

<style type="text/css">
    .mynsbutton {color: #ff0000;}
</style>

<input type="button" class="mynsbutton" value="My Button" />

If you then need to find all your mynsbutton-elements with javascript for some more processing, you could look into the jQuery-library, or use one of the ready snippets of code on the internet to find all elements with your mynsbutton-class.

fencliff 2010-05-30 09:44:11

Answer 3

+1 A:

Like the others I really recommend that you don't do this. But ...

If you really want to, and you're not too concerned about validation you can do:

<html xmlns:myns='http://www.example.com/namespaces'&gt;
    <head>
        <script type="text/javascript">
            window.onload = function() {
                 var tmp = document.getElementsByTagName(
                         (typeof document.body.scopeName == "undefined") ? 
                              'myns:button' : 'button');

                 for (i = 0; i < tmp.length; i++) {
                    if ((typeof tmp[i].scopeName == "undefined") || 
                            (tmp[i].scopeName == 'myns'))
                       tmp[i].style.color = '#FF0000';
                 }
            };
        </script>
    </head>
    <body>
        <myns:button>My NS Button</myns:button>
    </body>
</html>

Change http://www.example.com/namespaces for your own namespace name.

Tested in latest versions of FF, Chrome, Opera and in IE6, IE7 and IE8.

See http://msdn.microsoft.com/en-us/library/ms534388%28VS.85%29.aspx as a starting place for information about how this works in IE.

Alohci 2010-05-30 11:13:03

ansaurus

tags:

views:

answers:

Using colon in html tag and handle its element in javascript

related questions