
JS重塑学习
有用过两年多的JS了,以前一直觉得不是很重要,但是做JavaWeb的,要做好的话,那么JS这门基础课程肯定要打扎实,现在准备利用空闲时间重新学习JS。
漫长学习路
为了完善自己的代码,我会尽自己最大的努力
展开
-
Javascript静态页面的三种传值方式
cookie优点:可以在同源内的任意网页内访问.生命期可以设置.缺点:值长度有限制.Cookie是浏览器存储少量命名数据.它与某个特定的网页或网站关联在一起.Cookie用来给浏览器提供内存,以便脚本和服务器程序可以在一个页面中使用另一个页面的输入数据.这里推荐使用jquery的cookie.js下载与引入:jquery.cookie.js基于jquery;先引入jquery,再引入:jquery原创 2017-12-12 19:28:09 · 1086 阅读 · 0 评论 -
Angularjs的前端拦截器
最近项目中,要使用过滤器去做登陆拦截,接到要求的第一反应肯定是java的filter。简单方便,后来发现项目中很多请求用到的是ajax异步请求,在使用sendRedirect跳转的时候,根本跳出过去。因为服务器要控制页面跳转必须客户端提交请求,服务器接到请求后,将处理后的html返回至页面展示 AJAX是从服务端获取到内容后利用客户端脚本替换InnerHtml,这本质上是客户端的行为,所以Ajax原创 2016-10-31 11:12:08 · 6937 阅读 · 0 评论 -
淘宝购物车前端(JS和Angularjs版本)
今天用HTML和JS实现以下购物车,然后再用Angualrjs加bootstrap再去实现一下购物车的前端实现。功能页面分析:既然是做模仿淘宝购物车,肯定要先去分析一下淘宝的购物车页面,自己去淘宝卖了两件东西,看了下效果;首先有一个全选功能,全选的时候会把所有的单选框给选中,并且会把所有的金额进行统计。商品店铺的单选功能:在选择店铺的时候会把下面的商品全部都给选中,并且统计已经勾选的金额。商品单选原创 2016-09-15 18:21:12 · 8802 阅读 · 0 评论 -
一个极端的前端国际化方法
最近一直在做整个页面的国际化,相信很多小伙伴们都做过,前端主要采用的是Angularjs,后端使用的是Spring来做国际化,那么他们的优点,缺点现在一起来总结一下。其实无论用哪种语言做国际化,感觉都是千篇一律,只不过实现的方式不同而已。1.定义国际化配置(什么CN啊EN啊之类的)2.读取国际化配置3.定义自己的国际化方式(是通过切面也好,工具类也好)AngularJs国际化1.定义国际化配置;在原创 2016-08-29 15:41:07 · 11366 阅读 · 5 评论 -
JavaScript定时器原理及高级使用
javaScript里面内置了两个定时器,一个是setTimeout()一个是setInterval()。下面将由浅入深来理解一下定时器的工作原理。使用方式:setTimeout()原创 2016-08-15 20:03:53 · 5718 阅读 · 2 评论 -
Ajax用法与区别
上一次复习了XMLHttpRequest对象,这一次要总结一下Ajax的其他几个对象,以及各个版本的Ajax用法和区别。FormDate现在Web中大家都会用到表单的数据序列化,XMLHttpRequest也提供了一个叫做FormData类型;var data=new FormData(); data.append("name","张三"); data.append("age","14")原创 2016-08-11 17:45:37 · 3122 阅读 · 0 评论 -
Ajax的XMLHttoRequest对象
Ajax在我们的网页中无处不在,我们平常开发中也都会使用Ajax,可是我们对它的认识又有多少啦,又有多少人知道它的全名,又有多少人会把它当成阿贾克斯Ajax的由来2005年,Jesse James Garrett 介绍了一种技术,用他的话说就叫Ajax,是对Asynchronous JavaScript+XML的简写,这一技术能够向服务器请求额外的数据而无需卸载页面,会带来更好的用户体验。这一技术原创 2016-08-10 20:26:36 · 1191 阅读 · 0 评论 -
Jquery自制表单实时验证
关于Jquery表单原创 2016-08-08 17:06:24 · 4303 阅读 · 3 评论 -
JSON
语法JSON的语法可以表示以下三种类型的值。简单值:使用与javaScrpt相同的语法,可以在JSON中表示字符串,数值,布尔值和null。但JSON不支持JavaScript中的特殊值unfedined。对象:对象作为一种复杂数据类型,表示的是一组有序的键值对儿。而每个键值对儿中的值可以是简单值,也可以是复杂数据类型的值。数组:数组也是一种复杂数据类型,表示一组有序的值的列表,可原创 2016-07-27 18:03:42 · 1407 阅读 · 0 评论 -
XML DOM完全参考手册(二)DOM节点
解析 XML DOM大多数浏览器都内建了供读取和操作 XML 的 XML 解析器。解析器把 XML 转换为 JavaScript 可存取的对象。解析 XML所有现代浏览器都内建了用于读取和操作 XML 的 XML 解析器。解析器把 XML 读入内存,并把它转换为可被 JavaScript 访问的 XML DOM 对象。微软的 XML 解析器与其他转载 2016-07-26 17:56:58 · 1020 阅读 · 0 评论 -
XML DOM完全参考手册(一)DOM与节点
XML 文档对象模型定义访问和操作XML文档的标准方法。DOM 将 XML 文档作为一个树形结构,而树叶被定义为节点。XML DOM 简介XML DOM 定义了访问和处理 XML 文档的标准方法。XML DOM 是 XML Document Object Model 的缩写,即 XML 文档对象模型。什么是 DOM?转载 2016-07-26 16:33:17 · 1143 阅读 · 0 评论 -
表单序列化与get,post请求
表单序列化随着Ajax的出现,表单序列化已经成为一种常见需求。在JS中,可以利用表单字段的type属性,连同name和value属性一起实现对表单的序列化。在编写代码前,先了解一下表单提交期间,浏览器是怎么样将数据发送给服务器的;1.对表单字段的名称和值进行URL编码,使用和号(&)分割。2.不发送禁用的表单字段3.只发送勾选的复选框和单选按钮。4.不发送type为"reset原创 2016-07-24 22:08:10 · 2653 阅读 · 0 评论 -
JavaScript 表单脚本
理解表单JavaScript最初的一个应用,就是分担服务器处理表单的责任,打破处处依赖服务器的局面,现在表单已经成为开发Web程序必不可少的一部分了,可是我们又对它了解多少啦,下面一起来了解一下表单;表单的基础知识在HTML中,表单是由元素来表示额,而在JavaScript中,表单对应的则是HTMLForm-Element类型。HTMLFormElement继承了HTMLElement原创 2016-07-23 17:18:40 · 1060 阅读 · 0 评论 -
JavaScript内存和性能
内存和性能由于Javascript会为我们的web应用程序提供很强的交互能力,因此会有很多开发人员不分青红皂白地向页面中添加大量的处理程序。在JavaScript中,添加到页面上的事件处理程序数量将直接关系到页面的整体运行性能。导致这一问题的原因是多方面的。首先,每个函数都是对象,都会占用内存;内存中的对象越多,性能就会越差。其次,必须事先指定所有事件处理程序而导致的DOM访问次数,会延迟整个原创 2016-07-21 19:24:58 · 831 阅读 · 0 评论 -
javaScript事件类型四(键盘与文本事件)
文本和键盘事件也是我们平常用的比较少的,在用户输入键盘的时候会触发键盘事件,回车的时候有可能会触发键盘和submit的文本事件;键盘事件键盘事件类型keydown:在用户按下键盘上的任意键时触发,而且如果按住不放的话,会重复触发此事件。keypress:当用户按下键盘上的字符键时触发,而且如果按住不放的话,会重复触发此事件。按下Esc键也会触发这个事件keyup:当用户释放键盘原创 2016-07-17 17:45:54 · 1445 阅读 · 0 评论 -
JavaScript事件类型(三)鼠标事件
鼠标与滚轮事件在我们日常生活和开发中最常用到的也就是鼠标点击事件了,比较鼠标是我们最重要的定位设备。有人说上网可以没有键盘,但是一定不能没有鼠标,事实上确实是这样,因为现在很多网站都设置的有虚拟键盘,点击一下就出来了。DOM3级定义了9个鼠标事件,简介如下:原创 2016-07-16 18:37:40 · 2007 阅读 · 0 评论 -
JavaScript事件类型(二)
焦点事件:在HTML页面中,每个元素都会得到焦点和失去焦点,我们的焦点事件就会在这个时候触发,利用这些事件与document.hasFoucs()方法及document.activeElement属性配合。可以知晓用户在页面上的行踪,定义和用法onblur 事件会在对象失去焦点时发生。语法参数描述SomeJavaScr原创 2016-07-15 10:47:36 · 1245 阅读 · 2 评论 -
解密jQuery事件核心 - 模拟事件(四)
在Internet Explorer 8和更低,一些事件change 和 submit本身不冒泡,但jQuery修改这些冒泡,创建一致的跨浏览器的行为。焦点事件blur :在这个事件触发前,元素已经失去焦点,不冒泡,同步触发。target 指向当前失去焦点的元素。focus:在这个事件触发前,元素已经得到焦点,不冒泡,同步触发。target 指向当前得到转载 2016-07-14 22:13:47 · 1624 阅读 · 0 评论 -
JavaScript事件类型(一)
当我们打开浏览器的时候实际上就会触发一个事件,浏览器加载完成之后会触发一个load事件,当我们鼠标移动的时候有可能也会触发一个事件,当我们点击的时候也会触发事件。事件在我们的浏览器中显得如此重要,下面来认识一下事件;事件类型1.UI事件,当用户与页面上的元素交互时触发;2.焦点事件,当元素获得或失去焦点时触发;3.鼠标事件,当用户通过鼠标在页面上执行操作时触发;4.滚轮事件,当原创 2016-07-11 21:28:43 · 1561 阅读 · 0 评论 -
兼容IE5,6,7,8 谷歌,火狐的关闭窗口方法
废话不多说,现在需要一个程序能够关闭IE5,6,7,8和谷歌火狐的方法其主要目的是为了兼容性考虑;window.navigator.userAgent属性包含了浏览器类型、版本、操作系统类型、浏览器引擎类型等信息,通过这个属性来判断浏览器类型,下面是我写的一个函数,这个函数返回一个包含浏览器名称和版本的数组。此函数可区分ie5.5~ie8、Chrome、Opera、Safair原创 2016-07-06 22:03:55 · 2475 阅读 · 0 评论 -
JavaScript事件
什么是事件流javaScript与HTML之间的交互是通过事件实现的。事件,就是文档或浏览器窗口中发生的一些特定的交互瞬间。可以使用侦听器(或处理程序)来预订事件,以便事件发生时执行相应的代码。这种模型使用了我们的观察者模式,支持页面的行为(JS代码)与页面的外观(HTML,CSS)之间的松散耦合。当浏览器发展到第四代时,IE和Netscape开发团队使用了两个完全相反的事件流概念,IE的事件原创 2016-06-19 18:03:31 · 1738 阅读 · 0 评论 -
javaScript DOM操作技术
在一般情况下我们操作DOM都比较简单明了,尤其是jquery出来之后,我们会发现操作DOM变得如此简单,但是也会有许多隐藏的坑,所以有时候操作DOM也并非想象中那么简单;简单而常用的操作:访问节点document.getElementById() 根据Id获取元素节点document.getElementsByName() 根据name获取元素节点docum原创 2016-06-16 20:53:59 · 3072 阅读 · 0 评论 -
JavaScript DOM(三) Element 类型
简介:在JavaScript中除了document类型之外,Element类型就要算是Web编程中最常用的类型了。Element类型用于表现XML或者HTML元素,提供了对元素标签名,子节点及特性的访问;特征:1.nodeType的值为1;2.nodeName的值为元素的标签名;3.nodeValue的值为null;4.parentNode可能是document或Eleme原创 2016-06-08 17:48:14 · 1870 阅读 · 0 评论 -
使用jQuery加载js脚本
动态加载Javascript是一项非常强大且有用的技术。这方面的主题在本站已经讨论了不少,我也经常会在一些个人项目上使用RequireJS和Dojo加载js。它们很强大,但有时候也会得不偿失。如果你使用的是jQuery,它里面有一个内置的方法可以用来加载单个js文件。当你需要延迟加载一些js插件或其它类型的文件时,可以使用这个方法。下面就介绍一下如何使用它!jQuery JavaScript转载 2016-06-06 11:00:52 · 2084 阅读 · 0 评论 -
JS小数运算出现多位小数的问题
写在前面的话:今天帮同事解决了一个问题,就是小数相乘出现很多位小数的问题;这个问题自己以前也遇到过,现在特意来总结一下;Number类型:Number类型是ECMAScript中最常用和最令人关注的类型了;这种类型使用IEEE754格式来表示整数和浮点数值(浮点数值在某些语言中也被成为双精度数值),为支持各种数据类型,ECMA-262定义了不同的数值面量格式。十进制:var原创 2016-06-01 19:38:20 · 12417 阅读 · 1 评论 -
JavaScript DOM(二)之Document类型
Document类型简介javaScript通过Document类型表示文档;因此我们称document 为文挡对象,在浏览器中, document对象是HTMLDocument的一个实例,表示整个HTML页面,而且,document对象是window对象的一个属性,因为可以作为一个全局对象来访问;Document类型特征1:nodeType的值为9;2:nodeName的值为"#原创 2016-05-31 20:03:28 · 2830 阅读 · 0 评论 -
JavaScript函数式编程
最近一段时间,函数式编程又开始活跃起来了。函数式编程是一种编程范式,它将电脑运算视为数学上的函数计算,并且避免使用程序状态以及可变数据。函数式编程强调程序执行的结果而非执行的过程,倡导利用若干简单的执行单元让计算结果不断渐进,逐层推导复杂的运算,而不是设计一个复杂的执行过程。今天我试图用js去梳理函数式编程相关的一些知识。文中代码风格采用Standard,使用ES6语法。函数式编程初试转载 2016-05-27 14:02:27 · 2038 阅读 · 2 评论 -
jQuery性能优化
jQuery性能优化现在越来越多的人应用jQuery了,有些同学在享受爽快淋漓coding时就将性能问题忽略了, 比如我. jquery虽在诸多的js类库中性能表现还算优秀, 但毕竟不是在用原生的javascript开发, 性能问题还是需要引起重视的.总是从ID选择器开始继承在class前使用tag将jquery对象缓存起来掌握强大的链式操作使用子查询对直接的DOM操作进行限制翻译 2016-03-29 13:08:02 · 857 阅读 · 0 评论 -
为什么说DOM操作很慢
为什么说DOM操作很慢一直都听说DOM很慢,要尽量少的去操作DOM,于是就想进一步去探究下为什么大家都会这样说,在网上学习了一些资料,这边整理出来。 首先,DOM对象本身也是一个js对象,所以严格来说,并不是操作这个对象慢,而是说操作了这个对象后,会触发一些浏览器行为,比如布局(layout)和绘制(paint)。下面主要先介绍下这些浏览器行为,阐述一个页面是怎么最终被呈现出来的,另转载 2016-03-29 13:05:45 · 2020 阅读 · 0 评论 -
JavaScritpt的DOM初探之Node(一)
DOM(文档对象模型)是针对HTML和XML文档的一个API。DOM描绘了一个层次化的节点树,允许开发人员添加,移除和修改页面的某一部分。DOM脱胎于微软公司的DHTLM(动态HTML),但是现在它已经成为表现和操作页面标记的真正跨平台,语言中立的方式。JavaScript和DOM通常被视为一个单一的实体,因为JavaScript是最常见的用于此目的(与web上的内容交互)。 使用DOM AP原创 2016-03-28 20:25:33 · 1241 阅读 · 0 评论 -
JavaScript BOM
JavaScript特性:交互性安全性(不可以直接访问本地硬盘)跨平台性(只要是可以解析js的浏览器都可以执行,和平台无关)JavaScript三大核心:1)核心(ECMAScript):描述了JS的语法和基本对象。2)文档对象模型 ☆(DOM):处理网页内容的方法和接口3)浏览器对象模型(BOM):与浏览器交互的方法和接口B原创 2016-03-20 22:09:29 · 2839 阅读 · 0 评论 -
JavaScript的闭包理解
由于本人是做java web 开发的,对js只是存在很浅的理解,js闭包的概念很早就听说了,但是一直都不明白是什么意思,今天准备梳理一下闭关的概念;闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现。闭包的特性:1.函数嵌套函数2.函数内部可以引用外部的参数和变量3.参数和变量不会被垃圾回收机制回收闭包的定义及其优缺点原创 2016-03-19 18:18:37 · 1677 阅读 · 1 评论 -
JavaScript函数表达式
在ECMAScript中,有两个最常用的创建函数对象的方法,即使用函数表达式或者使用函数声明。对此,ECMAScript规范明确了一点,即是,即函数声明 必须始终带有一个标识符(Identifier),也就是我们所说的函数名,而函数表达式则可以省略。函数声明的语法是这样的: function functionName(){ 函数体 }首先是function关键字,这个关键字表示原创 2016-02-28 21:57:12 · 1225 阅读 · 1 评论 -
Jquery和angularjs获取check框选中的值小技巧
在我们平常的开发中,有时候会需要获取一下check框选中的值,以及check框选中行的所有信息。这个时候有一个小技巧那就是我们可以把要获取的信息全部放到check框的值里面,这样我们可以获取check框选中值的时候也就相当于获取了当前行的信息。全选全不选:var bischecked=$('#cboxchecked').is(':checked'); var fruit=$原创 2016-01-17 15:38:45 · 18029 阅读 · 1 评论 -
JavaScript运行原理解析
写在前面的话: 发现使用了那么长时间的Javascript,但是对其运行原理还是不清晰,今天特意总结一下,把大神们的理论和自己的总结都记录到下面;1. 什么是JavaScript解析引擎?简单地说,JavaScript解析引擎就是能够“读懂”JavaScript代码,并准确地给出代码运行结果的一段程序。比方说,当你写了 var a = 1 + 1; 这样一段代码,JavaScrip翻译 2016-01-09 17:06:41 · 28555 阅读 · 9 评论 -
JavaScript数组
何为数组:所谓数组,就是相同数据类型的元素按一定顺序排列的集合,就是把有限个类型相同的变量用一个名字命名,然后用编号区分他们的变量的集合,这个名字称为数组名,编号称为下标。组成数组的各个变量称为数组的分量,也称为数组的元素,有时也称为下标变量。数组是在程序设计中,为了处理方便, 把具有相同类型的若干变量按有序的形式组织起来的一种形式。这些按序排列的同类数据元素的集合称为数组。在JS原创 2015-12-20 22:44:56 · 2400 阅读 · 2 评论 -
搞对象前,你得先有对象
我们在生活中经常听到对象两个词,那么对象到底是个 什么玩意啦,我们来查一查维基百科;百度给出的答案太玄乎了,我们这里只讨论编程语言的对象,准确的说是JavaScript的对象;理解对象引用类型的值(对象)是引用类型的一个实例。在Js中,引用类型是一种数据结构,用于将数据和功能组织在一起。它有时被人称之为类,但这种称呼并不妥当。尽管JS从技术上讲是一门面向对象的语言,但它不具备传原创 2015-11-22 21:24:47 · 1828 阅读 · 2 评论 -
JavaScript和JQuery和angularjs操作select
今天使用angularjs操作select下拉列表,发现了一些问题,这里特意来总结一下他和JS,以及jquery的用法;标签定义和用法 select 元素可创建单选或多选菜单。当提交表单时,浏览器会提交选定的项目,或者收集用逗号分隔的多个选项,将其合成一个单独的参数列表,并且在将 表单数据提交给服务器时包括 name 属性。标签可选的属性属性原创 2015-11-16 22:12:43 · 1868 阅读 · 1 评论 -
JavaScript垃圾收集
JS具体自动垃圾收集机制(Java也有GC);也就是说,执行环境会负责管理代码执行过程中使用的内存。在编写JS程序时,开发人员不用再关心内存使用问题,所需内存的分配以及无用内存的回收完全实现了自动管理。这种垃圾收集器会按照固定的时间间隔(或代码中预定的收集时间),周期性的执行这一操作;下面让我们一起来分析一下函数中局部变量的正常生命周期。局部变量只在函数执行的过程中存在,而在这个过程中,会为局原创 2015-11-15 20:03:43 · 1254 阅读 · 1 评论 -
JavaScript执行环境及作用域
执行环境(executin context)是JS中最为重要的一个概念。执行环境定义了变量或函数有权访问的其他数据决定了它们各自的行为。每个执行环境都有一个与之关联的变量对象(variable object),环境中定义的所有变量和函数都保存在这个对象中。虽然我们编写的代码无法访问这个对象,但解析器在处理数据时会在后台使用它。全局执行环境是最外围的一个执行环境。根据JS实现的宿主环境不同,表示原创 2015-11-08 21:30:57 · 2571 阅读 · 0 评论