html改变button按钮位置

html改变button按钮位置,第1张

1、name : 表示按钮的名称,通常作为按钮标识进行使用。 <button name="btn">按钮</button>。

2、type : 表示按钮类型,通常与表单一起联用。reset : 重置按钮sumit : 提交按钮button : 普通按钮<button type="button">按钮</button>。

3、value : 表示按钮初始值,通常在js脚本中进行使用和修改。<button value ="点击">按钮</button>。

4、disabled :表示禁用按钮,使按钮不能点击<button disabled ="disabled">按钮</button>。

可以使用input的click事件进行处理,这里假设点击转向的链接是百度,方法如下:

1、DOM0级事件处理:

1)html代码:<input name="注册" type="button" id="btn1" title="登注册" value="注册" o nclick="goToBaiDu()"/>

2)js代码:

function goToBaiDu(){

console.log('现在去百度啦!')

window.open('http://www.baidu.com')

}

效果如下:

2、DOM2级事件,绑定click事件,如下:

1)html代码:<input name="注册" type="button" id="btn1" title="登注册" value="注册"/>

2)js代码:

window.onload = function(){

document.getElementById('btn1').addEventListener('click',goToBaiDu)

}

function goToBaiDu(){

console.log('现在去百度啦!')

window.open('http://www.baidu.com')

}

效果如下:

3、上面的方式的打开一个新窗口,还有一个打开链接的方式,是在当前标签页下直接跳转到另一个页面,代码如下:

window.location.href="http://www.baidu.com"


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/zaji/8324544.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-04-15
下一篇2023-04-15

发表评论

登录后才能评论

评论列表(0条)

    保存