JavaScript兼容性问题

JavaScript compatibility issue

本文关键字:问题 兼容性 JavaScript      更新时间:2023-09-26

我已经做了很多研究,但无法找到一个代码,使脚本兼容所有浏览器。我想这个功能在Firefox, IE, Chrome等工作,但目前,它只适用于Chrome和比Firefox版本49。非常感谢任何帮助。代码如下:

<head>
    <script type="text/javascript">
        function toggle(tag) {
            var x = document.getElementsByName(tag)[0];
            var a = x.parentNode
            if (a.style.display == 'block') {
                a.style.display = 'none'
            } else {
                a.style.display = 'block'
            }
        }

        function init() {
            //this function will add show hide functionality to paired list items,
            //as long as the answer is a list item straight after the question list item.
            //You can also have as many separate lists as you want.
            //all lists must be contained within a div with id QA
            var obj = document.getElementById('QA');
            var elements = obj.getElementsByTagName('li');
            var index = 1
            //add javascript to question elements
            //you could also add styling to question elements here
            for (var i = 0; i < elements.length; i += 2) {
                var element = elements[i];
                element.innerHTML = "<a href='javascript:toggle(" + index + ")'>" + element.innerHTML + "</a>"
                index = index + 1
            }
            //add bookmark to answer elements and add styling
            var index = 1
            for (var i = 1; i < elements.length; i += 2) {
                var element = elements[i];
                element.innerHTML = "<a name='" + index + "' id='" + index + "'></a>" + element.innerHTML
                index = index + 1
                element.style.padding = '0px 0px 10px 20px' //add indent to answer
                element.style.listStyleType = 'none' //remove bullet
                element.style.display = 'none' //hide answer element
            }
        }
        window.onload = init;
    </script>
</head>

根据你的body结构,Document.getElementsByName()可能在不同浏览器之间表现不同:

getElementsByName方法在不同的浏览器中工作方式不同。在IE &Opera, getElementsByName()方法还将返回具有指定值的id属性的元素。所以你应该小心不要使用同一个字符串作为名字和ID。