Posts
JavaScript的诞生
JavaScript 的简介 JavaScript（通常缩写为JS）是一种高级的、解释型的编程语言。JavaScript是一门基于原型、函数先行的语言，是一门多范式的语言，它支持面向对象编程，命令式编程，以及函数式编程。
历史 1995年，网景招募了布兰登·艾克，目标是把Scheme语言嵌入到Netscape Navigator浏览器当中。但更早之前，网景已经跟昇阳合作在Netscape Navigator中支持Java，这时网景内部产生激烈的争论。后来网景决定发明一种与Java搭配使用的辅助脚本语言并且语法上有些类似，这个决策导致排除了采用现有的语言，例如Perl、Python、Tcl或Scheme。为了在其他竞争提案中捍卫JavaScript这个想法，公司需要有一个可以运作的原型。艾克在1995年5月仅花了十天时间就把原型设计出来了。
最初命名为Mocha，1995年9月在Netscape Navigator 2.0的Beta版中改名为LiveScript，同年12月，Netscape Navigator 2.0 Beta 3中部署时被重命名为JavaScript，当时网景公司与昇阳电脑公司组成的开发联盟为了让这门语言搭上Java这个编程语言“热词”，因此将其临时改名为JavaScript，日后这成为大众对这门语言有诸多误解的原因之一。
微软采纳 JavaScript推出后在浏览器上大获成功，微软公司在不久后就为Internet Explorer 3浏览器推出了JScript，以与处于市场领导地位的网景产品同台竞争。JScript也是一种JavaScript实现，这两个JavaScript语言版本在浏览器端共存意味着语言标准化的缺失，发展初期，JavaScript的标准并未确定，同期有网景的JavaScript，微软的JScript双峰并峙。除此之外，微软也在网页技术上加入了不少专属对象，使不少网页使用非微软平台及浏览器无法正常显示，导致在浏览器大战期间网页设计者通常会把“用Netscape可达到最佳效果”或“用IE可达到最佳效果”的标志放在主页。随着Internet Explorer 4的发布，微软引入了动态HTML的概念，但语言实现和不同专有化的文档对象模型的差异仍然存在，成为网络上普及使用JavaScript的阻碍。
标准化 1996年11月，网景正式向ECMA（欧洲计算机制造商协会）提交语言标准。1997年6月，ECMA以JavaScript语言为基础制定了ECMAScript标准规范ECMA-262。JavaScript成为了ECMAScript最著名的实现之一。
Posts
Simple_url
URL的简单基础知识 URL 包含哪几部分 URL 全称是Union Resource Location，包括了：
协议 域名 端口 路径 查询参数 锚点 协议 网络协议是通信计算机双方必须共同遵从的一组约定，常用的有TCP/IP，基于此封装的上层协议有HTTP/HTTPS
域名 IP的别称
端口 一台机器提供的不同服务
路径 访问资源在服务器的地址路径
查询参数 访问资源的自定义选择参数
锚点 前端显示的资源定位，不传给服务器
DNS DNS 全称是Domain Name Server，域名解析服务，使用 nslookup 命令可以查到DNS记录的生存时间还可以指定使用哪个DNS服务器进行解释
IP 功能是
定位一台设备 封装数据报文，跟其他设备交流 域名 IP与域名的关系 一个域名可以对应不同的IP
负载均衡，防止一台机器扛不住
一个IP可以对应不同域名
共享主机，资源不足才这么使用
加了www的域名 www.域名和域名不是同一个域名，比如：com是顶级域名，域名.com是一级域名，www.域名.com 二级域名
Posts
CSS知识篇
这篇主要介绍浏览器的渲染原理和CSS动画。
浏览器渲染原理 渲染树构建、布局及绘制 整个过程可以概括为根据 HTML 和 CSS 输入构建了 DOM 树和 CSSOM 树，再将CSSOM 树和 DOM 树合并成渲染树，然后用于计算每个可见元素的布局，并输出给绘制流程，将像素渲染到屏幕上。
简要概述了浏览器完成的步骤：
处理 HTML 标记并构建 DOM 树。 处理 CSS 标记并构建 CSSOM 树。 将 DOM 与 CSSOM 合并成一个渲染树。 根据渲染树来Layout布局（文档流、盒模型、计算大小和位置），以计算每个节点的几何信息。 Paint绘制（把边框颜色、文字颜色、阴影等画出来）。 Compose合成（根据层叠关系展示画面）到屏幕上。 关于DOM 和 CSSOM 合并成一个“渲染树”，浏览器大体上完成了下列工作： 从 DOM 树的根节点开始遍历每个可见节点。
某些节点不可见（例如脚本标记、元标记等），因为它们不会体现在渲染输出中，所以会被忽略。
某些节点通过 CSS 隐藏，因此在渲染树中也会被忽略。 对于每个可见节点，为其找到适配的 CSSOM 规则并应用它们。 发射可见节点，连同其内容和计算的样式。 关于“布局”阶段 合并成一个“渲染树”的过程是计算了哪些节点应该是可见的以及它们的计算样式，但我们尚未计算它们在设备视口内的确切位置和大小—这就是“布局”阶段，也称为“自动重排”。
布局流程的输出是一个“盒模型”，它会精确地捕获每个元素在视口内的确切位置和尺寸：所有相对测量值都转换为屏幕上的绝对像素。
关于“绘制”阶段 将渲染树中的每个节点转换成屏幕上的实际像素。这一步通常称为“绘制”或“栅格化”。
执行渲染树构建、布局和绘制所需的时间将取决于文档大小、应用的样式，以及运行文档的设备：文档越大，浏览器需要完成的工作就越多；样式越复杂，绘制需要的时间就越长（例如，单色的绘制开销“较小”，而阴影的计算和渲染开销则要“大得多”）。
注意点：
visibility: hidden 与 display: none 是不一样的。前者隐藏元素，但元素仍占据着布局空间（即将其渲染成一个空框），而后者 (display: none) 将元素从渲染树中完全移除，元素既不可见，也不是布局的组成部分。 渲染树只包含渲染网页所需的节点。 布局更新样式包含布局、绘制、合成，布局和绘制有可能被忽略。 CSS 动画 主要方式有三种：
Posts
HTML常用标签
这篇主要介绍 a 标签、img 标签和 table 标签的用法。
关于a 标签 属性 1、href（hyper reference） 用来表示超链接，使用类型有：
网址 https://google.com http://google.com //google.com 路径 /a/index.html index.html 伪协议 javascript:; mailto:邮箱 tel:手机号 id 例如：href=#xxx
2、target 表示目标窗口：
_blank （新窗口） _top _parent _self（default） 窗口命名：
window的name 例如：自定义一个target="xxx" 会寻找xxx窗口并打开，没有就新建窗口，命名为xxx。
iframe的name 3、download 4、rel=noopener 代码如下：
<a href="https://www.baidu.com" target="_blank">超链接</a> <a href="/a/index.html">访问a.html</a> <a href="index2.html">访问index2.html</a> <a href="javascript:alert(1)">空链接</a> <a href="mailto:707187137@qq.com">发邮件</a> <a href="tel:10086">打电话</a> <a href="#xxx">id</a> 作用 跳转外部页面 跳转内部锚点 跳转到邮箱、电话 关于img 标签 作用 发出 get请求 展示一张图片
Posts
HTML入门笔记1
HTML简介和简单标签的使用 简介 HTML 是谁发明的？ HTML 是 Tim Berners-Lee 在1990年左右发明的，他的贡献：
发明了第一个浏览器 发明了第一个服务器 用自己的浏览器访问自己的服务器 发明了 WWWW ，同时发明了 HTML 、 HTTP 和 URL HTML 起手应该写什么？ 代码如下：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>Document</title> </head> <body> </body> </html> <!DOCTYPE html>
这是标记文档类型
<html lang="en">
html 标签，可以把 lang = en 改成 lang = zh-CN 。注意，zh-CN 不要写成 zh ，因为不同国家的中文有不同的语言类型。
<head>
<meta charset="UTF-8">
Posts
Create Personal Blog
How to create a personal blog with hugo Open home page of Hugo : A blog generator by go language
press ‘Quick start’ button to create!
Step 1: Install Hugo brew install hugo Step 2: Create a New Site Create the directory to init your blog.If your want to build based github,you need call the directory name as ‘username.github.io’.
hugo new site username.github.io Step 3: Add a Theme ‘cd’ into blog directory