代码改变世界

随笔分类 -  前端

jQuery 文档操作 - insertAfter() ,insertBefore(),after(),before() 方法

2020-02-02 23:06 by GarfieldEr007, 280 阅读, 收藏, 编辑
摘要: 这个方法跟prependTo()和appendTo()不一样的地方在于,一个是仍然插入到元素内部,而insertAfter和insertBefore是插入到元素外部。 这里拿insertBefore来作为例子说一下: 使用方法: 第一种方法:插入代码: <html> <head> <script t 阅读全文

前端 算法的时间复杂度和空间复杂度

2020-02-02 12:25 by GarfieldEr007, 891 阅读, 收藏, 编辑
摘要: 算法的评估 对于一个问题,经常有多种不同的求解算法,这时候我们就需要一个对算法进行评估的标准,找出最优的方案,评估一个算法有以下几个维度: 正确性:能正确的实现功能,满足问题的需求。 易读性:通常,写出一个利与人类阅读的代码和利于机器阅读的代码一样重要 健壮性:对于预料之外的输入,也能做出合适的处理 阅读全文

前端矩阵知识

2020-02-02 12:24 by GarfieldEr007, 787 阅读, 收藏, 编辑
摘要: 概述 矩阵,是线性代数中涉及的内容,线性代数在科学领域有很多应用的场景,如下: 大部分同学在大学时期应该都学过一本叫做线性代数的书,如果没猜错的话,你们的老师在教学的时候大多都是概念性的灌输,比如矩阵乘法如何运算,加法如何运算,大家只要记住就ok了,但是大部分同学都不理解,为什么矩阵的乘法要这样算? 阅读全文

浏览器渲染页面的过程

2020-02-02 12:22 by GarfieldEr007, 228 阅读, 收藏, 编辑
摘要: 浏览器渲染页面的过程如下图: 一、解析HTML创建DOM Tree 浏览器解析HTML文档,并构造一颗DOM树(DOM Tree) 二、解析CSS计算样式数据 浏览器构造DOM树的同时,还会解析CSS样式并计算最终的样式数据,生成样式规则。 三、构造渲染树(Render Tree) 根据 DOM T 阅读全文

跨域

2020-02-02 12:21 by GarfieldEr007, 144 阅读, 收藏, 编辑
摘要: 同源策略 定义 同源策略指三个相同:协议相同、域名相同、端口相同,有一个不同即非同源。 主域与子域、域名与域名对应的IP。都是非同源的 意义 同源策略可以算是web安全的基石,没有同源策略就么有安全可言。 非同源的限制 无法共享 cookie/Storage/indexDB 无法操作彼此的 DOM 阅读全文

从输入URL到页面加载完成的过程中都发生了什么事情?

2020-02-02 12:20 by GarfieldEr007, 230 阅读, 收藏, 编辑
摘要: 解析URL 当你在浏览器中输入URL并敲回车之后,浏览器会把URL分成几部分: 1、协议:从计算机获取资源的方式,常见的HTTP、FTP等 2、网络地址:域名或者IP,指示网络中的哪一台计算机 3、资源路径:指示在该计算机上获取哪一个资源 DNS域名解析 当浏览器发现网络地址并不是IP,而是域名的时 阅读全文

前端基础知识

2020-02-02 12:19 by GarfieldEr007, 149 阅读, 收藏, 编辑
摘要: 一、创建函数 函数声明 function fnName(){ } 函数表达式 var fnName = function(){ } 使用Function构造函数 // 参数:Function 接收任意多的参数,但最后一个参数总被认为是函数体,前面的参数是传入新函数的参数 var fnName = n 阅读全文

前端笔记知识

2020-02-02 12:17 by GarfieldEr007, 159 阅读, 收藏, 编辑
摘要: 笔记列表 基础知识 语言基础 函数 数组 字符串 cookie和storage 异步处理 DOM DOM操作 DOM事件 计算机原理 计算机是怎样跑起来的 CSS3 transform BFC Git config配置项 git常用命令及技巧 Git版本控制管理 网络与安全 网络 get和post请 阅读全文

HTTPS:让数据传输更安全

2020-02-02 11:58 by GarfieldEr007, 212 阅读, 收藏, 编辑
摘要: 浏览器安全主要划分为三大块内容:页面安全、系统安全和网络安全。前面我们用四篇文章介绍了页面安全和系统安全,也聊了浏览器和 Web 开发者是如何应对各种类型的攻击,本文是我们专栏的最后一篇,我们就接着来聊聊网络安全协议 HTTPS。 我们先从 HTTP 的明文传输的特性讲起,在上一个模块的三篇文章中我 阅读全文

沙盒:页面和系统之间的隔离墙

2020-02-02 11:56 by GarfieldEr007, 355 阅读, 收藏, 编辑
摘要: 从稳定性视角来看,单进程架构的浏览器是不稳定的,因为只要浏览器进程中的任意一个功能出现异常都有可能影响到整个浏览器,如页面卡死、浏览器崩溃等。不过浏览器的稳定性并不是本文讨论的重点,我们今天主要聊的是浏览器架构是如何影响到操作系统安全的 浏览器本身的漏洞是单进程浏览器的一个主要问题,如果浏览器被曝出 阅读全文

CSRF攻击:陌生链接不要随便点

2020-02-02 11:54 by GarfieldEr007, 447 阅读, 收藏, 编辑
摘要: 中我们讲到了 XSS 攻击,XSS 的攻击方式是黑客往用户的页面中注入恶意脚本,然后再通过恶意脚本将用户页面的数据上传到黑客的服务器上,最后黑客再利用这些数据进行一些恶意操作。XSS 攻击能够带来很大的破坏性,不过另外一种类型的攻击也不容忽视,它就是我们今天要聊的 CSRF 攻击。 相信你经常能听到 阅读全文

跨站脚本攻击XSS:为什么cookie中有httpOnly属性

2020-02-02 11:53 by GarfieldEr007, 663 阅读, 收藏, 编辑
摘要: 通过上篇文章的介绍,我们知道了同源策略可以隔离各个站点之间的 DOM 交互、页面数据和网络通信,虽然严格的同源策略会带来更多的安全,但是也束缚了 Web。这就需要在安全和自由之间找到一个平衡点,所以我们默认页面中可以引用任意第三方资源,然后又引入 CSP 策略来加以限制;默认 XMLHttpRequ 阅读全文

同源策略:为什么XMLHttpRequst不能跨域请求资源

2020-02-02 11:51 by GarfieldEr007, 224 阅读, 收藏, 编辑
摘要: 通过前面 6 个模块的介绍,我们已经大致知道浏览器是怎么工作的了,也了解这种工作方式对前端产生了什么样的影响。在这个过程中,我们还穿插介绍了一些浏览器安全相关的内容,不过都比较散,所以最后的 5 篇文章,我们就来系统地介绍下浏览器安全相关的内容。 浏览器安全可以分为三大块——Web 页面安全、浏览器 阅读全文

HTTP2:如何提升网络速度

2020-02-02 11:50 by GarfieldEr007, 534 阅读, 收藏, 编辑
摘要: 上一篇文章我们聊了 HTTP/1.1 的发展史,虽然 HTTP/1.1 已经做了大量的优化,但是依然存在很多性能瓶颈,依然不能满足我们日益变化的新需求,所以就有了我们今天要聊的 HTTP/2。 本文我们依然从需求的层面来谈,先分析 HTTP/1.1 存在哪些问题,然后再来分析 HTTP/2 是如何解 阅读全文

DOM树:JavaScript是如何影响DOM树构建的

2020-02-02 11:49 by GarfieldEr007, 534 阅读, 收藏, 编辑
摘要: 在上一篇文章中,我们通过开发者工具中的网络面板,介绍了网络请求过程的几种性能指标以及对页面加载的影响。 而在渲染流水线中,后面的步骤都直接或者间接地依赖于 DOM 结构,所以本文我们就继续沿着网络数据流路径来介绍 DOM 树是怎么生成的。然后再基于 DOM 树的解析流程介绍两块内容:第一个是在解析过 阅读全文

页面性能分析:利用chrome做web性能分析

2020-02-02 11:48 by GarfieldEr007, 592 阅读, 收藏, 编辑
摘要: 在上一篇文章中,我们通过开发者工具中的网络面板,介绍了网络请求过程的几种性能指标以及对页面加载的影响。 而在渲染流水线中,后面的步骤都直接或者间接地依赖于 DOM 结构,所以本文我们就继续沿着网络数据流路径来介绍 DOM 树是怎么生成的。然后再基于 DOM 树的解析流程介绍两块内容:第一个是在解析过 阅读全文

this:从JavaScript执行上下文视角讲this

2020-02-02 11:45 by GarfieldEr007, 206 阅读, 收藏, 编辑
摘要: 在上篇文章中,我们讲了词法作用域、作用域链以及闭包,并在最后思考题中留了下面这样一段代码 var bar = { myName:"time.geekbang.com", printName: function () { console.log(myName) } } function foo() { 阅读全文

作用域链和闭包:代码中出现相同的变量,JavaScript引擎如何选择

2020-02-02 11:43 by GarfieldEr007, 264 阅读, 收藏, 编辑
摘要: 理解作用域链是理解闭包的基础,而闭包在 JavaScript 中几乎无处不在,同时作用域和作用域链还是所有编程语言的基础。所以,如果你想学透一门语言,作用域和作用域链一定是绕不开的 那今天我们就来聊聊什么是作用域链,并通过作用域链再来讲讲什么是闭包。 首先我们来看下面这段代码: function b 阅读全文

调用栈:为什么JavaScript代码会出现栈溢出

2020-02-02 11:42 by GarfieldEr007, 1955 阅读, 收藏, 编辑
摘要: 在上篇文章中,我们讲到了,当一段代码被执行时,JavaScript引擎先会对其进行编译,并创建执行上下文。但是并没有明确说明到底什么样的代码才算符合规范 那么接下来我们就来明确下,哪些情况下代码才算是“一段”代码,才会在执行之前就进行编译并创建执行上下文。一般说来,有这么三种情况 当JavaScri 阅读全文

变量提升:JavaScript代码是按顺序执行的吗

2020-02-02 11:40 by GarfieldEr007, 711 阅读, 收藏, 编辑
摘要: 讲解完宏观视角下的浏览器后,从这篇文章开始,我们就进入下一个新的模块了,这里我会对JavaScript执行原理做深入介绍。 今天在该模块的第一篇文章,我们主要讲解执行上下文相关的内容。那为什么先讲执行上下文呢?它这么重要吗?可以这么说,只有理解了JavaScrip的执行上下文,你才能更好地理解Jav 阅读全文