前端开发工程师
摘要: CSS是负责布局和渲染的重要角色,漂亮的页面当然能够吸引用户。本文是自己在开发过程中总结的关于CSS与性能的关系,可能有不对之处,希望能够指出。 1、所有的样式尽量放在css文件中,HTML标签中不要写style属性,因为浏览器在所有的样式加载完成之后,才会开始渲染整个页面,写在标签属性必会加长浏览器的渲染时间 2、删除默认样式代码 因为会影响浏览器的执行时间。
摘要: 页面优化是对网页中的HTML代码进行必要的调整,可以有效地精简页面中的冗余代码,加快网页显示速度,减少网页占用搜索引擎服务器的存储空间,提高用户体验和搜索引擎友好性,当然也可以更好的突出页面的主题,提高页面的相关性。
摘要: 本文将分享我在github上常用的一些插件,可能在开发中你会用到它,希望能够帮助你! 前端技术总结 url : https://github.com/JacksonTian/fks 简述: 主要说了对于前端开发人员需要掌握的技术和一些学习资料 ...
摘要: 本文讲解如何使用js生成n到m间的随机数字,主要目的是为后期的js生成验证码做准备。 Math.random()函数返回0和1之间的伪随机数,可能为0,但总是小于1,[0,1) 生成n-m,包含n但不包含m的整数: 第一步算出 m-n的值,假设等于w 第二步Math.
摘要: 我们在开发过程中经常会遇到通过js获取或者改变DOM元素的样式,方法有很多,比如:通过更改DOM元素的class。现在我们讨论原生js来获取DOM元素的CSS样式,注意是获取不是设置 在开始之前先说下获取最终应用在元素上的所有CSS属性对象的意思是,如果没有给元素设置任何样式,也会把浏览器默认的样式返回来。
摘要: 在讲完javascript设计模式之后,本文主要再讲前端开发框架的模式,再讲模式之前,首先介绍下库和框架的区别,两者都是产品开发时的产物,因此很多人并没有很细的区分开来。 库是将代码封装在文件中、允许继承和修改这些文件。
摘要: 前面介绍了一款非常不错的前端框架kendo-ui,如果你想阅读,请点这里。通过使用它一段时间,感觉是非常好用。下面就介绍一下如何使用它和开发自己的组件 引入: 只需要引进下面三个文件即可 kendo.
摘要: 近期在网上看到chrome有个金丝雀版,第一次看到这个版本,所以就将chrome的各个版本进行了了解,chrome是前端开发最好用的工具,不仅仅是它的调试工具,还有他对HTML5/CSS3的兼容性都非常好。
摘要: 随着用户体验的重要性和项目的富客户端化,越来越多的公司将前端与后端分离开来,这时候前端就需要有自己的服务环境。本文将介绍我在开发中所用到的前端服务环境的搭建。 环境: OS: win7 64bit Server: Apache html文件: *.
摘要: 现在有一个需求如图所示,当用户勾选显示明文复选框时,要以明文显示用户输入的密码,去掉勾选时要变回密文,刚开始想到的就是修改输入框的type来决定显示明文还是密文,使用jQuery的attr来做试验,测试结果是chrome,Firefox,ie9+都是好的,在ie8以下就会报错,查找了下原因,ie8中是不允许修改input的type属性,最终换了种思路实现。
HttpWatch: 强大的网页数据分析工具。集成在Internet Explorer浏览器中。只需要选择相应的网站,软件就可以对网站与IE之间的需求回复的通讯情况进行分析并在同一界面显示其相应日志记录。
摘要: 在我们制作页面时CSS hack由于不同的浏览器,比如Internet Explorer,Mozilla Firefox等,对CSS的解析认识不一样,因此会导致生成的页面效果不一样,得不到我们所需要的页面效果。
清除图片下方出现几像素的空白间隙 方法1: img{display:block;} 方法2: img{vertical-align:top;} 除了top值,还可以设置为text-top | middle | bottom | text-bottom,甚至...
摘要: 当点击某个按钮或者某个事件发生出发浏览器打开一个新的窗口,这种交互在我们开发的时候经常会见到,一般有两种方法: 通过a标签,click,当点击click是就会跳转页面 通过javascript的window.
我们经常会在页面的左上角或者右上角看到类似如图所示的标签,比如页面的链接(最常使用)等,下面我们就实现一个简单的标签 实现步骤是先做一个水平长条,使用CSS3的transform来实现旋转,如果是在左上角的话就逆时针旋转45度,右上角顺时针旋转45度。
看了下Arale 项目一些关于JavaScript的编码风格,文档书写规范和注释规范,感觉还不错分享给大家,其实规范并没有标准的答案,只要项目组成员认可就好。 规范讨论 编码风格 文档书写规范 注释规范
摘要: 无论多少人开发一个项目,规范是最初始也是最基本的,一个好的规范不仅让代码看起来完美也能够解决冲突。下面是我在开发时使用的css规范 基本规范: 所有名称小写,符合w3c规范 类名和id,多个变量之间用中划线连接 所有变量只能使用名词 变量定义要符合语义化 基本原则: 以项目名或者一个全局名称为命名空间,例如你的项目名叫demo,则命名空间为demo,这样在多人合作开发时,高度统一如一人编写。
在文本框倒叙输入一文中提到了设置文本框焦点的javascript代码,今天就使用这段代码来做一个Demo。内容就是当删除单词时就一次性删除整个单词,如图所示: 下面我把示例代码贴上: 1 DOCTYPE html> 2 3 4 5 6 7 .
近期公司在做重构,准备换前端框架由Extjs换kendo-ui,问什么要换框架呢?主要有以下几个原因: Extjs太重,偏向后端语言,前端写起来费劲 Extjs执行太慢(这是主要原因),因为Extjs的页面也是用js来生成,这必然会降低性能,影响页面的渲染速度 kendo-ui是一款非常不错的前端框架,你可以在这里看一些Demo。
jQuery Optimization 现在jQuery已经出现在很多项目中,然而许多同学忽略了他的性能问题以及代码质量问题, 下面是我对jQuery的一些性能方面的学习. 选择器 选择器是jQuery中的核心功能,选择同一个DOM元素我们可以使用不同的方法。
所谓的文本框倒叙输入是指输入框的焦点始终在最开始的位置,如图所示,当我输入123456789时,在输入框上显示的是987654321。 为什么要做这个Demo?是因为在项目中遇到了,项目需求是两个输入框,一个正序输入,另一个倒叙输入。
变量声明前置: 所谓的变量声明前置就是在一个作用域块中,所有的变量都被放在块的开始出声明,下面举个例子你就能明白了 1 var a = 1; 2 function main() { 3 console.
无论是提示框还是导航栏都能看到如上图所示的带有箭头的框框,这种箭头可以通过背景图片或者是css来实现,本文介绍三种通过css实现带箭头的提示框。 通过border属性思路:两个三角形,通过定位使两个三角形相差1px作为边框。
在开发过程中经常会遇到文本过长超出文本的宽度,这时候我们会考虑将文本截断,但是只顾截断会失去交互的友好性,因为用户不知道后面还有内容,我们会在文本超出宽度的部分加上省略号,然后加上title属性,当用户鼠标放到此处提示完整信息。
本文是在Git操作指南基础上衍生出来的高级操作,如果你对git不是很熟悉,建议你先阅读Git操作指南。 一、忽略提交特定文件 如果你不想让一些文件上传到git仓库中,可以让Git忽略特定文件或是目录,通过vi ~/.gitconfig编辑git的配置文件,可以使用感叹号(注意英文)来指出例外的情况。
本文是介绍sublime text 2.0.2 build 2221 64位 的破解 在你使用sublime时可能经常出现下图: 这是在提醒你注册 在工具栏上点击help->Enter License,在弹出的窗口输入 Andrew Weber Single User License E...
模式有三种:Architectural Pattern、Design Pattern、Coding Pattern,即:框架模式、设计模式、编程模式。本文主要讲解javascript中的设计模式,好的设计模式能够提高代码的重用性,可读性,使代码更容易的维护和扩展。
现在越来越多的用户将chrome浏览器设置为自己默认的浏览器,不仅是因为他的界面美,最重要的是他对html5和CSS3完美的支持,且调试工具非常好用,还有丰富的扩展库。如何安装自己的扩展呢? 点击自定义chrome,选择工具-->扩展程序,如图: 下面推荐几款自己在工作中或者生活中使用的ch...
开发过程中,会不断发现新需求,不断发现bug,这时候就需要一个好的软件来管理项目。Git提供完备的版本管理功能,用于存储、追踪目录(文件夹)和文件的修改历史,是软件开发者的必备工具,是软件公司的基础设施。
Sublime插件: Sublime有好几种安装插件的方法,但是最好用也是最长用的是ctrl+shift+p。 第一步: 使用ctrl+` 调出Sublime控制台,在控制台中输入 import urllib2,os;pf='Package Control.
Sublime text快捷键 Sublime text 2是一款轻量、简洁、高效、跨平台的编辑器,他适合编写javascript,html,css,php,paython等等, 作为程序员,编码效率是非常重要的,快捷键能够帮助我们提高效率,下面是我推荐给大家的几个好用的快捷键:...
常用转换方法: 1.数字转换成字符串: number.toString(radix);返回一个字符串 radix指定将数字值转换为字符串的进制,默认为10进制 number.
描述 随着前端开发的重要性,以及业务的复杂性,前端的模块化开发也被大众所接收,最常见的js框架requireJs,一个js文件对应一个模块,方便开发人员调试与维护,但是一个文件对应一个模块增加了http请求,降低了网站的性能。