JSWebAPI

作者: 5jing | 来源:发表于2019-03-24 19:10 被阅读0次
    1. 常说的JS(浏览器执行的JS)包含两部分:
    • JS基础知识(ECMA262标准)
    • JS-Web-API(W3C标准)
    2. DOM节点的attr和property有什么区别
    • property是一个JS对象的属性的修改和获取
    • attribute是对html标签属性的修改和获取
    3. 简述事件冒泡流程
    • 因为DOM是树形结构
    • 事件按照树形往上冒泡
    • 阻止冒泡,防止父级标签触发事件
    • 冒泡的应用-代理,缓解浏览器压力,不用每个标签都设置一个事件监听
    4. 手动编写一个ajax,不依赖第三方库
    /**
     * readyState状态码
     * 0 - (未初始化)还没有调用send()方法
     * 1 - (载入)已调用send()方法,正在发送请求
     * 2 - (载入完成)send()方法执行完成,已经接收到全部响应内容
     * 3 - (交互)正在解析响应内容
     * 4 - (完成)响应内容解析完成,可以在客户端调用
     *
     * status状态码
     * 2xx - 表示成功处理请求。如200
     * 3xx - 需要重定向,浏览器直接跳转
     * 4xx - 客户端请求错误,如404
     * 5xx - 服务器端错误
    */
    var xhr = new XMLHttpRequest();
    xhr.open("GET", "/api", false);
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4) {
            if (xhr.status) {
                alert(xhr.responseText)
            }
        }
    }
    xhr.send(null);
    
    5. 跨域

    浏览器有同源策略,不允许ajax访问其他域接口
    ajax跨域只与后台有关系,后台可以设置响应头告诉浏览器是同源,前台无法让浏览器取消掉同源策略这种安全措施
    跨域条件:协议、域名、端口,有一个不同就算跨域
    可以跨域的三个标签<img><link><script>
    <img src=xxx>用于打点统计,统计网站可能是其他域
    <link hre=xxxf><script src=xxx>可以使用CDN,CDN的也是其他域
    <script src=xxx>可以用于JSOP

    6. 跨域注意事项
    • 所有的跨域请求都必须经过信息提供方允许
    • 如果未经允许即可获取,那是浏览器同源策略出现漏洞
    7. JSONP实现跨域
    <script>
        window.callback = function (data) {
            // 这是跨域得到的信息
            console.log(data);
        }
    </script>
    <script src="https://www.xxx.com/apijs"></script>
    <!-- 返回callback({x:100, y:200}) -->
    
    8. 服务器端设置http header实现跨域
    • 一个解决跨域的简洁方法,需要服务器端来做
    • 服务器端读取请求头的origin属性,设置响应头access-control-allow-origin
    • 是将来解决跨域问题的一个趋势
    9. cookie,sessionStorage和localStorage的区别

    cookie本身

    相关文章

      网友评论

          本文标题:JSWebAPI

          本文链接:https://www.haomeiwen.com/subject/yfzuvqtx.html