```html
html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Documenttitle>
<style>
.btn{
width: 100px;
height: 30px;
}
style>
head>
<body>
<button class="btn">button>
<script>
// location.assign = 'https://blog.csdn.net/'
// console.log(location);
// console.log(location.href);
// console.log(location.host);
// console.log(location.search);
// console.log(location.hash);
// console.log(location);
document.querySelector('.btn').onclick = () => {
location.href = 'https://blog.csdn.net/'
console.log(location.href);
}
script>
body>
html>
```
location.href 属性，是设置或返回当前显示的文档的完整 URL。
如果要返回或打印当前页面的URL，要将 console.log(location.href) 放在前面一行。
预览时，断点打在 location.href = 'https://blog.csdn.net/' 行上；
否则跳转到新页面后， console 控制页面输出的是新的内容，会覆盖 当前页面的 输出。
document.querySelector('.btn').onclick = () => {
// 打印当前文档的URL
console.log(location.href);
// 设置新的URL（并跳转）
location.href = 'https://blog.csdn.net/'
}
因为location.href;回直接在当前页面打开URL页面，所以会丢失原来的定义
直接跳转了
location.href，你使用的时候，js运行到这一步，就已经着手让浏览器启动跳转机制了，也就是重新跳转，你的打印不是报错，你仔细看会发现，js是可以运行到 打印的地方的，但是打印出来的内容 并不是你后面触发的这个地址，而是你这个 html 所在的实际位置（如果是本地打开的html那就是你这个文件在你电脑上的路径）。但是它会被很快的更新掉，因为你已经让他执行了重新加载新的 url 命令。
是你跳转的页面有问题，你换个链接地址，会发现不报错了