小码哥的IT人生

HTML <output> 标签 详解

HTML基础 2022-06-02 09:42:13小码哥的IT人生shichen

HTML <output> 标签

实例

执行计算然后在 <output> 元素中显示结果:

<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
   <input type="range" id="a" value="50">100
   +<input type="number" id="b" value="50">
   =<output name="x" for="a b"></output>
</form> 

 

完整实例【亲自试一试】:

<!DOCTYPE html>
<html>
<body>
<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
<input type="range" id="a" value="50">100
+<input type="number" id="b" value="50">
=<output name="x" for="a b"></output>
</form>
<p><b>注释:</b>Internet Explorer 不支持 <output> 标签。</p>
</body>
</html>

可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html

浏览器支持

元素 Chrome IE Firefox Safari Opera
<output> 10.0 13.0 4.0 5.1 11.0

Firefox, Chrome, Safari 以及 Opera 支持 <output> 标签。

注释:Internet Explorer 8 以及更早的版本不支持 <output> 标签。

定义和用法

<output> 标签定义不同类型的输出,比如脚本的输出。

HTML 4.01 与 HTML 5 之间的差异

<output> 标签是 HTML 5 中的新标签。

属性

new : HTML5 中的新属性。

属性 描述
for element_id 定义输出域相关的一个或多个元素。
form form_id 定义输入字段所属的一个或多个表单。
name name 定义对象的唯一名称。(表单提交时使用)

全局属性

<output> 标签支持 HTML 中的全局属性

事件属性

<output> 标签支持 HTML 中的事件属性

版权所有 © 小码哥的IT人生
Copyright © phpcodeweb All Rights Reserved
ICP备案号:苏ICP备17019232号-2  

苏公网安备 32030202000762号

© 2021-2024