怎么给button按钮绑定超链接 跳转到相对路径

您可以使用HTML中的<a>标签来创建超链接，然后将其包含在一个按钮中。例如，以下代码将创建一个按钮，当用户单击该按钮时，将跳转到相对路径为"example.html"的页面：

<button onclick="window.location.href='example.html'">跳转</button>

这将使用JavaScript将当前窗口的URL更改为指定的相对路径，并将用户重定向到新页面。

相关问题

怎么给button按钮绑定超链接

要给 button 按钮绑定超链接，你可以使用 JavaScript 中的 window.location.replace() 方法或者 window.open() 方法来实现。

window.location.replace() 方法会将当前页面的 URL 替换成新的 URL，并加载新的页面。例如：

<button onclick="window.location.replace('http://www.example.com')">跳转到 example.com</button>

在这个例子中，当用户点击按钮时，页面会跳转到 http://www.example.com。

window.open() 方法会打开一个新的浏览器窗口或标签页来显示新的 URL。例如：

<button onclick="window.open('http://www.example.com')">在新窗口打开 example.com</button>

在这个例子中，当用户点击按钮时，会在一个新的窗口或标签页中打开 http://www.example.com。

需要注意的是，有些浏览器默认会阻止弹出窗口，如果你使用了 window.open() 方法，可能会被浏览器阻止，需要用户手动允许弹出窗口。

使用HTML+JavaScript实现创建两个按钮，分别为“京东”与“天猫”，使用Vue.js的属性绑定实现点击按钮切换为“京东”与“天猫”的超链接地址，点击链接跳转到相应页面。

在HTML中，我们可以创建两个按钮，每个按钮关联一个Vue组件的data属性，代表当前显示的超链接地址。然后利用JavaScript和Vue.js的数据绑定功能，实现按钮的点击事件处理。

首先，在HTML部分：

<div id="app">
  <button @click="switchLink('jd.com')">京东</button>
  <button @click="switchLink('tmall.com')">天猫</button>
  <a :href="currentLink" target="_blank">{{ currentLink }}</a>
</div>

接下来，在Vue实例中设置数据和方法：

new Vue({
  el: '#app',
  data: {
    currentLink: 'jd.com', // 初始链接为京东
    links: { jd: 'jd.com', tmall: 'tmall.com' } // 链接字典
  },
  methods: {
    switchLink: function (target) {
      this.currentLink = this.links[target]; // 当点击按钮时，更新currentLink
    }
  }
})

在这个例子中，当点击“京东”按钮时，`switchLink`方法会将`currentLink`指向`links`对象里的"jd.com"，同理点击“天猫”按钮会指向"tmall.com"。同时，通过`:href`属性绑定，当前的`currentLink`值会被动态应用到<a>标签上，用户点击链接时就会跳转到对应的页面。