JavaScript
sleepwalker_1992
这个作者很懒,什么都没留下…
展开
-
JS常用的循环遍历数组的方法及跳出数组循环的方式
for循环、ForEach、map、filter、every、some,reduce,reduceRight原创 2024-01-19 16:24:17 · 3513 阅读 · 0 评论 -
JS遍历对象的方法及特点
JS遍历对象的方法及特点原创 2024-01-15 15:23:50 · 613 阅读 · 0 评论 -
JS常用的判断对象是否为空对象的方法
JS常用的判断对象是否为空对象的方法原创 2024-01-17 14:25:46 · 555 阅读 · 0 评论 -
Tree结构数据搜索过滤方法
Tree结构数据搜索过滤方法原创 2022-09-30 18:12:36 · 1286 阅读 · 0 评论 -
JavaScript比较两个数字的大小
JS中比较两个数字的大小,注意将字符串转换成数字再进行比较。同时注意超长数字比较问题。原创 2022-05-14 18:11:59 · 19344 阅读 · 0 评论 -
JavaScript实现图片文件转base64
图片文件转base64,利用canvas// 图片文件转base64,利用canvasfunction getBase64Image(img) { var canvas = document.createElement("canvas"); canvas.width = img.width; canvas.height = img.height; ...原创 2020-02-05 22:29:44 · 736 阅读 · 0 评论 -
JavaScript 为元素绑定和解绑事件
方法一:通过DOM元素的onclick等事件属性,为元素绑定事件。原创 2018-07-04 21:09:45 · 1216 阅读 · 0 评论 -
JavaScript元素创建的方式(一)
元素的创建,是为了提高用户的体验元素创建有三种方式:1、document.write("标签的代码及内容");2、对象.innerHTML = "标签及代码";3、document.createElement("标签的名字");1、document.write("标签的代码及内容");<!DOCTYPE html><html lang="en">&a原创 2018-07-05 22:04:57 · 212 阅读 · 0 评论 -
原型
__proto__,不标准,IE8不支持。为内置对象的原型对象添加方法局部变量变成全局变量原创 2018-07-03 23:11:54 · 224 阅读 · 0 评论 -
JavaScript浅拷贝和深拷贝
遍历DOM树原创 2018-07-03 20:14:11 · 240 阅读 · 0 评论 -
textContent、innerText、innerHTML
textContent:设置或者返回指定节点(标签)中的文本内容。谷歌、火狐支持,IE8以及更早版本不支持。innerText:设置或者返回指定节点(标签)中的文本内容。谷歌、火狐、IE8都支持。innerHTML:获取文本内容<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"...原创 2018-06-28 15:36:35 · 452 阅读 · 1 评论 -
模板引擎artTemplate的使用
无论是Ajax还是跨域,目的都是为了获取服务器的数据,获取数据之后,对前端界面进行渲染。怎么渲染前端界面呢?前端界面都是由标签构成的,所以前端界面的渲染主要做的就是生成html标签。生成html标签,可以通过拼接字符串的方式来实现。但是这种方式在标签结构比较复杂的情况下,很不好操作和后期维护,并且容易出错。通过模板引擎可以很方便地生成html标签。模板引擎的本质:将数据和模板结合起来生成html片...原创 2018-07-10 12:38:48 · 2314 阅读 · 0 评论 -
JavaScript实现简单的元素显示和隐藏
隐藏:display:none;显示:display:block;方法一:设置display样式<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title>&原创 2018-06-27 23:58:28 · 5144 阅读 · 0 评论 -
JavaScript阻止超链接默认的跳转
阻止超链接默认的跳转用:return false;<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body&原创 2018-06-27 23:10:51 · 4174 阅读 · 1 评论 -
JavaScript 特效三大系列总结
一. offset系列1. offset系列的5个属性1. offsetLeft : 用于获取元素到最近的定位父盒子的左侧距离 * 计算方式: 当前元素的左边框的左侧到定位父盒子的左边框右侧 * 如果父级盒子没有定位, 那么会接着往上找有定位的盒子 * 如果上级元素都没有定位,那么最后距离是与body的left值2. offsetTop : 用于获取元素到最近定位父盒子...转载 2018-06-27 20:16:11 · 410 阅读 · 0 评论 -
事件冒泡
事件冒泡:多个元素嵌套,有层次关系,这些元素注册了相同的事件,如果里面元素的事件触发了,外面元素的该事件自动的触发了。原创 2018-07-04 23:05:06 · 154 阅读 · 0 评论 -
前端模块化——RequireJS
为什么模块很重要?因为有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块。但是,这样做有一个前提,那就是大家必须以同样的方式编写模块。目前,通行的Javascript模块规范共有两种:CommonJS和AMD。AMD是"Asynchronous Module Definition"的缩写,即"异步模块定义"。它采用异步方式加载模块,模块的加载不影响它后面语句的运行。所有依赖这...原创 2018-07-12 12:44:12 · 3057 阅读 · 0 评论 -
js-cookie
1、安装npm install js-cookie2、应用<template> <div> <button @click="setCookie">创建cookie</button> <button @click="getCookie">读取cookie</button> <but...原创 2019-05-21 20:12:05 · 523 阅读 · 1 评论 -
HTML5 Web 存储(localStorage和sessionStorage)
HTML5 Web 存储是本地存储,存储在客户端,包括localStorage和sessionStorage。HTML5 Web 存储是以键/值对的形式存储的,通常以字符串存储。localStoragelocalStorage生命周期是永久,除非主动清除localStorage信息,否则这些信息将永远存在。存放数据大小为一般为5MB,而且它仅在客户端(即浏览器)中保存,不参与和服务器的通...原创 2018-09-24 21:25:38 · 19307 阅读 · 2 评论 -
JavaScript Cookie
一、Cookie的使用JavaScript 可以使用 document.cookie 属性来创建 、读取、及删除 cookie。1、创建cookie // 创建cookie document.cookie="username=sleepwalker"; // 创建cookie, 并设置过期时间 // 默认情况下,cook...原创 2019-01-08 21:42:56 · 609 阅读 · 0 评论 -
JavaScript求一维数组的第三大值
求一个足够长的一维数组中第三大值,数组中元素全是number类型的1、使用排序的方法可以降序或升序排序,这种方法可以求得任意第几大或第几小的值 // 排序的方法有很多,以冒泡排序 降序为例: var arr = [6, 10, 9, 3, 8, 15, 11, 16, 14, 19, 1, 7, 2, 18, 17]; for (var i = 0; i <...原创 2018-09-28 14:14:07 · 607 阅读 · 0 评论 -
JavaScript交换两个变量的值
<script> console.log("======第一种======"); // 1、借助第三方变量 { let a = 'Hello'; let b = 'Hi'; let temp; temp = a; a = b; b = temp; console.log(...原创 2018-09-22 16:23:09 · 443 阅读 · 1 评论 -
Javascript 键盘keyCode键码值表
1.字母和数字键的键码值(keyCode)按键 keycode A 65 B 66 C 67 D 68 E 69 F 70 G 71 H 72 I 73 J 74 K 75 L 76 M 77 N 78 O 79 P 80 Q...转载 2018-07-22 17:28:37 · 496 阅读 · 0 评论 -
JavaScript元素创建的方式(二)
动态创建一个列表方法一:对象.innerHTML = "标签及代码";<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head&a原创 2018-07-05 22:06:49 · 148 阅读 · 0 评论 -
JavaScript元素创建的方式(三)
1、动态创建表格<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><i原创 2018-07-05 23:52:39 · 652 阅读 · 0 评论 -
URL中的hash(#号)
1.#的含义#代表网页中的一个位置,其右边的字符,就是该位置的标识符。比如http://www.example.com/index.html#print就是代表index.html中的print位置。浏览器会自动把print位置滚动到页面可视区域内。设置方法:step1:设置一个锚点<a href="#print">定位到print位置</a>st...转载 2018-07-23 21:47:14 · 2143 阅读 · 0 评论 -
如何把局部变量变成全局变量
自调用函数的两种形式: //第一种自调用方式 (function(形参){ var num =10; //局部变量,外部访问不到 })(实参); //第二种自调用方式 (function(形参){ var num =10; //局部变量,外部访问不到 }(实参));自调用函数在页面加载完成后,代码也就执行完了。局部...原创 2018-07-05 18:20:56 · 27339 阅读 · 1 评论 -
BOM——client系列
clientWidth:可视区域的宽度(包括padding,不包括border)clientHeight:可视区域的高度(包括padding,不包括border)clientLeft:左边框(border)的宽度clientTop:上边框(border)的宽度clientX:鼠标在可视区域中的横坐标clientY:鼠标在可视区域中的纵坐标...原创 2018-06-27 20:18:34 · 317 阅读 · 0 评论 -
BOM——scroll系列
scrollWidth:元素中内容的实际的宽(不包括边框),如果元素中内容很少或没有内容就是元素的宽。scrollHeight:元素中内容的实际的高(不包括边框),如果元素中内容很少或没有内容就是元素的高。scrollTop:向上卷曲出去的距离scrollLeft:向左卷曲出去的距离各浏览器下 scrollTop的差异IE: 对于没有doctype声明的页面,使用 doc...原创 2018-06-27 19:36:18 · 722 阅读 · 0 评论 -
JavaScript实现循环点击按钮弹出对应的数字
问题:循环点击按钮弹出对应的数字<body><input type="button" value="按钮1"><input type="button" value="按钮2"><input type="button" value="按钮3"><input t原创 2018-07-02 22:03:45 · 4027 阅读 · 1 评论 -
javascript 基础语法(变量、字符串、数组)
javascript 定义变量、字符串拼接、定义数组的方式原创 2018-06-11 23:51:47 · 164 阅读 · 0 评论 -
JavaScript作用域
在 JavaScript 中, 对象和函数同样也是变量。在 JavaScript 中, 作用域为可访问变量,对象,函数的集合。JavaScript 局部作用域变量在函数内声明,变量为局部作用域。局部变量:只能在函数内部访问。因为局部变量只作用于函数内,所以不同的函数可以使用相同名称的变量。局部变量在函数开始执行时创建,函数执行完后局部变量会自动销毁。函数参数只在函数内起作用,是局部变量。JavaS...原创 2018-06-18 21:48:27 · 211 阅读 · 0 评论 -
JavaScript函数
函数定义的方法1、函数声明 //函数声明 function 函数名(参数1,参数2,参数3,...){ // 函数体 } //调用函数: 函数名(参数1,参数2,参数3,...);这种方法调用函数,可以在声明前调用,也可以在声明后调用。例如,求n的阶乘 //函数声明 ...原创 2018-06-18 21:21:43 · 197 阅读 · 0 评论 -
JavaScript获取任一元素的任一属性值
style:各大浏览器都兼容,能设置样式和获取样式,但是该方法只能获取到行内样式,获取不了外部的样式。如果写了行内没有的样式,返回的是空值.用法:获取元素的属性值:element.style.attr设置元素的值:element.style.attr="值";currentStyle:不能设置属性,只能获取属性值,该属性只兼容IE,不兼容火狐和谷歌用法:element.currentStyle["...原创 2018-06-25 16:30:19 · 232 阅读 · 0 评论 -
BOM——offset系列
offset系列offsetWidth: 获取元素的宽(包括左右padding和border)。offsetHeight: 获取元素的高(包括上下padding和border)。offsetTop: 获取元素距离上面位置的值。offsetLeft: 获取元素距离左边位置的值。offsetParent: 获取距离自己最近的有定位的父元素。注意: 在styl...原创 2018-06-24 21:34:27 · 705 阅读 · 0 评论 -
JavaScript封装动画函数(一)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> *{ margin: 0;原创 2018-06-23 22:57:36 · 566 阅读 · 0 评论 -
JavaScript计时事件
在一个设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行。称之为计时事件。setInterval() - 间隔指定的毫秒数不停地执行指定的代码。clearInterval() - 用于停止 setInterval() 方法执行的函数代码。setTimeout() - 在指定的毫秒数后执行指定代码。clearTimeout() - 用于停止setTimeout()方法执行的函数代码。注意: ...原创 2018-06-23 17:22:15 · 303 阅读 · 0 评论 -
JavaScript 的BOM基本操作(location、history、navigator等)
1、JavaScript分三个部分:(1)ECMAScript标准--------基本语法(2)DOM---------Document Object Model 文档对象模型,操作页面元素的(3)BOM---------Browser Object Model 浏览器对象模型,操作浏览器的2、基本介绍:(1)所有浏览器都支持 window 对象。它表示浏览器窗口。(2)浏...原创 2018-06-23 13:31:31 · 564 阅读 · 0 评论 -
JS创建对象的四种简单方式
// 对象:特指的某个事物,具有属性和方法(一组无序的属性的集合) // 特征------>属性 // 行为------>方法 // 创建对象的四种方式 // 1.字面量的方式,就是实例化对象 var stu1={ name:"小明", ...原创 2018-06-22 11:49:43 · 3193 阅读 · 0 评论 -
JavaScript面向对象编程思想
面向对象基础复习补充:+ 创建对象的方式:``` * var o = { name: '123', age: 18 }; //json方式创建 * var o = new Object(); //通过new的方式创建 * var o = new Persion(); //通过类的构造函数创建```+ JS中对象的属性创建方式``` * json的方式: var o = {...原创 2018-06-06 15:46:34 · 333 阅读 · 0 评论