web前端
分享web前端总结。JavaScript、css、html等,以及typescript、react、vue等等前端框架实战总结。
码上飞跃
热爱技术,喜欢运动。
展开
-
[置顶] 手机端浏览器平台、操作系统平台及微信平台的判断
做手机端的前端开发,少不了对手机平台的判断。如,对于app下载,就要判断在Android平台下就显示Android下载提示;在iOS平台下就显示iOS下载提示。 今天就为大家介绍一下用js判断手机客户端平台及系统平台的方法:技术支持:jQuery库js代码如下: <script type="text/javascript"> //手机端判断...原创 2015-07-13 22:25:23 · 339 阅读 · 0 评论 -
清除浮动的5种方式
在CSS的开发中,之前对于清除浮动这块总感觉迷惑,为什么要清除浮动?清除浮动的方式又有那些? 如下面一段HTML代码:<ol> <li> <h2>运用CSS3的-webkit-box属性实现导航条效果</h2> <ul class="navone"> <li>...2015-04-06 10:42:36 · 201 阅读 · 0 评论 -
javascript编程高手之路
本来想尝试每天回答或看已解决的3个问题来学习总结今天的知识点,看了下博文里面的问答,在问的和已解决的都提不起兴趣。就看了下知识库里面一些文章,把里面感觉好的段落再摘录一下,为自己再看时备忘。第一阶段:《JavaScript DOM编程艺术》 看这本书之前,请先确认您对Javascript有个基本的了解,应该知道if else之类的语法,如果不懂,先去看看我第二阶段推荐的《Javascript...原创 2015-07-13 22:23:34 · 287 阅读 · 0 评论 -
jQuery.ajax
jQuery.ajax( url [, settings])说明:执行一个异步的HTTP(Ajax)的请求。jQuery.ajax( url [, settings])(添加的版本:1.5)url类型:String一个用来包含发送请求的URL字符串。settings类型:PlainObject一个以“{键:值}”组成的AJAX请求设置。所有选项都是可选的。可以使用$...转载 2017-05-10 23:02:58 · 447 阅读 · 0 评论 -
[置顶] 手机端第一屏页面文章的展开和隐藏
本人做的是手机端的前端开发,事事处处都得从手机用户的体验着手考虑。大家都知道手机相对于pc来说要小很多,所要容纳的东西相对于pc来说也要少之又少。一些重要的东西又希望用户在打开手机网站的第一屏就能看到,这时就要尽可能地将重点呈现给用户。 内容又由文字,图片等等信息组成,如果文字过长,就显得冗余,这里就为大家介绍一个如何隐藏多余文字和展开多余文字的方法。 需要...原创 2015-07-13 22:25:17 · 411 阅读 · 0 评论 -
z-index用法总结
1.z-index属性要结合position属性才能发挥作用,即通过设置position:relative;和position:absolute;进而再设置z-index属性才可以;2.只在一个地方设置z-index属性在某些地方就不起作用,如在Android的app中,必须设置某一个元素的z-index属性比另一个元素的z-index属性大或者小才起作用;今天,先总结这两点,不断完善中。...原创 2015-07-13 22:23:29 · 618 阅读 · 0 评论 -
text-indent实现文本缩进布局
今天的总结很简单,但对于初学者来说,特别是对于我这个初入前端门槛的开发者来说,就不是那么地简单了(这里指不容易想到)。 好了,废话不多说,今天的总结就是一个对文本缩进的简单应用。如何做到标题与内容的分离呢?如下图: 就是做这么一个简单的标题与内容的分离,看似简单,但对于我这个初生牛犊确实难以想到(text-indent可以有负值来设置)。这不,想了很长时间...原创 2015-07-13 22:23:56 · 545 阅读 · 0 评论 -
ECMAScript垃圾回收机制及性能提升
ECMAScript的垃圾回收主要有两种算法,一种是引用计数,一种是标记清除;引用计数引用计数的主要思想是为内存中的每个对象保持一个计数器,如果一个对象的引用次数为0,那么这样的对象就可以作为垃圾回收了。例如:A、B都是Obj对象的引用,那么Obj的引用计数为2,如果某函数调用返回后,A的生命周期结束,那么Obj的引用计数就为1,如果Obj的引用次数变为0,那么它就可以回收了。...转载 2017-05-01 23:30:04 · 343 阅读 · 0 评论 -
深入理解ECMAScript中的声明提升、this关键字及作用域(链)
声明提升大部分编程语言都是先声明变量再使用,但在JavaScript中,事情有些不一样:console.log(a);//undefinedvar a = 0;上面是合法的JavaScript代码,正常输出undefined而不是报错Uncaught ReferenceError: a is not defined。为什么?就是因为声明提升(hoisting)。...转载 2017-04-21 22:39:28 · 467 阅读 · 0 评论 -
关于自适应布局的一点总结
css布局我想是经常困扰初学前端者的一个问题,至于我,也是初入门槛。在闲暇时间,就喜欢自个儿琢磨,自己也就是这样不断地进步的。我想经过不断的学习,前端技能肯定会更上一层楼的。 今天就浅谈下css的自适应布局吧。 所谓自适应布局,现在的浅显地认为就是百分比布局,它能随着浏览器窗口的缩放而自行改变其宽度和高度。当然也可以只设定宽度自适应或者高度自适应等。 ...原创 2015-07-13 22:23:50 · 263 阅读 · 0 评论 -
[置顶] web版码表计时器
这是我自己写的一个码表计时器,运用jsp+servlet技术,用javascript,CSS3,HTML5和Ajax增强交互,开发环境为win7+MyEclipse10.5+jdk1.7+tomcat7,完成后的界面如下:初始界面如下:该界面中开始计时到分计的四个按钮为禁用状态第二个界面是查看记录界面,从本地读取文件,呈现到网页中正在计时,这时点击分计按钮,可以增加记录...原创 2019-03-11 22:12:56 · 238 阅读 · 0 评论 -
ECMAScript函数参数只会按值传递,不会按引用传递
ECMAScript的一些语法规范都是参照C语言来制定的,C语言中定义函数参数时,可以指定基本类型参数(int,float,double等等)也可以指定引用类型参数(指针)。其中引用类型参数是指给函数传入变量的地址,然后函数内部处理引用类型参数(实际上操作的是指向变量的地址的副本,副本指向同一内存块)时,外部的引用类型变量也会随着改变。需声明一点的是C语言只支持按值传递机制,不支持按引用传递机...原创 2017-04-16 12:05:26 · 411 阅读 · 0 评论 -
这是前端最好的时代——论前端的“三化”建设
摘要:深JS大会近日在深圳举办,涵盖了JS领域众多热点话题,很多专家的精彩分享更是引起参会者的诸多思考,如赫门演讲中提出的“每18至24个月,前端都会难一倍”。本文来自腾讯AlloyTeam李成熙,分享了他参会的所见所感。JS中国开发者大会于7月11-12日在深圳成功举办。该大会号称JavaScript和Node.js领域含金量最高的技术分享大会,聚集了来自国内外20多位讲师及大量JS技术爱好...转载 2015-07-18 16:29:18 · 606 阅读 · 0 评论 -
XMLHttpRequest
原英文链接:https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest参照原英文文章,翻译过来,然后加入自己的理解和拓展。XMLHttpRequest是客户端(如浏览器)的一个API接口,提供一个客户端和服务器之间传输数据的功能。它使从一个URL获取数据变得容易而不用刷新整个页面。在更新页面一部分数据的同时不会打断用户的其...原创 2017-05-08 22:43:59 · 798 阅读 · 0 评论 -
纯CSS制作下拉导航
纯CSS下拉导航(兼容IE,ff,chrome及opera)的好处有很多: 1.不必用JavaScript或者jQuery实现,如果网页禁用了JavaScript或者网络慢都有可能影响性能; 2.纯CSS下拉导航不必依靠额外的js库,所以减少了不必要的http请求,加快了用户访问速度; HTML代码如下: <ul class="na...原创 2015-07-13 22:24:56 · 272 阅读 · 0 评论 -
判断一个对象是否为数组的方法
下面介绍两种方法来判断一个对象是否为数组:var is_array=function(value){ return value && typeof value==="object" && value instanceof Array;//其实只用最后面的value instanceof Array就可以判断一个对象是否为数组};v...原创 2019-03-11 22:13:46 · 329 阅读 · 0 评论 -
继承与原型链
JavaScript对于有基于类的语言经验的开发人员来说有点令人困惑(如Java或C++),因为它是动态的,并且本身不提供类实现。(在ES2015/ES6中引入了class关键字,但是只是语法糖,JavaScript仍然是基于原型的)。当谈到继承时,JavaScript只有一种结构:对象。每个对象都有一个内部链接到另一个对象,称为它的原型prototype。该原型对象有自己的原型,等等,直到达...转载 2017-05-07 18:42:12 · 329 阅读 · 0 评论 -
JavaScript闭包
概论在讨论ECMAScript闭包之前,还是有必要来看一下函数式编程中一些基本定义。众所周知,在函数式语言中,函数即是数据。就比方说,函数可以赋值给变量,可以当参数传递给其他函数,还可以从函数里返回等等。这类函数有特殊的名字和结构。定义A functional argument ("Funarg") - is an argument which value is a functio...转载 2017-05-04 23:22:46 · 281 阅读 · 0 评论 -
JavaScript实现跨域的几种方法
地址链接:http://www.cnblogs.com/2050/p/3191744.html原创 2018-02-25 22:35:30 · 191 阅读 · 0 评论 -
[置顶] 一个app下载框
今天闲着没事,就研究了下公司的网站,就“偷”了点东西出来。下面来制作一个简单的app下载框,为我的公司作下宣传哈。需要的技术支持:一般jQuery库;HTML代码如下:<div class="app_download"> <div class="download_logo"></div> <span class="dow...原创 2015-07-13 22:25:12 · 602 阅读 · 0 评论 -
CSS开发中应该注意的问题
在CSS开发中,要特别注意选择器的运用,如此才能使文档结构更清晰,更易于阅读。 1.某一块的文档结构中包含多层标签嵌套,则应在其祖先元素上面加类或者ID,然后用后代选择器来选择不同的子元素; 2.CSS2.1和CSS3有许多新的特性,如果IE6及更低版本不支持,浏览器会忽略整个规则,以保证向后兼容性; 3.在用类或者ID来为元素添加样式时,遵循...原创 2015-03-28 23:14:38 · 135 阅读 · 0 评论 -
jsonp
JSON和JSONPJSON(JavaScript Object Notation)是一种轻量级的数据交换格式。JSONP是JSON with Padding的略称。它是一个非官方的协议,它允许在服务端集成Script tags返回至客户端,通过JavaScript callback的形式实现跨域访问(这仅仅是JSONP简单的实现形式)JSONP就像是JSON+Padding一样(Pa...转载 2017-05-13 11:10:56 · 350 阅读 · 0 评论 -
手机端JavaScript实战技巧小总
近期在手机端JavaScript的开发中,遇到一些小而头疼的问题。下面做一个小小的总结:1.为标签a添加onclick属性:$("a").each(function(){ $(this).attr("onClick","alert('javascript test')"); }); 在一些浏览器中,用$(this).attr("onclick","aler...原创 2015-07-13 22:24:34 · 433 阅读 · 0 评论 -
$(document).ready()与$(window).load()的区别
虽说很早就开始接触JavaScript,自己也用JavaScript编写过许多代码,如之前的web版码表计时器,就写了近500行代码,函数也写了10个左右。当时也就是想到哪里就写到哪里,行不通就另外找方法,根本不会考虑代码的性能、作用及优化。 随着在实践中对JavaScript的应用,对JavaScript的认识也在不断地深入。这里,就为大家介绍一下$(document)...原创 2015-07-13 22:24:28 · 322 阅读 · 0 评论 -
清除浮动的5种方式
在CSS的开发中,之前对于清除浮动这块总感觉迷惑,为什么要清除浮动?清除浮动的方式又有那些? 如下面一段HTML代码:<ol> <li> <h2>运用CSS3的-webkit-box属性实现导航条效果</h2> <ul class="navone"> <li>...原创 2015-07-13 22:24:50 · 381 阅读 · 0 评论 -
[译][removed]如何判断值的类型
原文链接:http://www.adobe.com/devnet/archive/html5/articles/categorizing-values-in-javascript.html本文中,我将会解释JavaScript一共有几种类型的值,以及如何判断一个值的类型。这将有助于你更好地理解JavaScript是如何工作的。也能帮你实现更高级的编程任务,比如在需要处理各种不同类型的传入值的地...转载 2017-04-18 21:39:10 · 323 阅读 · 0 评论 -
CSS开发中应该注意的问题
在CSS开发中,要特别注意选择器的运用,如此才能使文档结构更清晰,更易于阅读。 1.某一块的文档结构中包含多层标签嵌套,则应在其祖先元素上面加类或者ID,然后用后代选择器来选择不同的子元素; 2.CSS2.1和CSS3有许多新的特性,如果IE6及更低版本不支持,浏览器会忽略整个规则,以保证向后兼容性; 3.在用类或者ID来为元素添加样式时,遵循...原创 2015-07-13 22:24:45 · 342 阅读 · 0 评论 -
纯CSS制作下拉导航
纯CSS下拉导航(兼容IE,ff,chrome及opera)的好处有很多: 1.不必用JavaScript或者jQuery实现,如果网页禁用了JavaScript或者网络慢都有可能影响性能; 2.纯CSS下拉导航不必依靠额外的js库,所以减少了不必要的http请求,加快了用户访问速度; HTML代码如下: <ul class="na...2015-04-06 13:59:23 · 112 阅读 · 0 评论 -
一个简单的CSS弹出窗
今天为大家介绍一款简单的弹出窗。大家在浏览网页的时候就会遇到某些提示信息或者是警告信息,这些信息也往往是以弹出窗的形式出现的。这些弹出窗口也往往是以浏览器默认的样式出现的,各个浏览器或者是手机网站渲染的效果也往往不同。下面做一个统一的弹窗框,可以根据根据自己的喜好自动调整。 需要的技术支持:一般jQuery库;HTML代码:<div class="popu...原创 2015-07-13 22:24:12 · 620 阅读 · 0 评论 -
jQuery插件开发教程
地址链接:http://www.cnblogs.com/Wayou/p/jquery_plugin_tutorial.html转载 2018-02-24 16:23:08 · 134 阅读 · 0 评论 -
JavaScript数值转换函数(Number(),parseInt(),parseFloat(),Math)总结
在前端开发的过程中,需要用到很多关于数值转换的函数,来将得到的字符串或者数值进行处理。如将一个浮点数转换为整数;将一个整数转换为浮点数;将一段字符串转换为数值;将一个浮点数转换为小于它的最小整数或者保留几个小数等。 参考网上的一些资料,也结合自己平时的开发,粗略介绍一下一些常用的数值转换函数。 首先对所要讲的数值转换函数做一个列表:Number(),parseI...原创 2015-07-13 22:24:17 · 482 阅读 · 0 评论 -
css经典书籍
china-pub网上书店图像设计书籍频道,为您强力推荐经典css书籍,div+css经典设计书籍,css3书籍。一、《HTML 5与CSS 3权威指南》(被公认的权威的HTML5与CSS3实战教程,多次重印,热销中)HTML 5与CSS 3权威指南(被公认的权威的HTML5与CSS3实战教程,多次重印,热销中)《html 5与css 3权威指南》内容系统...原创 2015-07-13 22:24:01 · 2799 阅读 · 0 评论 -
仿照移动端码表计时器开发的web版码表计时器
这个是我仿照移动端的码表计时器做的一款web版的码表计时器。运用的主要技术有javascript,CSS3,Ajax,jsp等等。我用了整整三天来开发这款小应用,虽然没有什么用处,但让我对以前所学的知识有了一个总结性的应用。下面来详细介绍一下我的这一款小应用:1.图1为码表启动时的初始界面,其中的按钮“开始计时”,“停止计时”,“重新计时”,“分计”为禁用状态。“清屏”按钮为可用状态。用户可以...原创 2014-06-01 11:55:41 · 683 阅读 · 0 评论 -
手机浏览器下怎么打开app应用
今天在做前端输出的时候,需要和app的做些对接工作。就是在手机浏览器中下载某app时,能判断该用户是否安装了该应用。如果安装了该应用,就直接打开该应用;如果没有安装该应用,就下载该应用。那么下面就对在浏览器中,用js判断某用户是否安装了该应用,并判断是否打开该应用做个简单的介绍。 那么,怎么判断某用户是否安装了某应用呢? 在这里,先写段html代码,如下:...原创 2015-07-13 22:24:07 · 8189 阅读 · 0 评论 -
JavaScript内存泄漏教程-阮一峰
地址链接:http://www.ruanyifeng.com/blog/2017/04/memory-leak.html转载 2018-02-25 22:39:33 · 923 阅读 · 0 评论 -
JavaScript设置倒计时及倒计时弹窗
在前端开发中,难免会用到倒计时。如做的双十一活动,在距活动开始的半个月前需要做些宣传工作,需要告知用户优惠活动什么时候开始。这个时候就要用到倒计时,如在整站的某个页面提醒用户活动什么时候开始等。而在活动的后期,特别是在距活动结束仅有1天左右时,就要用到弹窗倒计时。这个倒计时设置在整站的首页顶部(当然也可以设置在其它地方,如首页中部等),并设置弹窗弹出10秒后自动消失,由用户决定是否点击...原创 2015-07-13 22:24:23 · 998 阅读 · 0 评论 -
vue3 + typescript生成导出excel文档
本文旨在提供一个demo,快速了解怎样利用前端生成及导出excel文件。原创 2023-02-10 23:20:46 · 464 阅读 · 0 评论 -
nodejs异常之-Error: listen EACCES 127.0.0.1:8000
异常信息Error: listen EACCES 127.0.0.1:8000 at Object.exports._errnoException (util.js:1018:11) at exports._exceptionWithHostPort (util.js:1041:20) at Server._listen2 (net.js:1245:19) at li原创 2017-05-29 10:26:30 · 33342 阅读 · 2 评论 -
nodejs之express框架的运用
Express是基于nodejs的一个快速web开发框架,它提供了一个Express application generator可以帮助我们快速创建应用的骨架。1.安装generator$ npm install express-generator -g2.生成骨架安装完成后用以下命令生成骨架,-e选项代表使用EJS模板引擎。$ express -e myapp生成的文件结构如下: app.js是e原创 2017-05-31 22:21:05 · 506 阅读 · 0 评论 -
windows下mongodb的安装使用
一、下载点击这里下载二、安装原创 2017-07-05 10:41:32 · 267 阅读 · 0 评论