127个常用的JS代码片段,每段代码花30秒就能看懂(上) JavaScript 是目前最流行的编程语言之一,正如大多数人所说:“如果你想学一门编程语言,请学JavaScript.” FreeCodeCamp的创始人 Quincy Larson 在最近的一次采访中被问到哪种语言开发人员应该首先学习.他回答:“ JavaScript.” “软件正在吞噬世界,JavaScript正在吞噬软件.JavaScript每年都在变得越来越占主导地位,而且没人知道最终会取代它的是什么." 如果您没有充分的理由…

1.隐藏部分数字,如手机号码,身份证号码 1 2 3 function (str,start,length,mask_char){ return str.replace(str.substr(start,length),Array(length+1).join(mask_char||"*")) } 2.获取指定范围内的随机数 1 2 3 function randNum(minnum,maxnum){ return Math.floor(minnum+Math.random()*(ma…

题外话 这款插件就比較重量级了-.用熟悉了写原生JS的效率要提升非常多--并且,不仅支持JS还包括了nodejs snippet javascript-snippets 插件作者: zenorocha Github地址 : https://github.com/zenorocha/atom-javascript-snippets 内置了丰富的JS snippet . 并且也非常好理解和记忆-耍多了会上手的 安装 在设置中心搜索安装 代码片段(Tab或者Enter补全) Console命令 [cd…

1.单选框/手风琴 <script> $(document).ready(function(){ $("dd").on("click",function(){ var $this = $(this); $("dd").removeClass("selected"); $this.addClass("selected"); }) }) </script> 2.复选框 function…

function appendHTML(container,html,position){ position =position || 'after'; var objE = document.createElement("div"), nodes=null, fragment = document.createDocumentFragment(); objE.innerHTML = html; nodes=objE.childNodes; for (var i=0, length=n…

后端人员也免不了要处理一些前端的事情,由于代码不是自己写的,所以不好找到相关的代码. 比如在表单提交时,前端提交的数据不正确,这时候你可能会想在谷歌浏览器里添加一个鼠标 点击事件的断点. 然而查看js的调用堆栈你会发现,傻眼了,一大堆jquery或其它js库的代码. 怎么办呢? 使用浏览器自带的blackbox,即把不需要的放到黑盒里 1.先打开开发者工具,然后选择设置,如下 2.添加排除的js库,排除规则支持正则表达式 另外还有一个方法,安装一个浏览器插件VisulalEvent. 1.点击这…

var dateDiff = function(hisTime,nowTime){ if(!arguments.length) return ''; var arg = arguments, now =arg[1]?arg[1]:new Date().getTime(), diffValue = now - arg[0].getTime(), result={ isToday:false }, minute = 1000 * 60, hour = minute * 60, day = hour…

html5选择器 //参数均接收一个合法的css选择器 element = document.querySelector('.foo,.bar');//返回带有foo或者bar样式类的首个元素 elements = document.querySelectorAll('div.foo');//返回所有带foo类样式的nodeList集合 鼠标滚轮事件 $('#showPic').on("mousewheel DOMMouseScroll", function (e) { ? : -))…

原始出处,可拷贝:http://www.w3cfuns.com/notes/25068/1d0d350a974d879e63f1115cf80a3288.html 摘自:http://www.loveqiao.com/archives/768  http://www.cnblogs.com/hupan508/p/5337948.html html5选择器 //参数均接收一个合法的css选择器 element = document.querySelector('.foo,.bar');//返回带有…

http://www.w3cfuns.com/notes/25068/1d0d350a974d879e63f1115cf80a3288.html…

Date.prototype.format = function(format) { var date = { "M+": this.getMonth() + 1, "d+": this.getDate(), "h+": this.getHours(), "m+": this.getMinutes(), "s+": this.getSeconds(), "q+": Math.floor(…

// Determine if an element is in the visible viewport function isInViewport(element) { var rect = element.getBoundingClientRect(); var html = document.documentElement; //在IE中,默认坐标从(2,2)开始计算,导致最终距离比其他浏览器多出两个像素,我们需要做个兼容. var top = document.documentElem…

1. 对比cookie // cookie array function getCookieArrayByStr(str) { var cookies = str.split("; "); var cookieObj = {} for (var i=0; i<cookies.length; i++) { var line = cookies[i]; var pos = line.indexOf("="); var key = line.substr(0, po…

1.如果数组所有元素都满足函数条件,则返回true.调用时,如果省略第二个参数,则默认传递布尔值. const all= (arr, fn=Boolean) => arr.every(fn); console.log(all([0,1,1])); //false console.log(all([1,2,3]); //true console.log(all([4,5,5,3], x => x>2)); //true 2.判断数组中的元素是否都相等 const allEqual = ar…

  上一次更博还是去年10月28号了,截至今天已经有整整4个月没有更新博客了,没更新博客不是代表不学了,期间我已经用vue做了两个项目,微信小程序做了一个项目,只是毕竟找到工作了,想偷偷懒,你懂的. 过年期间一直在关注js片段代码,虽然这个时代前端框架横行,大量上层工具层出不穷,比如http请求的封装:react的fetch.vue的axios(vue官方已经不用vue-resource了):知名的lodash,和最近发现的30-seconds-of-code,在我看来这些都是宝贝.言归正传,今…

获取一个input输入框的值: JavascriptExecutor js =(JavascriptExecutor) driver; merchatName=js.executeScript("return arguments[0].value", m1.byId("subMerName")).toString(); 在selenium里面也提供了执行js代码的方法: Object executeScript(String script, Object... ar…

1.IE条件注释 条件注释简介 IE中的条件注释(Conditional comments)对IE的版本和IE非IE有优秀的区分能力,是WEB设计中常用的hack方法.条件注释只能用于IE5以上,IE10以上不支持. 如果你安装了多个IE,条件注释将会以最高版本的IE为标准. 条件注释的基本结构和HTML的注释(<!– –>)是一样的.因此IE以外的浏览器将会把它们看作是普通的注释而完全忽略它们. IE将会根据if条件来判断是否如解析普通的页面内容一样解析条件注释里的内容. 条件注释使用方法示…

JS读取client端的文件内容的代码片段 if(window.FileReader){ var html5file = this.pipeDetailFileUpLoader._files[0]; var reader = new FileReader(); reader.onload = lang.hitch(this,function(f) { console.log(f.target.result); }); //reader.readAsDataURL(html5file); read…

HTML 很容易写,但创建网页时,您经常需要重复做同样的任务,如创建表单.在这篇文章中,我收集了10个超有用的 HTML 代码片段,有 HTML5 启动模板.空白图片.打电话和发短信.自动完成等等,帮助你提高开发速度. HTML5 启动模板 当启动一个新的项目的时候,你需要一个启动模板.这里是一个简洁干净的模板,可以作为 HTML5 项目的基础. ? 1 2 3 4 5 6 7 8 9 10 11 12 13 <!DOCTYPE html> <html>     <head&…

实用js代码大全 //过滤数字 <input type=text onkeypress="return event.keyCode>=48&&event.keyCode<=57||(this.value.indexOf('.')<0?event.keyCode==46:false)" onpaste="return !clipboardData.getData('text').match(/\D/)" ondragenter=…

有时为了研究学习一些格式不规范的JS代码段,需要将代码段格式化一下,这样思路就会清晰多了,网上找到此款格式化的工具,将以下代码保存为html格式文件即可使用 <html> <head> <title>JSer </title> <meta http-equiv="content-type" content="text/html; charset=gb2312" /> <style> /* Glo…

JQuery是继prototype之后又一个优秀的Javascript库.它是轻量级的js库 ,它兼容CSS3,还兼容各种浏览器(IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+),jQuery2.0及后续版本将不再支持IE6/7/8浏览器.jQuery使用户能更方便地处理HTML(标准通用标记语言下的一个应用).events.实现动画效果,并且方便地为网站提供AJAX交互.jQuery还有一个比较大的优势是,它的文档说明很全,而且各种应用也说得很详细,同时还有…

sublime text 3 中有个强大的功能就是可以编写各种文件类型的snippet代码片段,可以节省大量的时间. 文件名为:jekyll-top.sublime-snippet(.sublime-snippet)后缀必须这样 <snippet> <content><![CDATA[/** * author:qinbb * title:智能推荐${1:标题} */ ${2}]]></content> <!-- Optional: Set a tabT…

原文地址 本文内容 ECMAScript 发生了什么变化? 新标准 版本号6 兑现承诺 迭代器和for-of循环 生成器 Generators 模板字符串 不定参数和默认参数 解构 Destructuring 箭头函数 Arrow Functions Symbols 集合 学习Babel和Broccoli,马上就用ES6 代理 Proxies ES6 说自己的宗旨是"凡是新加入的特性,势必已在其它语言中得到强有力的实用性证明."--TRUE!如果你大概浏览下 ES6 的新特性,事实上它…

GistBox 用简便的方式来组织和管理代码片段.你的代码会保存到云端进行备份,再也不用担心迷失在杂乱的代码片段中.GistBox 是建立在标准的 HTML5 技术基础上.在旅途中或在办公室,你都可以使用 GistBox. 您可能感兴趣的相关文章 Metronic – 基于 Bootstrap 响应式后台管理模板 HTML Inspector – 帮助你编写高质量 HTML 代码 Web 开发人员必备的随机 JSON 数据生成工具 Selectize – 用于标签和下拉列表功能的选择控件 Pur…

本文会给你们展示50个jquery代码片段,这些代码能够给你的javascript项目提供帮助.其中的一些代码段是从jQuery1.4.2才开始支持的做法,另一些则是真正有用的函数或方法,他们能够帮助你又快又好地把事情完成.如果你发现你任何可以做得更好的地方的话,欢迎把你的版本粘贴在评论中! 1. 如何修改jQuery默认编码(例如默认UTF-8改成改GB2312): $.ajaxSetup({ ajaxSettings:{ contentType:"application/x-www-form…

与任何新技术一样,常常难就难在如何开始入手. 有鉴于此,我们整理出了与jQuery Mobile库有关的我认为最便利的一些技巧.方法和代码片段. 由于本文不是旨在全面介绍使用jQuery Mobile库的入门知识,会忽略掉一些相当浅显的东西,而是直接探讨一些相当棘手的东西. 另外欢迎留言,告诉我们你觉得哪些代码片段很实用,以及你所知道的其他任何实用的代码片段. 1.完整的基本页面 我一再发现自己需要为基本页面建立完整的标记.正因为如此,下面是创建一个基本页面所需要的全部代码. <!DOCTYPE…

在开发网站.app或博客时,代码片段可以真正地为你节省时间.今天,我们就来分享一下我收集的一些超级有用的PHP代码片段.一起来看一看吧! 1.创建数据URI 数据URI在嵌入图像到HTML / CSS / JS中以节省HTTP请求时非常有用,并且可以减少网站的加载时间.下面的函数可以创建基于$file的数据URI. function data_uri($file, $mime) { $contents=file_get_contents($file); $base64=base64_encode…

在网站开发中,我们都期望能高效快速的进行程序开发,如果有能直接使用的代码片段,提高开发效率,那将是极好的.php开发福利来了,今天小编就将为大家分享9大超实用的.可节省大量开发时间的php代码片段. 一.查看邮件是否已被阅读 当发送邮件后,我们都会想知道到底这个邮件是否已被对方阅读,监控邮件的打开率,这个时候我们就可以使用下面的这段代码显示对方IP地址记录阅读的实际日期和时间. view sourceprint? error_reporting(0); Header("Content-Type:…

jQuery已经成为任何web项目的重要组成部分.它为网站提供了交互性的通过移动HTML元素,创建自定义动画,处理事件,选择DOM元素,检索整个document ,让最终用户有一个更好的体验. 在这篇文章中我已经收集了20 +个可重复使用的jQuery代码片段,你可以很容易地复制并直接粘贴到你的项目中. 图片的延迟加载 1 jQuery(document).ready(function() { 2     jQuery("img.lazy").lazy({ 3         dela…