2

次のページがあります。

<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>

IE で [テスト] ボタンをクリックすると結果は 0 になり、FF でクリックすると結果は 0123 になります。

両方のブラウザで同じ結果を得るにはどうすればよいですか? つまり、「0123」です。

これを可能な限り単純な例に切り詰めたことに注意してください。jquery やサードパーティのライブラリは使用できません。純粋な Javasscript ソリューションが必要です。custom: タグも変更できません。

ありがとう

4

2 に答える 2

2 
<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>
于 2012-05-11T08:51:09.853 に答える
1

これを機能させるには、ページ XHTML を作成し、カスタム名前空間を定義してからgetElementsByTagNameNSを使用する必要があります。XSLTも使用できます。

于 2012-05-09T12:47:00.363 に答える