Question

我一直在学习HTML5。我遇到过的一个例子是使用了range类型的输入元素和一个输出元素（这个例子目前只适用于Chrome，Safari和Opera）。下面的表单生成一个滑块，结果回显到输出元素。

<form>
   <p>
      <input type="range" id="slideValue" value="50" 
          oninput="slideCurrent.value = parseInt (slideValue.value);" />
      <output id="slideCurrent">50</output>
   </p>
   <input type="submit" value="Send">
</form>

我的问题涉及oninput属性。 oninput属性包含JavaScript。在HTML5之前的JavaScript中，我经常会看到对 this.value 的JavaScript引用。但是，在上面的HTML5示例中，对 slideCurrent 和 slideValue 的引用有效（显然，无需使用 getElementById ）。我相信这是JavaScript表现的一种新方式。

这种新的JavaScript操作方法是否记录在某处？

Answer 1

这是IE引入的一种方法，元素的名称和id是全局范围内的引用。其他浏览器已复制它，但它被认为是不好用。 Mozilla发出警告：

在全局范围内由ID / NAME引用的元素。使用WC3标准 document.getElementById（）代替......

google搜索时可以找到很多线程。可以找到一篇好文章here。在事件处理程序中，您可以使用this 作为元素的引用，但输出元素应该被标准的dom方法所取代。

编辑：哦，狗屎，是的，它在规范中：http://www.whatwg.org/specs/web-apps/current-work/#dom-window-nameditem。但是有一个大红色警报：

这可能会改变。浏览器供应商正在考虑将此行为限制为怪异模式。 Read more...

另请参阅Mozilla错误303420和602381

Answer 2

内联事件处理程序中的代码作用于元素，就像它位于with块中一样。
因此，您可以将元素的属性用作全局变量。

这是一个鲜为人知的dangerous功能，对HTML5来说并不陌生。

HTML5 oninput属性中的JavaScript操作？

2 个答案: