- 博客(34)
- 收藏
- 关注
原创 图解CSS3核心技术与案例实战(by 大漠)阅读笔记
第一章对于尚不完全支持CSS3的浏览器,将引入渐进增强的概念。 渐进增强(Progressive Enhancement):一开始就针对低版本浏览器进行构建页面,完成基本的功能,然后再针对高级浏览器进行效果、交互、追加功能达到更好的体验。优雅降级(Graceful Degradation):一开始就构建站点的完整功能,然后针对浏览器测试和修复。比如一开始使用 CSS3 的特性构建了
2018-02-01 10:56:13 789
原创 knockout click绑定使用事件源对象
应用场景:li中的信息通过ajax请求后使用foreach绑定加载至页面,然后针对每个li绑定click事件,并读取其id属性,进行后续操作。初始代码如下: 若直接使用click绑定,在未点击的情况下,goDetail方法会自动执行,在goDetail方法中打印this对象,打印信息如下:得不到预期效果。将click绑
2017-05-08 21:38:25 3188
原创 knockout中foreach双重嵌套
在开发过程中,一个需求是后台传输table数据,分为header和data两部分,header代表表头,data是json对象,代表每个字段的具体值。table是个json数组。问题是:header代表的表头列数不定,data代表的行数也不定,要实现向表格添加数据。解决方案:html代码:
2017-03-30 17:26:21 4395
原创 解决Bootstrap的row类,引起网页横向滚动条的问题。
在写网页的时候,采用了Bootstrap框架,在使用栅格布局的时候,在父标签中添加row类,发现引起网页出现横向滚动条的问题。查看row类的css样式内容为:.row{margin-left:15px;margin-right:15px;}因此确定就是由于这两个样式因此的。故重写row类的css样式,即.row{margin-left:0px;margin-
2016-04-27 19:36:09 15255
原创 2016年腾讯web前端实习生面试记录
一面:4月15日上午9点,面试约一个小时。1. 自我介绍2. 之前实习的公司主要做什么?3. 项目中用到的director.js的原理4. 简历上三个项目,分些介绍怎么做的。画出整个流程,以及数据量大小。(这里问了很多项目中的细节)5. 项目用了那么多框架,怎么去选择框架?6. knockout兼容性好,它的事件兼容性怎么实现?7. 要用图展示查询结果怎么做?8.
2016-04-18 10:02:02 4987
原创 2016网易web前端开发实习生面试记录
我是2016年4月14日面试的网易web前端开发。一面:上午10点,是一场中规中举的基础面试。面试时间是二十分钟,问题如下:1.你前端开发,一般用什么工具?2. 你调试工具用哪些?3. 在chrome中怎么查看网络和内存?4. 知道哪些前端性能优化的方法?5. CSS3新特性有哪些?6. HTML5新特性有哪些?7. 对原型链的理解。二面:下午一点,主要
2016-04-18 09:42:59 6463 3
原创 前端性能优化十四个规则:
HTTP是一种客户端/服务器协议,由请求和响应构成。浏览器向一个特定的URL发送HTTP请求,URL对应的宿主服务器发回HTTP响应。该协议使用简单的纯文本格式。请求的类型有GET、POST、HEAD、PUT、DELETE、OPTIONS和TRACE。前端性能优化十四个规则:1. 减少HTTP请求。a. 至少80%的最终用户响应时间花在了页面中的组件(图片、脚本、样
2016-04-05 21:47:28 14987 1
原创 SSL——安全套接层
1. SSL(Secure Sockets Layer)是Netscape公司引入的,现在主要使用的是3.0版本。2. SSL在两个套接字之间建立一个安全的链接 ,其中包括以下功能:(1)客户与服务器之间的参数协商;(2)客户和服务器的双向认证;(3)保密的通信;(4)数据完整性保护。3. SSL在通常协议栈中的位置如图所示:应用层(HTTP)
2016-04-04 21:56:04 2548
原创 jQuery选择器
面试阿里的时候,被问到jQuery中的类怎么实现,当时觉得很简单,想当然地回答了document.getElementsByClassName()。直到今天才发现那是个悲剧的开始啊~其实,jQuery的核心是通过CSS选择符查询DOM文档取得元素的引用,从而抛开了getElementById()和getElementByTagName()。以下内容引用于W3School。j
2016-03-28 11:23:12 361
原创 visibility:collapse在不同浏览器
CSS里的visibility属性有个collapse属性值是干嘛用的?在不同浏览器下以后什么区别?当一个元素的visibility属性被设置成collapse值后,对于一般的元素,它的表现跟hidden是一样的,但如果是table相关的元素,例如table行,table group,table列,table column group,它的表现跟display:none一样,也就是说,它们
2016-03-23 16:31:46 4573 1
转载 CSS常见兼容问题解决方案
1.怪异模式问题:漏写DTD声明,Firefox仍然会按照标准模式来解析网页,但在IE中会触发怪异模式。为避免怪异模式给我们带来不必要的麻烦,最好养成书写DTD声明的好习惯。2.IE6双边距问题:在IE6下,如果对元素设置了浮动,同时又设置了margin-left或margin-right,margin值会加倍。例如:HTML:CSS:[url=][/url].myDiv{
2016-03-23 13:36:50 5409
原创 ECMAScript5防篡改对象
1.不可扩展对象使用Object.preventExtensions( )方法,在定义了对象之后,不能再添加新属性和方法。var person={name:"Nicholas"};Object.preventExtensions(person);person.age=20;console.log(person.age); //undefined使用Object.isExten
2016-03-21 22:55:40 363
原创 统计字符串中字母个数
var str = "aaaabbbccccddeeeeeeefgdddhhh";var obj = {};for(var i=0;i<str.length;i++){ var v = str.charAt(i); if(obj[v] && obj[v].value == v){ obj[v].count = ++ obj[v].count; }els
2016-03-21 21:10:47 1820
原创 删除一个数组中重复的元素
var arr1 =[1,2,2,2,3,3,3,4,5,6], arr2 = [];for(var i = 0,len = arr1.length; i< len; i++){ if(arr2.indexOf(arr1[i]) < 0){ arr2.push(arr1[i]); }}console.log(arr2);
2016-03-21 20:58:49 390
原创 跨浏览器的事件对象
testclick me var EventUtil = { addHandler:function(element,type,handler){ if(element.addEventListener){ element.addEventListener(type,handler,false); }else if(ele
2016-03-21 15:59:25 263
原创 Ajax详解
一、Ajax的过程Step1:创建XMLHttpRequest对象,在IE6及以前,创建ActiveXObject对象。function createXHR(){ if (typeof XMLHttpRequest != "undefined") { return XMLHttpRequest(); }else if(typeof ActiveXObject != "un
2016-03-16 16:17:11 417
原创 JavaScript事件机制详解
一、事件处理程序a. DOM0级事件处理程序,被认为是元素的方法。 在事件处理程序中,通过this访问元素的任何属性和方法。b. DOM2级事件处理程序DOM2级事件定义了两个方法,用于处理指定和删除事件处理程序的操作:addEventListener( )和removeEventListener( )。所有节点都包含这两个方法,都接受3个参数:要处理的
2016-03-16 10:54:44 1342
原创 慕课网Zepto.js课程学习笔记
Bootstrap适配移动端Zepto VS jQuery mobile1. Zepto是仿jQuery的实现,但是没有复杂的操作,是轻量级,更像一个工具库;2. jQuery mobile不是jQuery的移动端实现,其进行了触屏优化,包括了UI界面,不是轻量级,而是高度化组件。Zepto 提供了API,例如可以利用html5进行定位或者发短信。Why Zepto?
2016-03-09 20:20:31 462
原创 Ajax请求的理解
Ajax技术的核心是XMLHttpRequest对象(简称XHR)。优点:1. 能够以异步方式从服务器取得更多信息,意味着用户单击后,可以不必刷新页面也能取得新数据。2. Ajax通信与数据格式无关,不一定是XML数据。XHR对象的用法:1. open( )方法。接受3个参数:要发送的请求的类型(get,post等)、请求的URL和表示是否异步发送请求的布尔值。例如
2016-03-08 21:49:46 866
原创 2015AC前端大会笔记
1. 开发眼中的前端交互——by Weber移动web开发 VS PC web开发a. M: HTML——关注meta标签,定制移动web开发的行为和样式b. V:CSS——屏幕分辨率适配c. C: JavaScript——交互优化&性能优化 性能优化——更快:压缩代码、文件合并、后台直出等方法切实改变响应速度交互优化——更好用:
2016-03-08 09:04:15 1076
原创 JavaScript高级程序设计(第3版)第八章读书笔记
第八章 BOM1. BOM的核心对象是window,它表示浏览器的一个实例。在浏览器中,window对象由双重较色,它既是通过JavaScript访问浏览器窗口的一个接口,又是ECMAScript规定的Global对象。这意味着在网页中定义的任何一个对象、变量和函数,都以window作为其Global对象,因此有权访问parseInt( )等方法。2. 由于window对象同时扮演者ECM
2016-03-01 21:51:03 1096
原创 JavaScript高级程序设计(第3版)第七章读书笔记
第七章 函数表达式1. 函数声明有一个重要特征 ,函数声明提升。即在执行代码之前会先读取函数声明,意味着可以把函数声明放在调用它的语句后面。2. 使用arguments.callee实现对函数的递归调用。但在严格模式下,不能通过脚本访问arguments.callee,但可以使用命名函数表达式来达成相同的效果。3. 闭包是指有权访问另一个函数作用域中的变量的函数。创建闭包的常用方式,就
2016-03-01 17:28:22 910
原创 JavaScript高级程序设计(第3版)第六章读书笔记
第六章 面向对象的程序设计1. 数据属性[[Configurable]]:表示能否通过delete删除属性从而重新定义属性。默认值为true。[[Enumerable]]:表示能否通过for-in循环返回属性。默认值为true。[[Writable]]:表示能否修改属性的值,默认为true。[[Value]]:包含这个属性的数据值。默认为undefined。要修改属性默认的
2016-02-29 15:07:03 1278
原创 JavaScript高级程序设计(第3版)第五章读书笔记
第五章 引用类型1. 创建Object实例的方式有两种,第一种是使用new操作符后跟Object构造函数,例如:var person = new Object( );person.name = “Nicholas”;person.age=29;第二种是使用对象字面量表示法。如:var person = {name : “Nicholas”,age :
2016-02-28 21:24:19 568
原创 JavaScript高级程序设计(第3版)第四章读书笔记
第四章 变量、作用域和内存问题1. ECMAScript变量可能包含两种不同数据类型的值:基本类型值和引用类型值。基本类型指的是简单的数据段,而引用类型值指那些可能由多个值构成的对象。基本数据类型是:Undefined、Null、Boolean、Number和String。引用类型的值是保存在内存中的对象。JavaScript不允许直接访问内存中的位置,即不能直接操作对象的内存空
2016-02-27 13:51:21 1096
原创 JavaScript高级程序设计(第3版)第三章读书笔记
第三章 基本概念1. ECMAScript中的一切(变量、函数名和操作符)都区分大小写。2. 标识符是指变量、函数、属性的名字,或者函数的参数。3. 标识符的组成规则是:第一个字符必须是一个字母、下划线(_)或一个美元符号($);其他字符可以是字母、下划线、美元符号或数字。4. ECMAScript标识符采用驼峰大小写格式。
2016-02-26 22:55:26 564
原创 JavaScript高级程序设计(第3版)第二章读书笔记
第二章在HTML中使用JavaScript1. HTML4.01为定义了6个属性:async(异步加载,仅对外部文件有效)、charset、defer(脚本可以延迟到文档完全被解析和显示之后再执行)、language(已废弃)、src、type(可看成language的替代属性,表示编写代码使用的脚本语言的内容类型,即MIME类型,一般写成type=”text/javascrip
2016-02-26 09:59:39 582
原创 JavaScript高级程序设计(第3版)第一章读书笔记
第一章 JavaScript简介1. JavaScript实现由三个部分组成:核心(ECMAScript)、文档对象模型(DOM)、浏览器对象模型(BOM)。2. ECMAScript,由ECMA-262定义,其组成部分:语法、类型、语句、关键字、保留字、操作符、对象3. 五大主流浏览器:IE、Firefox、Safari、Chrome、Opera4.
2016-02-26 09:56:47 646
原创 Image对象生成Base64位编码
在对图片进行编码转换的时候,会出现第一次无效,第二次才有效的情况。后来查找,发现Image对象有complete属性,所有的操作都需要在加载完成之后才能进行,故需要将执行操作写在image.onload中。
2015-12-22 09:57:20 1088
原创 JSON.Stringify()函数使用心得
在前端开发过程中,当传给后台的json对象中某个key-value对是以数组表示的时候,直接把json对象作为data通过ajax请求发送给后台,会报400错误(Bad Request)。原json对象是{ clubId:18,depart:"A",name:"B"},此时,需要先把json对象做JSON.Stringify()操作,此时,发送给后台的json对象是{ "clubId"
2015-11-19 16:27:02 1919
原创 CSS3114: @font-face 未能完成 OpenType 嵌入权限检查。权限必须是可安装的。
在开发web过程中,使用了方正正纤黑、方正正准黑等中文字体,通过font-face引入TTF格式文件,在Firefox、Chrome等浏览器上均能正常显示,但IE9、10及以上的浏览器报错:CSS3114: @font-face 未能完成 OpenType 嵌入权限检查。权限必须是可安装的。 解决办法为:引入ETO格式文件。
2015-08-23 23:04:01 10149
转载 初识font-face用法
写@font-face语句之前,需要获取要使用字体的四种文件格式,确保能在主流浏览器中都能正常显示该字体。.TTF或.OTF,适用于Firefox 、Safari、Opera.EOT,适用于Internet Explorer 4.0+.SVG,适用于Chrome、IPhone.WOFF 知用于Chrome、Firefox
2015-08-14 10:21:26 456
原创 myeclipse2015工程与jdk版本异常
今天运行工程时,抛出了Exception in thread "main" java.lang.UnsupportedClassVersionErro这一异常。解决方案为:Project->Properties->Java Compiler->Configure Workspace Setting,在弹出的页面中进行设置,将jdk设为1.7即可。
2015-08-05 14:33:27 658
原创 jsp页面中form表单提交到数据库的方法
一、基础方法 执行servlet(在web.xml里面配置) --> doService()里面调用jdbc --> 与数据库进行数据交互;二、使用框架 SSH:调用执行Action(在web.xml里面配置Struts2,spring 监听,spring配置文件里面配置hibernate)--> excute()方法里面调用DAO --> DAO里面用hiberna
2015-08-03 16:41:56 5180
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人