前端面试题-HTML、HTTP、web综合问题(三)

news2024/9/28 11:20:24

26 你做的⻚⾯在哪些流览器测试过?这些浏览器的内核分别是什么?

  • IE : trident 内核
  • Firefox : gecko 内核
  • Safari : webkit 内核
  • Opera :以前是 presto 内核, Opera 现已改⽤Google - Chrome 的 Blink 内核
  • Chrome:Blink (基于 webkit ,Google与Opera Software共同开发)

27 div+css的布局较table布局有什么优点?

  • 改版的时候更⽅便 只要改 css ⽂件。
  • ⻚⾯加载速度更快、结构化清晰、⻚⾯显示简洁。
  • 表现与结构相分离。
  • 易于优化( seo )搜索引擎更友好,排名更容易靠前。

28 a:img的alt与title有何异同?b:strong与em的异同?

  • alt(alt text) :为不能显示图像、窗体或 applets 的⽤户代理( UA ), alt 属性⽤来指定替换⽂字。替换⽂字的语⾔由 lang 属性指定。(在IE浏览器下会在没有 title 时把 alt 当成 tool tip 显示)
  • title(tool tip) :该属性为设置该属性的元素提供建议性的信息
  • strong :粗体强调标签,强调,表示内容的重要性
  • em :斜体强调标签,更强烈强调,表示内容的强调点

29 你能描述⼀下渐进增强和优雅降级之间的不同吗

  • 渐进增强:针对低版本浏览器进⾏构建⻚⾯,保证最基本的功能,然后再针对⾼级浏览器进⾏效果、交互等改进和追加功能达到更好的⽤户体验。
  • 优雅降级:⼀开始就构建完整的功能,然后再针对低版本浏览器进⾏兼容。
    • 区别:优雅降级是从复杂的现状开始,并试图减少⽤户体验的供给,⽽渐进增强则是从⼀个⾮常基础的,能够起作⽤的版本开始,并不断扩充,以适应未来环境的需要。降级(功能衰减)意味着往回看;⽽渐进增强则意味着朝前看,同时保证其根基处于安全地带

30 为什么利⽤多个域名来存储⽹站资源会更有效?

  • CDN 缓存更⽅便

  • 突破浏览器并发限制

  • 节约 cookie 带宽

  • 节约主域名的连接数,优化⻚⾯响应速度

  • 防⽌不必要的安全问题

31 简述⼀下src与href的区别

  • src ⽤于替换当前元素,href⽤于在当前⽂档和引⽤资源之间确⽴联系。
  • src 是 source 的缩写,指向外部资源的位置,指向的内容将会嵌⼊到⽂档中当前标签所
    在位置;在请求 src 资源时会将其指向的资源下载并应⽤到⽂档内,例如 js 脚本,
    img 图⽚和 frame 等元素
    • 当浏览器解析到该元素时,会暂停其他资源的下载和处理,直到将该资源加载、编译、执⾏完毕,图⽚和框架等元素也如此,类似于将所指向资源嵌⼊当前标签内。这也是为什么将js脚本放在底部⽽不是头部
  • href 是 Hypertext Reference 的缩写,指向⽹络资源所在位置,建⽴和当前元素(锚
    点)或当前⽂档(链接)之间的链接,如果我们在⽂档中添加
  • 那么浏览器会识别该⽂档为 css ⽂件,就会并⾏下载资源并且不会停⽌对当前⽂档的处理。这也是为什么建议使⽤ link ⽅式来加载 css ,⽽不是使⽤ @import ⽅式

32 知道的⽹⻚制作会⽤到的图⽚格式有哪些?

  • png-8 、 png-24 、 jpeg 、 gif 、 svg
    • 但是上⾯的那些都不是⾯试官想要的最后答案。⾯试官希望听到是Webp , Apng 。(是否有关注新技术,新鲜事物)
  • Webp: WebP 格式,⾕歌(google)开发的⼀种旨在加快图⽚加载速度的图⽚格式。图⽚压缩体积⼤约只有 JPEG 的 2/3 ,并能节省⼤量的服务器带宽资源和数据空间。Facebook Ebay 等知名⽹站已经开始测试并使⽤ WebP 格式。* * 在质量相同的情况下,WebP格式图像的体积要⽐JPEG格式图像⼩ 40% 。
  • Apng:全称是 “Animated Portable Network Graphics” , 是PNG的位图动画扩展,可以实现png格式的动态图⽚效果。04年诞⽣,但⼀直得不到各⼤浏览器⼚商的⽀持,直到⽇前得到 iOS safari 8 的⽀持,有望代替 GIF 成为下⼀代动态图标准

33 在css/js代码上线之后开发⼈员经常会优化性能,从⽤户刷新⽹⻚开始,⼀次js请求⼀般情况下有哪些地⽅会有缓存处理?

dns 缓存, cdn 缓存,浏览器缓存,服务器缓存

33 ⼀个⻚⾯上有⼤量的图⽚(⼤型电商⽹站),加载很慢,你有哪些⽅法优化这些图⽚的加载,给⽤户更好的体验。

  • 图⽚懒加载,在⻚⾯上的未可视区域可以添加⼀个滚动事件,判断图⽚位置与浏览器顶端的距离与⻚⾯的距离,如果前者⼩于后者,优先加载。
  • 如果为幻灯⽚、相册等,可以使⽤图⽚预加载技术,将当前展示图⽚的前⼀张和后⼀张优先下载。
  • 如果图⽚为css图⽚,可以使⽤ CSSsprite , SVGsprite , Iconfont 、 Base64 等技术。
  • 如果图⽚过⼤,可以使⽤特殊编码的图⽚,加载时会先加载⼀张压缩的特别厉害的缩略图,以提⾼⽤户体验。
  • 如果图⽚展示区域⼩于图⽚的真实⼤⼩,则因在服务器端根据业务需要先⾏进⾏图⽚压缩,图⽚压缩后⼤⼩与展示⼀致。

34 常⻅排序算法的时间复杂度,空间复杂度

在这里插入图片描述

35 web开发中会话跟踪的⽅法有哪些

  • cookie
  • session
  • url 重写
  • 隐藏 input
  • ip 地址

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/730819.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

照片模糊怎么变清晰?秒变高清图,三个方法分享给你!

对于摄影爱好者和日常使用照片的人来说,需要高清晰度的图片是很常见的需求。在编写文档、制作展示或者从网络获取图片时,我们经常会遇到模糊的照片,这些照片既不能满足我们的需求,也无法直接使用。那么,如何将模糊的照…

OpenCV图像的仿射变换、旋转和缩放

以下是对代码的逐行解释: // 包含必要的OpenCV头文件和C++库文件 #include "opencv2/highgui/highgui.hpp" #include "opencv2/imgproc/imgproc.hpp" #include <iostream> using namespace cv;

大数据/AI 行业案例资源介绍分享

大数据行业案例库是泰迪科技在数据挖掘领域探索10余年和高校资深讲师联合经验总结之作&#xff0c;内容涵盖智能电网、移动电信、医疗健康、网络舆情、电子商务、金融保险、交通运输、信息安全、政务民生等诸多行业&#xff0c;特别适合有数据挖掘相关课程教学的高校、研究所和…

【动态规划算法】第七题: 剑指Offer47.礼物的最⼤价值

&#x1f496;作者&#xff1a;小树苗渴望变成参天大树&#x1f388; &#x1f389;作者宣言&#xff1a;认真写好每一篇博客&#x1f4a4; &#x1f38a;作者gitee:gitee✨ &#x1f49e;作者专栏&#xff1a;C语言,数据结构初阶,Linux,C 动态规划算法\&#x1f384; 如 果 你…

《世界上最伟大的推销员》 - 经典语录与 AIGC解析

文章大纲 第一卷 全新的我第二卷 爱在今天第三卷 坚持到底第四卷 我是奇迹第五卷 最后一天第六卷 控制情绪第七卷 笑遍世界第八卷 提升价值第九卷 立即行动第十卷 我的祈祷 第一卷 全新的我 经典语录 ★ 世界上没有绝望的处境&#xff0c;只有对处境绝望的人。 ★ 怕苦的人苦一…

Redis 从入门到精通【进阶篇】之Redis事务详解

文章目录 0.前言1.Redis 事务基本流程 1.事务详解1.1. 开始事务1.2. 命令入队1.3. 执行事务1.6. 带 WATCH 的事务1.7. WATCH 命令的实现1.8. WATCH 的触发1.9. 事务的 ACID 性质 2.总结2.1. 在事务和非事务状态下2.2. 小结2.3. 为什么Redis 的事务并不是真正的原子操作2.4. 为什…

TCP连接管理(三次握手,四次挥手)

目录 一、回顾一下TCP包头二、连接的建立——“三次握手”三、连接的建立——“四次挥手”保活计时器 一、回顾一下TCP包头 源端口号&#xff08;Source Port&#xff09;&#xff1a;16 位字段&#xff0c;表示发送方的端口号。 目的端口号&#xff08;Destination Port&…

【机器学习核心总结】什么是决策树

什么是决策树 在游戏中遇到敌人是选择攻击还是逃跑&#xff1f;如果选择攻击&#xff0c;是选择普通的物理攻击还是魔法攻击&#xff1f;为达到目标根据一定的条件进行选择的过程&#xff0c;就是决策树(DT Tree)。 决策树模型非常经典&#xff0c;在机器学习中常被用于分类&…

2.3 Web应用 -- 5. Web缓存/代理服务器技术

2.3 Web应用 -- 5. Web缓存/代理服务器技术 Web缓存/代理服务器技术条件性GET方法 Web缓存/代理服务器技术 功能 在不访问服务器的前提下满足客户端的HTTP请求。 为什么要发明这种技术&#xff1f; 缩短客户请求的响应时间减少机构/组织的流量在大范围内(Internet)实现有效的内…

【小沐学C++】libcurl实现HTTP/HTTPS请求

文章目录 1、简介2、下载和编译2.1 下载2.2 编译2.3 使用 3、命令行测试3.1 获取文件头Headers3.2 请求内容Request Content3.3 响应内容Response Content3.4 GET请求3.5 POST请求3.6 其他 4、代码测试3.1 simple.c3.2 url2file.c3.3 simplepost.c3.4 resolve.c3.5 progressfun…

Docker中部署Redis集群与部署微服务项目的详细过程

目录 一、使用Docker部署的好处二、Docker 与 Kubernetes 对比三、Redis集群部署实战四、Spring Boot项目 打包镜像?小结 一、使用Docker部署的好处 Docker的好处在于&#xff1a;在不同实例上运行相同的容器 Docker的五大优点&#xff1a; 持续部署与测试、多云服务平台支…

一、枚举类型——新特性(模式匹配-支配性)

switch 中 case 语句的顺序很重要。如果基类先出现&#xff0c;就会支配任何出现在后面的 case&#xff1a; Dominance.java JDK 17 sealed interface Base { }record Derived() implements Base { }public class Dominance {static String test(Base base) {return switch (ba…

稳扎稳打学爬虫09—chromedriver下载与安装方法

chromedriver下载与安装方法 1. 获取chromedriver.exe2. 将chromedriver.exe 应用程序复制到浏览器的安装目录下3. 将chromedriver.exe 应用程序复制到python安装目录下4.进行测试5.有可能的报错 1. 获取chromedriver.exe http://chromedriver.storage.googleapis.com/index.h…

SpringBoot整合shiro项目完成认证功能

springboot整合shiro完成认证功能 一、准备阶段&#x1f95d; 1.创建springboot工程&#x1f353; 2.引入依赖&#x1f353; <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi&…

Visual Studio Code 编辑器实用插件简介

Visual Studio Code 编辑器插件 以下是一些常用的 Visual Studio Code 编辑器插件及其简短描述&#xff1a; 2gua.rainbow-brackets&#xff1a;在括号周围添加彩虹色的边框&#xff0c;以帮助区分不同层次的括号。adpyke.codesnap&#xff1a;将代码片段转换为漂亮的图片&am…

第66篇:顶级APT后门Sunburst通信流量全过程复盘分析(修正篇)

Part1 前言 由于先前文章存在部分错误&#xff0c;原文ABC_123已删除&#xff0c;上周末把文章修正&#xff0c;重新发布。 大家好&#xff0c;我是ABC_123。前面几周分享了Solarwinds供应链攻击事件的详细攻击流程及Sunburst后门的设计思路&#xff0c;但是多数朋友还是对Sun…

各种软件的启动界面(SplashScreen)修改汇总

最近装了新电脑&#xff0c;搞了一波萌化&#xff0c;顺便把我常用软件的启动界面也给换了&#xff0c;包括adobe全家桶、UE、3dsMax、Maya、JB家的几个&#xff0c;&#xff08;Office想换没换成功&#xff0c;找了很久没找到方法&#xff0c;不知道有没大佬知道&#xff09; …

在阿里云上部署Springboot项目

文章目录 环境准备1.安装jdk2.安装mysql3.开启端口 上传项目1.数据库上传2.项目上传 环境准备 1.安装jdk 查看系统中原来是否含有java环境 rpm -qa |grep java rpm -qa |grep jdk rpm -qa |grep gcj其中&#xff0c;gcj是一个轻巧的&#xff0c;性能优越的Java语言编译器。它…

SpringSecurityOAuth2 中 Miss grant type问题

SpringSecurityOAuth2 登录传值的时候会出现 Miss grant type问题 没有设置content-type问题 Content-Type: application/x-www-form-urlencoded 解决

timingPath/set_data_check和set_max_delay/set_multicycle_path

目录 0.timing path 1.set_data_check 1.1set_data_clk约束cdc path 1.2 set_data_check和set_max_delay区别和使用场景 2.set_mulicycle_path 0.timing path timing path的概念&#xff1a; start和end不只是reg的CP和REG的D pin 还可以是mem的D/Qpin和 port port--&…