javaScript中a链接和window跳转的两种方式介绍

a链接

HTML a 元素(或称锚元素)可以通过它的 href 属性创建通向其他网页、文件、同一页面内的位置、电子邮件地址或任何其他 URL 的超链接。

常用属性

  • href
    href是a链接必写的属性,存放a链接跳转地址,该地址可以是完整的url地址,也可以是相对项目中相对路径,也可以是‘#top’当作锚点使用
<a href="https://vitejs.dev">
    </a>
  • target
    该属性指定在何处显示链接的资源。默认当前页面加载资源。以下是关键字具有特殊的意义:
    • _self: 当前页面加载,即当前的响应到同一 HTML 4 frame(或 HTML5 浏览上下文)。此值是默认的,如果没有指定属性的话。
    • _blank: 新窗口打开,即到一个新的未命名的 HTML4 窗口或 HTML5 浏览器上下文
    • _parent: 加载响应到当前框架的 HTML4 父框架或当前的 HTML5 浏览上下文的父浏览上下文。如果没有 parent 框架或者浏览上下文,此选项的行为方式与 _self 相同。
    • _top: IHTML4 中:加载的响应成完整的,原来的窗口,取消所有其它 frame。 HTML5 中:加载响应进入顶层浏览上下文(即,浏览上下文,它是当前的一个的祖先,并且没有 parent)。如果没有 parent 框架或者浏览上下文,此选项的行为方式相同_self
<a href="https://vitejs.dev" target="_blank">
    </a>
  • download
    这个属性下载时候用,有值时会被当做文件名使用。
<a href="https://vitejs.dev" target="_blank" download="文件名">
      <img src="/vite.svg" class="logo" alt="Vite logo" />
    </a>

window跳转

winodw对象是代表当前整个窗口的顶级对象,可以直接使用它里面的一些属性来改变当前窗口的一些信息。例如使用window.location来改变当前窗口的url信息。

let href = `https://www.baidu.com/`
      window.location.href = href
      //不带href也行
      window.location = href
  • window.open()
    window的open方法可以打一个新的窗口,和a链接打开新页面效果类似。第二个参数为__blank时是每次执行都打开一个新窗口。
window.open('https://www.baidu.com/','__blank')

总结

  1. a链接在html或者其他模板语法使用时比较方便。
  2. winodw对象在javaScript里使用比较方便。
  3. 当url是一个可下载资源时,两个都可以使用该url进行下载。

你可能感兴趣的:(javascript,前端,开发语言)