Home/ Questions/Q 7918567
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-03T15:33:12+00:00

I have the following page: <html> <head> <title>Test</title> <script type=text/javascript> function BuildTree() { var

  • 0

I have the following page:

<html>
<head>
    <title>Test</title>
    <script type="text/javascript">
        function BuildTree() {
            var total = 0;
            var pages = document.getElementsByTagName('custom:page');
            var questions = pages[0].getElementsByTagName('custom:question');
            for (var i = 0; i < questions.length; ++i) {
                var question = questions[i];
                var val = question.getAttribute('value')
                total += val;
            }
            alert("Total: " + total);
        };
    </script>
</head>
<body>
    <custom:pages>
        <custom:page>
            <custom:question  value="1">aaa</custom:question>
            <custom:question  value="2">bbb</custom:question>
            <custom:question  value="3">ccc</custom:question>
        </custom:page>
        <custom:page>
            <custom:question  value="1">aaa</custom:question>
            <custom:question  value="2">bbb</custom:question>
            <custom:question  value="3">ccc</custom:question>
        </custom:page>
    </custom:pages>
    <input id="btnTest" type="button" value="Test" onclick="BuildTree();" />
</body>
</html>

When I click the Test button in IE the result is 0, when I click it in FF the result is 0123.

How can I get the same result in both browsers? i.e. ‘0123’.

Note that I’ve trimmed this down to as simple an example as possible. I cannot use jquery or any third party libraries, I need a pure Javasscript solution. I also cannot change the custom: tags.

Thanks

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team
    <html xmlns:custom="http://www.test.com">
<head>
    <title>Test</title>
    <script type="text/javascript">
        // We want to find all the question tags withing a page tag
        // getElementsByTagName works fine when using standard HTML tags within each other
        function BuildTree() {
            var total = 0;
            // These two do not work in IE but do work in FF
            //var pages = document.getElementsByTagName('custom:page');
            //var questions = pages[0].getElementsByTagName('custom:question');

            // These only work in FireFox (and require a namespace)
            //var pages = document.getElementsByTagNameNS('http://www.test.com', 'page'); // FF only
            //var questions = pages[0].getElementsByTagNameNS('http://www.test.com', 'question'); // FF only

            // Adding a namespace ' xmlns:custom="http://www.test.com"' to the document and removing the 'custom:' from the search works correctly
            var pages = document.getElementsByTagName('page');
            var questions = pages[0].getElementsByTagName('question');

            for (var i = 0; i < questions.length; ++i) {
                var question = questions[i];
                var val = question.getAttribute('value')
                total += val;
            }
            alert("Total: " + total);
        };
    </script>
</head>
<body>
    <custom:pages>
        <custom:page>
            <custom:question value="1">aaa</custom:question>
            <custom:question value="2">bbb</custom:question>
            <custom:question value="3">ccc</custom:question>
        </custom:page>
        <custom:page>
            <custom:question value="1">aaa</custom:question>
            <custom:question value="2">bbb</custom:question>
            <custom:question value="3">ccc</custom:question>
        </custom:page>
    </custom:pages>
    <input id="btnTest" type="button" value="Test" onclick="BuildTree();" />
</body>
</html>
    • 0