JavaScript对象

h0cksr

发布于 2023-05-17 09:24:52

54100

代码可运行

文章被收录于专栏：h0cksr的小屋h0cksr的小屋

运行总次数：0

代码可运行

JavaScript对象

Documetn

Document

Document 接口表示任何在浏览器中载入的网页，并作为网页内容的入口，也就是DOM 树。DOM 树包含了像 <body> 、<table> 这样的元素，以及大量其他元素。它向网页文档本身提供了全局操作功能，能解决如何获取页面的 URL ，如何在文档中创建一个新的元素这样的问题。

Document 接口描述了任何类型的文档的通用属性与方法。根据不同的文档类型（例如HTML、XML、SVG，...），还能使用更多 API：使用 "text/html" 作为内容类型（content type）的 HTML 文档，还实现了 HTMLDocument 接口，而 XML 和 SVG 文档则（额外）实现了 XMLDocument 接口。
构造器

Document()
    创建一个新的 Document 对象。

Location对象

Location对象的属性返回值 location.href 获取或者设置url location.search 返回参数 location.host 返回主机(域名) location.port 返回端口号，若无则返回空 location.pathname 返回路径 location.hash 返回片段#后面内容常见于链接锚点

Location对象常见方法

对象方法返回值 location.assign() 跟href 一样，可以跳转页面(也称为重定向页面) location.replace() 替换当前页面，因为不记录历史，所以不能后退页面 location.reload() 重新加载页面，相当于刷新按钮或者f5 如果参数为true强制刷新ctrl+f5

history对象

history对象方法作用 history.back() 相当于页面的后退 history.forward() 页面前进 history.go(args) 前进后退功能参数如果是1前进1个页面如果是-1后退1个页面

高级事件

监听事件

<!--给第一个button按钮注册一个alert(1)的弹窗事件后跳转-->
<>
<script>
    var buttons = document.querySelectorAll('button');
    btns[0].addEventListener('click', function() {
        alert(1);
        location.replace('/next.html');
    })
</script>