JavaScript
主要是记录以JavaScript知识点的目录
鸿雁南去情难寄
仙人抚我顶,结发受长生。
展开
-
01 JavaScript语言基础-概述
概述一,概念JavaScript是一种直译式脚本语言、 Web的编程语言。所有现代的HTML页面都使用JavaScript,用于改进设计、验证表单、检测浏览器、创建cookies等设计。二,JS的组成1,ECMAScript:核心部分,定义JavaScript的语法规范。2,DOM:Document Object Model文档对象模型,主要是用于管理页面3,BOM:Browser O...原创 2018-11-21 11:01:00 · 305 阅读 · 0 评论 -
02 JavaScript语言进阶-DOM基础
DOM基础一、DOM查找方法1.document.getElementById()语法 :document.getElementById(“id”); 功能 :返回对拥有指定 ID 的第一个对象的引用返回值:DOM对象id为DOM元素上id属性的值2.document.getElementsByTagName()语法:document.getElementsByTag...原创 2018-11-21 11:55:33 · 201 阅读 · 0 评论 -
03 JavaScript语言基础-this
this一,this隐含参数解析器在调用函数时每次都会向函数内部传递一个隐含参数,这个隐含参数就是this,this指向的是一个对象,而这个被指的对象称为函数执行的上下文对象。二,this指向的对象1,以函数的形式调用时,this指向的是window2,以方法的形式调用时,this指向调用该方法的那个对象3,以用构造函数调用时,this指向新建的那个对象...原创 2018-11-21 11:09:55 · 108 阅读 · 0 评论 -
04 JavaScript语言基础-XML
XML一,XML概述XML指可扩展标记语言,类似HTML,它被设计用于描述数据。在企业开发中经常使用它作为配置文件。二,XML特征XML标签没有被预定义,需要用户自行定义标签三,XML声明语法:<?xml varsion = "版本号" encoding = "编码方式"?>声明时必须在文档的第一行原创 2018-11-21 11:18:12 · 124 阅读 · 0 评论 -
05 JavaScript语言基础-数据类型与值
数据类型与值摘录于《JavaScript权威指南》一,数据类型的包装对象三个基本数据类型都有自己对应的对象类。数值、字符串、布尔值基本类型分别对应Number、String、Boolen对象。这些类是那些基本数据类型的包装,这些包装具有与基本数据类型一样的值,还具有用于运算数据的属性和方法。假设在对象环境中试图访问某个字符串的属性和方法时,JavaScript会为该字符串值内部创建一个St...原创 2018-12-22 23:52:09 · 185 阅读 · 0 评论 -
06 JavaScript语言基础-变量
变量摘录于《JavaScript权威指南》一,重复声明与遗漏声明1、使用var语句多次声明同一个变量是合法的,不会造成语法上的错误。2、若读取一个为声明的变量值,会产生语法错误;若尝试给一个未用var声明的变量赋值,JavaScript会隐式的声明该变量,而被隐式声明的变量总是会被创建为全局变量,即使该变量只在一个函数体内使用。二,变量作用域在函数体内部,局部变量的优先级比同名的全局变...原创 2018-12-23 16:47:20 · 164 阅读 · 0 评论 -
07 JavaScript语言基础-对象
对象摘录于《JavaScript权威指南》一,创建对象对象是一种复合数据类型,一个无序的属性属性集合,它们将多个数据值集中在一个单元中,而且允许使用名字来存取这些值。创建对象的一种方法是在代码中创建一个直接量。对象直接量是用逗号隔开的一对对的属性名和值的列表,包含在一个花括号中。创建对象的另一种方式是使用new运算符创建具体一类对象,在new后跟着调用一个构造函数,他用于初始化对象的属性...原创 2018-12-24 09:04:50 · 221 阅读 · 0 评论 -
08 JavaScript语言基础-数组
数组一,遍历数组摘录于《JavaScript权威指南》在JavaScript中的数组是稀疏的,这表明数组下标不必一定要落在一个连续的数字范围内,只有真实存储在数组中的元素才会被分配内存。因此在这样的情况下使用元素之前就需要检测:eg: for(var i = 0;i <arr.length;i++){ if(arr[i])alert(arr[i]);}二,截断或增长...原创 2018-12-24 09:22:51 · 149 阅读 · 0 评论 -
01 JavaScript语言进阶-高级特性
JavaScript高级特性一,函数1,Argument对象<1>JavaScript特性在JavaScript中存在函数的重载,当定义多个同名函数时,计算机只会编译运行最后一个函数。在JavaScript中函数定义没有任何参数,调用该函数时,可以传递任意参数。<2&a原创 2018-11-21 11:45:52 · 268 阅读 · 0 评论 -
02 JavaScript语言基础-对象
对象一,简介对象属于一种复合型数据类型,在对象中可以保存多个不同数据类型的属性。二,对象分类1,内建对象:由ES标准中定义的对象,在任何的ES的实现中都可以使用。2,宿主对象:由JS的运行环境提供的对象,主要指浏览器提供的对象。3,自定义对象:由开发人员自己创建的对象。三,创建对象使用new关键字调用的函数,是构造函数constructor,构造函数是专门用来创建对象的函数。语...原创 2018-11-21 11:07:00 · 132 阅读 · 0 评论 -
03 JavaScript语言进阶-DOM事件
JavaScript-DOM事件一、HTML事件语法:tag 事件 = “执行脚本”></tag>功能:在HTML元素上绑定事件。说明:执行脚本可以是一个函数的调用。二、DOM 0级事件语法:ele.事件 = 执行脚本 功能:在DOM对象上绑定事件说明:执行脚本可以是一个匿名函数,也可以是一个函数的调用。三、常用的鼠标事件与键盘事件1>鼠...原创 2018-11-21 12:01:13 · 158 阅读 · 0 评论 -
04 JavaScript语言进阶-预解释
预解释在当前的作用域中,JavaScript代码执行之前,浏览器首先会默认的把所有具有var和function的内容,进行提前声明或者定义。1,声明和定义1.1 声明(declare):通知浏览器在全局作用域存在一个基本类型的变量或引用数据类型1.2 定义(defined):给变量或引用数据类型赋值2,vsr与function的预解释2.1 var:在预解释时只提前声明2.2 fun...原创 2019-09-11 20:06:32 · 155 阅读 · 0 评论 -
05 JavaScript语言进阶-作用域链
作用域链在私有作用域中,代码执行时存在变量,应先确认该变量是否为私有变量,若是私有变量则和外部作用域无关,若不是私有,则往当前作用域的上级作用域进行查找,若当前级作用域查找为空,则继续往上级作用域查找,一直找到window为止。1,私有作用域和全局作用域1.1 全局作用域:JavaScript寄主的平台作用域,对于网页,window就是其全局作用域1.2 私有作用域:函数执行时,会形成...原创 2019-09-11 22:48:00 · 199 阅读 · 0 评论 -
06 JavaScript语言进阶-全局变量细节内容
全局变量细节内容在全局作用域中,具有var和不具有var变量存在差异。不具有var的变量相当于给window增加该变量的属性名和属性值,具有var的变量相当于给全局作用域增加一个全局变量同时也给window增加该变量的属性和属性值。1,全局作用域下有无var情况1.1 在变量赋值前引用该变量情况 具有var: 可以进行预解释,在具有var变量赋值前引用该变量不会报错 不具有var:不...原创 2019-09-12 12:17:29 · 166 阅读 · 0 评论 -
07 JavaScript语言进阶-预解释几种特殊机制
预解释特殊机制1,无论何条件直接预解释示例: 在全局作用域中有以下代码,是通过关键字 in 判断num是否为window的一个属性,取反进行判断执行代码。if(!("num" in window)){ var num = 10;}console.log(num);1.1 一般编程理解思维:先判断if语句,num不是window属性为false,取反,为num设置全局变量值和wi...原创 2019-09-12 20:05:55 · 168 阅读 · 0 评论 -
08 JavaScript语言进阶-上级作用域的查找
上级作用域的查找只需查看当前函数在哪个作用域下定义的,那此作用域为当前函数的上级作用域,与当前函数在哪里执行无关。示例:var num = 15;//预解释,全局作用域中声明 numfunction fn(){ var num = 150;//fn()预解释,函数私有作用域中声明 num return function(){//return 之后不进行预解释 console...原创 2019-09-16 15:45:05 · 176 阅读 · 0 评论 -
09 JavaScript语言进阶-内存释放与销毁
内存释放与作用域销毁1,堆内存释放对象数据类型或函数数据类型在定义时,会开辟一个堆内存,堆内存具有一个引用地址,若堆内存的引用地址被声明的变量引用,那该堆内存被占用,此时堆内存不能被释放。释放方式:使引用堆内存地址的所有变量赋值为空对象指针null。当前堆内存若没有任何变量占用,则浏览器会在空闲时间段将其销毁。示例:var obj1 = {name:"小二"};//创建对象,形成堆内存...原创 2019-09-16 15:50:56 · 404 阅读 · 0 评论 -
10 JavaScript语言进阶-this关键字
this关键字JavaScript中主要是针对函数中的this来研究的。JavaScript中的this代表的是当前行为执行的主体,this的确定与函数在何处定义和在何处执行无关。javaScript中的context代表的是当前行为执行的环境或区域1,this的确立1.1 函数执行,函数名前面是有“.”。如果有,this就是“.”之前的内容;如果没有,this就是window。1.2...原创 2019-09-16 15:52:39 · 165 阅读 · 0 评论 -
11 JavaScript语言进阶-单例模式
单例模式1,单例模式对象数据类型的作用是把描述同一个事物的属性和方法存放在一个内存空间下,起到了分组的作用。保证了不同事物之间的属性即使属性名相同也不会发生冲突。我们把上述的该种分组编写代码模式的模式称为“单例模式”。示例//创建两个对象var person01 = { name: "小明", age:12};var person02 = { name: "小花",...原创 2019-09-16 17:19:25 · 202 阅读 · 0 评论 -
12 JavaScript语言进阶-工厂模式
工厂模式1,工厂模式工厂模式又称函数的封装,是把实现同一事件的相同代码编写在一个函数中,以后再实现此功能只需执行当前函数即可,减少页面中冗余代码提高代码重复利用率,更好的实现低耦合高内聚的思想。示例:function createPerson(name,age){ var obj = {};//创建空对象 obj.name = name;//对象添加属性 obj.age = ...原创 2019-09-16 19:14:34 · 158 阅读 · 0 评论 -
13 JavaScript语言进阶-构造函数模式
讲述构造函数的特征,关于 类,实例等内容原创 2019-09-18 15:22:07 · 196 阅读 · 0 评论 -
14 Javascript语言进阶-构造函数模式-扩展
构造函数模式-扩展构造函数特征1,在构造函数模式中,一个无需进行传参的被new的函数,书写函数时可省略小括号。示例:function Fn(){ this.say = function() {console.log("OK");};}var p1 = new Fu;//省略“()”2,在构造函数模式中,若属性值是2.1 基本数据类型的,this是当前类的实例2.2 ...原创 2019-09-21 12:51:55 · 381 阅读 · 0 评论 -
15 JavaScript语言进阶-原型链模式
原型链模式1,原型链模式在通过对象.属性名方式来获取属性值时,首先它会在对象的私有的属性上查找,如果存在此属性则获取该属性值,如果私有属性里不存在,则通过"proto"查找所属类的原型,原型上存在则获取当前原型上公有的属性值,如果该原型上也不存在该属性,则继续通过"proto"继续向上查找,查找到Object类的prototype为止。该种查找机制就是原型链模式。2,原型链模式的特征2.1...原创 2019-09-21 14:20:44 · 293 阅读 · 0 评论 -
01 JavaScript DOM技术-DOM
原创 2019-01-06 21:29:55 · 166 阅读 · 0 评论 -
02 JavaScript DOM技术-Element部分属性("child-","node-")
原创 2019-01-08 20:56:53 · 189 阅读 · 0 评论 -
03 JavaScript DOM技术-DOM最佳方案
原创 2019-01-10 20:04:26 · 209 阅读 · 0 评论 -
04 JavaScript DOM技术-共享onload事件
共享onload事件当两个及以上的函数都需要在加载页面时执行,若将他们逐一的绑定到onload事件上,那么只有最后一个函数才实际执行。那么我们需要特别的函数来解决这样的处境...原创 2019-01-30 21:54:17 · 215 阅读 · 0 评论 -
05 JavaScript DOM技术-动态创建标记
动态创建标记一,传统方式1,document.write方法该方式是快捷的把字符串插入到文档里<body> <script> document.write("<p>this is document.write</p>"); </script></body>该方式的最大的缺点是它违背了“行为与表现分离原创 2019-02-01 21:01:05 · 228 阅读 · 0 评论 -
06 JavaScript DOM技术-编写insertAfter函数
insertAfter函数由于在DOM中只提供了将新建元素插入到目标元素之前的insertBefore方法,而并没有提供对应的insertAfter方法,由于将元素插入目标元素之后的情况也很常见,所以有必要由我们自己来编写insertAfter函数来弥补这个空缺。function insertAfter(newElement,targetElement){ var parent = tar...原创 2019-02-02 11:06:12 · 222 阅读 · 0 评论 -
07 JavaScript DOM技术-Ajax技术
Ajax一,Ajax概述2005年,Adaptive Path公司发明了Ajax这个词,用于概括异步加载页面内容的技术。使用Ajax可以做到只更新需要部分页面,其他的大部分内容就无需重新加载,这样就避免了更新小部分内容而加载整个页面的问题。二,XMLHttpRequest对象XMLHttpRequest对象是Ajax的核心,该对象充当着浏览器中的脚本(客户端)与服务器之间的中介人的角色,J...原创 2019-02-03 13:56:03 · 297 阅读 · 0 评论 -
08 JavaScript DOM技术-编写getNextElemnt函数
getNextElement函数编写获取下一个元素节点的通用函数function getNextElement(node){ // 判定一个节点是否为元素节点 if(node.nodeType == 1){ return node; } // 判断某父节元素节点中是否有下一个兄弟节点 if(node.nextSibling){ return getNextElement(no...原创 2019-02-28 12:14:19 · 233 阅读 · 0 评论 -
09 JavaScript DOM技术-className属性
className属性一,calssName主要作用className属性是一个可读可写的的属性,若只要是元素节点都有className属性,可以使用className属性得到一个元素的class属性并且还能用于赋值操作。这个操作可以用来为对应节点设置已有的CSS样式。方式element.className = value二,优化className属性操作通过上述介绍的方式来只有设置...原创 2019-02-28 12:40:46 · 3060 阅读 · 0 评论 -
10 JavaScript DOM技术-JavaScript DOM实现动画效果
JavaScriptDOM 实现动画效果一,动画条件之一 位置网页元素在浏览器窗口里的位置是一种表示性的信息,通常是由CSS来设置。其属性名为position,包含四个属性值为static、fixed、relative、absolusion。1,static::它是默认值,有关的元素将按照他们在标记里先后出现顺序表现在浏览器窗口里。2,relative:它是和static相似,与之不同的在...原创 2019-02-28 13:49:21 · 777 阅读 · 0 评论