美文网首页
2021-01-26面试题

2021-01-26面试题

作者: Viewwei | 来源:发表于2021-01-26 08:17 被阅读0次

    iframe框架都有哪些优缺点?

    iframe 是一种框架,也是一种常用的网页嵌入式

    iframe优点

    1. iframe 能够原封不动的把嵌入式网页展示出来
    2.  如果多个网页引用 iframe,那么你只需要更改 iframe 的内容,就可以实现调用每一个页面内容的改变,方便快捷
    3. 如果遇到加载缓慢的第三方内容如广告和图标,这些问题可以由 iframe 来解决
    4. 可以使用 iframe 实现跨域请求
    5. iframe是主页面是独立的,如果 iframe 内容发生改变或者重新加载 iframe 页面,不会影响到主页面
    

    iframe缺点

      - 从网络请求方面来说:因为每个iframe对应一个页面,意味着多余的css,js文件的载入,会增加请求的开销
      - 如果iframe内部有滚动条,会严重影响用户体验
      - 多个 iframe 会产生很多页面,或者多个 iframe 页面,不容易管理
      - 现在浏览器不对 iframe 的内容进行解析,导致 iframe 不会被浏览器搜素引擎优化,不利于 SEO
      - iframe对于很多移动设备兼容性差,比如 PAD 手机无法显示框架
    
    • 总结:能不用 iframe 就不要用 iframe,iframe 算是 web 发展呢过程中的一个产物.

    简述你对BFC规范的理解

    特性
    1. 计算 BFC 的高度时,浮动子元素也参与计算
    2. BFC 就是页面上一个独立的容器,容器里面的子元素不会影响外面的元素,反之亦然
    3.BFC 区域不会与 float 元素重叠
    
    行程条件
    1. html 根元素
    2.float 的值不是 static 或者 relative
    3. position的值不是 inline-block,table-cell...
    4. overflow的值不是 visible
    
    应用场景
    1. 解决浮动子元素导致父元素高度坍塌的问题
    2.解决文字环绕 float 四周的问题
    3. 解决间距重叠问题
    

    实例
    产生 BFC

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <title></title>
        </head>
        <body>
            <div id="out">
                <div id="in"></div>
            </div>
        </body>
        <style>
            #out {
                min-height: 20px;
                border: 1px red solid;
                overflow: hidden; 
                /* 产生 bfc */
            }
            #in {
                height: 100px;
                background-color: aqua;
                float: left;
                width: 100%;
            }
        </style>
    </html>
    
    

    统计某一字符或字符串在另一个字符串中出现的次数

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <title></title>
        </head>
        <body>
        </body>
        <script>
            
            const countAppears = function(params,target) {
                let count =0
                if (!target || !params){
                    return count
                }
                
                const index = target.indexOf(params)
                if (index > -1){
                    count = 1 +countAppears(params,target.slice(index +1))
                }
                return count
            }
            const str = "abcaaadefg2333333333334abcddddea";
            
            console.log(countAppears("2", str));
            console.log(countAppears("b", str));
            console.log(countAppears("d", str));
            console.log(countAppears("a", str));
            console.log(countAppears("f", str));
        </script>
        
    </html>
    

    相关文章

      网友评论

          本文标题:2021-01-26面试题

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