精华内容
下载资源
问答
  • 前端实习面试题

    2020-09-02 15:23:11
    部分前端实习面试题记录 1、你对盒子模型的理解 https://www.cnblogs.com/clearsky/p/5696286.html (千与千寻*的博客中的相关讲解与一些问题解决) 2、html5中添加了哪些新标签 Html5新增了27个元素,废弃了16 个...

    部分前端实习面试题记录

    在这里插入图片描述

    1、你对盒子模型的理解

    https://www.cnblogs.com/clearsky/p/5696286.html
    (千与千寻*的博客中的相关讲解与一些问题解决)

    2、html5中添加了哪些新标签

    Html5新增了27个元素,废弃了16 个元素,根据现有的标准规范,把HTML5 的元素按优先级定义为结构性属性、级块性元素、行内语义性元素和交互性元素 4 大类。

    结构性元素主要负责web上下文结构的定义
    section:在 web 页面应用中,该元素也可以用于区域的章节描述。
    header:页面主体上的头部, header 元素往往在一对 body 元素中。
    footer:页面的底部(页脚),通常会标出网站的相关信息。
    nav:专门用于菜单导航、链接导航的元素,是 navigator 的缩写。
    article:用于表现一篇文章的主体内容,一般为文字集中显示的区域。

    级块性元素主要完成web页面区域的划分,确保内容的有效分割。
    aside:用于表达注记、贴士、侧栏、摘要、插入的引用等作为补充主体的内容。
    figure:是对多个元素进行组合并展示的元素,通常与 ficaption 联合使用。
    code:表示一段代码块。
    dialog:用于表达人与人之间的对话,该元素包含 dt 和 dd 这两个组合元素, dt 用于表示说话者,而 dd 用来表示说话内容。

    行内语义性元素主要完成web页面具体内容的引用和描述,是丰富内容展示的基础。
    meter:表示特定范围内的数值,可用于工资、数量、百分比等。
    time:表示时间值。
    progress:用来表示进度条,可通过对其 max 、 min 、 step 等属性进行控制,完成对进度的表示和监事。
    video:视频元素,用于支持和实现视频文件的直接播放,支持缓冲预载和多种视频媒体格式。
    audio:音频元素,用于支持和实现音频文件的直接播放,支持缓冲预载和多种音频媒体格式。

    交互性元素主要用于功能性的内容表达,会有一定的内容和数据的关联,是各种事件的基础。
    details:用来表示一段具体的内容,但是内容默认可能不显示,通过某种手段(如单击)与 legend 交互才会显示出来。
    datagrid:用来控制客户端数据与显示,可以由动态脚本及时更新。
    menu:主要用于交互菜单(曾被废弃又被重新启用的元素)。
    command:用来处理命令按钮。

    3、块级元素、行内元素有哪些?有什么区别?

    块级元素:块级大多为结构性标记
    
      <address>...</adderss>   
      <center>...</center>  地址文字
      <h1>...</h1>  标题一级
      <h2>...</h2>  标题二级
      <h3>...</h3>  标题三级
      <h4>...</h4>  标题四级
      <h5>...</h5>  标题五级
      <h6>...</h6>  标题六级
      <hr>  水平分割线
      <p>...</p>  段落
      <pre>...</pre>  预格式化
      <blockquote>...</blockquote>  段落缩进   前后5个字符
      <marquee>...</marquee>  滚动文本
      <ul>...</ul>  无序列表
      <ol>...</ol>  有序列表
      <dl>...</dl>  定义列表
      <table>...</table>  表格
      <form>...</form>  表单
      <div>...</div>
    
    行内元素:行内大多为描述性标记
      <span>...</span>
      <a>...</a>  链接
      <br>  换行
      <b>...</b>  加粗
      <strong>...</strong>  加粗
      <img >  图片
      <sup>...</sup>  上标
      <sub>...</sub>  下标
      <i>...</i>  斜体
      <em>...</em>  斜体
      <del>...</del>  删除线
      <u>...</u>  下划线
      <input>...</input>  文本框
      <textarea>...</textarea>  多行文本
      <select>...</select>  下拉列表
    
    ·块级元素
    
      1.总是从新的一行开始
      2.高度、宽度都是可控的
      3.宽度没有设置时,默认为100%
      4.块级元素中可以包含块级元素和行内元素
    
    ·行内元素
    
      1.和其他元素都在一行
      2.高度、宽度以及内边距都是不可控的
      3.宽高就是内容的高度,不可以改变
      4.行内元素只能行内元素,不能包含块级元素
    
    ·行内块级元素
    
    inline-block 的元素(如input、img)既具有 block 元素可以设置宽高的特性,
    同时又具有 inline 元素默认不换行的特性。
    当然不仅仅是这些特性,比如 inline-block 元素也可以设置 vertical-align属性
    (因为这个垂直对齐属性只对设置了inline-block的元素有效)。
    HTML 中的换行符、空格符、制表符等合并为空白符,字体大小不为 0 的情况下,
    空白符自然占据一定的宽度,使用inline-block 会产生元素间的空隙。
    

    4、如何设置值改变其行内或是块级?

        display:block; (字面意思表现形式设为块级元素)
    
       display:inline; (字面意思表现形式设为行内元素)
    

    5、css有哪些定位

    1、静态定位(static):

    默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。

    2、相对定位(relative):

    定位为relative的元素脱离正常的文档流,但其在文档流中的位置依然存在,只是视觉上相对原来的位置有移动。

    通过top,bottom,left,right的设置相对于其正常(原先本身)位置进行定位。可通过z-index进行层次分级 。

    3、绝对定位(absolute):

    生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。可通过z-index进行层次分级。

    定位为absolute的层脱离正常文档流,但与relative的区别是其在正常流中的位置不再存在。

    这个属性总是有人给出误导。说当position属性设为absolute后,总是按照浏览器窗口来进行定位的,这其实是错误的。实际上,这是fixed属性的特点。

    4、固定定位(fixed):

    与绝对定位类似,元素从文档流中脱离,但是它们不是相对于容器块定位,而是相对于视口(viewpoint)定位(大多数情况下,这个视口就是指浏览器窗口)。

    6、水平垂直居中有哪些方式

    1、弹性盒

       display:flex  //父元素
       margin:auto   //子元素
    

    2、弹性盒2

       display:flex;
       justifly-content:center;
       align-items:center
    

    3、absolute

    .parent {
        position: relative;
    }
    .child {
        position: absolute;;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
    }
    

    引用:https://www.jianshu.com/p/907f99004c3e

    7、浮动有哪些?设置浮动会造成什么影响?如何解决

    影响:使用float浮动后子元素虽然实现了水平方向的浮动,但是父元素的高度有时会塌陷。
    解决方法:
    一、在父元素的样式中加入overflow:hidden属性。目的是父元素包住这个脱离了文档流的浮动元素。
    二、使用flex弹性布局,不需要设置float,直接对父元素设置
    display: flex;
    flex-direction: row
    也可使子元素呈现在一行上
    三、可以用一个空的div块儿,设置class为clear,然后在使用了float浮动du的块儿zhi的末尾加上这个空div块,再设置它的属性

    <div class="clear"><div>
    
    <style>
    .clear{
    clear:both;
    }
    <style>
    

    四、为父元素添加伪类

    .parent{
    border: 2px solid blue;
    }
    .child{
    height:50px;
    width:50px;
    background:red;
    float:left;
    }
    .parent:after{
    content:'';
    clear:both;
    display:block
    }
    

    8、基本数据类型有哪些

    引用:https://blog.csdn.net/lizhensen/article/details/79327898?utm_source=blogxgwz5

    9、讲一下闭包

    闭包是指有权访问另外一个函数作用域中的变量的函数.可以理解为(能够读取其他函数内部变量的函数)
    具体:https://www.cnblogs.com/heyushuo/p/9975911.html
    https://blog.csdn.net/zhizhiC/article/details/79734611

    10、webpack是什么?作用?loader和plugin的区别

    Webpack 的核心概念是一个模块打包工具 ,它的主要目标是将js文件打包在一起,打包后的文件用于在浏览器中使用,但它也能胜任转换(transform) 、打包(bundle) 或包裹(package) 任何其他资源。
    Webpack 核心主要进行 JavaScript 资源打包。它可以结合其他插件工具,将多种静态资源css、png、sass 分类转换成一个个静态文件,这样可以减少页面的请求。
    可集成 babel 工具实现 EcmaScript 6 转 EcmaScript 5 ,解决兼容性问题
    可集成 http 服务器
    可集成模块热加载,当代码改变后自动刷新浏览器 等等功能

    loader和plugin区别:https://blog.csdn.net/jiang7701037/article/details/98887179

    11、讲一讲Http状态码

    常见的Http状态码:
    200 - 请求成功
    301 - 资源(网页等)被永久转移到其它URL
    404 - 请求的资源(网页等)不存在
    500 - 内部服务器错误
    引用:https://www.runoob.com/http/http-status-codes.html

    12、跨域问题的解决方法

    https://blog.csdn.net/yup1212/article/details/87633272

    13、Vue双向绑定原理

    https://baijiahao.baidu.com/s?id=1611592926044081590&wfr=spider&for=pc

    14、Vue生命周期

    https://www.jianshu.com/p/410b6099be69

    15、Vuex是什么,本质上是用来解决什么问题

    https://blog.csdn.net/weixin_44276128/article/details/108080193

    16、谈谈对Git的理解

    https://git-scm.com/book/zh/v2/%E8%B5%B7%E6%AD%A5-Git-%E6%98%AF%E4%BB%80%E4%B9%88%EF%BC%9F

    展开全文
  • 前端实习面试题

    2021-01-08 09:10:33
    1.什么是浏览器内核,常用的浏览器的内核有哪些? ...目前的浏览器内核有:trident,Gecko,presto,webkit等 行内元素和块级元素有哪些? 内行元素有:a,span,br,i,img,label等 块级元素有:div,li,ul,ol,h1~h6,tr等 ...
  • 前端实习面试题总结

    2021-05-07 11:59:06
    前端实习面试题 浮动有哪些?设置浮动会造成什么影响?如何解决 影响:使用float浮动后子元素虽然实现了水平方向的浮动,但是父元素的高度有时会塌陷。 解决方法: (1)在父元素的样式中加入overflow:hidden属性...

    前端实习面试题

    1. 浮动有哪些?设置浮动会造成什么影响?如何解决
      影响:使用float浮动后子元素虽然实现了水平方向的浮动,但是父元素的高度有时会塌陷。
      解决方法:
      (1)在父元素的样式中加入overflow:hidden属性。目的是父元素包住这个脱离了文档流的浮动元素。
      (2)使用flex弹性布局,不需要设置float,直接对父元素设置
      display: flex;
      flex-direction: row
      也可使子元素呈现在一行上
      (3)可以用一个空的div块儿,设置class为clear,然后在使用了float浮动du的块儿zhi的末尾加上这个空div块,再设置它的属性
    <div class="clear"><div>
    
    <style>
    .clear{
    clear:both;
    }
    <style>
    
    1. 水平垂直居中有哪些方式
      (1)弹性盒
        display:flex  //父元素
       margin:auto   //子元素
    

    (2)弹性盒2

        display:flex;
       justifly-content:center;
       align-items:center
    

    (3)absolute

    .parent {
        position: relative;
    }
    .child {
        position: absolute;;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
    }
    
    1. css有哪些定位
      (1)静态定位(static):

    默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。

    (2)相对定位(relative):

    定位为relative的元素脱离正常的文档流,但其在文档流中的位置依然存在,只是视觉上相对原来的位置有移动。

    通过top,bottom,left,right的设置相对于其正常(原先本身)位置进行定位。可通过z-index进行层次分级 。

    (3)绝对定位(absolute):

    生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。可通过z-index进行层次分级。

    定位为absolute的层脱离正常文档流,但与relative的区别是其在正常流中的位置不再存在。

    这个属性总是有人给出误导。说当position属性设为absolute后,总是按照浏览器窗口来进行定位的,这其实是错误的。实际上,这是fixed属性的特点。

    (4)固定定位(fixed):

    与绝对定位类似,元素从文档流中脱离,但是它们不是相对于容器块定位,而是相对于视口(viewpoint)定位(大多数情况下,这个视口就是指浏览器窗口)。

    1. 如何设置值改变其行内或是块级?
      display:block; (字面意思表现形式设为块级元素)
      display:inline; (字面意思表现形式设为行内元素)
    
    1. webpack是什么?作用?
      Webpack 的核心概念是一个模块打包工具 ,它的主要目标是将js文件打包在一起,打包后的文件用于在浏览器中使用,但它也能胜任转换(transform) 、打包(bundle) 或包裹(package) 任何其他资源。
      Webpack 核心主要进行 JavaScript 资源打包。它可以结合其他插件工具,将多种静态资源css、png、sass 分类转换成一个个静态文件,这样可以减少页面的请求。
      可集成 babel 工具实现 EcmaScript 6 转 EcmaScript 5 ,解决兼容性问题
      可集成 http 服务器
      可集成模块热加载,当代码改变后自动刷新浏览器 等等功能
    2. 讲一讲Http状态码
      常见的Http状态码:
      200 - 请求成功
      301 - 资源(网页等)被永久转移到其它URL
      404 - 请求的资源(网页等)不存在
      500 - 内部服务器错误
      获取更多面试题:智一面
    展开全文
  • 初级前端实习面试题(自拟) HTML HTML5有哪些新特性 localStorage、sessionStorage有了解么 canvas有了解使用过么,做过什么呢 CSS 如何实现水平垂直居中 伪类元素有了解么,一般用来处理什么 盒模型 flex ...

    初级前端实习面试题(自拟)

    HTML

    1. HTML5有哪些新特性
      1. localStorage、sessionStorage有了解么
      2. canvas有了解使用过么,做过什么呢

    CSS

    1. 如何实现水平垂直居中
    2. 伪类元素有了解么,一般用来处理什么
    3. 盒模型
    4. flex

    JS

    1. ES6新特性
      1. let const var
      2. 箭头函数
      3. 异步Promise、async/await
    2. 闭包
    3. this指向

    计算机网络

    1. 跨域

    浏览器原理

    1. 性能优化(重绘、回流)

    VUE

    1. 生命周期
    2. 组件通信方式
    3. slot

    小程序

    展开全文
  • 前端实习面试题分享

    千次阅读 2019-08-24 17:30:47
    所以从B站上找到一位愿意分享面试经历的UP主,耗时一天,把她遇到的所有面试题都分类并且手敲了出来,在这里我再分享给大家。括号内是她提供的一些参考答案,基本没错。由于她面的公司比较多,有的问题会重复多次,...

    因为马上要准备找实习了,还不知道面试官要问啥。所以从B站上找到一位愿意分享面试经历的UP主,耗时一天,把她遇到的所有面试题都分类并且手敲了出来,在这里我再分享给大家。括号内是她提供的一些参考答案,基本没错。由于她面的公司比较多,有的问题会重复多次,我做了统计并标注了出来,希望能对大家有所帮助~

    HTML

    • h5新增的标签有哪些?为什么要加强语义化? (吉利) three times
    • 行内元素,块级元素有内些?有什么不同?
    • 第一行 !doctype 是做什么用的?
    • HTML页面加载完成后,会触发那个事件?onready还是 onload(onready在 dom 元素结构完成就会执行,onload会在图片加载完之后才执行;onready有多少执行多少,onload只会执行最后一个)
    • addEventListener 能否多次给DOM对象添加监听事件?(可以)
    • attachEvent 能否删除对象的监听事件?(不可以,删除的话用 detachEvent )
    • new Date()获取的是哪里的时间?(PC本地的时间)

    CSS

    • 两个子盒子分别放到父盒子的最左和最右,怎么做?(弹性盒子)(吉利) two times
    • css3的新特性有那些?
    • 子盒子在父盒子中水平居中有哪几种方法?(弹性盒子,position)
    • 子盒子的定位,如何上下居中?(定位和弹性盒子)
    • 父盒子中的子盒子浮动会有什么后果?(子盒子浮动,父盒子的高度为0)
    • 定位有哪几个属性?
    • 行内块元素和行内元素的区别?
    • 两个行内块元素同行显示时,会出现3px空白间隙,为什么?如何解决?
    • 为什么要清除浮动?怎么清除浮动?
    • css选择器的优先级是什么?
    • css中如何定位?(吉利)

    JS

    • 基础!!!
    • 闭包是什么及优缺点?举例。用let怎么实现?(闭包是指当外部函数返回,内部函数还可以访问外部函数的属性或者方法) (华为) four times
    • 前后端传递 getpost的区别? three times
    • js的基本数据类型有哪些?(注意es6的symbol)two times
    • 现在有几种存储方式?(cookie,localStorage,sessionStorage)分别又有什么不同?two times
    • 轮播图怎么考虑实现?two times
    • cookie中的session的了解(一个存储在客户端,一个存储在服务端)two times
    • 深拷贝和浅拷贝有什么区别?如何实现深拷贝?two times
    • 如何判断数据类型?(基本数据类型用typeOf,引用类型用instanceOf)
    • JS的执行机制是什么?
    • 绑定DOM元素的事件有哪几种方法?(在DOM元素里直接写;在JS代码里写(on:click);绑定事件监听函数)
    • 数组的常用遍历方法有哪些?(for;ES6新增)
    • JS的三大事件是什么?
    • this的指向是什么?如何改变指向?(1.箭头函数 2.that 3.apply,call,bind 4.new)
    • 怎么绑定事件?
    • 数组常用的操作方法?splice和slice的区别(一个是在原数组进行操作,一个是对原数组进行拷贝进行操作)
    • 事件委托是什么?
    • for…in…和for…of…的区别
    • 在js模型中,Windows模型中,什么属性是用来指定浏览器状态栏里面的临时消息的(status)
    • 两个div需要设置层级关系,需要哪些属性(z-index)
    • eval元素能不能解释为由js源码组成的字符串呢?能不能用断点调试?会不会引起安全问题(可以的,不能,会有安全问题,xss攻击)
    • js里,两个整数进行除法,结果是整数还是小数?(可用parseInt和Math.round变为整数)
    • offsetWidth,clientWidth代表什么?(可见区域的宽度,高度)
    • 继承是怎么实现的?用prototype是怎么实现的?(华为)
    • JS的垃圾回收机制,用JS时怎么调bug的?(华为)

    ES6

    • ES6里面const,let,var的区别**(吉利)****(华为)** three times
    • ES6有哪些新特性?**(吉利)**double
    • const定义的对象能否改变?(能)
    • let和var在全局定义的时候有什么区别?(var在全局对象windows中可以找到,而let不行)
    • ES6里新增的类和方法有哪些?(class和继承),怎么实现继承的?(华为)
    • ES6里面Promise的两个参数分别是什么?

    Vue

    • Vue的生命周期有哪些?他们各有什么不同?five times
    • **v-if v-show **之间的区别是什么? five times
    • Vue里面父子组件怎么传值?兄弟组件是怎么传值的?(订阅者模式bus)(华为) four times
    • v-for中key值的作用是什么?对使用的影响,没有key时会出现什么情况?(没有的情况下会被复用) three times
    • vuex代码怎么写?two times
    • computedwatch的区别是什么?应用场景有哪些? two times
    • 数据请求在生命周期的那个阶段?
    • Vue实现双向绑定的原理是什么?
    • 什么情况下会用created,mounted?
    • 箭头函数和一般函数的区别?(箭头函数没有this,也没有arguments,不能做构造函数)
    • vue组件中的data为什么是函数形式?(函数形式返回的是新对象,不会出现多个组件引用同一个对象,避免修改数据带来的连锁反应)
    • vue中this从那个生命周期可以开始被调用?
    • vue-cli如何使用json数据模拟?
    • Vue中插槽有什么作用?
    • app怎么适配?
    • vue router的钩子函数有哪些?那个是可以全局使用的钩子
    • jQuery和Vue的区别是什么? (华为)
    • Vue中Vuex和Axios的使用 (华为)
    • Vue的源码看过吗?怎么实现数据劫持?(华为)
    • router和route的区别是什么?

    综合

    • 怎么实现跨域? (1.isonp 2.代理 3.php header写允许跨域)jsonp的原理是什么?three times
    • 前端常用的性能优化有哪些?()two times
    • 从输入URL到页面加载完成,中间发生了什么?
    • 如何查看一个网站所使用的的技术?(打开开发者工具)
    • react核心是什么?
    • 怎么实现文本不自动换行?超出部分显示省略号
    • HTTP 和HTTPS分别是什么?区别
    • css动画特性可以用Js实现,为什么还要用css实现?(css渲染动画不占用js主线程)
    • Ajax请求数据重新处理和拦截器
    • git的使用及常用git的代码有那些?
    • npm中warn了解吗?
    • 用过哪些基础框架?
    • jQuery中绑定事件on和bind的区别是什么?
    • 打开页面,加载较慢,如何缩短时长
    • http请求头content-type是干什么的?
    • HTTP常见的状态码有哪几种?JS和DOM操作浏览器兼容的注意事项有哪些?
    • Web开发常见的安全性漏洞是哪些?
    • 单页面应用的优缺点有那些?

    bootstrap

    • bootstrap中栏栅的24个时怎么做到的?

    算法

    • 如何给数据去重?
    • 冒牌排序

    素质面

    • 说出三个优缺点
    展开全文
  • 用友前端实习面试题

    2020-07-25 14:46:26
    关于用友web前端面试题的知识 哪些中间件产品提供了JSP和Servlet的服务: Tomcat和Jetty。 关于WebService的描述: XML Security题gogmde1机制是WebService中的XML数据安全的基本机制。 SOAP WebService通过WSDL描述...
  • 以下基本是我在面试中遇到的所有问题,给大家做一个参考。除2月13和14日为现场面试以外,其余均为电话面试。我的本意不是让大家背答案,所以没有把面试公司...作者:Icarus原文链接:无他,唯手熟尔-前端实习面试题...
  • 网易前端实习面试题

    2016-04-19 22:04:32
    面试题: 1:为什么来应聘这个岗位? 2:说说你对前端的理解? 3:你对自己未来的职业有什么规划? 4:前端分为哪几部分? 5:你是如何学习前端的? 6:能说说你所了解的前端的知识吗? 7:说说块标签,行块...
  • 小米前端实习面试题和一些经验

    千次阅读 2017-09-25 23:55:06
    前两天接到了小米的面试邀请,在此之前有个电面,自认为已经初步对小米对前端实习生的要求了解了大概,然后没做过多心里建设准备就去了。(画外音:到了小米,正好赶上当天有许多新员工入职,大厅看起来比较忙碌,拿...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 8,272
精华内容 3,308
关键字:

前端实习面试题