Javascript
文章平均质量分 83
Hello 程序猿
授之以鱼不入授之以渔,喜欢分享知识,喜欢交流经验。永远相信一句话三人行必有我师焉,很尊重他人的意见。
展开
-
50 天学习 50 个项目 - HTML/CSS and JavaScript
???? ???? ???? 项目源代码,点击【Github 原文链接】所有项目如下所示:#项目在线演示01Expanding CardsLive Demo02Progress StepsLive Demo03Rotating Navigation AnimationLive Demo04Hidden Search WidgetLive Demo05Blurry LoadingLive Demo06Scroll Animation原创 2021-07-18 01:09:32 · 981 阅读 · 1 评论 -
使用 sroll-snap-type 优化滚动
本文转自公众号:iCSS前端趣闻。慕课网推出 CSS 架构课程,一节课解决 CSS 难复用、难维护、难扩展问题(点我)。根据CSS Scroll Snap Module Level 1[1]规范,CSS 新增了一批能够控制滚动的属性,让滚动能够在仅仅通过 CSS 的控制下,得到许多原本需要 JS 脚本介入才能实现的美好交互。Tips:本文截的一些 Gif 图涉及容器滚动,效果不是很好,可以点进 Demo 里实际感受下。sroll-snap-type首先看看sroll-snap-ty...转载 2021-04-01 17:30:29 · 510 阅读 · 0 评论 -
比较正宗的验证邮箱的正则表达式js代码详解
这个比较简单的,应付个面试基本足够:/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/ 拿代码去测试一下吧: function isEmail(str){ var reg = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/; return reg.tes原创 2016-04-18 12:02:44 · 5643 阅读 · 0 评论 -
介绍一个性能飞快的移动端滑屏组件iSlider.js
islider功能介绍:/** * iSlider 高性能全屏滑动组件 * @class iSlider * @param {object} opts * @param {string} opts.wrap='.wrap' 容器 * @param {string} opts.item='.item' 滚动单元的元素 * @param {string} opts.pla原创 2016-04-17 23:27:04 · 8890 阅读 · 0 评论 -
Three.js打造H5里的“3D全景漫游”秘籍
近来风生水起的VR虚拟现实技术,抽空想起年初完成的“星球计划”项目,总结篇文章与各位分享一下制作基于Html5的3D全景漫游秘籍。 QQ物联与深圳市天文台合作,在手Q“发现新设备”-“公共设备”里,连接QQ物联摄像头为用户提供2016年天体大事件的直播,大家可以通过手Q实时观看到世界各地最佳观测点的日食,流星等天体现象。承载整个“星球计划”活动的运营页面,经多方讨论,我们决转载 2016-04-16 19:29:40 · 32632 阅读 · 2 评论 -
这周一定把zepto源码读完,抽取精华与大家分享
先简单把事件兼容写法写一下,希望读完源码以后,能够写出更好的兼容写法:/*element代表元素,type代表事件类型,handler代表事件被触发时调用的方法 /var EventUtil = {addHandler: function (element, type, handler) { if (element.addEventListener) {原创 2016-05-11 04:30:41 · 564 阅读 · 0 评论 -
移动端web开发技巧
META相关1. 添加到主屏后的标题(IOS) name="apple-mobile-web-app-title" content="标题"> 2. 启用 WebApp 全屏模式(IOS)当网站添加到主屏幕后再点击进行启动时,可隐藏地址栏(从浏览器跳转或输入链接进入并没有此效果) name="apple-mobile-web-app-capable" content转载 2016-04-15 04:34:09 · 1550 阅读 · 0 评论 -
JS封装简单后代选择器
原文:http://www.cnblogs.com/jr1993/p/4540549.html大概思路是这样的:通过判断传过来的参数是什么类型,如果是对象,那这里就是this(因为封装是自己用的,肯定不会随便乱传一个对象过来),如果是一个函数(匿名函数),那就是Dom加载(这里先不讲),如果是字符串,那就是CSS选择器,通过判断是否存在空格,没有就是单一CSS选择器,有就是后代选择器。转载 2016-05-26 00:56:58 · 810 阅读 · 0 评论 -
call、aplly、caller、callee分别是什么?
call和aplly的区别:概念:call 和 apply 都是为了改变某个函数运行时的 context 即上下文而存在的,换句话说,就是为了改变函数体内部 this 的指向。因为 JavaScript 的函数存在「定义时上下文」和「运行时上下文」以及「上下文是可以改变的」这样的概念。二者的作用完全一样,只是接受参数的方式不太一样。例如:有一个函数原创 2016-04-19 01:06:22 · 1212 阅读 · 0 评论 -
原生JS实现的简单“瀑布流”布局
自pinterest网站爆红以来,国内一度掀起“仿PIN”狂潮,诸如花瓣、蘑菇街等等。正是如此,“瀑布流”式布局受到广大网民的青睐。众多知名JS库,也相继出现“瀑布流”布局插件,譬如jQuery的Masonry插件、KISSY的waterfall插件等。今天闲来无聊,我也自己动手弄了段原生JS代码,实现了简单的“瀑布流”布局效果,当然肯定不能和以上那些优秀插件相提并论,有兴趣的朋友,可以去看看,希转载 2016-04-19 12:22:51 · 534 阅读 · 0 评论 -
大神如何阅读源码
以下是我搜集的各种方法,我将一一尝试,会根据尝试结果,做个总结,与大家一起分享:1、腾讯IMWEB负责人说:首先,搞清楚自己要读懂他们的原因和动机。其次,可以先看下这些优秀框架或者库的设计文档和架构图,这样会让你宏观上对一些概念有些认识。 然后,从你最感兴趣的一个点,开始设置断点,跟进去看发生了哪些事情。 和架构设计哪一块是match的。有人补充:最快,最易懂方法。原创 2016-05-14 03:42:15 · 9756 阅读 · 0 评论 -
抛弃 JS,使用 TypeScript
转自:原文最近几个月我已经全面抛弃 JavaScript,完全使用 TypeScript 进行前端开发(只在上课的时候用到 JS)。先说优点:bug 显著减少,之前会遇到的 xxx 为空的问题几乎不会出现了,类型相关 bug 直线减少。 应用更可控,当你需要约束某些代码的时候,用类型就能很简单地做到,比如 React 里强制写 diaplayName 方便调试。 查文档更方便,以前...转载 2019-07-06 15:39:00 · 757 阅读 · 0 评论 -
如何用不到200行代码写一款属于自己的js类库
前言JavaScript 的核心是支持面向对象的,同时它也提供了强大灵活的 OOP 语言能力。本文将使用面向对象的方式,来教大家用原生js写出一个类似jQuery这样的类库。我们将会学到如下知识点:闭包:减少变量污染,缩短变量查找范围 自执行函数在对象中的运用 extend的实现原理 如何实现跨浏览器的事件监听 原型链与继承接下来我会对类库的核心api进行讲解和展示,文章最后后附...原创 2019-07-07 14:55:08 · 385 阅读 · 0 评论 -
CSS弹性盒子Flexbox布局详解
版权声明:本文为小平果原创文章 , 转载请注明:http://blog.csdn.net/i10630226布局的传统解决方案,基于盒状模型,依赖 display属性 + position属性 + float属性。它对于那些特殊布局非常不方便,比如,垂直居中就不容易实现。2009年,W3C提出了一种新的方案—-Flex布局,可以简便、完整、响应式地实现各种页面布局。目前,它已经转载 2016-04-15 04:17:13 · 739 阅读 · 0 评论 -
浏览器详谈及其内部工作机制 —— web开发必读
浏览器介绍如今,浏览器格局基本上是五分天下,分别是:IE、Firefox、Safari、Chrome、Opera,而浏览器引擎就更加集中了,主要是四大巨头:IE的浏览器排版引擎Trident,目前随IE10发布了Trident6.0;Mozilla的排版引擎Gecko,今年4月2号发布了Gecko21预览版,稳定版本为Gecko20;Google Chrome和Apple Safari使用转载 2016-04-14 19:52:05 · 797 阅读 · 0 评论 -
胡博君收集JS中的响应事件
欢迎大家收看我的在线Java全套免费教学超清视频:http://v.youku.com/v_show/id_XODQ1NjU0NDc2.html 这是其中的一个视频连接,大家可以拖动到优酷视频下方,订阅我的账号,因为以后我会有更多视频免费提供百度搜索:输入Fcs_D调的码农 ,或者输入"胡博君"就能看到我的很多视频或者加我的微信号:fcsboy 我可以及时通过微信通知你们QQ学习群:237053693原创 2015-01-07 09:48:58 · 900 阅读 · 0 评论 -
胡博君浅谈Js获取当前时间方法集合
欢迎大家收看我的在线Java全套免费教学超清视频:http://v.youku.com/v_show/id_XODQ1NjU0NDc2.html 这是其中的一个视频连接,大家可以拖动到优酷视频下方,订阅我的账号,因为以后我会有更多视频免费提供百度搜索:输入Fcs_D调的码农 ,或者输入"胡博君"就能看到我的很多视频或者加我的微信号:fcsboy 我可以及时通过微信通知你们QQ学习群:237053693原创 2015-01-13 18:10:12 · 763 阅读 · 0 评论 -
胡博君浅谈Js中获得时间戳的三种方法
欢迎大家收看我的在线Java全套免费教学超清视频:http://v.youku.com/v_show/id_XODQ1NjU0NDc2.html 这是其中的一个视频连接,大家可以拖动到优酷视频下方,订阅我的账号,因为以后我会有更多视频免费提供百度搜索:输入Fcs_D调的码农 ,或者输入"胡博君"就能看到我的很多视频或者加我的微信号:fcsboy 我可以及时通过微信通知你们QQ学习群:237053693原创 2015-01-13 18:13:32 · 712 阅读 · 0 评论 -
Js中em与px的区别
欢迎大家收看我的在线Java全套免费教学超清视频:http://v.youku.com/v_show/id_XODQ1NjU0NDc2.html 这是其中的一个视频连接,大家可以拖动到优酷视频下方,订阅我的账号,因为以后我会有更多视频免费提供百度搜索:输入Fcs_D调的码农 ,或者输入"胡博君"就能看到我的很多视频或者加我的微信号:fcsboy 我可以及时通过微信通知你们QQ学习群:237053693原创 2015-01-05 11:01:55 · 3533 阅读 · 0 评论 -
JavaScript MVC框架PK:Angular、Backbone、CanJS与Ember
原文地址:http://sporto.github.io/.../comparison-angular-backbone-can-ember/原文作者:Sebastian Porto @Twitter本文译者:@李松峰,感谢 @林永坚jake 推荐版权声明:经作者授权翻译,转载请注明原文及译文出处选择JavaScript MVC框架很难。一方面要考虑的因素非常多,另一方面这转载 2016-04-12 13:55:45 · 663 阅读 · 0 评论 -
ES6 JavaScript Promise的初识
如果要实现一个并发的异步操作,执行A、B、C三件事情,但是又要按照顺序来执行,先A再B再C的顺序。以前做法:$.ajax({ url: "A.html", context: document.body, success: function(){ //这里是A事情,先执行 $.ajax({ url: "B.html", context: document.body, s原创 2016-04-12 23:35:17 · 657 阅读 · 0 评论 -
JS跨域调用之document.domain--相同基础域名页面之间的调用
最近项目需要跨域调用JS,整理一下相关知识,写几个帖子记录一下学习历程。 例子只需要1个tomcat即可,这里我的tomcat端口都改成80了。 背景:浏览器在执行Javascript时,出于对安全性的考虑,禁止两个或者多个不同域的页面进行互相操作。 相同域的页面在相互操作的时候不会有任何问题。 如下例子:文件放置于%TOMCAT_HOME%/webapps/domai转载 2016-04-26 02:15:18 · 2478 阅读 · 0 评论 -
js模块化之require.js
js模块化之require.js没有模块化,之前如何写js的?<script src='a.js'></script><script src='b.js'></script><script src='c.js'></script>如上图所示,这样加载会出现两个问题: 1、必须按顺序加载,从a到c,而且是同步加载,也就是a没有加载完毕,b和c就不能执行,以及其他文件都不能执行。 2、c如果调用原创 2016-04-10 01:28:11 · 561 阅读 · 0 评论 -
大部分人都会做错的经典JS闭包面试题
由工作中演变而来的面试题这是一个我工作当中的遇到的一个问题,似乎很有趣,就当做了一道题去面试,发现几乎没人能全部答对并说出原因,遂拿出来聊一聊吧。先看题目代码:function fun(n,o) { console.log(o) return { fun:function(m){ return fun(m,n); }转载 2016-04-14 00:51:44 · 2774 阅读 · 2 评论 -
JavaScript浅析闭包和内存泄露的问题
JavaScript使用一种称为垃圾收集的技术来管理分配给它的内存。这与C这样的底层语言不同,C要求使用多少借多少,用完再释放回去。其他语言,比如 Objective-C,实现了一个引用计数系统来辅助完成这些工作,我们能够了解到有多少个程序块使用了一个特定的内存段,因而可以在不需要时清除这些内存段。JavaScript是一种高级语言,它一般是通过后台来维护这种计数系统。当J转载 2016-04-14 01:24:29 · 567 阅读 · 0 评论 -
实例分析JavaScript中的事件委托和事件绑定
我们在学习JavaScript中,难免都会去网上查一些资料。也许偶尔就会遇到“事件委托”(也有的称我“事件代理”,这里不评论谁是谁非。以下全部称为“事件委托”),尤其是在查JavaScript的事件处理的时候。但是,大多数时说的是“事件绑定”,对于“事件委托”,或是不提,或是浅尝辄止。对于我这个比较好奇的人来说,实在很蛋疼。尤其是想更多的了解“事件委托”的时候。 这次干脆一劳永逸,自己把转载 2016-04-14 03:05:37 · 2117 阅读 · 0 评论 -
JavaScript 移动和触摸框架
jQuery Mobile : 是 jQuery 在手机上和平板设备上的版本。jQuery Mobile 不仅会给主流移动平台带来jQuery核心库,而且会发布一个完整统一的jQuery移动UI框架。支持全球主流的移动平台。jQuery Mobile开发团队说:能开发这个项目,我们非常兴奋。移动Web太需要一个跨浏览器的框架,让开发人员开发出真正的移动Web网站。我们将尽全力去满足这样的需求。原创 2016-04-14 03:13:18 · 7014 阅读 · 1 评论 -
Javascript闭包(Closure)
作者: 阮一峰 原文链接:http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html日期: 2009年8月30日闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现。下面就是我的学习笔记,对于Javascript初学者应该是很转载 2016-04-14 03:19:08 · 439 阅读 · 0 评论 -
js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offsetWidth (包括边线的宽);网页可见区域高: document.body.offsetHeight (包括边线的宽);网页正文全文宽: document.body.scrollWid转载 2016-04-14 17:00:02 · 441 阅读 · 0 评论 -
innerHTML、innerText和outerHTML、outerText的区别
1、区别描述如下: innerHTML 设置或获取位于对象起始和结束标签内的 HTMLouterHTML 设置或获取对象及其内容的 HTML 形式innerText 设置或获取位于对象起始和结束标签内的文本outerText 设置(包括标签)或获取(不包括标签)对象的文本innerText和outerText在获取时是相同效果,但在设置时,innerText仅设原创 2016-04-14 17:54:48 · 625 阅读 · 0 评论 -
胡博君简单总结JS中的分享到代码
欢迎大家收看我的在线Java全套免费教学超清视频:http://v.youku.com/v_show/id_XODQ1NjU0NDc2.html 这是其中的一个视频连接,大家可以拖动到优酷视频下方,订阅我的账号,因为以后我会有更多视频免费提供百度搜索:输入Fcs_D调的码农 ,或者输入"胡博君"就能看到我的很多视频或者加我的微信号:fcsboy 我可以及时通过微信通知你们QQ学习群:237053693原创 2015-01-06 23:51:42 · 1117 阅读 · 0 评论