JavaScript
文章平均质量分 54
如题
Han_python
一个机械工程师
展开
-
《JavaScript视频27》window定时器
window属性(略)方法alert()、 confirm()、 prompt()setInterval()定时调用,可以将一个函数每隔一段时间执行一次参数:回调函数,该函数会每隔一段时间被调用一次调用间隔时间,单位是毫秒返回值返回一个number类型的数据,作为该定时器的唯一标识clearInterval()关闭定时器,需要一个定时器的标识符作为参数这个方法可以接收任意的参数,如果不是定时器的标识,则不做反应。<!DOCTYPE html><h原创 2021-02-23 20:53:49 · 69 阅读 · 0 评论 -
《JavaScript视频26》BOM、navigator
BOM浏览器对象模型window 代表浏览器的整个窗口,是网页中的全局对象navigator 代表当前浏览器的信息location 当前浏览器的地址栏信息history 可以在当次访问时,操作浏览器向前或向后翻页screen 可以获取用户显示器的信息这些BOM对象在浏览器中都是作为window对象的属性保存的,可以通过window对象来使用,也可以直接使用,使用时首字母小写。navigator一般我们会使用userAgent来判断浏览器的信息。<!DOCTYPE html&g原创 2021-02-22 21:01:51 · 54 阅读 · 0 评论 -
《视频24》键盘
键盘事件键盘事件一般绑定给可以获取焦点的对象,或者documentonkeydown按键被按下,如果按着不松手,事件会连续一直触发onkeyup按键被松开通过event.keyCode可以获取按键的编码除了keyCode,事件对象还提供了几个属性altKeyctrlKeyshiftKey通过这三个属性可以判断,alt、ctrl和shift是否被按下,如果按下则返回true,否则返回false不能输入数字的输入框:<!DOCTYPE html><html>原创 2021-02-21 16:43:20 · 72 阅读 · 0 评论 -
《JavaScript视频23》拖拽、鼠标滚轮
拖拽流程:当鼠标在元素上按下时,开始拖拽 onmousedown当鼠标移动时,元素移动 onmousemove当鼠标松开时,元素固定在当前位置 onmouseup原创 2021-02-20 23:12:40 · 135 阅读 · 1 评论 -
《JavaScript视频22》事件的绑定
事件的绑定使用 对象.事件 = 函数 的形式绑定响应函数,只能绑定一个响应函数,绑定多个则后面的会覆盖掉前面的。通过 addEventListener() 方法可以为元素绑定响应函数,使用这种方式可以为相同事件绑定多个响应函数,当事件被触发时,响应函数将会按照函数绑定顺序执行。该种方法需要传入三个参数:需要传入事件的字符串,不要on,比如click回调函数,当事件触发时,该函数会被调用是否在捕获阶段触发事件,需要一个bool值,一般都传false<!DOCTYPE html>&原创 2021-02-18 22:56:45 · 58 阅读 · 0 评论 -
《JavaScript视频21》冒泡
事件的冒泡当后代元素上的事件被触发时,其祖先元素的相同事件也会被触发。大部分事件冒泡是有用的,如果不希望冒泡可以通过事件对象来取消冒泡。event.cancelBubble = true;事件的委派可以将事件统一绑定给元素的共同祖先元素,这样当后代元素上的事件触发时,会一直冒泡到祖先元素上进行执行。事件对象target可以返回触发此事件的元素。<!DOCTYPE html><html> <head> <meta charset="utf-8原创 2021-02-07 22:14:22 · 67 阅读 · 0 评论 -
《JavaScript视频20》事件、鼠标位置
事件onmousemove 鼠标移动事件事件对象当事件的响应函数被触发时,浏览器每次都会将一个事件对象作为实参传递进响应函数。在事件对象中封装了当前事件相关的一切信息,比如鼠标坐标、键盘键位等。clientX/clientY,可以获取鼠标指针的水平和垂直坐标<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <s原创 2021-02-07 20:26:45 · 104 阅读 · 0 评论 -
《JavaScript视频19》其他样式相关属性
其他相关属性clientWidth 、clientHeight 可以返回可见宽度和高度,包括内容区和内边距,直接返回数值,不带单位,并且都是只读属性,不能通过赋值修改。offsetWidth、 offsetHeight 可以获取元素总宽高,包括边框。offsetParent 获取离当前元素最近的开启了定位的祖先元素,如果都没开启,则返回bodyoffsetLeft、offsetTop 当前元素相对于定位父元素的偏移量scrollHeight、scrollWidth可以显示滚动区原创 2021-02-04 22:28:34 · 111 阅读 · 0 评论 -
《JavaScript视频18》操作内联样式
添加删除记录原创 2021-02-03 22:16:51 · 804 阅读 · 0 评论 -
《JavaScript视频17》DOM增删改
DOM增删改document.creatElement()可以创建一个元素节点对象需要一个标签名作为参数,将会根据该标签名创建元素节点对象并将创建好的对象作为返回值返回document.creatTextNode()可以创建一个文本节点对象需要一个文本内容作为参数,将会根据该内容创建文本节点并将新的节点返回appendChild()向一个父节点中添加一个新的子节点用法:父节点.appendChild(子节点);insertBefore()在指定的子节点前面插入新的子节原创 2021-01-31 20:57:39 · 85 阅读 · 0 评论 -
《JavaScript视频16》DOM查询
通过document调用可以获取元素节点通过具体的元素节点的调用,可以获取元素节点的子节点:getElementsByTagName() 方法childNodes属性:返回包括文本节点在内的所有子节点children属性:可以获取当前元素的所有子元素firstChild属性:当前元素的第一个子节点lastChild属性:当前元素的最后一个子节点根据DOM标准,标签中的空白也会当成文本节点,但是在IE8及以下不会。获取父节点和兄弟节点:parentNode属性:当前节点的父节点pre原创 2021-01-31 17:20:01 · 67 阅读 · 1 评论 -
《JavaScript15》网页图片切换案例
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> *{ margin: 0; padding: 0; } #back{ width: 1000px; height: 600px; background-color: aq原创 2021-01-30 22:46:06 · 143 阅读 · 0 评论 -
《JavaScript视频14》DOM
DOMDocument Object Model文档对象模型JS中通过DOM来对HTML文档进行操作,只要理解了DOM就可以随心所欲的操作web页面文档:整个html文档对象:将网页中的每个部分都转换为一个对象模型:表示对象之间的关系HTML DOM 树节点Node:构成我们网页的最基本组成部分,网页中的每一个部分都是一个节点:元素节点:html标签属性节点:元素的属性文本节点:html中的文本内容文档节点:整个html文档浏览器已经为我们提供了文档节点对象,这个对象是wi原创 2021-01-25 22:10:18 · 65 阅读 · 0 评论 -
《JavaScript视频13》正则表达式
正则表达式正则表达式用于定义一些字符串的规则,计算机可以根据正则表达式,来检查一个字符串是否符合规则,或者将字符串中符合规则的内容提取出来。创建正则表达式的对象:语法: var 变量 = new RegExp("正则表达式","匹配模式");使用正则表达式的test()方法,可以用来检查一个字符串是否符合正则表达式的规则,返回值为true或者false。//用于检查字符串中是否有"a"的正则表达式var reg = new RegExp("a","i");var str = "baf";va原创 2021-01-24 16:19:12 · 190 阅读 · 0 评论 -
《JavaScript视频12》包装类
包装类在JS中为我们提供了三个包装类,可以将基本的数据类型转换为对象:String()Number()Boolean()var num = new Number(3);num.hello = "abcd";console.log(num.hello);上述这种方法基本不用,否则难以做数据比较,因为通过包装类,不同的基本数据类型都转换成了对象。当我们对一些基本数据类型的值调用属性和方法时,浏览器会临时使用包装类将其转换为对象,然后再调用对象的属性和方法,调用完之后再将其转换为基本数据类原创 2021-01-23 23:10:50 · 69 阅读 · 0 评论 -
《JavaScript视频11》函数的方法call()和apply()、arguments、Date对象、Math
call()和apply()在调用函数时,如果不传入参数,就是正常调用,此时函数执行时候的this就是window如果使用call()或者apply()进行调用,并且在调用时将一个对象指定为第一个参数,那么这个对象将会成为函数执行时的this。如果需要传入函数的其他实参:call()方法可以将实参在对象之后依次传递:fun.call(obj,2,4);apply()方法需要将实参封装在数组中统一传递:fun.apply(obj,[2,3]);this以函数形式调用时,this永远都是win原创 2021-01-23 19:00:09 · 96 阅读 · 0 评论 -
《JavaScript视频10》数组的其他方法
forEach()方法var arr = ["赵","周","李","孙","钱"]; arr.forEach(function(a){ console.log("a=" +a); });IE8及以下的浏览器不兼容forEach()方法需要一个函数作为参数,浏览器会调用这个函数。数组中有几个元素,函数就会执行几次,每次执行,浏览器会将遍历到的元素作为实参的形式传递进来,我们可以定义形参来读取这些内容。浏览器会在回调函数中传递三个参数。第一个参数是当前正在遍历的元素第二个参数是元素的原创 2021-01-21 21:27:40 · 72 阅读 · 0 评论 -
《JavaScript视频9》数组
数组Array普通对象使用属性名-属性值来保存数据,而数组使用索引来保存数据。使用构造函数Array()来创建数组,使用数组[索引] = 值来为对象添加元素。var han = new Array();han[0] = 10;han[1] = 22;console.log(han);读取元素:数组[索引]查询数组长度:数组.length修改数组长度:数组.length = 长度;向数组的最后添加元素:han[han.length] = 元素;创建方法二:使用字面量来创建数组:va原创 2021-01-19 20:59:38 · 78 阅读 · 0 评论 -
《JavaScript视频8》原型(重点)、重写toString、垃圾回收
原型prototype我们所创建的每一个函数,解析器都会向函数中添加一个属性prototype。这个属性值保存着一个地址,而这个地址指向的就是原型对象。如果我们的函数作为普通函数调用,则prototype不起作用。当函数以构造函数的形式调用时,则它所创建的对象中都会有一个隐含的属性,指向该构造函数的原型对象。我们可以通过__proto__来访问该属性。function MyClass(){}var mc = new MyClass();console.log(mc.__proto__);c原创 2021-01-10 11:54:39 · 125 阅读 · 0 评论 -
《JavaScript视频7》this、工厂对象、构造函数
this解析器在调用函数时,每次都会向函数内部传递进一个隐含的参数,这个隐含的参数就是this。this指向一个对象,这个对象我们称为函数执行的上下文对象,根据函数的调用方式的不同,this会指向不同的对象。以函数形式调用时,this永远都是window以方法的形式调用时,this`就是调用方法的那个对象。function han(){ console.log(this);}han();var obj = { name:"hanmeng", sayName:han};obj.s原创 2021-01-10 10:25:14 · 72 阅读 · 0 评论 -
《JavaScript视频6》作用域
在JS中,有两种作用域:全局作用域和函数作用域。在script标签中定义的变量,都属于全局变量,页面打开时创建,页面关闭时销毁。在全局作用域中有一个全局对象window,代表的是一个浏览器的窗口,由浏览器创建,我们可以直接使用。在全局作用域中,创建的变量都会作为window对象的属性保存。var a = 10;console.log(window.a);创建的函数都会作为window对象的方法。变量的声明提前:我们使用var关键字声明的变量,会在所有代码执行之前被声明,但是不会立即赋值。在定原创 2021-01-08 21:11:16 · 77 阅读 · 0 评论 -
《JavaScript视频5》函数
函数方法一:构造函数var fun = new Function();可以将要封装的代码以字符串的形式传递给构造函数。函数中的代码,会在函数被调用时执行。函数调用语法:函数对象();var fun = new Function("console.log('Hello')");fun();但是我们在开发中很少使用构造函数开发函数。方法二:函数声明语法:function 函数名([形参1, 形参2...]){语句}function fun2(){console.log("这是我原创 2021-01-06 22:41:22 · 64 阅读 · 0 评论 -
《JavaScript视频4》对象
对象对象属于一种复合的数据类型,在对象中可以保存多个不同的数据类型的属性。内建对象:由ES标准中定义的对象,如String.Function.Object等等宿主对象:由JS的运行环境提供的对象,如BOM、DOM等等自定义对象:开发人员创建的对象的操作使用new关键字调用的函数,是构造函数constructor,构造函数是专门用来创建对象的函数。var han = new Object();在对象中保存的值,称为属性,向对象添加属性:对象.属性名 = 属性值;han.name =原创 2021-01-04 22:13:20 · 79 阅读 · 0 评论 -
《JavaScript视频3》流程控制语句
代码块:在JS中,可以用{}对语句进行分组,相同的组内语句,要么都执行,要么都不执行。每组语句被称为一个代码块,大括号只有分组作用。流程控制语句:条件判断语句条件分支语句循环语句条件判断语句语法一:if(条件表达式) 语句if语句只能控制紧随其后的语句,如果要控制多条语句,可以将这些语句统一放到代码块中。var a = 10;if (a > 10){alert("a比10大");alert("我也要执行");}语法二:if (条件表达式){语句1}else原创 2021-01-03 20:53:58 · 115 阅读 · 0 评论 -
《JavaScript视频2》运算符
运算符加+ 减- 乘 * 除以/ 取模(余数)%运算符可以对一个或多个值进行运算,并获取运算结果。除了加法,当对非Number类型的数据进行运算时,会先将数据转成Number类型再进行运算。可以利用这个性质将数据转换成Number类型。任何值和NaN进行运算,结果都是NaN任何值和字符串做加法运算都会先转换为字符串,然后再和字符串做拼接操作。因此我们可以利用这一特性,用加法将任意数据加上一个空字符串,转换成String格式。var a = 123;a = a + "";result =原创 2021-01-02 15:16:37 · 119 阅读 · 3 评论 -
《尚硅谷最新版JavaScript基础全套教程完整版(140集实战教学,JS从入门到精通)》视频1
起源JavaScript诞生于1995年,前期主要用于处理网页中的前端验证。ECMAScript是一个JavaScript标准,而这个标准需要由各个厂商去实现。一个完整的JavaScript应该由以下三个部分构成:ECMAScript :标准DOM:文档对象模型BOM:浏览器对象模型JS的特点:解释性语言动态语言基于原型的面向对象类似于C和Java的语法结构/*可以发出警告框*/alert("警告");/*可以向body中输出内容*/document.write("内原创 2021-01-01 20:10:07 · 2245 阅读 · 0 评论