博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
一些面试题的整理
阅读量:5098 次
发布时间:2019-06-13

本文共 2522 字,大约阅读时间需要 8 分钟。

1.css的选择符,继承性,优先级顺序, css3新增伪类

     CSS 选择符:

       1) id选择器(# myid)

       2) 类选择器(.myclassname)
       3) 标签选择器(div, h1, p)
       4) 相邻选择器(h1 + p)
       5) 子选择器(ul > li)
       6) 后代选择器(li a)
       7) 通配符选择器( * )
       8) 属性选择器(a[rel = "external"])
       9) 伪类选择器(a: hover, li:nth-child)

    继承性:

        可继承的(font-size,font-family,color,text-indent)

        不可继承的(border,padding,margin,width,height)

   优先级顺序:

  (1)优先级就近原则,同权重情况下样式定义最近者为准

  (2)载入样式以最后载入的定位为准

  (3)!important>id>class>tag

  (4)important比内联优先级高,但内联比id优先级高

 css3新增伪类

  (1)p:first-of-type 选择属于其父元素的首个p元素的每个p元素

  (2)p:last-of-type 选择属于其父元素的最后p元素的每个p元素

  (3)p:only-of-type 选择属于其父元素的唯一p元素的每个p元素

  (4)p:only-child 选择其属于其父元素的唯一子元素的每个p元素

  (5)p:nth-child(2) 选择属于其父元素的第二个子元素的每个p元素

  (6):enabled :disabled 控制表单控件的禁用状态

  (7):checked 单选框或复选框被选中

   css3新特性

  (1)css3实现圆角(border-radius),阴影(box-shadow)

  (2)对文字加特效(text-shadow),线性渐变(gradient),旋转(transform)

  (3)transform:rotate(9deg) scale(0.85,0.9) translate(0px,-20px) skew(-9deg,0); 旋转缩放定位倾斜

  (4)增加了更多的css选择器,多背景rgba

  (5)在css3中唯一引入的伪元素是::selection

  (6)媒体查询,多栏布局

  (7)border-image

2.减小页面加载时间的方法

  (1)减少重复的HTTP请求数量比如:减少调用其他页面文件的数量;把需要频繁加载的图片合成一个单独的图片

  (2)压缩JavaScript,css代码

  (3)在文件头部放置css样式,在文件尾部放置JavaScript脚本

  (4)css,JavaScript改为外部调用

  (5)尽可能减少DOM元素

  (6)避免使用css脚本

  (7)添加文件过期或缓存头

  (8)使用cdn网络加速

  (9)服务器启用gzip压缩功能

  (10)ajax采用缓存调用

  (11)ajax尽量采用get方式调用

  (12)养成良好的开发维护习惯,尽量避免脚本重复调用

  (13)缩减iframe的使用

  (14)优化图片文件

  (15)当页面内容大到一定程度,可以采用分页的方式展现,或者淘宝的翻页后加载方式

  (16)使用多域名负载网页内的多个文件、图片 

3.如何画一个矩形

  在HTML页面中添加canvas标签,然后在JS中获取,并设定初始位置和宽度高度,即可画出一个矩形。代码如下,效果展示:

  

    
canvas画矩形

4.关于vue的生命周期

  Vue实例有一个完整的生命周期,也就是从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、销毁等一系列过程,我们称这是Vue的生命周期。通俗说就是Vue实例从创建到销毁的过程,就是生命周期。

每一个组件或者实例都会经历一个完整的生命周期,总共分为三个阶段:初始化、运行中、销毁。

  1. 实例、组件通过new Vue() 创建出来之后会初始化事件和生命周期,然后就会执行beforeCreate钩子函数,这个时候,数据还没有挂载呢,只是一个空壳,无法访问到数据和真实的dom,一般不做操作

  2. 挂载数据,绑定事件等等,然后执行created函数,这个时候已经可以使用到数据,也可以更改数据,在这里更改数据不会触发updated函数,在这里可以在渲染前倒数第二次更改数据的机会,不会触发其他的钩子函数,一般可以在这里做初始数据的获取

  3. 接下来开始找实例或者组件对应的模板,编译模板为虚拟dom放入到render函数中准备渲染,然后执行beforeMount钩子函数,在这个函数中虚拟dom已经创建完成,马上就要渲染,在这里也可以更改数据,不会触发updated,在这里可以在渲染前最后一次更改数据的机会,不会触发其他的钩子函数,一般可以在这里做初始数据的获取

  4. 接下来开始render,渲染出真实dom,然后执行mounted钩子函数,此时,组件已经出现在页面中,数据、真实dom都已经处理好了,事件都已经挂载好了,可以在这里操作真实dom等事情...

  5. 当组件或实例的数据更改之后,会立即执行beforeUpdate,然后vue的虚拟dom机制会重新构建虚拟dom与上一次的虚拟dom树利用diff算法进行对比之后重新渲染,一般不做什么事儿

  6. 当更新完成后,执行updated,数据已经更改完成,dom也重新render完成,可以操作更新后的虚拟dom

  7. 当经过某种途径调用$destroy方法后,立即执行beforeDestroy,一般在这里做一些善后工作,例如清除计时器、清除非指令绑定的事件等等

  8. 组件的数据绑定、监听...去掉后只剩下dom空壳,这个时候,执行destroyed,在这里做善后工作也可以

    

         

转载于:https://www.cnblogs.com/kugaoheng/p/9552174.html

你可能感兴趣的文章
jq选择器
查看>>
[TJOI2017] 可乐
查看>>
CAP在MySQL的分析
查看>>
Magento强大的配置系统(一)
查看>>
hdu Is It A Tree?
查看>>
使用scrapy爬取网站的商品数据
查看>>
用JS控制CSS基本样式
查看>>
第四次作业
查看>>
JS 时间函数
查看>>
caci 与 nagios 一些总结 【一】
查看>>
【R笔记】使用R语言进行异常检测
查看>>
Julia体验 语言特性 元编程,宏
查看>>
C语言运算符优先级
查看>>
35.QT-多线程
查看>>
AC日记——逆波兰表达式 openjudge 3.3 1696
查看>>
maven 项目 查询部分关心的字段
查看>>
linux 内核模块的helloWorld
查看>>
2018/3/25
查看>>
web后台工作流程
查看>>
Axure RP使用攻略--入门级(三)元件的触发事件
查看>>