<HeadFirst_HTML5> O'REILLY_Chap.6_与Web交流

关注

原创最新推荐文章于 2026-11-07 10:43:05 发布 636 阅读 AI 写同款· GEO 优化 ›

CSS 弹性盒布局：flex-wrap 换行与多行交叉轴对齐默认情况下，弹性容器（flex container）会把所有子项（flex item）挤在一行里，哪怕空间不够也只会压缩子项，而不会换行。浏览器会依次把子项放进当前行，当剩余空间不足以容纳下一个子项的基础尺寸时，就开启新的一行。一旦允许换行，容器里就会出现多条「弹性行（flex line）」，此时交叉轴对齐的行为也会从「单行对齐」变成「多行对齐」，是默认值：当子项没有设置固定高度时，行会被拉伸，子项随之变高，看起来像是「撑满了容器」。上面这段代码中，每个子项固定 200px 宽，容器宽度决定每行能放几个。阅读详情

<HeadFirst_HTML5> O’REILLY_Chap.6_与Web交流

本博客的FollowMeReading系列初衷是在线的读书笔记. 为方便后期查阅, 故写成博客形式, 使用关键字查询便可以快读的找到相关的内容.

FollowMeReading系列所选的书籍一般选自O’REILLY或Apress出版社, 尽量保证笔记内容的权威性.

FollowMeReading系列的博客标题格式为: <书名> 出版社章节数章节名, 方便大家在纸质版书籍中查找.

FollowMeReading系列博文中的内容大部分是原文, 非原文部分前面将有’博主’字样提醒.

感谢<HeadFirst_HTML5>作者 Eric Freeman & Elisabeth Robson
感谢<HeadFirst_HTML5>翻译林琪张伶

正文

原文

BULLTE POINTS(要点):

除了提供HTML和JavaScript的服务器外, XMLHttpRequest 不允许从其他不同服务器请求数据. 这是一个浏览器安全策略, 专门设计用来避免恶意的JavaScript访问你的Web页面和用户的cookie.
要访问Web服务托管的数据, 除了 XMLHttpRequest , 另一种候选方法是 JSNOP.
如果HTML和JavaScript与数据在同一个机器上, 就使用 XMLHttpRequest.
如果需要访问有远程服务器上一个Web服务托管的数据(假设这个Web服务支持JSNOP), 则要使用 JSONP. Web服务就是一个通过HTTP访问的Web API.
JSONP 是一种使用 <script> 元素获取数据的方法.
JSONP 就是JSON数据包装在JavaScript中, 通常会包装在一个函数调用中.
将JSON数据包装在 JSONP 中的函数调用成为”回调”.
将回调函数指定为 JSONP请求中的一个URL查询参数.
JSONP 并不比使用 <script> 元素链接到JavaScript库的做法更安全(或更不安全). 只要链接到第三方JavaScript都要特别当心.
要指定 <script> 元素做出 JSONP 请求, 可以把它直接增加到HTML, 或者使用JavaScript将 <script> 元素写至DOM.
如果做出多次请求, 可以在 JSONP 请求RUL的末尾使用一个随机数, 是浏览器不会缓存这个响应.
replaceClild 方法会用另一个元素替换DOM中一个元素.
setInterval 是一个定时器以指定的间隔调用一个函数. 可以使用 setInterval 向服务器做出重复的 JSONP 请求来获取新数据.