本教程操作环境:windows10系统、html5版、dell g3电脑。
html5怎样设置button按钮跳转页面
1、利用onclick点击事件和window.location.href属性给按钮元素添加点击事件进行跳转页面。
语法如下:
<button onclick="window.location.href=跳转地址">按钮</button>
示例如下:
<!doctype html><html lang="en"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <title>document</title></head><body><button onclick="window.location.href='https://www.baidu.com/'">按钮</button></body></html>
输出结果:
2、利用a标签将button元素包裹起来,利用a标签的href属性设置跳转地址即可。
示例如下:
<!doctype html><html lang="en"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <title>document</title></head><body><a href="https://www.baidu.com/"><button>按钮</button></a></body></html>
输出结果与上述结果相同。
推荐教程:《html视频教程》
以上就是html5怎样设置button按钮跳转页面的详细内容。
