dvpf=pc&keyword=Plzbefat"target="_blank">点击我</a>a标签自带部分样式,点击过后会有颜色差target参数详解:_self:新网页在当前的页面打开,不填参数则就是当前页面打开。_parent:没有iframe的话在当前的页面打开。什么时候用a标签什么时候用window.open?dvpf=pc&keyword=Plzbefat"target="_blank">头条@Plzbefat</a>看看颜色和下划线
window.open()
<button >点击我</button><script>document.getElementById("go").addEventListener("click", () => {openUrl("http://so.toutiao.com/search?dvpf=pc&keyword=Plzbefat");});function openUrl(url) {window.open(url);}</script>
a标签
<a href="http://so.toutiao.com/search?dvpf=pc&keyword=Plzbefat" target="_blank">点击我</a>
a 标签自带部分样式 , 点击过后会有颜色差
target参数详解:
- _self: 新网页在当前的页面打开,不填参数则就是当前页面打开。
- _blank: 新网页在新窗口打开。
- _parent: 没有iframe的话在当前的页面打开。
- _top: 没有iframe的话 在当前的页面打开。
什么时候用a标签什么时候用window.open?
一般使用a标签是不需要带上js逻辑的 , 这样使用起来简单明了 , 其余情况就使用 window.open() 就可以啦.
但是目前大多数使用 a 标签的时候 , 都觉得它原有的样式太丑 , 所以覆盖样式也是基本操作 .
css 对a标签的样式覆盖:
<style>/* 未点击过链接*/a:link {color: red;}/* 已经点击过链接 */a:visited {color: green;}/* 鼠标移动到a标签上方 */a:hover {color: hotpink;}/* 按住不放链接的时候 */a:active {color: blue;}/* a标签的下划线 */a {text-decoration: none;}</style><a href="http://so.toutiao.com/search?dvpf=pc&keyword=Plzbefat" target="_blank">头条@Plzbefat</a>
看看颜色和下划线