AwsuEver-优快云博客

原创关于git，学会这个就够用了

Observe more，Think more注：关于git，这是一篇总结性文章，希望对您有所帮助雷锋和雷峰塔、老婆和老婆饼、js和jsp、git和github一、什么是git官方说明：Git是一个免费的开源分布式版本控制系统，旨在快速高效地处理从小型到大型项目的所有内容简而言之，git是一个分布式版本控制系统...

2021-02-01 00:07:13 222

原创 CSS3动画开发指南之逐帧动画

最近在公司开发的项目中需要用到多个图片逐帧动画的效果，参考了他人的博客，在这里写出来记录一下（主要是我对自己转头就马什么梅的记忆力没信心）什么是逐帧动画维基百科中的定义：定格动画，又名逐帧动画，是一种动画技术，其原理即将每帧不同的图像连续播放，从而产生动画效果。简而言之，实现逐帧动画需要两个条件：（1）相关联的不同图像，即动画帧；（2）连续播放。了解了什么是逐帧...

2019-01-28 16:52:57 742

原创 js获取网页屏幕及元素的高度宽度和位置（超详细）

前端开发中我们常遇到对浏览器宽高和位置的获取问题，今天这篇文章将详细列出获取浏览器各种距离的方法网页可见区域宽：document.body.clientWidth网页可见区域高：document.body.clientHeight浏览器工作高度:document.documentElement.clientHeight网页可见区域宽：document.body.offs...

2018-12-02 21:48:31 3181

原创你需要知道的一些查找算法

数据查找是一个程序员经常会遇到的问题，了解一些查找算法会让我们的查找更快速更高效。（一）顺序查找条件：无序或有序队列。　　原理：按顺序比较每个元素，直到找到关键字为止。　　时间复杂度：O(n)var arr=[1,3,4,9,8,7,6,5];function sequenceFind(arr,tag){ for(var i=0; i<arr.length...

2018-11-20 18:17:35 274

转载前端开发的一些问题之防抖与节流

博客转载自：https://www.cnblogs.com/chenqf/p/7986725.html前端开发中我们经常会通过监听某些事件来完成项目需求1.通过监听 scroll 事件，检测滚动位置，根据滚动位置显示返回顶部按钮2.通过监听 resize 事件，对某些自适应页面调整DOM的渲染（通过CSS实现的自适应不再此范围内）3.通过监听 keyup 事件，监听文字输入并调用接口进行模...

2018-11-19 11:40:56 416

转载关于前端安全的一些内容

最近复习前端安全的时候读到一篇文章，借鉴过来共同学习。http://blog.nsfocus.net/offensive-defensive-stances-web-security/ 关于Web安全的问题，是一个老生常谈的问题，作为离用户最近的一层，我们大前端确实需要把手伸的更远一点。我们最常见的Web安全攻击有以下几种XSS 跨站脚本攻击CSRF 跨站请求伪造clickj...

2018-10-31 18:28:56 399

转载浅谈box-sizing属性

前言初学 css 的时候 div 的一些宽高问题经常会引起一些不好理解的问题，这里做一个关于css盒模型的分享。问题下面的代码可以直接复制出去运行哦<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>cs

2018-10-25 10:44:09 532

转载 css中形形色色的画图

在CSS中画图用border的属性来完成，今天我们就来看看利用CSS怎样绘制出好看又实用的图CSS border 属性定义和用法border 简写属性在一个声明设置所有的边框属性。可以按顺序设置如下属性：border-width border-style border-color如果不设置其中的某个值，也不会出问题，比如 border:solid #ff0000; 也是允...

2018-10-19 19:08:30 425

原创 CSS中的Flex布局

在了解Flex布局前我们先看一看传统的布局：布局的传统解决方案，基于盒子模型，依赖 display 属性 + position 属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现下面就该Flex布局登场了：2009年，W3C 提出了一种新的方案----Flex 布局，可以简便、完整、响应式地实现各种页面布局。目前，它已经得到了所有浏览器的支持，这意味着...

2018-10-19 14:36:31 199

原创 CSS中的BFC详解

这篇文章是我对BFC的理解和借鉴其他优秀文章中的一些总结，希望让大家有收获。一、何为BFC BFC（Block Formatting Context）格式化上下文，是Web页面中盒模型布局的CSS渲染模式，指一个独立的渲染区域或者说是一个隔离的独立容器。二、形成BFC的条件 1. float 除了none以外的值　　2. overflow 除了visib...

2018-10-18 17:05:46 411

转载 CSS中的布局方式（两栏布局、三栏布局）

此文章转载自：https://blog.youkuaiyun.com/crystal6918/article/details/55224670方法一：浮动布局&lt;div id = "aside"&gt;&lt;/div&gt;&lt;div id = "main"&gt;&lt;/div&gt;

2018-10-15 20:39:57 1472 1

原创 CSS实现水平垂直居中

1：设置margin:auto方法这个方法使用了一个 position:absolute，有固定宽度和高度的 div。这个 div被设置为 top:0; bottom:0;。但是因为它有固定高度，其实并不能和上下都间距为 0，因此 margin:auto; 会使它居中。使用 margin:auto;使块级元素垂直居中是很简单的。#out{ width: 200px; h...

2018-10-12 20:27:43 213

转载牛客网在线编程js的输入输出问题

原牛客网在线编程JavaScript输入和输出处理方法近段时间在牛客网刷题，到目前为止刷了53道编程题（其中包括23道剑指offer编程题，30道各大厂往年的校招真题）。刚开...

2018-10-11 10:29:32 2219

原创关于HTML5中WebSocket的一些理解

在之前的一篇文章中我初略的介绍了一下WebSocket，今天我们将看一看关于WebSocket的深层次理解。一：什么是HTML5中的WebSocketWebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。WebSocket 使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在 WebSocket API 中，浏览器和服...

2018-10-08 17:22:49 856

原创理解JS中变量提升和函数声明提升

（一）变量提升：1.变量定义ES6之前可以使用var关键字来定义一个变量；若变量未初始化，则变量的值为undefined2.变量作用域根据变量作用域可以分为全局变量和局部变量；全局变量的作用域为全部作用域；局部变量作用域为函数内；在函数作用域内，若全局变量名和局部变量名相同，那么局部变量的优先级会高于全局变量，也就是说局部变量的值会覆盖全局变量的值；在JS变量声明中，若不使...

2018-10-01 15:30:22 503

原创 JS——call()和apply()的用法

在上一篇文章中我们对js中的this指向问题进行了介绍，其中涉及到call()和apply()方法,在这篇文章中，我们将对call()和apply()进行探讨；首先我们来说说这两种方法的共同点：1. 每个函数都包含两个非继承而来的方法：call()方法和apply()方法。2.这两个方法的作用是一样的。都是在特定的作用域中调用函数，等于设置函数体内this对象的值，以扩充函数赖以运行...

2018-09-23 17:06:43 673

原创 JS——this详解

在这篇文章中，我们将探讨一下js中的this关键字，了解js中的this指向问题。阮一峰老师对this关键字的概括为：它代表函数运行时，自动生成的一个内部对象，只能在函数内部使用。这句话看似平常，可是要非常注意三个字：“运行时”，这说明this关键字只与函数的执行环境有关，而与声明环境没有关系。首先，必须搞清楚在JS里面，函数的几种调用方式: 普通函数调用作为方法来调用...

2018-09-22 17:48:30 385 1

原创 CSS清除浮动的几种方法

什么是清除浮动？在非IE浏览器（如Firefox）下，当容器的高度为auto，且容器的内容中有浮动（float为left或right）的元素，在这种情况下，容器的高度不能自动伸长以适应内容的高度，使得内容溢出到容器外面而影响（甚至破坏）布局的现象。这个现象叫浮动溢出，为了防止这个现象的出现而进行的CSS处理，就叫CSS清除浮动。下面是一个没有清除浮动的例子：.news { backg...

2018-09-20 11:10:09 214

原创前端需要掌握的网络知识（2）

在上一篇文章中我们介绍了网络的七层协议，详细介绍了应用层的协议，在这篇文章中我们将先看一看HTTP和HTTPS，然后会看一看其他层的协议。一：HTTP和HTTPSHTTP（全称：HTTP-Hypertext transfer protocol) 是一种详细规定了浏览器和万维网服务器之间互相通信规则的协议。HTTPS（全称：Hypertext Transfer Protocol over...

2018-09-06 23:47:32 1264

原创前端需要掌握的网络知识（1）

作为一个前端人员必须对网络知识有所了解，理解web请求的详细过程，这篇文章我们将会看一看关于web请求的一些网络知识一：计算机网络的七层协议应用层：（1）应用层是最靠近用户的OSI层。这一层为用户的应用程序（例如电子邮件、文件传输和终端仿真）提供网络服务。（2）应用层是网络应用协议以及它们的应用层协议存留的地方。应用层协议分布在多个端系统上，一个端系统中的应用程序使用协议与另一个...

2018-09-06 11:16:54 7558

原创 JS创建对象方法（2）

原型模式：先来看一个例子吧function Person(){}Person.prototype.name = “saw”;Person.prototype.age = “22”;Person.prototype.job = “no”;Person.prototype.sayName = function(){ alert(this.name);}var perso...

2018-09-05 13:03:44 187

原创 JS创建对象方法（1）

一、工厂模式function createPerson(name, age, job) {&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;var o = new Object();&amp;nbsp;&amp;

2018-08-29 13:25:02 156

原创 HTTP状态码

100 客户端应当继续发送请求。这个临时响应是用来通知客户端它的部分请求已经被服务器接收，且仍未被拒绝。客户端应当继续发送请求的剩余部分，或者如果请求已经完成，忽略这个响应。服务器必须在请求完成后向客户端发送一个最终响应。 101 服务器已经理解了客户端的请求，并将通过Upgrade 消息头通知客户端...

2018-08-24 09:20:31 602

转载 localStorage使用时需要注意的问题

一、localStorage，sessionStorage，cookie的简单介绍localStorage:仅在客户端存储不参与服务器通信，存储大小一般为5M，如果不是人为清除，那么即使是关闭浏览器也会一直存在。sessionStorage:仅在客户端存储不参与服务器通信，存储大小一般为5M，会话级存储，也就是说如果关闭当前页面或者浏览器那么就会清除cookie:...

2018-08-23 09:24:27 12426 2

原创 HTML5存储技术

HTML5 web缓存 HTML5 web 存储,一个比cookie更好的本地存储方式。什么是HTML5 web缓存使用HTML5可以在本地存储用户的浏览数据。早些时候,本地存储使用的是 cookie。但是Web 存储需要更加的安全与快速. 这些数据不会被保存在服务器上，但是这些数据只用于用户请求网站数据上.它也可以存储大量的数据，而不影响网站的性能.在HTML5之前，浏览器...

2018-08-21 18:31:21 343

原创 JS闭包的深入理解

闭包（closure）是Javascript语言的一个难点，也是它的特色，很多高级应用都要依靠闭包实现。要理解闭包，我们首先理解一下变量作用域的概念： 1.变量作用域 js中的变量有两种：全局变量，局部变量 js有一个特殊之处在于函数内部可以读取到全局变量var n=999;　　function f1(){　　　　alert(n);　　}　　f1(); // 999但...

2018-08-20 10:12:25 223

原创 JS对节点的操作

1）创建新节点　　createDocumentFragment() //创建一个DOM片段　　createElement() //创建一个具体的元素　　createTextNode() //创建一个文本节点2）添加、移除、替换、插入　　appendChild() //添加　　removeChild() //移除　　replaceChild() //替换　　inser...

2018-08-16 15:17:43 1611

引用类型：引用类型通常叫做类（class），也就是说，遇到引用值，所处理的就是对象1：Object类型创建方法：//方法（1）var dog = new Object(); var person = new Object();person.name = &amp;amp;amp;quot;Nicholas&amp;amp;amp;quot;;person.age = 29;//方法（2）var person = {name : &amp

2018-08-15 17:01:11 200

原创 JS中的数据类型（一）

一：类型五种基本数据类型（Undfined,Null,String,Number,Boolean）一种引用类型（Object）二：类型检测对于基本数据类型的检测可以使用 typeof 进行检测，typeof是一个操作符不是一个函数typeof 'abcdef' //stringtypeof 15 //number...

2018-08-15 13:24:03 165

原创 js中跨域问题详解

*什么是跨域？* 概念：只要协议，端口，域名有一个不同，都被当做不同的域；URL—————————————–说明———————————- 是否允许通信http://www.a.com/a.js http://www.a.com/b.js —————域名相同————————————可以通信http://www.a.com/lab/a.js http://www.a.com/scri...

2018-08-11 14:40:00 236

AwsuEver