JavaScript ServiceWorker API的好处就是让WEB开发人员轻松的控制缓存。虽然使用ETags等技术也是一种控制缓存的技术,按使用JavaScript让程序来控制缓存功能更强大,更自由。当然,强大有强大的好处,也有弊处——你需要做善后处理,所谓的善后处理,就是要清理缓存。
我经常使用JavaScript对象。非常喜欢。相对来说,数组虽然也很好用,但JavaScript Object提供了另一层次的数据结构和数据信息,这是简单的数组是无法比拟的。例如,我们可以非常方便的从一个JavaScript对象里寻找一个键值,比在数组里更迅速。
请随意画出一个小人,它就能活起来,你可以和它一起完成一次充满奇幻色彩的冒险旅程。
javascript从定义到执行,JS引擎在实现层做了很多初始化工作,因此在学习JS引擎工作机制之前,我们需要引入几个相关的概念:执行环境 栈、全局对象、执行环境、变量对象、活动对象、作用域和作用域链等,这些概念正是JS引擎工作的核心组件。这篇文章的目的不是孤立的为你讲解每一个概念, 而是通过一个简单的demo来展开分析,全局讲解JS引擎从定义到执行的每一个细节,以及这些概念在其中所扮演的角色。
如果在网上找一个关于如何将一段特定的文本拷贝到剪贴板的解决方案,最可能的结果就是使用Flash的方案来做这个事,虽然使用Flash可以很好地解决这个问题,但是这不是一个明智的想法,因为这个产品最终会消失或者至少是浏览器不再提供支持,因此这个解决方案是没有未来的。
现在有了一个新的、性能更好的方法可以实现JavaScript动画任务。之前我们曾讲过requestAnimationFrame() 这个方法。那篇文章里是一个系统的介绍,今天将在这里举2个实际例子和用法。
时间过去了这么久,技术在不断的进步,仍然有一些JavaScript函数是几乎所有Web程序员必备的,或为了性能,或为了功能。
这是一个轻量级的Craig Reynolds的 Boids 算法实现。 一个非常典型的群聚的例子。 它不仅能非常简单的模仿一群鸟, 也可以模拟一群蜂,一群羊或一群人。。
初次看到[].forEach.call()这样的代码,我觉得这种写法很有趣,为什么要这样写?为什么要用空数值引申出的方法?
全局变量在编程语言中一向被认为是一种不好的编程方法。但现实情况是,很多著名的项目都在大量的使用着全局变量
图片可以让页面更有吸引力,尤其是处理的恰当的时候,但问题是,图片的处理是个麻烦事情,它的创建和裁剪对于一个普通人来说是个困难的任务
新技术的出现有时会给我们WEB开发人员带领额外的苦恼,比如,如何判断用户现在是在线还是离线?幸好,有矛就有盾,JavaScript里的navigator对象帮我们解决这个问题。
过去WEB程序员都很清楚,用HTML表单上传文件是很麻烦的事情,特别是你想了解一下用户上传的文件的一些属性,必须等它上传完成后才能知道。
最近看到一个nodejs程序,promisify-node,它能够将一个普通的函数或对象转变成promised方式的API。经过查看源代码,发现它是通过读取函数的参数来寻找回调函数式的参数。这种方式看起来有点怪,但有时候很有用。
我还是第一次看见naturalWidth 和 naturalHeight这两个只读属性,真是两个非常有用的属性。不论你如何用CSS来变换一个img元素的高度和宽度,图片的原始大小都能用它们获取到。需要提醒的一点是,你不需要等待图片成功加载到页面后,才能正确的访问这两个属性,所以我它们放到了onload事件里。
代码执行效率对于程序员和程序来说都是至关重要的,尤其是遇到了那些需要大量调用、反复调用的函数方法。在很多Javascript框架里你都能看到有反复调用的函数。当在使用这些框架时,我们必须小心翼翼的尽量采取优化的代码编写。其中一种优化代码的方法就是在创建函数前先使用判断语句,而不是每次函数调用时都执行一次。
随着浏览器的进步,现代浏览器都实现了多标签页(tab)的概念,就是在一个浏览器窗口里同时打开着多个页面实例。如果这时我们需要实现某个标签页的标题不停闪动,来提示页面内容有重要信息需要关注,这时候在用老的方法就不灵了。这时候需要我们针对每个标签页来单独修改它的窗口标题。
现代浏览器里提供的新的API越来越倾向于移动手机应用,而不是传统的桌面应用,比如JavaScript地理位置信息API。另外一个只针对手机应用的JavaScript API就是振动(Vibration) API。很明显,这个API就是允许mobile程序员使用JavaScript调用手机的振动功能,并且能设定振动的方式和时长。
Prism插件的代码组成就是一个js文件和一个CSS文件。经过对这两个文件的修改,我就可以用简单的方法标注pre里的是什么编程语言的代码,Prism能根据这些语种提示个性化的高亮其中的代码,让这些代码显得更清晰,更适合读者阅读。
对于Web程序员来说,处理简单的URL格式也许会成为一场噩梦。试想一下,一个网址里有很多组成部分都会影响你对它的解析方法: 是否以/字符开头 是否以//开头 是否以?号开头 是否以#号开头 …等等
HTML5的革命,现代浏览器的诞生,JavaScript的升级,这些给我们提供了使用Javascript和input[type=file]元素获取上传文件过程信息的能力。下面就来看看这些上传文件API是如何使用的!
在浏览器里用JavaScript获取地理位置信息API在很多移动应用里是最常见的API运用,作为Web程序员,它应该是你必须具备的一项知识技巧。幸运的是,目前所有流行的浏览器都支持了这种技术。
这个新fetch API相比起XMLHttpRequest更简单,更易读,是很好的Ajax替代方法;fetch有很明显的优势,相信很快会流行起来!
随着技术的发展,这个电池状态信息API有了变化升级,它现在变成了基于promise方式的API,你可以在最新版的谷歌浏览器里使用它。下面让我们来看看这个最新的API的用法!
这里介绍的一个小技巧是如何用JavaScript获取页面上被选中的文字的方法
我们最常见到的带有多图的文章页面中,图的大小通常是和页面的宽度一致,这样看起来,页面就是一个直筒形,这样的布局看多了就会觉得很单调。之所以形成这样的局面,我想很大程度上是因为老式浏览器的限制。但随着现代浏览器(火狐/谷歌/IE11)的普及,浏览器对页面设计的限制越来越少,Web程序员的想象能力能够得到极大的发挥。
在我的开发工作中经常会遇到需要判断一个函数是否是JavaScript原生函数的情况,有时候这是一个很必要的工作,你需要知道这个函数是浏览器自身提供的,还是由第三方封装、伪装成原生函数。
最近我在研究开发一个火狐插件,具体的功能是将网页内容截屏并分享到微博上。目前基本功能已经实现,大家可以在 @程序师视野 里看到用这个截图插件分享的微博的效果。
在很多视频网站或提供了网址分享功能的网站上,你会发现当你点击分享组件后网址或分享代码会自动的粘贴到你的系统剪贴板里。这种能将网页内容自动粘贴到剪贴板的功能会给用户带来很大的方便。不幸的是,Flash 10毁掉了大部分所有的完成这个任务的方法。而幸运的是,还有一个工具叫做ZeroClipboard。ZeroClipboard使用了一个替换的Flash,并和JavaScript交互,能让你把任意内容通过JavaScript拷贝到系统剪贴板板里。
HTML5让我兴奋的一个最大的原因是,它里面实现的新功能和新特征都是我们长久以来一直期待的。比如,我以前一直在使用placeholders,但以前必须要用JavaScript实现。而HTML5里给JavaScript标记提供的async属性,使JavaScript能异步加载执行。之前我需要各种的JavaScript插件来实现这种功能,但现在这个新属性能让我们轻松的实现异步加载。
我一直对人工智能识别技术非常感兴趣,因为我无法想象这究竟是一种什么样的算法,什么样的分析过程。无论是声音识别、人脸面部识别或其它种识别,人们的外貌、说话的方式都是如此不同,一种图片你可以用不同的方式、从不同的角度拍摄,我不能理解这些识别技术是如何做到的。
当第一次听说nude.js的时候,我非常怀疑这种浏览器端的裸体识别技术,有几个理由:正常情况下,裸体识别应该在服务器端进行,这样,那些色情图片或色情视频才能在发送给浏览者前被发现。 我不相信完全依赖计算机能过滤掉所有色情内容(虽然我是个程序员)。
从Mozilla Aurora 11起,火狐浏览器里实现了一些新功能,其中一个就是对电池状态接口的基本实现。这个很简单的接口能提供你关于电池当前电量,是否在充电等信息,以及一些电池状态变化事件。让我们来看看效果!
估计很少人知道HTML5 APIS里有一个window.postMessage API。window.postMessage的功能是允许程序员跨域在两个窗口/frames间发送数据信息。基本上,它就像是跨域的AJAX,但不是浏览器跟服务器之间交互,而是在两个客户端之间通信。让我们来看一下window.postMessage是如何工作的
JavaScript弹出窗口很讨厌,所有人都不喜欢弹出窗口,但很多网站认为弹出框口很有用,需要弹出窗口。对于开发这样的网站的程序员,他们有个棘手的问题,他们不知道这些弹出窗口是否被浏览器或各种浏览器插件给屏蔽了,没有弹出来。当然,浏览器会通知用户,但这些很少会引起用户的注意。下面是一个简单的方法来测试你的弹出窗口是否被阻拦了。