Chrome开发者工具详解

本文深入探讨了Ajax技术,包括其核心XMLHttpRequest对象和异步数据交换的步骤。同时,讲解了XPath在XML文档中的导航作用,以及HTMLDOM事件如鼠标悬停、窗口调整等触发的JavaScript执行。此外,还介绍了DOM断点调试技术,帮助开发者在元素被修改时定位代码。最后,XMLHttpRequest作为关键接口,使得JavaScript能够在不刷新页面的情况下与服务器进行通信。
摘要由CSDN通过智能技术生成

Type: 请求资源的MIME类型;
Initiator解释请求是怎么发起的,有四种可能的值:

Parser:请求是由页面的HTML解析时发送的;
Redirect:请求是由页面重定向发送的;
Script:请求是由script脚本处理发送的;
Other:请求是由其他过程发送的,比如页面里的link链接点击,在地址栏输入URL地址。

***********************************XHR*****************************
ajax是asynchronous javascript and XML的简写,中文翻译是异步的javascript和XML,这一技术能够向服务器请求额外的数据而无须卸载页面,虽然名字中包含XML,但ajax通信与数据格式无关.
        ajax包括以下几步骤:1、创建AJAX对象;2、发出HTTP请求;3、接收服务器传回的数据;4、更新网页数据

        概括起来就是,ajax通过原生的XMLHttpRequest对象发出HTTP请求,得到服务器返回的数据后,再进行处理

       ajax技术的核心是XMLHttpRequest对象(简称XHR),XHR为向服务器发送请求和解析服务器响应提供了流畅的接口,能够以异步方式从服务器取得更多信息

补充解释
[XPath]

XPath 是一门在 XML 文档中查找信息的语言。XPath 用于在 XML 文档中通过元素和属性进行导航。比如在图2中,

 
1

 
<a href="https://github.com/NUKnightLab/TimelineJS">这里</a>

这里a标签的Xpath为:/html/body/div[2]/p[1]/a,解读为:html里面body标签的第二个div标签的第一个p标签下的a标签。

[HTML DOM事件]

HTML DOM允许我们在某一事件发生时执行特定的JavaScript脚本,这里的事件可以是:

鼠标移到某元素之上;
窗口或框架被重新调整大小;
文本被选中;
用户在HTML元素上单击;
某个键盘按键被按下…
这里事件发生时执行的javascript脚本就是事件监听器。

[DOM 断点]

DOM 断点(DOM Breakpoints)可以监听某个 DOM 被修改情况,在Elements中某个元素上右键可以设置三种不同情况的断点:

子节点修改
自身属性修改
自身节点被删除
设置后 DOM Breakpoints 列表中就会出现该 DOM 断点。

一旦监听的DOM被修改时,断点就会定位到执行修改操作的代码,这对于绑定了多个事件的 DOM 调试有很大的帮助。

[XMLHttpRequest]

XMLHttpRequest是一个浏览器接口,使得Javascript可以进行HTTP(S)通信。XMLHttpRequest 对象用于在后台与服务器交换数据,这样就可以

在不重新加载页面的情况下更新网页
在页面已加载后从服务器请求数据
在页面已加载后从服务器接收数据
在后台向服务器发送数据
 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值