欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

html开发中button元素与input元素的区别

程序员文章站 2022-03-06 09:37:35
一、button元素 1.type属性为button、reset、submit。 2.button元素在中的默认值不同,一定要明确指定button类型(ie中为button,其...

一、button元素

1.type属性为button、reset、submit。

2.button元素在中的默认值不同,一定要明确指定button类型(ie中为button,其他浏览器为submit)

3. 表单中使用button元素时,不同的额浏览器提交的值不一样(ie提交的是button元素之间的值,其他浏览器提交的是 button元素的value属性)

4.在button元素内部,可以放置内容,比如文本或图像。

二、input元素

1.type类型为button、submit、reset时,表单中提交的值是input元素的value属性。

2.提交表单时,尽量使用input元素。

三、使用

当类型为submit时,此时将表单的数据提交到服务器,若在此时改变form中的数据,则数据不可变。

当类型为button时,此时,仅仅是一个按钮。

在编写表单时,对每一项先进行检验,再进行提交

实例:

<form>
	<button type="submit">click</button>
	<p>webti</p>
</form>
<script type="text/javascript">
		var btn=document.getelementsbytagname('button')[0];
		var p=document.getelementsbytagname('p')[0];
		// alert(btn.type);
		btn.onclick=function (event) {

			alert(event.type);
			p.innerhtml="ccc";
			
		};
</script>

结果:点击时,此时的p的内容改变,之后就又会恢复原来的值。

不是很明白这个??