![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
js
我以为自己很帅
新人报道,一步一步走,我们一起来学习web前端,坚持就会成功! 奥力给
展开
-
20.处理事件
javascript基础 事件的三个阶段 捕获阶段: 事件从外层往里执行 当前目标阶段 冒泡阶段: 事件从里向外执行 事件对象.eventPhase属性可以查看事件触发时所处的阶段 注意: box.onclick box.attachEvent 只有冒泡事件 ##冒泡的作用(常用) 事件 委托:原理事件冒泡 事件里面的默认参数,或者事件对象e/或者a 表示 当事件发生时,可以获取与事件相关的数据 e.target 表示真正出发事件的对象 <body>原创 2021-08-27 15:59:07 · 106 阅读 · 0 评论 -
19.节点操作
javascript基础 ##节点属性 nodeType 节点的类型 1 元素节点 2 属性节点 3 文本节点 4.注释节点 nodeName 节点的名称(标签名称) nodeValue 节点值 元素节点的nodeValue始终是null var box = document.getElementById('box'); console.log(box.parentNode); //获取父节点,一般只有元素才会包含内容,所以相当于获取父元素 console.log(box.chil原创 2021-08-27 14:49:26 · 84 阅读 · 0 评论 -
18.创建元素
javascript基础 创建元素的三种方式(像搜索栏/购物车都需要用到) document.write() 覆盖整个原来的页面重新生成标签里面的内容 document.write('新设置的内容<p>标签也可以生成</p>'); node.innerHTML 选中node的所有子元素 var box = document.getElementById('box'); box.innerHTML = '新内容<p>新标签</p>'; 在当前页面,把bo原创 2021-08-27 14:43:49 · 134 阅读 · 0 评论 -
17.样式类名操作
javascript基础 样式操作 使用style方式设置的样式显示在标签行内 var box = document.getElementById('box'); box.style.width = '100px'; box.style.height = '100px'; box.style.backgroundColor = 'red'; 注意 通过样式属性设置宽高、位置的属性类型是字符串,需要加上px 类名操作 修改标签的className属性相当于直接修改标签的类名 var box原创 2021-08-27 14:40:06 · 324 阅读 · 0 评论 -
16.事件及属性操作
javascript基础 事件 ###事件:触发-响应机制 事件三要素 事件源:触发(被)事件的元素 事件名称: click 点击事件 事件处理程序:事件触发后要执行的代码(函数形式) 事件的基本使用 var box = documen.getElementById('box'); box.onclick = function() { console.log('代码会在box被点击后执行'); } 属性操作 非表单属性 href、title、id、src、className 美女相册 <原创 2021-08-27 13:50:17 · 94 阅读 · 0 评论 -
15.WebAPI
javascript基础 API的概念 API(Application Programming Interface,应用程序编程接口)是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。 任何开发语言都有自己的API API的特征输入和输出(I/O) var max = Math.max(1, 2, 3); API的使用方法(console.log(‘adf’)) Web API的概念 浏览器提供的一套操作浏览器原创 2021-08-27 13:33:18 · 59 阅读 · 0 评论 -
14.内置对象案例
#javascript基础 案例 截取字符串"我爱中华人民共和国",中的"中华" var s = "我爱中华人民共和国"; s = s.substr(2,2); console.log(s); "abcoefoxyozzopp"查找字符串中所有o出现的位置 var s = 'abcoefoxyozzopp'; var array = []; do { var index = s.indexOf('o', index + 1); if (index != -1) { array.pu原创 2021-08-27 10:13:35 · 121 阅读 · 0 评论 -
13.内置对象
javascript基础 内置对象 JavaScript中的对象分为3种:内置对象、自定义对象、浏览器对象 JavaScript 提供多个内置对象:Math/Array/Date… 对象只是带有属性和方法的特殊数据类型。 可以通过MDN/W3C来查询学习 如何学习一个方法? 方法的功能 参数的意义和类型 返回值意义和类型 demo进行测试 Math对象 Math对象不是构造函数,它具有数学函数的属性和方法,都是以静态成员的方式提供 Math.PI // 圆周率,这不带()括号,所以这是一个属性原创 2021-08-27 10:06:05 · 45 阅读 · 0 评论 -
13.内置对象
javascript基础 内置对象 JavaScript中的对象分为3种:内置对象、自定义对象、浏览器对象 JavaScript 提供多个内置对象:Math/Array/Date… 对象只是带有属性和方法的特殊数据类型。 可以通过MDN/W3C来查询学习 如何学习一个方法? 方法的功能 参数的意义和类型 返回值意义和类型 demo进行测试 Math对象 Math对象不是构造函数,它具有数学函数的属性和方法,都是以静态成员的方式提供 Math.PI // 圆周率,这不带()括号,所以这是一个属性原创 2021-08-27 09:43:37 · 54 阅读 · 0 评论 -
10变量以及作用域
javascript基础 作用域 作用域: 变量可以起作用的范围. 全局变量 在任何地方都可以访问到变量就叫做全局变量,对应全局作用域 局部变量 只在固定的代码区域内可以访问到的变量,对应局部作用域(函数作用域) 不使用var声明的变量是全局变量,不推荐. 局部变量退出作用域后就会被销毁,全局变量关闭页面或浏览器才会销毁 块级作用域 任何一对花括号({和})中的语句集都属于一个块,在这之中定义的所有变量在代码块外都是不可见的,我们称之为块级作用域。 在es5之前没有块级作用域的的概念,只有函数作用域,现阶原创 2021-08-26 18:34:00 · 99 阅读 · 0 评论 -
9匿名函数以及匿名函数调用.s
javascript基础知识 函数其他 匿名函数 var fn = function() { console.log('你好boy') } fn() //匿名函数调用 (function() { console.log('nihao') })() //匿名函数自调用 没有名字的函数,叫匿名函数,匿名函数在多人开发时还需要设置防命名重复处理,后面学习高阶函数再来讲 函数作为参数 因为函数也是一种类型,可以把函数作为一个函数的参数,其他函数中调用 函数可以作为返回值 fu原创 2021-08-26 17:17:57 · 140 阅读 · 0 评论 -
8.arguments对象以及使用
javaScript基础 arguments的使用 arguments对象是一个比较特殊的对象,实际上是当前函数的一个内置属性,也就是说所有的函数都内置了一个arguments对象. arguments对象中存储了传递的所有实参,是一个伪数组. 求任意的最大值 function getMax() { var max = arguments[0]; for (var i = 1; i < arguments.length; i++) { if (max < argumen原创 2021-08-26 16:52:04 · 92 阅读 · 0 评论 -
7.函数的语法以及函数的返回值
javascript基础 函数 把一段相对独立的具有特定功能的代码块封装起来,形成一个独立的实体,就是函数,给函数起个名字,后续可以反复调用. //声明函数 function sayHi() { console.log('吃了吗?'); } function getSum () { var sum = 0; for (var i = 0; i < 100; i++) { sum += i; } console.log(sum); } getSum(); 语法 通过参数的原创 2021-08-26 15:27:36 · 195 阅读 · 0 评论 -
6.数组元素添加以及排序
javaScript基础 数组 将多个元素按一定顺序排列到一个集合中,这个集合就成数组. ###数组的字面量 var arr1 = []; var arr2 = [1, 3, 4]; var arr3 = ['a', 'c', 'd']; console.log(arr3.length); 获取数组的长度; arr3.length = 0; 改变数组里面的元素个数 for(var i = 0;i < arr.len原创 2021-08-26 15:14:53 · 231 阅读 · 0 评论 -
5.流程控制语句
javaScript 基础 表达式和语句 表达式 一个表达式可以产生一个值,有可能是运算、函数调用、有可能是字面量。表达式可以放在任何需要值的地方。 语句 语句可以理解为一个行为,循环语句和判断语句就是典型的语句。一个程序有很多个语句组成,一般情况下;分割一个一个的语句 流程控制 顺序结构 从上到下执行就是顺序结构(程序默认就是从上到下执行) 分支结构 根据不同的情况执行 if语句 示例: <script> var num = 10; if (num > 10) {原创 2021-08-26 15:03:30 · 44 阅读 · 0 评论 -
4.运算符
javaScript基础 运算符 算术运算符 + - * / % ++i 自身加1 --i 自身减1 (注意是自身,运算之后自己的值被改变) 前置++(自身的值加1,结果值加1) var num1 = 5; ++ num1; 结果为6,num1的值变为6; var num2 = 6; console.log(num1 + ++ num2); 结果为 13; 后置++(自身的值加1,结果值不变) var num1 = 5; num1原创 2021-08-26 14:49:00 · 87 阅读 · 0 评论 -
3.数据类型之间的转换
JavaScript基础 获取变量的类型 var age = 18; console.log(typeof age); //'number' 注释 /* var age = 18; var name = 'zs'; console.log(name, age); */这是多行注释 var name = 'hm'; 输入输出语句 prompt('请输入你的年龄'); //网页中弹出输入对话框,提示"请输入你的年龄" alert('计算的结果是');// 弹出对话框,提示"计算的结果是";原创 2021-08-26 14:35:56 · 72 阅读 · 0 评论 -
2.变量以及简单数据类型
javascrip基础 变量 计算机中存储数据的标识符,根据变量可以获取内存中的数据 var age, name, sex; age = 18; var age = 18; var age = '18'; 变量可以申明并赋值 ##变量的命名规则 由字母 数字 下划线 符号组成,不能以数字开头 不能是关键字和保留字,例如: for while. 区分大小写. 变量名必须有意义,(建议遵守) 遵守驼峰命名,首字母小写,后面单词的首字母需要大写.,例如: userName.(建议遵守)原创 2021-08-26 14:19:42 · 56 阅读 · 0 评论 -
1.认识JavaScript
JavaScript基础知识 什么是javascript? javascript是一种运行在客户端(浏览器)的一种脚本语言. javascript现在的应用场景 网页特效 服务端开发(Node.js) 命令行工具(Node.js) 桌面程序(Electron) App(cordova) 控制硬件—物联网(ruff) 游戏开发(cocos2d-js) HTML/CSS/JavaScript的区别 html: 提供网页结构,以及网页中的内容 css: 用来美化结构 javascript: 控制页面的内容,原创 2021-08-26 13:46:54 · 52 阅读 · 0 评论