Question

以下代码在chrome，Firefox和Edge中运行良好。但是当我在html中尝试相同的代码时，我得到以下错误。

SCRIPT5009：＆＃39; ddlTest＆＃39;未定义

<select id="ddlTest">
    <option>1</option>
    <option>2</option>
    <option>3</option>
</select>

<script>

    function testFunc() {
        var y = (ddlTest).value;
        alert(y);
    }

</script>

有没有办法在IE中解决这个问题，除了：

的document.getElementById（＆＃39; ddlTest＆＃39）。值

Answer 1

在HTML5中添加了window上用于按ID访问元素的属性的功能。

HTML5标准specifies，窗口对象必须具有属性 key ，其值为 elem 如果...


只有一个DOM元素 elem ，其属性id的值为 key 。

只有一个DOM元素 elem ，其属性名称的值为 key 。 elem 的标签必须是以下之一：a，applet，area，embed，form，frame，frameset，iframe，img，object。


〜 http://2ality.com/2012/08/ids-are-global.html

但是，您应该不在实际代码中使用此功能 - 请改为使用document.getElementByID('elem')：

作为一般规则，依赖于此将导致代码脆弱。例如，随着新功能添加到Web平台，哪些ID最终映射到此API可能会随着时间的推移而变化。而不是使用document.getElementById()或document.querySelector()。

〜 https://html.spec.whatwg.org/#named-access-on-the-window-object

Answer 2

不，唯一的方法是通过文档获取元素：

function testFunc() {
    var ddlTest = document.getElementById('ddlTest');
    var y = ddlTest && ddlTest.value;
    alert(y);
}

Javascript函数在IE中没有按预期工作

2 个答案: