JavaScript
gxgalaxy
这个作者很懒,什么都没留下…
展开
-
JS数组 字符串去重
数组去重利用对象的属性(同一个属性名不可能出现两次),将数组的第一位作为属性名添加到对象中去,数组后面的值依次判断是否作为属性名出现过,如果出现过忽略,如果不存在就添加。最后将属性名使用push添加到空数组中。var Arr = [1,2,1,1,1,2,4,3,5,3,5,3];function uniqueArr(arr){ var newArr = []; var temp = {...原创 2020-04-28 22:39:23 · 762 阅读 · 0 评论 -
前端学习--查找
目录顺序查找二分查找插值查找顺序查找普通的遍历,穷举法。/** * 查找一个数组中目标值是否存在(顺序查找) * @param {*} arr * @param {*} target */var num = 0;function inOrderSearch(arr, target){ for ( var i = 0; i < arr.length; i++){...原创 2019-11-26 21:11:01 · 116 阅读 · 0 评论 -
前端必备算法--排序
目录排序算法选择排序冒泡排序插入排序快速排序测试数据排序算法不同的场景中,不同的排序算法执行效率不同。/** * 交换数组中指定的位置 * @param {*} arr * @param {*} i1 * @param {*} i2 */function swap(arr,i1,i2){ var temp = arr[i1]; arr[i1] = arr[...原创 2019-11-26 19:46:01 · 149 阅读 · 0 评论 -
原生JS事件绑定练习题
1、<ul> <li>a</li> <li>a</li> <li>a</li> <li>a</li></ul>使用原生JS ,addEventListener,给每个li绑定一个click事件,输出他们的顺序<ul> ...原创 2019-05-22 20:04:29 · 459 阅读 · 0 评论 -
JS之事件处理模型——事件冒泡、事件捕获
1、事件冒泡 结构上(非视觉上)嵌套关系的元素,会存在事件冒泡的功能,即同一事件,自子元素冒泡向父元素(自底向上)<div class="wrapper"> <div class="content"> <div class="box"> </div> </div&...原创 2019-05-23 00:32:21 · 334 阅读 · 0 评论 -
JS之事件
如何绑定事件1、.onclick = function(){};兼容性很好,但是一个元素的同一事件上只能绑定一个处理,基本等同于写在HTML行间上var div = document.getElementsByTagName('div')[0];div.onclick = function(){ console.log(this); }2、obj.addEventList...原创 2019-05-23 08:22:48 · 212 阅读 · 0 评论 -
JS之获取窗口属性
查看页面滚动条的滚动距离1、window.pageXOffset/pageYOffset(IE8及以下不兼容)2、IE8及以下的浏览器 document.body.scrollLeft/Top document.documentElement.scrollLeft/Top 这两个互相冲突,一个有值,另一个一定为0document.body.scroll...原创 2019-05-23 08:34:04 · 635 阅读 · 0 评论 -
JS之脚本化CSS
1、读写元素css属性dom.style.prop //只有这个可以写入可以读写行间样式,没有兼容性问题,碰到float这样的保留字属性,前面应该加css。eg:float->cssFloat 复合属性必须拆解,组合单词变成小驼峰式写法 background-color ->backgroundColor 写入的值必须是字符串格式2、查询计算样式window....原创 2019-05-23 09:16:17 · 147 阅读 · 0 评论 -
DOM之习题练习
1、封装函数,返回元素e的第n层祖先元素节点重点代码:<div> <strong> <span> <i></i> </span> </strong></div> <script type="text/javascript"> function retPar...原创 2019-05-18 17:04:03 · 1669 阅读 · 0 评论 -
HTML5与类相关的补充classList属性
classList属性在操作类名的时候,我们会通过className属性添加删除类名className是一个字符串,每次修改只能修改字符串的一部分如果一个元素有多个类名,要删除其中一个必须将三个类名拆开,删除不想要的,然后再把剩下的拼接成一个新的字符串例1<div class="wrapper content footer"></div>删除div元素的foo...原创 2019-10-10 15:25:26 · 122 阅读 · 0 评论 -
JavaScript之DOM操作实现一个鼠标滑动颜色变化实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>demo</title> <link rel="stylesheet" href="./src/demo.css"> <style> *{...原创 2019-05-16 21:48:09 · 655 阅读 · 0 评论 -
DOM基本操作之习题二
1、封装兼容性方法,求滚动条滚动离getScrollOffset()<script type="text/javascript">function getScrollOffset(){ if(window.pageXOffset){ return{ x : window.pageXOffset, y : window.pageYOffset ...原创 2019-05-22 00:23:37 · 317 阅读 · 0 评论 -
Javascript之DOM实现选项卡功能
定义:DOM定义了表示和修改文档所需的方法,DOM对象即为宿主对象,由浏览器厂商定义,用来操作html和Xml功能的一类对象的集合,也有人称DOM是对HTML以及XML的标准编程接口。下面我们实现一个简单的选项卡功能:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF...原创 2019-05-16 00:02:13 · 681 阅读 · 0 评论 -
JavaScript 之 typeof 操作符和类型转换
一、typeof 操作符:1、作用:判断返回值类型;类型转换。 typeof的六种返回类型:Number string boolean object undefined function 其中需要注意的是object undefined function三种返回类型。 2、显式类型转换:(1)、Number()...原创 2019-03-18 19:25:15 · 128 阅读 · 0 评论 -
JavaScript 之作用域和作用域链
1、[[scope]]:每个JavaScript函数都是一个对象,对象的有些属性我们可以访问,有些不可以,这些属性仅供引擎存取,其中[[scope]]就是其中一个。[[scope]]值得是我们所说的作用域,存储了运行期上下文集合(执行期上下文(AO GO)见https://blog.csdn.net/gxgalaxy/article/details/88729727)。2、作用域链:[[sco...原创 2019-03-25 18:59:47 · 115 阅读 · 0 评论 -
JavaScript之call、apply
在学习call和apply之前,我们先来简单的了解一下JavaScript中this指针:*简单来说:如果不用new操作符而直接调用,那么构造函数的执行对象就 是window,即this指向了window。现在用new操作符后,this就指向了新生成的对象。1、 call和apply都是改变this指向。2、区别在于传参列表不同call 需要把实参按照形参的个数传进去apply需要传一个...原创 2019-04-26 23:34:10 · 117 阅读 · 0 评论 -
JavaScript之继承的发展史
1.传统形式–原型链缺点:过多的继承了很多没有用的属性Grand.prototype.lastname = "ji"; function Gand(){ } var grand = new Grand(); Father.prototype = grand; function Father(){ this.name = "hehe"; } var fat...原创 2019-04-27 13:29:56 · 183 阅读 · 0 评论 -
JavaScript之原型
原型1、定义:原型是function对象的一个属性,它定义了构造函数制造出的对象的公共祖先。通过该构造函数产生的对象,可以继承该原型的属性和方法。原型也是对象。Person.prototype //--原型function Person(name,age,sex){ this.name = name; this.age = age; this.sex = sex; }v...原创 2019-04-24 21:10:19 · 246 阅读 · 0 评论 -
JavaScript 之原型的动态性
因为通过原型查找值是一次搜索过程,因此我们对原型所做的任何修改都能够立即从实例上反映出来。即使是先创建了实例在修改了原型也是一样的。直接在控制台进行操作,便于结果展现。var person = new Person();Person.prototype.name = "sunny";function Person(){}其原因是因为实例和原型之间松散的连接关系,首先会在实...原创 2019-04-24 21:54:19 · 350 阅读 · 0 评论 -
JavaScript之深度拷贝(递归方法)
步骤:判断是不是原始值 (typeof() 如果不是obj基本上就是原始值) 判断是数组还是对象 (使用instanceof toString constructor推荐使用toString) 建立相应的数组或者对象例子:将obj拷贝到obj1中去var obj = { name : "abc", age : 123, card : ["hahoa", "m...原创 2019-04-30 00:02:36 · 315 阅读 · 0 评论 -
JavaScript之DOM的基本操作
查document 代表整个文档 document.getElementById() 通过id标识选择这个元素,一个id对应一个元素 .getElementsByTagName() 通过标签名来选中 .getElementsByName() 只有部分标签name可生效(表单,表单元素,img,iframe) .getElementsByClassNam...原创 2019-05-18 23:55:41 · 153 阅读 · 0 评论 -
JS之Date对象,写一个计时器
写一个计时器,到三分钟停止<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>demo</title> <link rel="stylesheet" href="./src/demo.css"> &l...原创 2019-05-19 16:19:52 · 425 阅读 · 0 评论 -
JavaScript 之 预编译
JavaScript语言运行的过程分为三步:语法分析、预编译、解释执行。浏览很多博客发现,在很多面试中JavaScript的预编译过程总是会被作为一个考点,现在大致总结如下,以后补充。1.变量提升:变量提升在预编译过程中是一个十分重要的知识点,其中包括:函数声明整体提升和变量声明提升。指的是函数里所有的声明都会被提到函数的顶部。2.函数声明:3.变量赋值:4.预编译过程...原创 2019-03-22 00:43:45 · 170 阅读 · 1 评论