zoukankan      html  css  js  c++  java
  • web前端知识点反思总结

      当别人问你之前的知识,我们便会勾起之前的回忆,然后进行一番痛苦的挣扎后,发现我依然记得你

      什么是 DTD ?

        文档类型定义 (DTD) 可定义合法的 xml 文档的构建模块 ,他是使用一系列合法的元素来定义文档的结构

        DTD 可被成行的声明于 XML 的文档,也可作为一个外部引用

        DOCTYPE 是定义浏览器使用什么样的文本类型定义 DTD 载入页面,也就是告诉浏览器使用什么样的 HTML 或者 XHTML 规范来解析 html,一般情况出现在 html 文档的开头

        严格模式,又称为标准模式,是值浏览器按照 W3C 标准来解析代码,一种严格要求的 DTD ,排版和 js 的运作模式均是以该浏览器支持的最高标准运行

        混杂模式,又称怪异模式或者兼容模式,是指浏览器按照自己的方式来解析代码,页面以宽松的向后兼容的方式显示,就严格度来说不如严格模式,但是模拟老师浏览器的行为可以防止站点无法工作

        如何区分严格模式?

          1. 如果文档中包含了严格的 DOCTYPE,那么它一般以严格模式呈现

          2. 如果文档中包含过渡 DTD 和 URL 的 DOCTYPE,也以严格模式呈现,但有过渡 DTD 而没有 URL,会导致文档以混杂模式呈现

          3. DOCTYPE 不存在或者形式不正确或者有误,文档以混杂模式呈现

          4. html5 没有 DTD,因此也就没有严格模式与混杂模式的区分,HTML5 相对来说语法比较宽松

          

      input 的显示方式?

        元素的性质:行级块元素

      flex ?

        弹性盒模型

        只要对一个容器声明了 display:flex ,这个元素就变成了弹性容器,且具有 flex 弹性布局的方式

        讲解:

          1. 每个弹性容器都有两根轴:主轴和交叉轴,两轴之间成 90 度关系,注意:水平的不一定是主轴。

          2. 每根轴都有起点和终点,这对于元素的对齐非常重要。

          3. 弹性容器中的所有子元素称为 <弹性元素>,弹性元素永远占主轴排列

          4. 弹性元素也可以通过 display:flex 设置为另一个弹性容器,形成嵌套关系,因此一个元素既可以是弹性容器,也可以是弹性元素

      css引入样式 @import 和 link 的区别 ?

        虽然两者都是外部引用 css 的方式,但却有一些区别

          1. link 是 XHTML 标签,除了加载 css 外,还可以定义 RSS 等其他事务;@import 属于 css 范畴,只能加载 css

          2. link 引用 css 是,在页面载入时同时加载;@import 需要页面网页完全载入以后加载

          3. link 时 XHTML 标签,无兼容问题,@import 是在 css 2.1 提出的,低版本的浏览器不支持

          4. link 支持使用 javascript 控制 DOM 去改变样式;而 @import 不支持

      盒模型的介绍 ?

        盒模型的组成:content --> padding --> border --> margin

         注意:计算和模型高度的话,没有 margin

      保留小数点后两位 ?

        第一种方法:四舍五入法:

             var num = 12.34567890

             num = num.toFixed(2)

             console.log(num)

        第二种方法:不四舍无如法:

          var mumber = 15.7784523

          number = Math.floor(number * 100) / 100

          console.log(number)

      __proto__ 和 prototype 的区别?

        __proto__ 是对象的属性

        prototype 是函数的属性

        每个函数里面都有一个 prototype 的属性,每个 prototype 里面都有一个 constructor 的属性,指向了类本身

        每个实例对象都有一个 __proto__ 的属性,指向了父类的 prototype(原型)

      什么是标准文档流?

        css 中脱离文档流,也就是将元素从普通的布局排版中拿走,其他盒子在定位的时候,会当做脱离文档流的元素不存在而进行定位;

        浏览器在默认的排版方式就是文档流(或者叫标准流)排版方式,脱离文档流就是不按照文档流的排版方式。

        文档流的排版方式是:块级元素垂直排布,行内元素和行内块级水平排布。不脱离就是按照这种方式排版。

        例如:给元素设置浮动或者绝对定位,这就是脱离文档流布局。 

      new 关键字的作用 ?

        案例代码:

          function Person(){

          }

          var obj = new Person()

        new 关键字总共做了 3 件事;

          1. 创建一个空对象;

            var obj = {}

          2. 将新对象的 __proto__ 指向构造函数的 prototype 对象

            obj.__proto__ = Person.prototype

          3. 改变了 Person 函数的 this 指向

            Person.call(obj);

      dom ?

        dom 文档对象模型

        W3C 文档对象模型(DOM)是中立于平台和语言的接口,它允许程序和脚本动态的访问和更新文档的内容、结构和样式

        如果我们想跟用户进行交互,如果我们想加点特效,任何的操作都离不开 dom;

        dom 的增删查改

          创建:document.createElement('div');

          增:appendChild()  

            insertBefore()

          删:removeChild()

          查:id,document.getElementById()

            class,document.getElementsByClassName()

            tag,document.getElementsByTagName()

          改:replaceChild()

        dom 的属性操作

          获取 dom 的属性:getAttribute()

          设置 dom 的属性:setAttribute()  

      es6 的异步 ?

        Promise 对象

        Generator 函数

        async 函数

        Web Workers 线程

      闭包 ?

        

         

         返回闭包时牢记的一点就是:返回函数不要引用任何循环变量,或者后续会发生变化的变量。

      小程序的生命周期 ?

        App 的生命周期

          onLaunch()  监听小程序的初始化

          onShow()  监听小程序的显示

          onHide()  onLaunch() 监听小程序隐藏

        页面的生命周期

          onLoad()  监听页面加载

          onReady()  监听页面的初始化完成

          onShow()   监听页面显示

          onHide()  监听页面隐藏

          onUnload()  监听页面的卸载

      W3C 的标准 ?

        W3C 万维网联盟,他不是某一个标准,而是一系列标准的集合,网页有三部分组成:结构(html),表现(css),行为(js dom)

      项目介绍 ?

      人员配置 ?

      开发流程 ?

      通过提问暴露出来的问题:回答的太表面、背书、条理、关联、不会不说不知道

  • 相关阅读:
    JavaScript核心参考
    面向对象的程序设计之工厂模式
    ES6中promise的使用方法
    详解 Vue 2.4.0 带来的 4 个重大变化
    Vue.js 1.x 和 2.x 实例的生命周期
    表单控件的全面分析
    元素的一些常用属性
    为表格增加的方法
    Element类型知识大全
    6-3.斜体标签
  • 原文地址:https://www.cnblogs.com/shangjun6/p/11433623.html
Copyright © 2011-2022 走看看