web前端技术
文章平均质量分 52
_panda_
这个作者很懒,什么都没留下…
展开
-
css适配移动端flex css sprite rem
适配和兼容性问题?这个比较重要css篇 ● 识别各种端 ○ meta ■ ● h5 css3新特性 ○ max-width ○ @media screen and (max-width: 650px) ■ 不同规格下使用 ● 长度单位适配使用 ○ em原创 2017-04-11 17:09:05 · 1396 阅读 · 0 评论 -
js----全局变量和局部变量部分讲解
js—-全局变量和局部变量部分讲解以此文作为自己学习的一个总结。关于全局变量和局部变量的一句简单的定义:在函数外声明的变量都为全局变量,在函数内声明的为局部变量。 一、局部变量和全局变量重名会覆盖全局变量 var a = 1; function test1() { var a = 2; alert(a); } test1();// 2 二、转载 2016-12-09 22:15:46 · 470 阅读 · 0 评论 -
在JS方法中返回多个值的方法汇总
在JS方法中返回多个值的方法汇总 在使用JS编程中,有时需要在一个方法返回两个个或两个以上的数据,用下面的几种方法都可以实现: 使用数组的方式,如下:<html><head> <title>JS函数返回多个值</title></head><body> <input type="button" onclick="getNames()" value="test" /> <scri转载 2016-12-09 22:15:11 · 1361 阅读 · 0 评论 -
js/jquery/css 禁用点击事件
js/jquery/css 禁用点击事件> 工作中遇到这种情况: 验证邮箱 页面的重新发送需要在3分钟后才可以点击重新发送,所以在这之前需要禁用他的点击==我网上查了后有一下几种实现方法==1.css禁用鼠标点击事件.disabled { pointer-events: none; }//简单方便 鼠标呈现普通指针状,但是***失去***了点击事件jquery禁用a标签方法101 $(docu转载 2016-12-09 22:13:55 · 13163 阅读 · 0 评论 -
js使用indexOf()和substr()和split()取字符串特定值
学会使用indexOf()和substr()和split()取字符串特定值点我点我 eg:<script>var transferId;transferId = parseInt(urlname.substr(urlname.indexOf("=")+1,urlname.length-1));//transferId = parseInt(urlname.split("/z/").[1原创 2016-12-09 22:13:08 · 2673 阅读 · 0 评论 -
JS使用一个函数获取另外一个函数的多个返回值
废话不多说我们直接看代码╮(╯▽╰)╭<!DOCTYPE html><html lang="en"><head> <title>使用一个 函数 获取另外一个函数的返回值</title> <meta charset="utf-8"></head><body></body><script type="text/javascript" charset="utf-8">windo原创 2016-12-09 22:12:26 · 4977 阅读 · 0 评论 -
css3的box-sizing
Box-sizing 是 CSS3 的Box属性之一,那他当然也遵循CSS的Box model原理。CSS中Box model是分为两种,第一种是W3C的标准模型,另一种是IE的传统模型,他们相同之处都是对元素计算尺寸的模型,具体说就是对元素的width,height,padding,border以及元素实际尺寸的计算关系。W3C的标准 Box Model:外盒尺寸计算(元素空间尺原创 2016-04-24 20:04:38 · 541 阅读 · 0 评论 -
jquery中detach()和remove()区别
JQuery是一个很大强的工具库,在工作中开发中,可是有些方法还是因为不常用到,或是没有注意到而被我们而忽略。 remove()和detach()可能就是其中的一个,可能remove()我们用得比较多,而detach()就可能会很少了 通过一张对比表来解释2个方法之间的不同方法名参数事件及数据是否也被移除元素自身是否被移原创 2016-04-23 20:41:35 · 870 阅读 · 0 评论 -
jQuery对象与DOM对象的区别
jQuery对象与DOM对象1:对于才开始接触jQuery库的初学者,我们需要清楚认识一点:jQuery对象与DOM对象是不一样的2:可能一时半会分不清楚哪些是jQuery对象,哪些是DOM对象,下面重点介绍一下jQuery对象,以及两者相互间的转换。通过一个简单的例子,简单区分下jQuery对象与DOM对象:3:我们要获取页面上这个id为imooc的div元素,然后给原创 2016-04-23 20:18:56 · 1595 阅读 · 0 评论 -
DOM对象和Query对象相互转换
相比较jQuery转化成DOM,开发中更多的情况是把一个dom对象加工成jQuery对象。$(参数)是一个多功能的方法,通过传递不同的参数而产生不同的作用。如果传递给$(DOM)函数的参数是一个DOM对象,jQuery方法会把这个DOM对象给包装成一个新的jQuery对象通过$(dom)方法将普通的dom对象加工成jQuery对象之后,我们就可以调用jQuery的方法了HTML代码原创 2016-04-23 20:12:14 · 926 阅读 · 0 评论 -
jquery中的html()及.text()和.val()的区别
读取、修改元素的html结构或者元素的文本内容是常见的DOM操作,jQuery针对这样的处理提供了2个便捷的方法.html()与.text().html()方法 获取集合中第一个匹配元素的HTML内容 或 设置每一个匹配元素的html内容,具体有3种用法:.html() 不传入值,就是获取集合中第一个匹配元素的HTML内容.html( htmlString ) 设置每一个原创 2016-04-23 20:06:05 · 779 阅读 · 0 评论 -
sass入门学习
作为前端开发人员,你肯定对css很熟悉,但是你知道css可以自定义吗?大家都知道,js中可以自定义变量,css仅仅是一个标记语言,不是编程语言,因此不可以自定义变量,不可以引用等等。面对这些问题,我们现在来引进一个SASS,简单的说,他是css的升级版,他可以自定义变量,可以有if语句,还可以嵌套等等,很神奇吧!那下面我们就来介绍这个神奇的SASS!一、什么是SASSSAS转载 2016-05-13 21:03:25 · 492 阅读 · 0 评论 -
常用数组Array方法: indexOf、filter、forEach、map、reduce使用实例
ECMAScript5标准发布于2009年12月3日,它带来了一些新的,改善现有的Array数组操作的方法。然而,这些新奇的数组方法并没有真正流行起来的,因为当时市场上缺乏支持ES5的浏览器。Array "Extras"没有人怀疑这些方法的实用性,但写polyfill(PS:兼容旧版浏览器的插件)对他们来说是不值得的。它把“必须实现”变成了“最好实现”。有人居然将这些数组方法称之为Arra转载 2016-05-02 20:18:05 · 3906 阅读 · 0 评论 -
关于数组的一些常用函数
关于数组的一些常用函数push()数组尾部增加元素unshift()在数组的头部增加元素;delete()删除数组元素;长度不变只是变成了 undefined;占一个位置pop()删除尾部元素;shift()头部删除元素;遍历数组(数组是对象 for in的遍历方式)join()将数组转换成原创 2016-04-02 18:00:27 · 1522 阅读 · 0 评论 -
实用CSS3属性之 :target伪类实现Tab切换效果
CSS3 :target伪类用来改变页面中锚链接URL所指向的ID样式,例如你要改变描链接指向#tab的元素字体颜色为蓝色,哪么你可以这样写成#tab:target {color:blue}浏览器支持:不支持IE8及以下的IE版本,IE9支持这个属性,其它非IE内核浏览器如:Firefox、Chrome、等这些浏览器都支持。用法::target伪类与:hover、:转载 2016-03-28 14:49:50 · 1536 阅读 · 0 评论 -
基于github for windows&github的团队协作基本操作
首先,我们要在github上团队协作,先要建立一个team,这个自行百度,在github上操作就是;点击打开链接 这是我的有道文章今天主要讲的是怎么操作github for windows和github的协作使用我们先找到自己的team的github地址,如图 ,再选择自己的远程库;cqupt2013/Stage-one当你fork以后,原创 2016-03-27 12:45:09 · 817 阅读 · 0 评论 -
使用JSON.parse()和JSON.stringify()区别
1:parse用于从一个字符串中解析出json对象,如var str = '{"name":"huangxiaojian","age":"23"}'结果JSON.parse(str)Object 1. age: "23" 2. name: "huangxiaojian" 3. __proto__: Object注意:单引号写在{}外,每个属性名都必须用双引号,否则会抛出异常。2: stri转载 2016-12-09 22:17:41 · 786 阅读 · 0 评论 -
flag和jq on 的绑定多个对象和方法
使用flag跳出循环判断,当你判断一个值符合一堆数据中,符合一个就跳出的情况; 调用接口循环嵌套 参数名 要不同eg:<script> for (var i = 0, len = data.list.length; i < len; i++) { if (urlname == data.list[i].id) { util.alert("站点存在!"转载 2016-12-09 22:17:03 · 716 阅读 · 0 评论 -
阻止click点击事件
网上查了后有一下几种实现方法1.css禁用鼠标点击事件.disabled { pointer-events: none; }注:(这个没有试过)2.直接使用阻止事件的进行 e.stopPropatation||e.cancelBubble = truejquery 禁用a标签 方法1$(document).ready(function() {原创 2017-04-11 11:55:23 · 34033 阅读 · 1 评论 -
css3大总结-面使用
1 这里为了面试总结一些常用的css3的用法2 css3动画 animatition//css@keyframes firstAnimate{ form{ background:red; } to{ backgrounf:yellow; }}// 当然我们可以用100% >> 0% @-webkit-keyframes firstAnimate /*原创 2017-03-24 11:32:44 · 424 阅读 · 0 评论 -
js的深浅clone
slice()方法会浅复制(shallow copy)数组的一部分到一个新的数组,并返回这个新数组。 这个方法会返回一个新数组,出来的结果当然和原来的数组不同。所以,c === a//肯定是false。所谓浅复制,是指这样的情况:Array.clone = function(arr) { const ans = []; for(let i = 0; i < arr.leng原创 2017-03-11 21:57:47 · 700 阅读 · 0 评论 -
关于jq 的懒加载指南
W3Cways.com 微信公众号Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预加载的处理方式正好是相反的.在包含很多大图片长页面中延迟加载图片可以加快页面加载速度. 浏览器将会在加载可见图片之后即进入就绪状态. 在某转载 2017-02-25 11:59:08 · 851 阅读 · 0 评论 -
HTTPS 为什么更安全?
HTTPS 为什么更安全,先看这些HTTPS 是建立在密码学基础之上的一种安全通信协议,严格来说是基于 HTTP 协议和 SSL/TLS 的组合。理解 HTTPS 之前有必要弄清楚一些密码学的相关基础概念,比如:明文、密文、密码、密钥、对称加密、非对称加密、信息摘要、数字签名、数字证书。接下来我会逐个解释这些术语,文章里面提到的『数据』、『消息』都是同一个概念,表示用户之间通信的内容载转载 2017-02-22 10:23:43 · 402 阅读 · 0 评论 -
使用canvas fingerprinting追踪用户信息
总结一下使用canvas fingerprinting的过程 需求分析(页未央的点赞模块功能) 详细需求看这里》》 点我《《 - 点赞次数 - 是否登陆 - 登陆了 - 记录userId判断是否点赞 - 没登录 - 1:会出现的问题: - 什么时机产生原创 2017-02-13 11:13:36 · 4938 阅读 · 0 评论 -
浅谈xss
xss详解 link这样来形容XSS “ 如果把浏览器看作WEB2.0后时代的操作系统,那么客户端脚本就相当于传统的应用程序,而XSS的攻击方式其实就相当于在被攻击者的系统上执行了一个木马程序。但这种“木马”有个很大的缺点,就是无法像传统木马那样在操作系统中安家,以后还能自动执行。 ”- XSS又叫CSS (Cross Site Script) ,跨站脚本攻击。它指的是恶意攻击者往Web页面里原创 2017-01-11 11:01:40 · 562 阅读 · 0 评论 -
关于前端的xss防御
最近深入了解了一下XSS攻击。以前总浮浅的认为XSS防御仅仅只是输入过滤可能造成的XSS而已。然而这池子水深的很呐。 XSS的类型总体来说,XSS分三类,存储型XSS、反射型XSS、DOM-XSS。存储型XSS数据库中存有的存在XSS攻击的数据,返回给客户端。若数据未经过任何转义。被浏览器渲染。就可能导致XSS攻击;反射型XSS将用户输入的存在XSS攻击转载 2017-02-17 10:11:00 · 1307 阅读 · 0 评论 -
升级node.js的方法
升级node.js的方法 直接去官网下载一个最新的稳定版本的node安装就可以了,npm包也随便升级了;不过以前的配置还是要自己走一遍,如果嫌麻烦还是按照一下的方法来吧或者使用这个方法 一行命令搞定,省去了重新编译安装的过程。 node有一个模块叫n(这名字可够短的。。。),是专门用来管理node.js的版本的。 首先安装n模块:npm install -g n第二步: 升原创 2017-01-13 10:02:13 · 613 阅读 · 0 评论 -
使用enCode和deCode来解决xss的危害
最近项目网站被一个黑帽来搞了几遍,所以有幸来研究一下xss和漏洞防护,web端,&,<,>(直接在<后面加/,html的扫描过程,当发现<的时候进行close,模式)原创 2017-02-08 09:46:48 · 1061 阅读 · 0 评论 -
被注入js脚本的xss的解决方法
acelan的解决方法// acelan fix xss// 20170110 假红包注入事件function encodeHTML(source) { return String(source) .replace(/&/g, '&') .replace(/</g, '<') .replace(/>/g, '>')原创 2017-01-10 15:20:31 · 4375 阅读 · 0 评论 -
jquery对象的一些讨论
1、jquery选择器$(‘selector’)返回的不是数组,而是封装好的jquery对象。但这个对象有一个特别的地方,就是查询到的节点被以下标为属性,添加到了jquery对象上,所以它看起来像数组,因为它存在一些属性是数字;2、jquery对象有哪些属性和方法?我们可以理解,$(‘selector’)返回了一个对象obj,obj[0]….obj[i]总是返回查询到的第i个节点。除此之外,jque转载 2016-12-15 10:27:30 · 303 阅读 · 0 评论 -
css3的居中,flex和普通的悬挂布局
css3的居中,flex和普通的悬挂布局<!DOCTYPE html><html lang="en"><head> <title>悬挂布局</title> <meta charset="utf-8"> <style type="text/css" media="screen"> * { margin: 0; padding: 0;原创 2016-12-15 10:17:46 · 929 阅读 · 0 评论 -
多种css垂直居中的方法
多种css垂直居中的方法==css3不定宽高水平垂直居中==-webkit-justify-content:center;justify-content:center;//子元素水平居中-webkit-align-items:center;align-items:center;//子元素垂直居中display:-webkit-flex;display:flex;1:固定高宽的垂直居中原创 2016-12-15 10:13:06 · 424 阅读 · 0 评论 -
探究HTML与CSS:!important 和 @import 规则
!important:摘自:http://phpbegin.com/html/23/n-8123.html浏览器支持情况:firefox支持IE不支持!important是CSS1就定义的语法,作用是提高指定样式规则的应用优先权,语法格式{ sRule!important },即写在定义的最后面,并且在分号之前,比如:{font-color: red !importan转载 2016-03-12 15:34:04 · 1971 阅读 · 0 评论 -
js中for in 和 for each in的使用
区别一: for in是javascript 1.0 中发布的。 for each in是作为E4X标准的一部分在javascript 1.6中发布的,而它不是ECMAScript标准的一部分。 这将意味着存在各种浏览器的兼容性问题。for each in,对很多浏览器都不支持的。例如是不支持IE6,IE7,IE8等浏览器的。 区别二: 例: va转载 2016-04-02 19:28:50 · 422 阅读 · 0 评论 -
js库Modernizr的介绍和使用
Modernizr是一个开源的JS库,它使得那些基于访客浏览器的不同(指对新标准支持性的差异)而开发不同级别体验的设计师的工作变得更为简单传统浏览器目前不会被完全取代,令你难以将最新的 CSS3 或 HTML5 功能嵌入你的网站。 Modernizr 正是为解决这一难题应运而生,作为一个开源的 JavaScript 库,Modernizr 检测浏览器对 CSS3 或 HTML5 功能支持情况。转载 2016-03-09 22:09:22 · 1984 阅读 · 0 评论 -
AngularJS 入门学习
AngularJS是Google开源出来的一款 Javascript MVC 框架。利用AngularJS,你可以构建结构清晰、便于测试和维护的前端应用。使用AngularJS,你可以通过directive去定义很多自己的HTML元素属性。AngularJS无缝衔接了HTML(view)和Javascript(model),这样你就不需要去过多地关注Dom如何变化,你只需专注的处理你的数据转载 2015-11-21 21:33:12 · 338 阅读 · 0 评论 -
css中的z-index用法详解
概念z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。 层级关系的比较1. 对于同级元素,默认(或position:static)情况下文档流后面的元素会覆盖前面的。2. 对于同级元素,position不为static且z-index存在的情况下z-index大的元素会覆盖z-index小的元素,即z-转载 2015-11-16 21:09:15 · 3542 阅读 · 1 评论 -
在js中关于随机函数的使用
这次我就来详细的介绍一下Math.random(),以及如何用它来生成制定范围内的随机数。w3school的random()教程定义和用法random() 方法可返回介于 0 ~ 1 之间的一个随机数。语法Math.random()返回值0.0 ~ 1.0 之间的一个伪随机数。实例在本例中,我们将取得介于 0 到 1 之间的一个随机数:转载 2015-11-15 16:52:04 · 3201 阅读 · 0 评论 -
Canvas画板实现一个简单的球在盒子内随机移动效果
HTML5入门之Canvas:如何用Canvas画板实现一个简单的球在盒子内随机移动效果作者:html5Game | 时间:2014-2-25 17:05:14 | [小 大] | 来源:HTML5 | 阅读:12457 | 评论: 0 | 收藏HTML5入门Canvas画板实现球简单盒子随机移动 [摘要]: HTML5提供了一个非常好的标签转载 2015-10-26 20:38:15 · 5584 阅读 · 0 评论 -
AJAX 跨域请求 - JSONP获取JSON数据
AJAX 跨域请求 - JSONP获取JSON数据Asynchronous JavaScript and XML (Ajax ) 是驱动新一代 Web 站点(流行术语为 Web 2.0 站点)的关键技术。Ajax 允许在不干扰 Web 应用程序的显示和行为的情况下在后台进行数据检索。使用 XMLHttpRequest 函数获取数据,它是一种 API,允许客户端 JavaScript 通转载 2015-11-09 21:16:19 · 464 阅读 · 0 评论