- 博客(120)
- 收藏
- 关注
转载 2019腾讯暑期实习面试(offer)前端
最近在忙着准备找实习,所以没有更新之前的文章.不过所幸功夫不负有心人,我拿到了腾讯的offer.这里分享一下面试的经验.简介本人双非本科,普通学生一枚.面的是腾讯的Web前端开发.整个面试一共有四轮,分为:一面(笔试\初试) 二面(技术\复试) 三面(项目\复试) 四面(HR\终面)一面我是在五月份的时候收到的初试的消息第一面的形式是远程...
2019-06-19 13:35:00
619
转载 node项目自动化部署--基于Jenkins,Docker,Github(3)自动化部署
GitHub仓库由于现在的代码基本上都是多人合作开发,所以肯定会用到像 git 这样的版本控制工具所以这里使用 GitHub 来做一个演示首先我们需要在github上新建一个仓库点击New来新建一个仓库输入一个名字以及描述后点击 create然后将代码上传到GitHub上这里我上传的是一个简单的 hello world 的demo到这...
2019-05-15 13:12:00
230
转载 node项目自动化部署--基于Jenkins,Docker,Github(2)配置节点
上一篇文章中准备工作已经完成的差不多了这一篇主要讲解 Jenkins 上面的相关配置为了让代码部署到所有的子节点上所以我们首先需要在 Jenkins 中添加我们希望代码部署到的节点配置节点首先进入你的 Jenkins 页面然后选中系统管理点击进入系统管理后选择节点管理然后点击新建节点在输入框中为你的节点取一...
2019-04-30 11:24:00
224
转载 node项目自动化部署--基于Jenkins,Docker,Github(1)安装Jenkins
前言每次项目代码更新后都要重新部署,如果只有一台服务器还好.但是如果是分布式系统,动不动就很多台服务器,所以代码的自动部署就显得十分重要了.这里用几篇文章来记录一下如何使用Jenkins,Docker,github来搭建一个自动化部署的node项目.思路使用git进行版本控制,当项目更新时就触发 Jenkins的构建任务Jenkins 从 git ...
2019-04-29 17:31:00
175
转载 XDM-跨文档消息传送
XDMcross-document messaging 类似于XSS的简称,故称为 XDM 而不是 CDM某些时候 XDM 也能作为跨域的实现手段之一与Jsonp 和 传统的 CORS 跨域方式不同XDM通常用于不同域的页面之间传递消息postMessagepostMessage() 方法作为 XDM 的核心被添加进了 HTML5 规范中该方法的作用是:...
2019-04-29 10:33:00
210
转载 UEditor单图上传跨域问题解决方案
UEditorUEditor是百度团队提供的富文本编辑器git地址为:https://github.com/fex-team/ueditor在最近的项目中使用了该插件作为项目的富文本编辑器由于种种原因项目需要采用前后分离的方式,所以会导致该插件的单图上传功能出现跨域问题(CORB)官方对于该问题给出的答复为:由于时间关系来不及改换其他的富文本编辑器...
2019-04-28 16:43:00
421
转载 Javascript高级编程学习笔记(99)—— WebGL(5) 绘图
绘图WebGL只能绘制三种形状:点线三角其它的形状都是由上面的三种形状合成之后绘制到三维空间中的执行绘图操作 WebGL 提供了两种方法:gl.drawElements()gl.drawArrays()这两个方法的第一个参数都是一个常量常量的取值范围如下:gl.POINTS: 将每个顶点当成一个点来绘制gl.LI...
2019-04-26 11:37:00
145
转载 Javascript高级编程学习笔记(98)—— WebGL(4) WebGL上下文(2)
错误Javascript与WebGL之间的一个最大区别在于,WebGL的操作一般不会抛出错误如果希望获取WebGL的错误信息,那么就需要手动调用 gl.getError() 方法该方法会返回以下错误常量之一:gl.NO_ERROR: 上一次操作没有发生错误gl.INVALID_ENUM: 应该给WebGL方法传入常量但是传错了参数gl.INVALID_...
2019-04-25 09:45:00
237
转载 Javascript高级编程学习笔记(97)—— WebGL(3) WebGL上下文(1)
WebGL上下文在支持WebGL的浏览器中,WebGL的名字为 "experimental-webgl",这是由于 webgl 的规范仍未制定完成制定完成后名字就会改为简单的 "webgl"如果浏览器不支持,那么在获取webgl上下文的时候浏览器会返回 null 所以在使用前需要检测返回值基本的获取 WebGL 代码如下:let drawing = documen...
2019-04-24 10:35:00
274
转载 Javascript高级编程学习笔记(96)—— WebGL(2) 类型化视图
类型化视图类型化视图一般也被认为是一种类型化数组.因为其元素必须是某种特定的数据类型,类型化视图都继承自 DataviewInt8Array: 表示8位二补整数(即二进制补数)Uint8Array: 8位无符号整数Int16Array: 16位二补数Uint16Array: 16位无符号整数Float32Array: 32位IEEE浮点值Float64...
2019-04-23 09:28:00
108
转载 Javascript高级编程学习笔记(95)—— WebGL(1) 类型化数组
WebGLwebgl 是针对 canvas 的 3D上下文,与其它Web技术不同,WebGL并非是W3C制定的标准,而是由 Khronos Group 制定的。类型化数组WebGL所涉及的复杂运算需要提前知道数值的精度,但是标准的 JS 无法支持这一诉求。因此WebGL引入了类型化数组这一概念,类型化数组也是数组,与一般的数组没有什么区别,只不过这种数组中所有元素的...
2019-04-22 10:28:00
145
转载 腾讯2019春招一面(电话面试)
腾讯2019春招一面最近有许多事情,导致博客许久没更,所以先更个一面压压惊这件事情的起源有些曲折,所以先做个背景介绍(推销自己一波)本人在读大三学生一名(非985,211),前段时间不少的互联网巨头们开启了新一轮的春招,本人也去凑了热闹。我当时投简历的时候没注意,直接投了校园招聘,但是我发现我的简历直接就灰掉了,意思就是没有进入下一轮。这时我才发现今年的校...
2019-04-19 16:00:00
349
转载 Javascript高级编程学习笔记(94)—— Canvas(11) 合成
合成除了之前介绍的属性之外,还有两个属性会应用到整个2d上下文中;globalAlpha 用于指定所有绘制的透明度globalComposition 用于表示后绘制的图形怎样与先绘制的图形进行结合该属性的值是字符串,可能的值如下source-over(默认) 后绘制的图形位于先绘制的图形的上方source-in 后绘制的图形与先绘制的图形重叠...
2019-03-22 08:12:00
102
转载 Javascript高级编程学习笔记(93)—— Canvas(10) 模式及图像数据
模式模式其实就是重复的图像,用来填充或描边图形要创建一个新模式,可以调用 createPattern()并传入两个参数一个HTML img元素用于表示如何重复的字符串"repeat"重复"repeat-x" 水平方向重复"repeat-y" 垂直方向重复"no-repeat" 不重复如:let image = document.i...
2019-03-21 08:35:00
92
转载 Javascript高级编程学习笔记(92)—— Canvas(9) 渐变
渐变渐变由 canvasGradient 实例表示要创建一个渐变对象需要调用 createLinearGradient() 方法该方法接收四个参数:起点的x坐标起点的y坐标终点的x坐标终点的y坐标调用该方法后会创建一个指定大小的实例,并返回一个 CanvasGradient 实例创建渐变对象后需要指定色标,通过 addColorStop(...
2019-03-20 08:36:00
99
转载 Javascript高级编程学习笔记(91)—— Canvas(8) 阴影
阴影2D上下文将会根据以下属性为形状或路径绘制阴影shadowColor: 用于设置阴影颜色,默认为黑色shadowOffsetX: 形状或路径X方向的阴影偏移量,默认为0shadowOffsetY: 形状或路径y轴方向的阴影偏移量,默认为0shadowBlur: 模糊的像素数,默认为0, 即不模糊这些属性都可以通过 context 对象来修改,只要在绘制...
2019-03-19 07:30:00
103
转载 Javascript高级编程学习笔记(90)—— Canvas(7) 绘制图像
绘制图像2D绘图上下文内置了对图像的支持如果希望将一幅图绘制到画布上,可以使用 drawImage() 的方法该方法有三种不同的参数数组合以对应不同的应用场景将<img>绘制到画布的(x,y)点 context.drawImage(img, x, y)以宽 width 高 height 将<img>绘制到(x, y)点 cont...
2019-03-18 08:11:00
121
转载 Javascript高级编程学习笔记(89)—— Canvas(6) 变换
变换通过上下文的变化,可以对图像进行处理后再将其绘制到画布上当我们创建上下文时,会以默认值初始化变化矩阵,在默认的变换矩阵下所有处理都按描述直接绘制.而当我们为上下文应用变换时,会导致使用不同的变换矩阵进行处理,从而产生不同的结果canvas 上下文为我们提供了以下方法来修改变换矩阵:ratate(angle): 围绕原点将绘制的图像旋转 angle 弧度...
2019-03-17 10:45:00
93
转载 Javascript高级编程学习笔记(88)—— Canvas(5)绘制文本
绘制文本同样的,canvas也为绘制文本提供了相应的方法.2D上下文提供的文本绘制方法主要有两个:fillText()strokeText()这两个方法都接受四个参数要绘制的文本字符串绘制文本的X坐标绘制文本的Y坐标最大像素宽度这些方法都以以下属性为基础:font: 表示文本样式,大小,字体, 该属性以 CSS 中指定...
2019-03-16 10:41:00
133
转载 Javascript高级编程学习笔记(87)—— Canvas(4)绘制路径
绘制路径2D上下文支持许多在画布上绘制路径的方法通过路径可以创造出复杂的形状和线条,要绘制路径首先必须调用beginPath()方法,表示开始绘制路径然后再通过下列的方法绘制路径:arc(x,y,半径,起始角度,结束角度,旋转方向): 用于绘制圆形路径,以(x,y)为圆心,旋转方向为一个bool值表示是否以逆时针方向绘制,起始角度以及结束角度的单位都是弧度...
2019-03-15 14:51:00
141
转载 Javascript高级编程学习笔记(86)—— Canvas(3)绘制矩形
绘制矩形矩形是唯一一种可以直接在2D上下文中绘制的形状.与矩形有关的方法包括:fillRect()strokeRect()clearRect()上述方法都接收四个参数:绘制矩形的 X 坐标绘制矩形的 Y 坐标矩形的宽度矩形的高度这些参数的单位都是像素首先,fillRect() 方法在 canvas 中绘制的矩形会...
2019-03-14 09:14:00
257
转载 Javascript高级编程学习笔记(85)—— Canvas(2)2D上下文
2D上下文使用2D上下文提供的方法可以绘制简单的2D图形,如矩形,弧线和路径;2D上下文的坐标开始域<canvas>元素的左上角,原点坐标为(0,0)后续所有操作的计算都基于原点,x越大表示越靠右,y越大表示越靠下此外<canvas>的width,height属性表示水平和垂直方向上可用像素点的数目填充和描边2D上下文的两种基本...
2019-03-13 09:07:00
103
转载 Javascript高级编程学习笔记(84)—— Canvas(1)基本用法
Canvas绘图Canvas自HTML5引入后,由于其炫酷的效果成为HTML5新增功能中最受欢迎的部分Canvas元素通过在页面中设定一个区域,然后就可以使用JS在其中绘制图形<canvas>元素最早是由苹果公司推出,主要是在 Dashboard 插件中使用,后来该元素被HTML5引入,然后得到主流浏览器的广泛支持canvas除了具备绘制 2D 上下文的...
2019-03-12 10:34:00
114
转载 Javascript高级编程学习笔记(83)—— 富文本选区(3)
富文本选区在富文本编辑器中使用 iframe 的 getSelection() 方法可以获取选中的文本该方法是 window 对象和 document 对象的属性,调用后会返回一个当前选选择文本的 Selection 对象selection 对象拥有下列属性:anchorNode: 选区起点所在节点anchorOffset:选区起点在其所在节点中的偏移量...
2019-03-11 09:11:00
225
转载 Javascript高级编程学习笔记(82)—— 富文本操作(2)
操作富文本与富文本编辑器的交互的主要方式就是使用 document.execCommand() 方法该方法可以对文档执行自定义命令,并且可以应用大多数格式该方法接收三个参数:要执行命令的名称浏览器是否应该为当前页面提供用户界面执行命令的值为了保证跨浏览器的兼容性,最好保证第二个参数为 false,因为Firefox会在该参数为 true 时报错...
2019-03-10 17:08:00
108
转载 Javascript高级编程学习笔记(81)—— 富文本(1)
富文本编辑富文本编辑又称为: WYSIWYG(What You See Is What You Get,所见即所得)常用于博客等用途,虽然没有规范,但是在IE最先引入后其他的浏览器厂商也相继完成了对应功能的实现该技术的本质就是在 HTML 页面中嵌入<iframe>通过设置页面的 designMode 属性,使该页面可以被编辑将该属性设置为 on 后...
2019-03-09 14:53:00
120
转载 Javascript高级编程学习笔记(80)—— 表单(8)表单序列化
表单序列化随着 Ajax 的出现,表单序列化成为一种常见需求以将表单信息序列化为查询字符串为例我们可以利用表单的 type 属性,以及 name 和 value 实现对表单的序列化序列化应满足以下几点要求:对表单字段和值进行 url 编码,使用 & 符号分割不发送表单的禁用字段只发送勾选的复选框和单选按钮不发送 type 为 "reset...
2019-03-08 09:44:00
98
转载 Javascript高级编程学习笔记(79)—— 表单(7)选择框脚本
选择框脚本选择框由<option>和<select>元素创建,为了方便选择框的交互,除了提供表单字段的公有方法之外HTMLSelectElement 类型还提供下列特有的属性和方法:add(newOption, relOption) : 向控件中插入新的 option 位于 relOption 之前multiple : 布尔值,表示空间是否允许...
2019-03-07 11:15:00
103
转载 Javascript高级编程学习笔记(78)—— 表单(6)HTML约束验证API
自动切换焦点使用JS可以极大地提升表单的易用性其中最常用的一种就是当用户填写完当前字段后焦点自动切换到下一个字段以下方的HTML代码为例:<input type="text" name="tel1" id="txtTel1" maxlength="3"><input type="text" name="tel2" id="txtTel2" max...
2019-03-06 10:52:00
117
转载 Javascript高级编程学习笔记(77)—— 表单(5)过滤输入
在日常实践中,我们常常会需要用户按照某种规则输入数据但是文本框在默认情况下缺少验证数据的手段,因此需要使用JS来完成此类过滤输入的操作通过事件和DOM的结合手段就能够将普通的文本框转换为功能型控件屏蔽字符有时候我们需要用户的输入不包含某些字符所以我们可以通过阻止 Keypress 事件的默认事件来完成屏蔽字符的功能以如下代码为例,可以实现一个只能输入数...
2019-03-05 10:03:00
115
转载 Javascript高级编程学习笔记(76)—— 表单(4)选择文本
文本框脚本在HTML中文本框有两种实现方式:<input><textarea>这两种实现方式虽然在多数情况下表现一致,但是两者之间仍存在许多重要区别对于<input>来说,如果需要展现一个文本框则需要将 type 特性设置为“text”通过设置其 size 特性可以指定文本框中能够显示的最大字符数通过 valu...
2019-03-04 10:12:00
82
转载 Javascript高级编程学习笔记(75)—— 表单(3)表单字段
表单字段表单作为web应用中不可或缺的一部分,当然也是可以使用原生的 DOM 元素来访问的除了标准的访问方式之外,每个表单都拥有一个 elements 属性,该属性保存着该表单所有 表单元素 的集合,该集合是一个有序列表,包含着所有的表单字段这些元素在该集合中出现的顺序,与在文档中出现的顺序一致在该集合中可以使用 name 和 在文档中的顺序 来对其中的元素进行索引...
2019-03-01 15:17:00
145
转载 Javascript高级编程学习笔记(74)—— 表单(2)表单提交及重置
表单提交表单的很大一部分作用就是帮助用户完成和服务器的交互所以表单提交是表单中比较重要的部分虽然现如今的大部分应用场景都使用 AJAX 的异步请求来代替表单,但是仍有部分操作需要使用表单来完成,例如上传文件等表单的提交一般来说是通过图像按钮,或者提交按钮来实现的提交按钮既可以是 input 元素 也可以是 button 元素,如下所示:<!--通用...
2019-02-28 11:11:00
249
转载 Javascript高级编程学习笔记(73)—— 表单(1)表单基础
表单JS最初的一个用途就是帮助服务器分担处理表单的责任时至今日,虽然web应用以及JS都有了长足的发展,但是表单依然是现在web应用中比较重要的部分。因为默认的表单控件很丑,所以有时候我们会使用自定义的组件来完成表单的功能,这就需要我们对表单有一个较为详细的了解。表单基础在HTML中,表单是由 <form> 元素表示的,在JS中表单则对应了 HTML...
2019-02-27 11:22:00
85
转载 Javascript高级编程学习笔记(72)—— 模拟事件(2)IE事件模拟
IE中的事件模拟低版本的IE浏览器作为前端开发的一股清流,想避过都不行虽然低版本IE正在逐步被市场淘汰,不得不承认IE8以下的浏览器依然占了不小的份额所以这里大概介绍IE8以下的低版本IE中的事件模拟,如何实现事件模拟首先从实现思路上来说,与DOM标准中的事件模拟并没有太大的差异分为以下几步:创建 event 对象为event 对象指定信息...
2019-02-26 18:49:00
114
转载 Javascript高级编程学习笔记(71)—— 模拟事件(1)DOM事件模拟
事件,指的是网页中某个特定的交互时刻一般来说事件由浏览器厂商负责提供,一般由用户操作或者其它浏览器功能来触发但是有一类特殊的事件,那就是由我们开发人员通过JS触发的事件这些事件和浏览器创建的事件一样,都可以冒泡,并且在其触发时运行事先指定给它的事件处理程序在测试web程序的过程中这种模拟触发事件是一种极其有用的技术,为此DOM2级规范将其纳入规范规范化了模...
2019-02-25 19:41:00
93
转载 Javascript高级编程学习笔记(70)—— 事件(14)内存和性能
由于事件处理程序是现代的web程序交互能力的提供者所以在日常实践中,我们免不了要向页面中添加大量的事件处理程序(不管是用于用户交互还是用于统计用户数据)在创建GUI(图形用户界面)的语言(如C#)中,为GUI中的每一个按钮添加一个onclick事件是司空见惯的事,并且这样做并不会有什么问题但是在JS中情况就截然不同了,因为在web应用中添加到页面上的事件处理程序的数量将...
2019-02-24 10:33:00
72
转载 Javascript高级编程学习笔记(69)—— 事件(13)触摸与手势事件
触摸与手势事件由于移动设备既没有鼠标也没有键盘,所以在为移动浏览器开发交互性网页时,常规的鼠标键盘事件根本不够用所以早期的苹果为Safari 添加了一些与触摸相关的事件随着后面Android的Webkit的加入,让这些触摸事件成为了许多的事实标准基于此,W3C开始制定了 Touch Event 规范所以下面介绍的事件只针对移动设备触摸事件触摸事件会...
2019-02-23 10:00:00
146
转载 Javascript高级编程学习笔记(68)—— 事件(12)设备事件
设备事件随着智能手机与平板电脑的普及,为了更好地让用户与这些设备进行交互浏览器引入了一种新的方式,而一类新的事件也应运而生,这就是设备事件W3C从2011年开始制定关于设备事件的草案下面将会介绍纳入草案的部分设备事件PS.纳入草案不代表大多数浏览器已经实现orientationchange事件苹果公司为 Safari 添加了 orientat...
2019-02-22 10:49:00
127
转载 Javascript高级编程学习笔记(67)—— 事件(11)HTML5事件
DOM规范没有涵盖所有浏览器支持的所有事件而许多浏览器出于满足用户需求,或解决特殊问题的目的,实现了一些自定义事件HTML5列出了浏览器应该支持的所有事件,这里只讨论得到浏览器完善支持的事件(并非全部)contextmenu事件windows95 在PC中引入了上下文菜单的概念,即通过鼠标右键可以调出上下文菜单在该概念提出后不久,该概念也被引入了web 领域...
2019-02-21 21:58:00
101
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人