当前位置: 首页 > news >正文

常见前端基础面试题(HTML,CSS,JS)(一)

html语义化的理解

  1. 代码结构: 使页面在没有css的情况下,也能够呈现出好的内容结构

  2. 有利于SEO: 爬虫根据标签来分配关键字的权重,因此可以和搜索引擎建立良好的沟通,帮助爬虫抓取更多的有效信息

  3. 方便其他设备解析: 如屏幕阅读器、盲人阅读器、移动设备等,以有意义的方式来渲染页面

  4. 便于团体的开发和维护: 语义化使代码更具有可读性,让其他开发人员更加理解你的html结构,减少差异化。遵循 W3C 标准的团队都遵循这个标准。

    常用的语义元素有:header、nav、main、footer、article、section、aside

iframe

iframe称之为嵌入式框架、嵌入式框架可以把完整的网页内容嵌入到现有的网页中。

优点

  • 重载页面时不需要重载整个页面只需要重载页面中的一个框架页
  • 可以使脚本、可以并行下载
  • 可以实现跨子域通信

缺点

  • 会产生很多页面,不容易管理
  • 调用外部页面,需要额外调用 CSS,给页面带来额外的请求次数
  • iframe 会阻塞主页面的 onload 事件
  • 浏览器的后退按钮无效
  • 无法被一些搜索引擎索引识别
  • 多数小型的移动设备无法完全显示框架

BOM和DOM分别是什么

BOM是浏览器对象模型: 用来获取或设置浏览器的属性、行为。例如:新建窗口、获取屏幕分辨率、浏览器版本号等

DOM是文档对象模型: 用来获取或设置文档中标签的属性、例如获取或者设置input表单的value值

CSS盒模型

盒模型都是由四个部分组成的,分别是margin、border、padding和content

标准盒模型和IE盒模型的区别在于设置width和height时,所对应的范围不同:

  • 标准盒模型的width和height属性的范围只包含了content,
  • IE盒模型的width和height属性的范围包含了border、padding和content。

可以通过修改元素的box-sizing属性来改变元素的盒模型:

  • box-sizeing: content-box表示标准盒模型(默认值)
  • box-sizeing: border-box表示IE盒模型(怪异盒模型)

怎么让一个 div 水平垂直居中

  1. 通过绝对定位实现垂直居中

  2. 通过 transform 实现垂直居中

  3. 使用弹性盒子居中

BFC

所谓 BFC,指的是一个独立的布局环境,BFC 内部的元素布局与外部互不影响。

触发 BFC 的方式有很多,常见的有:

  • 设置浮动
  • overflow 设置为 auto、scroll、hidden
  • positon 设置为 absolute、fixed

常见BFC的应用

  • 解决浮动元素令父元素高度坍塌的问题
  • 解决非浮动元素被浮动元素覆盖问题
  • 解决外边距垂直方向重合问题

JS 的基本数据类型有哪些?基本数据类型和引用数据类型的区别

基本数据类型

JavaScript共有八种数据类型,分别是 Undefined、Null、Boolean、Number、String、Object、Symbol、BigInt

这些数据可以分为原始数据类型和引用数据类型:

  • 栈:原始数据类型(Undefined、Null、Boolean、Number、String)
  • 堆:引用数据类型(对象、数组和函数)

基本数据类型和引用数据类型的区别

  • 访问方式:

    • 原始值:访问到的是值
    • 引用值:访问到的是引用地址 (js不允许直接访问保存在堆中的对象、首先得到在堆中的地址,然后按照这个地址去获得对象的值)
  • 比较方式:

    • 原始值:比较的是值
    • 引用值: 比较的是引用的地址
  • 变量赋值:

    • 原始值赋值:赋值的是新值,与原来互不影响
    • 引用值赋值:赋值的是地址,指向原值所在堆内存中的地址
  • 动态属性:

    • 原始值:赋值的是值
    • 引用值:赋值的是地址

http://www.lryc.cn/news/18070.html

相关文章:

  • Delphi RSA加解密
  • oracle基本操作
  • hive只复制表结构不复制表数据
  • 如何将Linux的NIC 名称更改为 eth0 而不是 enps33 或 enp0s25,只要几秒钟
  • 位运算笔记
  • 2023全国首个区块链平台发布,区块链绿色消费积分系统玩法悄然上市
  • 【异常】因为忘加了租户查询条件,导致重复ID导入失败Duplicate entry ‘XXX‘ for key ‘PRIMARY‘
  • 证明CPU指令是乱序执行的
  • css 属性和属性值的定义
  • Python获取中国大学MOOC某课程评论及其参与人数
  • 【C++】类和对象(完结篇)
  • 低代码开发可以解决哪些问题?
  • Linux 中使用 docker-compose 部署 MongoDB 6 以上版本副本集及配置 SSL / TLS 协议
  • JavaWeb--Mybatis练习
  • Springer-MTA期刊上传Latex要求
  • Graph Embedding基础 图表示学习 什么是Graph Embedding
  • 某直聘tp_token解析
  • 替代启攀微8按键触控八通道触摸芯片-GTC08L
  • Zabbix“专家坐诊”第182期问答汇总
  • PHP、Nginx、openssl ECC证书搭建
  • 秒杀服务------技术点及亮点
  • 【Python数据挖掘入门】一、数据挖掘概况
  • 【python】anaconda 管理 python 环境
  • 线上插画培训班有用吗,教你选靠谱的插画课程
  • 吃鸡用什么蓝牙耳机效果好?手游吃鸡公认最好的几款蓝牙耳机
  • 四个步骤在CRM系统中设置游戏化机制
  • 2023年TikTok营销如何破局?品牌应做好这6点
  • 2023年CDGA考试-第5章-数据建模和设计(含答案)
  • 蓝桥杯入门即劝退(二十)快乐数(我不快乐了)
  • Aspose.Imaging for .NET V23