自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(28)
  • 资源 (1)
  • 收藏
  • 关注

原创 js浅拷贝与深拷贝

概念浅拷贝:只拷贝最外面一层的数据;更深层次的对象,只拷贝引用。深拷贝:拷贝多层数据;每一层级别的数据都会拷贝。总结:拷贝引用的时候,是属于传址,而非传值。关于传值和传址的区别,是很基础的内容,详见《JavaScript 基础/对象简介.md》这篇文章。深拷贝会把对象里所有的数据重新复制到新的内存空间,是最彻底的拷贝。浅拷贝的实现方式用 for in 实现浅拷贝(比较繁琐)const obj1 = { name: 'qianguyihao', age: 28,

2021-03-17 16:52:15 159

原创 a链接的四种状态:link、visited、hover、active

a链接的四种状态伪类是CSS 用于向某些选择器添加特殊的效果。a标签中有四个:link、visited、hover、active(1)link-设置a对象在未被访问前的样式表属性。(2)visited-设置a对象在其链接地址已被访问过时的样式表属性。(3)hover–设置对象在其鼠标悬停时的样式表属性。(4)active-设置对象在被用户激活(在鼠标点击与释放之间发生的事件)时的样式表属性。定义CSS时候的顺序不同,也会直接导致链接显示的效果不同。原因可能在于浏览器解释CSS时遵循的“就近原

2021-03-17 16:26:10 11225

原创 JS中的显式转换

显式转换显示转换一般指使用Number、String和Boolean三个构造函数,手动将各种类型的值,转换成数字、字符串或者布尔值。搬运工参考博客1参考博客2

2021-03-17 16:01:28 109

原创 前端面试题汇总

前端面试题汇总别人给的170多页面试题汇总,包含方方面面。分享一下。

2021-03-17 15:55:34 132

转载 js隐式转换

隐式转换规则转成string类型: +(字符串连接符) 2…转成number类型:++/–(自增自减运算符) + - * / %(算术运算符) > < >= <= == != === !=== (关系运算符)转成boolean类型:!(逻辑非运算符)坑一:字符串连接符与算术运算符隐式转换规则混淆坑二:关系运算符:会把其他数据类型转换成number之后再比较关系坑三:复杂数据类型在隐式转换时会先转成String,然后再转成Number运算坑四:逻辑非隐式转换与关系运算

2021-03-17 15:48:21 59

原创 阻止事件冒泡和取消默认事件

阻止事件冒泡function stopBubble(event) { var e = arguments.callee.caller.arguments[0]||event; //若省略此句,下面的e改为event,IE运行可以,但是其他浏览器就不兼容 if (e && e.stopPropagation) { //如果提供了事件对象,则这是一个非IE浏览器 console.log('非IE浏览器取消事件冒泡'); e.stopP.

2021-03-17 13:41:17 61

原创 前端图片加载优化问题

1、选择合适的图片格式2、图片压缩3、精灵图(雪碧图)4、自动优化:CDN5、使用svg技术替换图片6、用css和css3制作简单的图标和动画代替gif7、用字体图标库代替图片。8、图片延迟加载。(懒加载)9、将图片压缩成base64格式来节约请求...

2021-03-16 20:40:47 134

转载 Http状态码

Http状态码方便记忆的方法和常见状态码,HTTP状态码分类2XX 请求成功3XX 重定向4XX 客户端错误5XX 服务器错误方便记忆的方法和常见状态码1××(“继续努力”) => 表示接收到请求并且继续处理2××(“开心”) => 表示动作被成功接收、理解和接受3××(“又要跑一趟”) => 为了完成指定的动作,必须接受进一步处理4××(“自己的问题自己解决”) => 客户端发生错误,请求中包含错误语法,请求不能被正确执行5××(“服务不到位”)

2021-03-16 20:18:25 71

原创 如何实现浏览器内多个标签页之间的通信?

本题主要考察数据存储的知识,数据存储有本地和服务器存储两种方式。这里主要讲解用本地存储方式解决。即调用 localStorage、Cookie等本地存储方式。第一种——调用localStorage在一个标签页里面使localStorage.setItem(key,value)添加(修改、删除)内容;在另一个标签页里面监听 storage 事件。即可得到 localstorge 存储的值,实现不同标签页之间的通信。标签页1:<input id="name"> <input

2021-02-27 14:57:15 173

原创 label的作用是什么?怎么用的?

label便签用可以让用户点击文字区域,自动聚焦到当前项的input框。input设置id属性,label设置for属性,for属性的属性值为id属性值。

2021-02-27 14:53:22 419

原创 iframe有那些优缺点?

iframe的优点:iframe能够原封不动的把嵌入的网页展现出来。如果有多个网页引用iframe,那么你只需要修改iframe的内容,就可以实现调用的每一个页面内容的更改,方便快捷。网页如果为了统一风格,头部和版本都是一样的,就可以写成一个页面,用iframe来嵌套,可以增加代码的可重用。如果遇到加载缓慢的第三方内容如图标和广告,这些问题可以由iframe来解决。iframe的缺点:会产生很多页面,不容易管理。iframe框架结构有时会让人感到迷惑,如果框架个数多的话,可能会出现上下、

2021-02-26 13:59:12 169

原创 介绍一下你对浏览器内核的理解?

主要分成两个部分:渲染引擎(Render Engine)和JS引擎。渲染引擎:负责取得网页的内容(html,xml和图像等),整理讯息(例如假如css),以及计算网页的显示方式,然后输出到显示器或打印机。浏览器的内核的不同对于网页的语法解释会有不同,所以渲染的效果也不同。所有网页浏览器、电子邮件客户端以及它需要编辑、显示网络内容的应用程序都需要内核。JS引擎:解析和执行JavaScript来实现网页的动态效果。最开始渲染引擎和JS引擎并没有区分的很明确,后来JS引擎越来越独立,内核就倾向与只指

2021-02-26 13:52:34 487

转载 data-属性的作用是什么?

data-* 属性用于存储页面或应用程序的私有自定义数据。data-* 属性赋予我们在所有 HTML 元素上嵌入自定义 data 属性的能力。存储的(自定义)数据能够被页面的 JavaScript 中利用,以创建更好的用户体验(不进行 Ajax 调用或服务器端数据库查询)。data-* 属性包括两部分:属性名不应该包含任何大写字母,并且在前缀 “data-” 之后必须有至少一个字符属性值可以是任意字符串注释:用户代理会完全忽略前缀为 “data-” 的自定义属性。使用例子<!DOCTY

2021-02-26 13:43:38 2265

原创 说说超链接target属性的取值和作用?

target这个属性指定所链接的页面在浏览器窗口中的打开方式。它的参数值主要有:_blank:在新窗口中打开链接文档_self:默认。在相同的框架中打开链接文档_top:在整个窗口中打开链接文档,用 _top 目标将会清除所有被包含的框架并将文档载入整个浏览器窗口_parent:在父级框架中集中打开_framename:在指定的框架中打开链接文档...

2021-02-26 13:34:30 1324

原创 HTML全局属性(global attribute)有哪些?

accesskey:提供了为当前元素生成键盘快捷键的提示。这个属性由空格分隔的字符列表组成。浏览器应该使用在计算机键盘布局上存在的第一个。autocapitalize:控制用户的文本输入是否和如何自动大写,它可以有以下的值:off or none,没有应用自动大写(所有字母都默认为小写字母)。on or sentences,每个句子的第一个字母默认为大写字母;所有其他字母都默认为小写字母。words,每个单词的第一个字母默认为大写字母;所有其他字母都默认为小写字母。characters,所有的字.

2021-02-26 13:27:56 679

原创 说说你对SVG理解?

SVG可缩放矢量图形( Scalable Vector Graphics )是基于可扩展标记语言( XML ),用于描述二维矢量图形的一种图形格式。 SVG 是 W3C(‘World Wide Web ConSortium’ 即 ’ 国际互联网标准组织 ') 在 2000 年 8 月制定的一种新的二维矢量图形格式,也是规范中的网络矢量图形标准。 SVG 严格遵从 XML 语法,并用文本格式的描述性语言来描述图像内容,因此是一种和图像分辨率无关的矢量图形格式。 SVG 于 2003 年 1 月 14 日成为.

2021-02-26 13:24:15 343

原创 link和@import的区别?

本质上,这两种方式都是为了加载css文件,但还是存在细微的差别。差别1:老祖宗的差别,link属于XHTML标签,而@import完全是css提供的一种方式。link标签除了可以加载css外,还可以做很多其他的事情,比如定义RSS,定义rel连接属性等,@import只能加载CSS。差别2:加载顺序的差别:当一个页面被夹在的时候(就是被浏览者浏览的时候),link引用的CSS会同时被加载,而@import引用的CSS会等到页面全部被下载完再加载。所以有时候浏览@import加载CSS的页面

2021-02-26 13:15:39 454

原创 说说你对HTML语义化的理解?

什么是HTML语义化?基本上都是围绕着几个主要的标签,像标题(h1-h6),列表(li),强调(strong em)等。根据内容的语义化(内容结构化),选择合适的标签(代码语义化),便于开发者阅读和写出更优雅的代码的同时,让浏览器的爬虫和机器很好的解析。为什么要语义化?为了在没有css的情况下,页面也能呈现出很好的内容结构和代码结构。为了提升用户体验,如:title,alt用于解释名词或解释图片信息,lable标签的活用。有利于和搜索引擎建立良好的沟通。方便其他设备解析(如屏幕阅.

2021-02-26 13:02:18 364

原创 请你描述一下 cookies,sessionStorage 和 localStorage 的区别?

相同点:都存储在客户端不同点存储大小cookie数据大小不能超过4k。sessionStorage和localStorage 虽然也有存储大小的限制,但比cookie大得多,可以达到5M或更大。有效时间localStorage存储持久数据,浏览器关闭后数据不丢失除非主动删除数据;sessionStorage数据在当前浏览器窗口关闭后自动删除。cookie设置的cookie过期时间之前一直有效,即使窗口或浏览器关闭数据与服务器之间的交互方式cookie的数据会自动的传递到服

2021-02-26 12:56:53 84 1

原创 什么是WebGL,它有什么优点?

WebGL(全写 Web Graphics Library )是一种 3D 绘图标准,这种绘图技术标准允许把 JavaScript 和 OpenGL ES 2.0 结合在一起,通过增加OpenGL ES 2.0 的一个JavaScript 绑定, WebGL 可以为 HTML5 Canvas 提供硬件 3D 加速渲染,这样 Web 开发人员就可以借助系统显卡来在浏览器里更流畅地展示 3D 场景和模型了,还能创建复杂的导航和数据视觉化。显然, WebGL 技术标准免去了开发网页专用渲染插件的麻烦,可被用于创.

2021-02-26 12:45:42 856

原创 HTML5行内元素有哪些,块级元素有哪些, 空元素有哪些?

行内元素a - 锚点abbr - 缩写acronym - 首字b - 粗体 ( 不推荐 )bdo - bidi overridebig - 大字体br - 换行cite - 引用code - 计算机代码 ( 在引用源码的时候需要 )dfn - 定义字段em - 强调font - 字体设定 ( 不推荐 )i - 斜体img - 图片input - 输入框kbd - 定义键盘文本label - 表格标签q

2021-02-25 17:44:28 453

原创 对WEB标准以及W3C的理解与认识?

WEB标准WEB标准 不是某一个标准,而是一系列标准的集合。网页主要由三部分组成:结构(Structure)、表现(Presentation)和行为(Behavior)。对应的标准也分三方面:结构化标准语言主要包括XHTML和XML,表现标准语言主要包括CSS,行为标准主要包括对象模型(如W3C DOM)、ECMAScript等。这些标准大部分由 万维网联盟 (外语缩写: W3C )起草和发布,也有一些是其他标准组织制订的标准,比如ECMA(European Computer Manufacture

2021-02-25 17:38:56 126

原创 说说你对HTML5认识?(是什么,为什么)

是什么:HTML5指的是包括 HTML 、 CSS 和 JavaScript 在内的一套技术组合。它希望能够减少网页浏览器对于需要插件的丰富性网络应用服务( Plug-in-Based Rich Internet Application , RIA ),例如: AdobeFlash 、 Microsoft Silverlight 与 Oracle JavaFX 的需求,并且提供更多能有效加强网络应用的标准集。 HTML5 是 HTML 最新版本, 2014 年 10 月由万维网联盟( W3C )完成标准

2021-02-25 17:20:56 716 1

原创 你做的网页在哪些浏览器测试过,这些浏览器的内核分别是什么?

浏览器的内核IE(IE浏览器) : trident 内核 -ms-Firefox(火狐浏览器) : gecko 内核 -moz-Safari(苹果浏览器) :webkit 内核 -webkit-Opera(欧朋浏览器):以前是 presto 内核, Opera 现已改用 Google Chrome 的 Blink 内核 -o-Chrome(谷歌浏览器):Blink(基于 webkit , Google 与 Opera Software 共同开发 ) -w

2021-02-25 17:18:02 212

原创 HTML5有哪些新特性、移除了哪些元素?

HTML新特性:图像Canvas多媒体video、audio本地存储localStorage、sessionStorage语义化更好的内容元素article、header、footer、nav、section表单控件date、time、canlendar、url、search新的技术webworker、websocket、Geolocation移除的元素:纯表现的元素u、big、center、strike、tt、font、basefont框架集frame、frameset、nofra

2021-02-25 17:03:02 65

原创 Doctype作用? 严格模式与混杂模式如何区分?它们有何意义?

Doctype作用是什么?(<!DOCTYPE>)声明叫做文件类型定义(DTD),声明的作用为了告诉浏览器该文件的类型。让浏览器解析器知道应该用哪个规范来解析文档。<!DOCTYPE>声明必须在 HTML 文档的第一行,这并不是一个 HTML 标签。严格模式与混杂模式如何区分?严格模式:又称标准模式,是指浏览器按照 W3C 标准解析代码。混杂模式:又称怪异模式或兼容模式,是指浏览器用自己的方式解析代码。如何区分:浏览器解析时到底使用严格模式还是混杂模式,与网页中的 DT

2021-02-25 16:54:33 123

原创 HTML5的优点与缺点?

优点:网络标准统一、HTML5本身是由W3C推荐出来的多设备、跨平台即时更新,提高可用性和改进用户的友好体验有几个新的标签,这将有助于开发人员定义重要的内容可以给站点带来更多的多媒体元素(视频和音频),可以很好的替代Flash和Silverligh涉及到网站的抓取和索引的时候,对于SEO很友好;缺点:安全:像之前Firefox4的web socket和透明代理的实现存在严重的安全问题,同时web storage、web socket 这样的功能很容易被黑客利用,来盗取用户的信息和资料。

2021-02-25 16:17:45 366

原创 浏览器页面有哪三层构成,分别是什么,作用是什么?

浏览器页面有哪三层构成,分别是什么,作用是什么?构成:结构层、表示层、行为层分别是:HTML、CSS、JavaScript作用:HTML实现页面结构,CSS完成页面的表现与风格,JavaScript实现一些客户端的功能与业务。1、网页的结构层(structural layer)由HTML或XHTML之类的标记语言负责创建,标签就是那些出现在尖括号里的单词,对网页的语义含义做出了描述,但这些标签不包含任何关于如何显示有关的信息,例如p标签表达了这样一种语义:“这是一段文本段”。之前页面布局都习惯采用d

2021-02-25 12:07:47 2809 1

前端面试题汇总-分享一下,给面试前端的朋友

前端面试题汇总-分享一下,给面试前端的朋友

2021-03-11

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除