JAVASCRIPT
文章平均质量分 72
梦jenny
前端开发
展开
-
通过递归的方式实现深度clone
预备知识:各种数据类型的赋值方法及类型判断方法值类型和引用类型的区别数组和对象的遍历方法递归算法 预计工作量半小时 具体描述实现方法clone,可以用其针对可能是任何类型的对象,进行值拷贝例如var a = 1;var b = clone(a);b = 2;console.log(a, b); // 1, 2--------var原创 2015-04-01 12:41:32 · 919 阅读 · 0 评论 -
JS判断数据类型
主要有三种 typeof 、instanceof、prototype.toString.call判断数据类型1、对于返回非object的可以用typeof 使用方法 typeof XXX 或者 typeof(XXX)可以的有 String Boolean Number Undefined 2、对于null function object Array最适用的是in原创 2015-05-05 16:33:32 · 329 阅读 · 0 评论 -
js数组去重三种方法
第一种是比较常规的方法思路:1.构建一个新的数组存放结果2.for循环中每次从原数组中取出一个元素,用这个元素循环与结果数组对比3.若结果数组中没有该元素,则存到结果数组中复制代码代码如下:Array.prototype.unique1 = function(){ var res = [this[0]];//this指的对象本身如下文ar转载 2015-05-05 22:13:42 · 547 阅读 · 0 评论 -
实现一个简单的DOM选择器
实现一个简单的DOM选择器 预备知识DOM相关知识http://www.w3school.com.cn/htmldom/index.asp 具体描述实现一个方法$,可以完成以下功能 1.可以通过id获取一个DOM例如:......$("#dom1") // 返回一个数组,数组中唯一的元素为id为dom1的div 2.可以通过css的cla原创 2015-04-07 08:49:59 · 733 阅读 · 0 评论 -
js数组的操作
js数组的操作用 js有很久了,但都没有深究过js的数组形式。偶尔用用也就是简单的string.split(char)。这段时间做的一个项目,用到数组的地方很多,自以为js高手的自己居然无从下手,一下狠心,我学!呵呵。学了之后才知道,js数组的功能强大很,远比VB,C#强多了,大家慢慢看吧1、数组的创建 var arrayObj = new Array(); /转载 2015-04-09 17:29:27 · 276 阅读 · 0 评论 -
JS选取DOM元素的方法
摘自JavaScript权威指南(jQuery根据样式选择器查找元素的终极方式是 先用getElementsByTagName(*)获取所有DOM元素,然后根据样式选择器对所有DOM元素进行筛选)今天试了下各种选取元素的方法的速度,用原生的方法比jQuery要快差不多8倍,IE8是最慢的,IE9的速度差不多是IE8的3倍,Chrome的表现最好,其次是Firefox)选取文档元转载 2015-04-09 16:37:38 · 432 阅读 · 0 评论 -
js的slice函数
经常看到slice函数处理数组,如克隆,时候用slice(0)今天探讨一下slice功能点击打开链接1 var aArr = [0,1,2,3];2 var m = aArr.slice(0);3 aArr = [3,2,1,0];4 alert(m);//输出0,1,2,3,这时虽然aArr中的值已经改变,但是因为使用slice方法已经创建一个新的数组。原创 2015-04-02 18:53:11 · 2185 阅读 · 0 评论 -
JS---创建自己的“JavaScript库”,原来如此简单
博主在上一篇文章中提到了JavaScript库实际上就是一堆函数的集合,就是方便给你调用的不用自己写那些功能强大的函数……这篇文章说一说如何创建JavaScript库及需要注意的问题!期待您光临斧正!行文目录:点击对应目录进行跳转编写JavaScript库要注意的问题编写JavaScript库的模板代码编写JavaScript库(实例转载 2015-04-09 17:28:54 · 376 阅读 · 0 评论 -
js substr 与substring
substring 方法用于提取字符串中介于两个指定下标之间的字符substring(start,end)开始和结束的位置,从零开始的索引参数 描述start 必需。一个非负的整数,规定要提取的子串的第一个字符在 stringObject 中的位置。stop 可选。一个非负的整数,比要提取的子串的最后一个字符在 stringObject 中的转载 2015-04-09 15:53:12 · 369 阅读 · 0 评论 -
图片轮播
这几天写图片轮播,在网上搜到了几个博客,在这里记一下Cauma 的图片轮播 ,其他的各种JS实现也都可以看看橡树小屋JQUERY实现也可以看看jquery实现图片轮播原创 2015-06-08 10:09:50 · 603 阅读 · 0 评论 -
js定位DOM元素
获取元素的位置属性可以通过HTMLElement.offsetLeftHTMLElement.offsetTop但是,这两个属性所储存的数值并不是该元素相对整个浏览器画布的绝对位置,而是相对于其父元素位置的相对位置,也就是说这两个数值得到的是以其 父元素左上角为(0,0)点从而计算出的数值。所以我们要得到她的绝对位置,那么我们必须依次向上获取他的父元素的位置,然后获取它父元转载 2015-07-11 10:05:15 · 1278 阅读 · 0 评论 -
JS中关于clientWidth offsetWidth scrollWidth 等的含义
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offsetWidth (包括边线的宽);网页可见区域高: document.body.offsetHeight (包括边线的宽);网页正文全文宽: document.body.scroll转载 2015-08-25 10:07:40 · 1956 阅读 · 0 评论 -
懒加载
懒加载技术(简称lazyload)并不是新技术, 它是javascript程序员对网页性能优化的一种方案.lazyload的核心是按需加载.在大型网站中都有lazyload的身影,例如谷歌的图片搜索页,迅雷首页,淘宝网,QQ空间等.因此掌握lazyload技术是个不错的选择,可惜jquery插件lazy load官网(http://www.appelsiini.net/projects/lazyl转载 2015-09-15 11:15:47 · 667 阅读 · 0 评论 -
js 中的this
this是js的一个关键字,随着函数使用场合不同,this的值会发生变化。但是总有一个原则,那就是this指的是调用函数的那个对象。1、纯粹函数调用。function test() { this.x = 1; alert(x);}test();其实这里的this就是全局变量。看下面的例子就能很好的理解其实this就是全局对象Global。原创 2015-09-07 19:27:52 · 380 阅读 · 0 评论 -
JS效率问题之 str+ ;array.join && arr[i]
请把以下用于连接字符串的JavaScript代码修改为更有效率的方式12345678var htmlString = "<div class=”container”>" + "<ul id=”news-list”>";for(var原创 2015-08-21 18:50:37 · 734 阅读 · 0 评论 -
JS之reduce
以前没接触到reduce 忽然遇见了这么个题:martix = [[1,2],[3,4][5,6]]; var fl = martix.___(function(a,b)____); console.log(fl)//输出[1,2,3,4,5,6]看看reduce[0, 1, 2, 3, 4].reduce(function(previousValue, currentValue, index,原创 2015-08-18 21:09:44 · 1155 阅读 · 0 评论 -
JS继承
继承:继承本身就是一个抽象的话题,在JavaScript中继承更是一个复杂的话题,因为JavaScript想要实现继承有两种实现方式,分别是类式继承和原型式继承,每种实现的方式都需要采取不少措施,下面本人通过分析例子的方式讲解JavaScript中这个很重要的话题。/* -- 类式继承 -- */ //先声明一个超类 function Person(name){ this.转载 2015-08-31 10:12:58 · 272 阅读 · 0 评论 -
原型和原型链详解
原文点击打开点击打开链接私有变量和函数在函数内部定义的变量和函数,如果不对外提供接口,外部是无法访问到的,也就是该函数的私有的变量和函数。script type="text/javascript"> function Box(){ var color = "blue";//私有变量 var fn = function()转载 2015-08-31 10:06:11 · 492 阅读 · 0 评论 -
详解js跨域问题
什么是跨域?概念:只要协议、域名、端口有任何一个不同,都被当作是不同的域。URL 说明 是否允许通信http://www.a.com/a.jshttp://www.a.com/b.js 同一域名下 允许http://www.a.com/lab/a.jshttp://www.a.com/script/b.js 同一转载 2015-08-25 16:10:56 · 227 阅读 · 0 评论 -
画线
我有两个图 我点击a图 再点击b图 ab之间就会出现一条连线 而且我拖动a或b连线会跟随变化只需要监听并且计算两个点的运动轨迹就可以了吧function createLine(x1,y1, x2,y2){ var length = Math.sqrt((x1-x2)*(x1-x2) + (y1-y2)*(y1-y2)); var angle = Math.atan2(y2转载 2015-04-08 17:04:00 · 364 阅读 · 0 评论 -
正则基础之 ?:
?: 是 不想被捕获的时候使用 可以提高程序执行速度正则基础之——反向引用 正则基础之——捕获组(capture group)比如 ([a-z][0-9])+ 这个正则表达式里 ( ) 里面的内容被捕获了, 反向引用的时候可以用上 。一般正则替换的时候用的多 像UBB代码 但是 如果写成 (?:[a-z][0-9])+ 跟上面 正则表达式 整体匹配是一样的 就转载 2015-04-08 10:58:07 · 349 阅读 · 0 评论 -
实现一个自定义事件处理对象notice,或者称为消息中心对象
预备知识:对象及数组的相关知识JavaScript函数相关知识搜索“监听者模式(观察者模式)”相关知识阅读 预计工作量:半小时 具体描述:任何对象可以通过notice.on方法注册要监听什么消息(事件),当监听到时进行响应某个方法例如:notice.on("something happen",someFunction);notice.on("OnLi原创 2015-04-01 12:35:14 · 556 阅读 · 1 评论 -
锚点
锚点锚点就是点击链接,到页面特定位置,可以用的name属性;也可以根据任意标签的id值;但是有一点需要注意,只使用id属性当作锚点时,有个重要的缺点值得一提,那就是某些古老的浏览器并不支持这个方法.哦喔,在标识你自己的锚点时这的确是个必须考虑的问题所以可以将name和id结合起来,XHTML1.0不推荐使用name属性,因此必须考虑向后兼容.向前兼容用name 向后兼容原创 2015-04-03 15:26:02 · 615 阅读 · 0 评论 -
window对象的alert() confirm() prompt()方法
alert() 弹出个提示框 (确定) confirm() 弹出个确认框 (确定,取消) prompt() 弹出个输入框 让你输入东西 使用消息框 使用警告、提示和确认 可以使用警告、确认和提示消息框来获得用户的输入。这些消息框是 window 对象的接口方法。由于 window 对象位于对象层次的顶层,因此实际应用中不必使用这些消息框的全名(例如 “window.alert()”转载 2015-04-01 12:40:27 · 2382 阅读 · 0 评论 -
javascript 中的call函数的理解问题;apply
function myFun(){ document.write(arguments + " ");} var myObject = new Object(); myFun.call(myObject,13,3,95); 输出结果是[object Object] 解释:call([thisObj[,arg1[, arg2[, [,.argN]]]]转载 2015-04-03 20:28:33 · 605 阅读 · 0 评论 -
深度克隆与浅度克隆
javascript中对象的深度克隆深度克隆:原不变浅克隆:通过“=”赋值操作;基础类型:值传递;对象:引用。以下number function string 执行的浅克隆(赋值操作),但是结果表现形式与深度克隆一致,都是原不变,相当于深克隆。 浅==深对于基础类型可以理解赋值操作原来的不变,但是function作为引用,原也不变,是因为,函数的克隆会在内存单独开辟空间,互不影原创 2015-04-02 18:34:32 · 1007 阅读 · 0 评论 -
javascript事件监听
大家可以参考一下两个博文,深入学习。JS实现监听者模式或观察者模式设计模式学习----观察者模式(事件监听实现)javascript事件监听模式我在这里做些基础性的总结。首先,什么是事件监听?一个元素有一个事件 触发的时候 浏览器直接解释执行就完了呗 为什么还要监听??意义 何在? 监听到底是干什么的?跟后台有关系?比如说一个页面上有什么东西,其中有一个按钮原创 2015-04-02 15:58:53 · 923 阅读 · 0 评论 -
js对象属性值访问
var obj = { name:'lily', year:'20'}alert(obj.year);alert(obj['year']);这两种都能访问到year的值可以用点,也可以用下标两个都是获取对象值的方式。第二个用变量名获取对象值的时候很有用。123456789var obj = { name:'lily', year:'20' }alert(obj.year原创 2015-04-01 21:15:22 · 431 阅读 · 0 评论 -
javascript中的冒号
对冒号(:)有了更进一步的了解,希望对想了解冒号用法的人有所帮助。 1、switch语句分支 2、?:三元表达式的false 3、声明对象直接量的成员 4、声明标签 1和2相信地球人都知道吧?如果有人不知道,那我改成地球上的程序员都知道,哈哈 3、对象直接量我们也经常用,什么是对象直接量呢? 对象直接量(也称为对象初始化程序)是由一个列表构成的,这个列表的元素是用冒转载 2015-04-01 20:43:01 · 461 阅读 · 0 评论 -
浅谈javascript六种数据类型以及特殊注意点
在js中常见的六种数据类型:String类型、Null类型、Number类型、Boolean类型、Object类型。1、typeof的注意点涉及到数据类型,不免会提到,操作符 typeof。要注意:1、typeof是操作符,不是方法。虽然我们经常使用typeof()的方式获取对象的数据类型。2、对 null 取typeof 是 object(这是因为null是 空的对象引用),对函转载 2015-04-01 13:03:37 · 610 阅读 · 0 评论 -
js入门·对象属性方法大总结
今天是我们js入门系列演示的最后一节了(暂时我是这样计划的),但是请朋友们记住,前面的实例你都很熟悉了的话也不代表我们就懂了JS,甚至连入门我们都不得不承认我们只是站在门槛上,还没有进去呢,那你可能要问,为什么要匆匆结束呢?答案很简单,我们的最终目标是AJAX/Atlas,在以后的入门教程中我们还会接触大量的JS的东西,而我这个懒人繁冗的注释一定不会让你失望的,所以更多JS我们以后继续学习,下面我转载 2015-04-01 21:09:31 · 354 阅读 · 0 评论 -
正则表达式
点击打开链接正则表达式 - 语法正则表达式(regular expression)描述了一种字符串匹配的模式,可以用来检查一个串是否含有某种子串、将匹配的子串做替换或者从某个串中取出符合某个条件的子串等。列目录时, dir *.txt或ls *.txt中的*.txt就不是一个正则表达式,因为这里*与正则式的*的含义是不同的。构造正则表达式的方法和创建数学表达式的方法一样转载 2015-04-08 14:02:42 · 344 阅读 · 0 评论 -
正则表达式 \b
\b代表字与字中间那个看不见的东西,如here is a word那么,这句中有好几个\b, 每个单词的前后都有一个\b.所以你用 \bhere\b 可以匹配上面这个here,但如果here 不是一个单词,而是一个单词的一部分,如 adheread, 这样的话,用here 可以匹配,用\bhere\b就不能区配了,因为ad后面没有\b. 所以 adhere 中的here转载 2015-04-08 14:00:04 · 295 阅读 · 0 评论 -
正则表达式
^符号表示开头^once表示该模式只匹配那些以once开头的字符串。例如该模式与字符串"once upon a time"匹配,与"There once was a man from NewYork"不匹配$符号用来匹配那些以给定模式结尾的字符串。bucket$这个模式与"Who kept all of this cash in a bucket"匹配,转载 2015-04-08 10:22:06 · 358 阅读 · 0 评论 -
原生js学习网址
抛弃jQuery,深入原生的JavaScript原创 2015-04-08 15:01:39 · 407 阅读 · 0 评论 -
JS引用
转载 2015-04-08 17:03:13 · 313 阅读 · 0 评论 -
window.location.hash属性介绍
location是javascript里边管理地址栏的内置对象,比如location.href就管理页面的url,用location.href=url就可以直接将页面重定向url。而location.hash则可以用来获取或设置页面的标签值。比如http://domain/#admin的location.hash="#admin"。利用这个属性值可以做一个非常有意义的事情。很多人都喜欢收藏转载 2015-04-07 10:11:08 · 316 阅读 · 0 评论 -
JavaScript的5种调用函数的方法
一次又一次的,我发现,那些有bug的Javascript代码是由于没有真正理解Javascript函数是如何工作而导致的(顺便说一下,许多那样的代码是我写的).JavaScript拥有函数式编程的特性, 当我们选择面对它的时候,这将成为我们前进的阻碍. 作为初学者,我们来测试五种函数调用的方法,从表面来看我们会认为那些函数与C#中函数的作用非常相似,但是我们一会儿可以看到还是有非常重要的不转载 2015-04-01 20:38:04 · 525 阅读 · 0 评论 -
Javascript中valueOf与toString区别
前言基本上,所有JS数据类型都拥有这两个方法,null除外。它们俩解决javascript值运算与显示的问题,重写会加大它们调用的优化。测试分析先看一例:var aaa = { i: 10, valueOf: function() { return this.i+30; }, toString: function() { return this.val转载 2015-04-01 18:16:27 · 416 阅读 · 0 评论 -
js 继承
JS实现继承的几种方式原文链接点击打开链接前言JS作为面向对象的弱类型语言,继承也是其非常强大的特性之一。那么如何在JS中实现继承呢?让我们拭目以待。JS继承的实现方式既然要实现继承,那么首先我们得有一个父类,代码如下:// 定义一个动物类function Animal (name) { // 属性 this.name = name || 'Animal'; // 实例方法 th...转载 2018-03-23 15:14:03 · 184 阅读 · 0 评论