Javascript
文章平均质量分 63
王胜飞
一个人的朝圣
展开
-
自定义浏览器滚动条的样式,打造属于你的滚动条风格
今天学霸做社联的网站,想实现的效果是某个div里面有文字,超出的部分可以滚动但是不显示滚动条。以前没做过,这次百度了一下,下面是一篇博客-----------------------------我是可爱的分界线---------------------------------------前段时间,到网上找素材时,看到了一个很个性的滚动条式,打开Chrome的调试工具看了一下,发现不转载 2016-04-26 17:32:11 · 5792 阅读 · 0 评论 -
form提交
在网页DOM的实现的过程中,form提交是与后台直接的联系。在DOM编写的过程中会出现两个问题问题一:描述:提交按钮/reset按钮不在form标签中,输入框在form中。问题:点击submit按钮不能提交。解决方案:只需用js/jq的提交事件即可。 $("form").submit();问题二:描述:某些输入框不在form标签中,其他包括提交按钮都在form原创 2016-05-26 16:01:08 · 388 阅读 · 0 评论 -
JavaScript正则表达式解析器和可视化:Regulex
今天小明问了我一个正则表达式的问题,看不懂,突然想起以前看到过一个网站http://jex.im/regulex/真是一个神奇的网站,在此附上github地址https://github.com/JexCheng/regulex----------我是萌萌哒参考线----------JavaScript正则表达式解析器和可视化。Visualizer原创 2016-06-23 21:44:03 · 1017 阅读 · 0 评论 -
点击事件的坑
今天写js的时候,加了一个点击事件出现弹出层,但是点击了之后就立刻消失了,不知道怎么回事,一直以为是冒泡的事,但是查了也没问题,定位什么都想了,结果发现,原来是点击的div是一个a链接,有href属性,把href属性去了就行了,其他的解决方案以后再想吧,快速开发原创 2016-09-26 11:14:26 · 521 阅读 · 0 评论 -
搭建React运行环境
1.新建文件夹,服务用整个项目2.npm init 输出package.json文件3.使用browsersync模块进行测试监听npm install --save browser-sync4.编辑package.json文件 "scripts": { "dev": "browser-sync start --server --files \"*.*\"" }5原创 2016-10-12 15:17:13 · 524 阅读 · 0 评论 -
静态页放到thinkphp里js出现的语法错误
问题一说明:出卷系统需要实现样式的一些修改,用jq的css方法修改样式,以前一般都这么写的,从来没什么问题。但是这两天小明放到服务器上的tp框架后,出现了错误,我本来以为是php里面的错误,但是一看是js提示的错误,如上图。疑惑了,原来都是这么写的,这次怎么不行了,代码如下$(".head_s").css({"background":"#FEE263"});我知道是json原创 2016-10-06 22:48:53 · 839 阅读 · 0 评论 -
webpack资源整理及笔记
以下是最近学习的路线一些资源的整理首先当然是要先看ES6,有一些会用到ES6的语法,而且看了ES6不练习的话很快会忘的,要时常看看别人怎么写的。然后MDN是比较正统的标准吧,CSDN的话就是一些小的问题或者bug或者ie的兼容性的问题可以去看看。深入浅出ES6MDN入门webpackhttps://segmentfault.com/a/1190000006178770w原创 2016-11-28 20:23:44 · 761 阅读 · 0 评论 -
动态加载javascript,引用外链
最近写宗教题,需要写很多选择题,但是也不没有成绩要求,就随便选,因此想着用console控制台来执行js。然后自动将所有选择题选中,代码如下function addScript(){ var script = document.createElement("script"); script.type = "text/javascript"; script.src = 'http://原创 2016-12-03 14:23:26 · 3347 阅读 · 0 评论 -
jQuery中children()和find()的区别
首先,有一张表格它的结构为我要找到每行tr中的第一个td,于是我写成了 。这样写是错误的。结果也只能找到一个td 也就是第一个值为"1"的td(用length属性来得到td的个数)。而写成就能找到所有4个要找的td了。这就牵涉到children与find的区别了。百度了一下这两者的区别:都说他俩的区别是children()只能匹配转载 2016-05-08 19:08:56 · 747 阅读 · 0 评论 -
《锋利的JQuery》学习笔记
同事整理的一篇文章,觉得很实用,转发过来自己收藏!据说是一本不错的jQuery书,看完后感觉总体也不错,介绍的挺全面的,列举了大量的例子,比较易懂。加上之前学过一点CSS方面的知识,所以在看选择器这部分也比较容易理解(很多都是CSS的写法)。总体感觉,JQuery大置分成了几大块:选择器、DOM操作、事件、动画、AJAX。本书都一一的介绍了,特别是选择器,几乎每种选择器都列举了转载 2016-05-08 19:36:57 · 581 阅读 · 0 评论 -
JS创建对象的几种方式
这里仅介绍几种常用的方式1.工厂模式2.构造函数模式3.原型模式4.构造函数与原型模式组合5.动态原型模式1.工厂模式function Person() { var o = new Object(); o.name = 'hanmeimei'; o.say = function() { alert(this.name); } return o原创 2017-09-11 13:38:25 · 479 阅读 · 0 评论 -
JavaScript 装逼指南
Summary本文秉承着你看不懂是你 sb,我写的代码就是牛逼的理念来介绍一些 js 的装逼技巧。下面的技巧,后三个请谨慎用于团队项目中(主要考虑到可读性的原因),不然,leader 可能请你喝茶。Boolean这个技巧用的很多,也非常的简单!!'fuck'通过两个取反,可以强制转换为Boolean类型。较为常用。原创 2016-04-27 17:57:11 · 447 阅读 · 0 评论 -
jquery中attr和prop的区别
jquery中attr和prop的区别在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别?这些问题就出现了。关于它们两个的区别,网上的答案很多。这里谈谈我的心得,我的心得很简单:对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方转载 2016-04-03 12:21:40 · 454 阅读 · 0 评论 -
解析Javascript事件冒泡机制
1. 事件 在浏览器客户端应用平台,基本生都是以事件驱动的,即某个事件发生,然后做出相应的动作。 浏览器的事件表示的是某些事情发生的信号。事件的阐述不是本文的重点,尚未了解的朋友,可以访问W3school教程 进行了解,这将有助于更好地理解以下的内容 。2.冒泡机制 什么是冒泡呢?转载 2016-04-05 14:27:07 · 556 阅读 · 0 评论 -
详解location.href几种用法的区别【JS跳转】
一:提出问题使用js的同学一定知道js的location.href的作用是什么,但是在js中关于location.href的用法究竟有哪几种,究竟有哪些区别,估计很多人都不知道了。二:常见的几种形式目前在开发中经常要用到的几种形式有:1self.location.href;2window.location.href;原创 2016-04-19 14:31:06 · 36324 阅读 · 1 评论 -
href="javascript:xxx(this);"和onclick="javascript:xxx(this);"的区别
href="JavaScript:xxx(this);"和onclick="javascript:xxx(this);"一直以为这两种写法是等同的,今天在项目中使用时发现前者的this根本拿不到触发事件的A标签,而后者可以拿到一般在做分页按钮时会用A标签来做,但是一般都会写之类的href="#"会导致分页在跳转时页面先跳到当前页面顶部用户体验不好,所以一般推荐写成转载 2016-04-19 14:02:51 · 823 阅读 · 0 评论 -
利用JS提交表单的几种方法和验证
工作中发现表单提交方便的问题,很多时候IE下提交好好的,打了火狐下就出现了问题,利用提交按钮就不成功了,于是利用JS的方式就成功了,也不知道为什么。在导师的催促下就总结出以下的几种常用表单提交的方法。 第一种方式:表单提交,在form标签中增加onsubmit事件来判断表单提交是否成功 function validate(obj) { if (原创 2016-04-18 17:42:27 · 601 阅读 · 0 评论 -
使用ajax和history.pushState无刷新改变页面URL
表现如果你使用chrome或者firefox等浏览器访问本博客、github.com、plus.google.com等网站时,细心的你会发现页面之间的点击是通过ajax异步请求的,同时页面的URL发生了了改变。并且能够很好的支持浏览器前进和后退。是什么有这么强大的功能呢?HTML5里引用了新的API,history.pushState和history.replaceStat转载 2016-04-12 16:30:35 · 470 阅读 · 0 评论 -
js网页顶部线性页面加载进度条,jquery头部线性进度条总结
前言网页顶部加载进度条,近年来很流行,很多网站都采用了这种加载方式。网上也有这样类似的插件,今天我们总结一下网页顶部线性页面加载进度条。 静态效果如下:点击运行可以测试效果!头部LoadingBar线性进度条总结上面的代码只是静态效果,没有和网页加载联系在一起,要和网页加载联系在一起,今天推荐几个插件。插件一:LoadingBarLoadingBar.js的转载 2016-04-12 16:06:20 · 2163 阅读 · 0 评论 -
关于JS出现的Cannot read property 'XXX' of null错误
看了stack overflow,感觉还是对不上号。就百度其他的了。Cannot read property 'cxslide' of null调试页面的时候出现了这样的错误,搜索一番发现是由于在加载JS的时候,页面还未加载完成,就出现了这样的错误。解决方法很简单,将这段 js 放到页面的最下面,等到所以页面加载完成时,再加载这段JS。简单记录一下原创 2016-04-11 20:11:20 · 19038 阅读 · 2 评论 -
JavaScript获取DOM元素位置和尺寸大小
在一些复杂的页面中经常会用JavaScript处理一些DOM元素的动态效果,这种时候我们经常会用到一些元素位置和尺寸的计算,浏览器兼容性问题也是不可忽略的一部分,要想写出预想效果的JavaScript代码,我们需要了解一些基本知识。基础概念为了方便理解,我们需要了解几个基础概念,每个HTML元素都有下列属性offsetWidthclientW原创 2016-04-06 13:55:48 · 2973 阅读 · 0 评论 -
JavaScript如何获得一个DOM元素的绝对位置?(获取元素位置,不依赖框架)
JavaScript如何获得一个DOM元素的绝对位置?(获取元素位置,不依赖框架)function offset(ele) { var top = ele.offsetTop; var left = ele.offsetLeft; while (ele.offsetParent) { ele = ele.offsetParent; if转载 2016-04-06 13:53:27 · 4565 阅读 · 0 评论 -
scrollWidth,clientWidth,offsetWidth的区别
通过一个demo测试这三个属性的差别。说明:scrollWidth:对象的实际内容的宽度,不包边线宽度,会随对象中内容超过可视区后而变大。 clientWidth:对象内容的可视区的宽度,不包滚动条等边线,会随对象显示大小的变化而改变。 offsetWidth:对象整体的实际宽度,包滚动条等边线,会随对象显示大小的变化而改变。 该demo就在页面中放一个te转载 2016-04-06 13:50:19 · 497 阅读 · 0 评论 -
让你彻底弄清offset
很多初学者对于JavaScript中的offset、scroll、client一直弄不明白,虽然网上到处都可以看一张图(图1),但这张图太多太杂,并且由于浏览器差异性,图示也不完全正确。图一 不知道大家看到这张图的第一感觉如何,反正我的感觉就是“这次第,怎一个乱字了得”。 既然我认为上图太多太乱,那么我就把offset、scroll、client分开说,希望能让转载 2016-04-06 13:48:33 · 573 阅读 · 0 评论 -
JavaScript事件委托的技术原理
如今的JavaScript技术界里最火热的一项技术应该是‘事件委托(event delegation)’了。使用事件委托技术能让你避免对特定的每个节点添加事件监听器;相反,事件监听器是被添加到它们的父元素上。事件监听器会分析从子元素冒泡上来的事件,找到是哪个子元素的事件。基本概念非常简单,但仍有很多人不理解事件委托的工作原理。这里我将要解释事件委托是如何工作的,并提供几个纯JavaScript的基转载 2016-04-05 16:55:37 · 397 阅读 · 0 评论 -
浅谈Jquery中的bind(),live(),delegate(),on()绑定事件方式
浅谈Jquery中的bind(),live(),delegate(),on()绑定事件方式前言 因为项目中经常会有利用jquery操作dom元素的增删操作,所以会涉及到dom元素的绑定事件方式,简单的归纳一下bind,live,delegate,on的区别,以便以后查阅,也希望该文章日后能帮助到园友,文中如有不当之处,还望各位指正,话不多说,直接进入正题。bi转载 2016-04-05 16:54:30 · 562 阅读 · 0 评论 -
Javascript实现HashTable(哈希表)
ES6特性(详细可看阮一峰)Set 对象类似于数组,且成员的值都是唯一的。Map 对象是键值对集合,和 JSON 对象类似,但是 key 不仅可以是字符串还可以是对象其中Map中的键名也可以是对象这个特性极大的方便了开发,但是在ES6之前是没有办法的,只能模拟,但是很麻烦。但是可以模拟一个hashTable来方便开发,其实javascript的object的属性其实与哈希表非常原创 2017-09-03 17:34:00 · 1807 阅读 · 0 评论