本文汇总了六道JavaScript面试题，涉及iframe的优缺点、BFC（块格式化上下文）的概念、统计字符串出现次数的方法、HTML5离线存储的原理和使用、清除浮动的策略以及加密字符串的实践。详细解释了各知识点的要点，适合面试复习和学习提升。
目录
1. iframe框架都有哪些优缺点
优点：
- 可以实现异步刷新，单个
iframe刷新不影响整体窗口的刷新（可以实现无刷新上传，在FormData无法使用时） - 可以实现跨域，每个
iframe的源都可以不相同（方便引入第三方内容） - 多页面应用时，对于共同的
header,footer可以使用iframe加载，拆分代码（导航栏的应用）
缺点：
- 每一个
iframe都对应着一个页面，也就意味着多余的css,js文件的载入，会增加请求的开销 - 如果
iframe内还有滚动条，会严重影响用户体验 window.onload事件会在所有iframe加载完成后才触发，因此会造成页面阻塞
2. 简述你对BFC规范的理解
介绍：
- BFC是CSS中的一个渲染机制，BFC就相当于一个盒子，内部的元素与外界的元素互不干扰。它不会影响外部的布局，外部的布局也不会影响到它。
形成条件（任意一条）
- html 根元素
- float的值不是none
- position 的值不是static或者relative
- display的值是inline-block,table-cell,flex,table-caption或者inline-flex
- overflow的值不是visible
特性
- 内部的盒子会在垂直方向上一个接一个的放置
- 对于同一个BFC的俩个相邻的盒子的margin会发生重叠，与方向无关。
- 每个元素的左外边距与包含块的左边界相接触（从左到右），即使浮动元素也是如此
- BFC的区域不会与float的元素区域重叠
- 计算BFC的高度时，浮动子元素也参与计算
- BFC就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素，反之亦然
应用场景
- 解决浮动子元素导致父元素，高度坍塌的问题
- 解决文字环绕在float 四周的情况
- 解决边距重叠问题 （父子，兄弟，空元素等）
3. 统计某一字符或字符串在另一个字符串中出现的次数
方法一：
var parent = 'aaasdsd'
var childInNums = parent.split('a').length - 1
console.log(childInNums);
方法二：
function strCount(str, target) {
let count = 0
if (!target) return count
while (str.match(target)) {
str = str.replace(target, '')
count++
}
return count
}
console.log(strCount('abcdef abcdef a', 'abc'))
4. 简述下html5的离线储存原理，同时说明如何使用？
原理：
HTML5的离线存储是基于一个新建的.appcache文件的缓存机制(不是存储技术)，通过这个文件上的解析清单离线存储资源，这些资源就会像cookie一样被存储了下来。之后当网络在处于离线状态下时，浏览器会通过被离线存储的数据进行页面展示。
如何使用：
① 页面头部像下面一样加入一个manifest的属性。
<!DOCTYPE HTML>
<html manifest = "cache.manifest">
...
</html>
② 在cache.manifest文件的编写离线存储的资源。
CACHE MANIFEST
#v0.1
CACHE:
js/index.js
css/index.css
NETWORK:
images/logo.png
FALLBACK:
*.html /404.html /* / /404.html 或 /html/ /404.html 也可*/
以#号开头的是注释，一般会在第二行写个版本号，用来在缓存的文件更新时，更新manifest以实现浏览器重新下载新的文件，可以是版本号，时间戳或md5码等。
离线存储的manifest一般由三个部分组成：
① CACHE：必选，表示需要离线存储的资源列表，由于包含manifest文件的页面将被自动离线存储，所以不需要把页面自身也列出来。
② NETWORK：可选，可以使用通配符，表示在它下面列出来的资源只有在在线的情况下才能访问，他们不会被离线存储，所以在离线情况下无法使用这些资源。不过，如果在CACHE和NETWORK中有一个相同的资源，那么这个资源还是会被离线存储，也就是说CACHE的优先级更高。
③ FALLBACK：可选，表示如果访问第一个资源失败，那么就使用第二个资源来替换他，如/html/ /404.html表示用 “404.html” 替代 /
最低0.47元/天 解锁文章
12万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
