- 博客(35)
- 收藏
- 关注
RSS订阅转载 Web前端性能优化总结
转自：http://www.2cto.com/kf/201604/498725.html 网站的划分一般为二：前端和后台。我们可以理解成后台是用来实现网站的功能的，比如：实现用户注册，用户能够为文章发表评论等等。而前端呢？其实应该是属于功能的表现。并且影响用户访问体验的绝大部分来自前端页面。 而我们建设网站的目的是什么呢？不就是为了让目标人群来访问吗？
2017-09-11 20:24:43
432
转载 HTTP协议
HTTP简介HTTP协议是Hyper Text Transfer Protocol（超文本传输协议）的缩写,是用于从万维网（WWW:World Wide Web ）服务器传输超文本到本地浏览器的传送协议。HTTP是一个基于TCP/IP通信协议来传递数据（HTML 文件, 图片文件, 查询结果等）。HTTP是一个属于应用层的面向对象的协议，由于其简捷、快速的方式，适用于分布式超媒体信
2017-09-09 18:32:37
328
转载 TCP协议详解（多看两遍）
为什么会有TCP/IP协议在世界上各地，各种各样的电脑运行着各自不同的操作系统为大家服务，这些电脑在表达同一种信息的时候所使用的方法是千差万别。就好像圣经中上帝打乱了各地人的口音，让他们无法合作一样。计算机使用者意识到，计算机只是单兵作战并不会发挥太大的作用。只有把它们联合起来，电脑才会发挥出它最大的潜力。于是人们就想方设法的用电线把电脑连接到了一起。但是简单的连到一起是远远不够的，就好像
2017-09-09 18:31:41
328
转载 浏览器页面加载解析渲染机制
为什么要了解浏览器加载、解析、渲染这个过程？了解浏览器如何进行加载，我们可以在引用外部样式文件，外部js时，将他们放到合适的位置，使浏览器以最快的速度将文件加载完毕。了解浏览器如何进行解析，我们可以在构建DOM结构，组织css选择器时，选择最优的写法，提高浏览器的解析速率。了解浏览器如何进行渲染，明白渲染的过程，我们在设置元素属性，编写js文件时，可以减少”重绘“”重新布局
2017-09-09 18:30:39
330
转载 SASS开发环境搭建（webstorm做编辑器）
sass只是了解过，却没有实际操作。下午空余一部分时间，搭个SASS环境扫扫盲吧。遇到的问题还真是不少。sass安装：根据实际操作的过程，总结以下步骤：（限window系统）1、下载RubyInstaller，运行安装（只管点击next即可）。2、在开始程序中找到Start Command Prompt with Ruby，如下图点击后出现命令窗口：
2017-08-22 20:06:16
212
转载 页面锚点的4种方法
最简单的方法是锚点用标签，在href属性中写入DIV的id。如下： div { height: 800px; width: 400px; border: 2px solid black; } h2 { position: fixed;
2017-06-20 11:43:29
2152
原创 关于cookie需要设置路径以及cookie域
今天遇到了一个小问题，在调用cookie的时候，document.cookie = '' ，百度查到是因为我设置cookie的时候没有设置cookie的路径，所以只能在当年目录的页面访问cookie，我希望在父级甚至所有页面都可以访问cookie，我必须设置cookie的路径，path ＝ ／。新的封装cookie：//设置cookie，name是要存的名字，value是对应的值，iday
2017-05-11 17:43:25
3173
转载 html中引入js，不同时候引入的区别
一般html中引入js文件，是head或者body中区别：headJavaScript" src="xx/xx.js">head中引入js文件，在页面初始化时需要用到，比如现在很流行前后端分离，页面初始化时，需要初始化页面数据等，一般会在js中ajax后台接口，返回数据初始化页面，这种时候就需要把js，写在head中body
2017-04-27 10:48:55
773
原创 一些小问题
今天需要判断cookie里的值是否为null，我忽略了cookie里存的值都是string类型的，当从后台调取的值为null的时候，这时cookie里的值应该是"null"，而不是null，所以在判断的时候出现了问题。if (username != 'null') { $('#name').html(username);}if (usernickname != 'nul
2017-04-17 20:20:19
178
原创 关于两个html页面之间的传值
最近项目涉及到了两个页面之间的传值问题，去网上找到了几种方法，分别是利用cookie，url，localstorage。cookie：在a.html创建对应的cookie,在b.html get对应cookie并赋值。localstorage：和cookie基本类似。url：最终决定采用url方式传值。参考了各位大牛的博客，具体方式如下（转载）：HTML页面之间的传值，需要借助
2017-04-17 11:12:33
922
原创 jQuery过滤选择器
script src="../jquery-1.8.3.min.js">script>script> $(function () { //各种过滤选择器 $('li:first').css('background','black'); //选取第一个元素 返回的是单个元素 $('li:last').css('background','
2017-04-01 14:16:19
339
原创 JavaScript面向对象简单拖拽
html>html lang="en">head> meta charset="UTF-8"> title>Titletitle> style> #div1{ width: 200px; height: 200px; position: absolute; b
2017-03-30 18:31:30
276
原创 JavaScript: 原型
每一个JavaScript对象（null除外）都和另一个对象相关联。“另一个”对象就是我们熟知的原型，每一个对象都从原型继承属性。所有通过对象直接量创建的对象都具有同一个原型对象，并可以通过JavaScript代码Object.prototype获得对原型对象的引用。通过关键字new和构造函数调用创建的对象的原型就是构造函数的prototype的原型。例如，Date.prototype的属性继
2017-03-29 17:55:49
236
原创 javascript: 对象概念
对象的属性特性：1.可写，表明是否可以设置该属性的值。2.可枚举，表明是否可以通过for／in循环返回该属性。3.可配置，表明是否可以删除或修改该属性。每个对象拥有三个相关的对象特性：1.对象的原型指向另外一个对象，本对象的属性继承自它的原型对象。2.对象的类是一个标识对象类型的字符串。3.对象的扩展标记指明了是否可以向该对象添加新属性。三类javascript对象
2017-03-29 17:00:41
220
转载 解决ios下，点击延迟300ms的办法
在开发微信端时，发现在Android下面，click事件非常的流畅，而在IOS下却有一定的延迟。查了查资料，发现早在2007年，苹果为了解决在Iphone这种小屏幕浏览器站点的问题，就设置了300毫秒的延迟。这是为了系统判断用户是双击还是单击屏幕。 网上面有很多的解决方案，推荐一个比较好用，而且也是非常稳定的方案 : fastclick.js github 使用方法 在头部加入：
2017-03-23 17:57:18
3256
原创 javascript：逻辑表达式
1.逻辑与&&：运算符首先计算左操作数的值，即首先计算“&&”左侧表达式。如果计算结果是假值，那么整个表达式的结果一定也是假值，因此“&&”这时简单地返回左操作数的值，而不会对右操作数进行计算。反过来讲，如果左操作数是真值，那么整个表达式的结果则依赖于右操作数的值，如果右操作数是真值，那么整个表达式的值一定是真值；如果右操作数是假值，那么整个表达式的值一定是假值。因此，但左操作数是真值时，
2017-03-21 10:50:15
1117
原创 javascript: 相等和不等运算符
“＝＝”，“＝＝＝”用于比较两个值是否相等，当然他们对相等的定义不尽相同。两个运算符允许任意类型的操作数，如果操作数相等则返回true，否则返回false。“＝＝＝”称为严格相等运算符（strict equality）,也称作恒等运算符，用来检测两个操作数是否严格相等。“＝＝”运算符称为相等运算符，他用来检测两个操作数是否相等，这里相等的定义非常宽松，可以允许进行类型转换。“！＝”和“！＝
2017-03-20 19:19:57
1004
原创 javascript用面向对象写简单选项卡
html>html lang="en">head> meta charset="UTF-8"> title>Titletitle> style> #div1 input{ width: 40px; height: 20px; border: 1px solid black;
2017-03-20 18:43:49
291
原创 jQuery Mobile页面加载机制及页面跳转出现的问题
今天初步接触了jQuery Mobile框架，简单总结一下首先，这个简单的项目做到现在，再去用这个框架已经不合适了，但是有一些特效，一些jqm封装的效果还是值得拿来用一下的。比如今天用到了jqm的触摸事件，用来处理轮播图片左右滑动很方便，但是原生js也要学会，弄懂。遇到了几个问题，第一个问题，起初调用jqm框架的时候，没有加 data－role＝page，也没有将ready函数换成pa
2017-03-15 18:32:35
1473
转载 移动端自适应设计的开发思路
互联网上的自适应方案到底有几种呢？就我个人实践所知，有这么几种方案：固定一个某些宽度，使用一个模式，加上少许的媒体查询方案使用flexbox解决方案使用百分比加媒体查询使用rem淘宝最近开源的一个框架和网易的框架有同工之异。都是采用rem实现一稿解决所有设置自适应。在没出来这种方案之前，第一种做法的人数也不少。类似以下说到的拉钩网。看一下流云诸葛的文章。以下摘自：从
2017-03-14 17:00:59
446
转载 jquery实现搜索框历史搜索记录功能
html>html lang="en">head> meta charset="UTF-8"> title>Titletitle>head>body> input type="text" id="inp"> button type="button" id="btn">搜索button> br> div id="keyname">div>
2017-03-14 16:55:31
3168
原创 加载页面文本框自动获得焦点
$('#search_txt')[0].focus();／／先将jq对象转为dom对象可以调用.focus();document.getElementById('search_txt').focus()
2017-03-14 16:50:05
1065
转载 项目常见的函数封装，基于Jquery
/// /* * DIV或元素居中 * @return */ jQuery.fn.mCenterDiv = function () { this.css("position", "absolute"); this.css("border", "1px solid #ccc"); this.css("top", ($(window)
2017-03-13 18:53:02
181
原创 jq ajax基础
script> $.ajax({ url: 'localhost.txt？Date'+Math.random(),//服务器地址,?后面的是处理缓存 type: 'GET'/'POST', //数据传输方式，一般上传用post，调用用get data: {image:image}, dataType: 'json', //数
2017-03-13 14:43:58
188
原创 jq仿淘宝选择产品颜色尺码
$('.slide_color').click(function () { $('.slide_color').eq($(this).index()).toggleClass('this_color').siblings('.slide_color').removeClass('this_color'); $('#selected_color').html($(this).html
2017-03-13 09:41:29
639
转载 2017/3/10 JQuery 淡出、 动画、显示/隐藏切换等效果
1、jQuery slideToggle() 表示简单的 slide panel 效果。html>head>script type="text/javascript" src="jquery-1.7.1.min.js">script>script type="text/javascript">$(document).r
2017-03-10 16:03:25
421
原创 jq删除元素操作
jQuery提供了多个方法进行元素的删除操作，目前用到了remove（），empty（）。1.remove（）是删除指定的元素全部内容，例如：$(this.parentNode).remove();／／删除按钮的父节点但除了这个元素本身得以保留之外，remove() 不会保留元素的 jQuery 数据。其他的比如绑定的事件、附加的数据等都会被移除。这一点与 detach() 不
2017-03-06 18:05:09
1203
转载 jq插入元素
jquery添加插入元素技巧：jquery添加分为在指定元素的里面添加和外面添加两种：里面添加使用（append 和prepend）里面添加又分为在里面的前面添加和后面添加里面的前面添加使用prepend和prependTo里面的后面添加使用append 或appendTo外面添加使用（after和before）
2017-03-06 18:03:41
271
原创 2017/3/6
动态添加select：var oTd=document.createElement('td');var oSel=document.createElement('select');var option='M';var option1='L';var option2='XL';var option3='XXL';oTd.appendChild(oSel);oTr.appendC
2017-03-06 10:55:09
204
原创 2017/3/3
最近用到的几种jq图片轮播。1.不是无缝的轮播：//图片宽度自适应var oImglist=document.getElementById('imglist');var windowWidth=document.body.clientWidth;$('#imglist li').css('width',windowWidth);if (windowWidth>640){
2017-03-03 10:20:44
198
原创 2017/3/1
1.把插入图片封装成新函数，下面的imgpreview方法失效。（待解决）2.定制产品信息页面和＋页面高度太高（已解决）3.¥位置偏下（已解决：没有设置行高，以后不管什么内容都要设置行高，否则在不同的设备会出现这类情况）4.定制表页面太丑（未解决）5.ios设备＋号偏离（已解决：设置绝对定位后，即使top／bottom／left／right某个值为0也要设置上，否则会出这类bug）
2017-03-01 15:01:28
165
原创 2017/2/18 问题合集
入坑144天因为flex的兼容性问题，导致代码臃肿，重新优化了样式表，简单的居中问题不再使用flex属性。同时也学会了如何处理flex兼容性的问题：a{ display: -moz-box; display: -webkit-box; display: -webkit-flex; /* 新版本语法: Chrome 21+ */ display:
2017-02-18 13:41:43
228
转载 HTML5新标签解释及用法
标签定义外部的内容。比如来自一个外部的新闻提供者的一篇新的文章，或者来自 blog 的文本，或者是来自论坛的文本。亦或是来自其他外部源内容。HTML5:HTML4:标签定义 article 以外的内容。aside 的内容应该与 article 的内容相关。HTML5:Aside 的内容是独立的内容，但应与文档内容相关。HTML4:Aside 的内容是独立的内容，但应与文档内容相
2017-02-16 13:36:12
203
原创 2017/2/16 问题合集
入坑第142天1.关于display：flex的兼容性问题，发现在ios上flex盒模型显示不正常。解决办法：display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */ display: -moz-box; /* Firefox 17- */ display: -webkit-flex
2017-02-16 10:42:20
414
原创 2017/2/15 问题合集
今天开通博客，每天遇到的问题和解决办法都会记录在这里。今天是入前端坑的第141天。一. ios连续点击文本会出现选中文字的情况。百度查到有两种解决方式：1.通过js解决，selectstart="return false;" >屏蔽双击选中文字的区域2.通过CSS解决，<div class="picBox"style="-moz-user-select:n
2017-02-16 10:40:06
190
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人