![](https://img-blog.csdnimg.cn/20190927151124774.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
JS
二阶段
遥远的理想国
这个作者很懒,什么都没留下…
展开
-
使用回调函数自定义事件监听
回调函数实在原函数执行完毕之后才开始执行的函数。我们处理事件的时候会使用 ele.onclick = function(){}还有一种方式是使用事件监听函数,但是事件监听会出现浏览器兼容问题,这个时候可以使用自定义函数来解决这个兼容问题函数的前三个函数分别为元素,时间类型,回调函数var dv = document.querySelector("div")//写回调函数function on(ele, type ,fn){ //兼容性分类结算 if(ele.addEventListener原创 2020-09-09 20:27:44 · 522 阅读 · 0 评论 -
动态表格(通过创建与移动节点)
使用createElement创建节点,并用innerText或innerHtml传输文本,最后用appendchild传递节点.var tbody = document.querySelector("tbody")obj.forEach(function(item,index){ var tr = document.createElement("tr") var td = document.createElement("td") td.innerText = index+1 tr.append原创 2020-08-24 19:06:44 · 107 阅读 · 0 评论 -
拖拽与光标信息
demo如下 : demo使用.onmousedown获取鼠标与目标dv的offset与client,以此来得出dv的left与top值,并使得这两个值与鼠标的位置有关,从而达到鼠标动,dv动的效果,再通过onmousemove方法在移动鼠标的同时获取其数据,并打印在网页上.最后添加onmouseup效果,在松开鼠标的时候清除move函数.var dv = document.querySelector(".block")var p0 = document.querySelectorAll("p")[原创 2020-08-24 15:35:49 · 137 阅读 · 0 评论 -
动态创建表格(使用模板字符串)
动态的内容使用${}的格式书写.function setTable(){for(let i = 0; i<arr.length ; i++){ const obj = arr[i] const str = ` <tr> <td>${obj.name}</td> <td>${obj.age}</td> <td>${obj.gender}</td> <td class = "del" ind原创 2020-08-24 15:02:34 · 535 阅读 · 0 评论 -
js中的浏览器滚动事件
实例: 仿写京东的滚动后出现上边栏链接: demohtml结构<body><div class="topic"> <div class="container"> </div></div><box id="box"> <div class="container"> <div class="top"> <div class="left"></div>原创 2020-08-24 14:31:10 · 742 阅读 · 0 评论 -
数据插入表格(初级)
由于刚接触数组与对象的处理方法,所以这里采用的添加与删除的原理是,对原对象数组进行处理,再生成新的对象数组传入表格链接:demo放点核心代码:var tbody = document.querySelector("tbody")setTable() function setTable(){ var str="" var i = 0 arr.forEach(function(item,index){ str +="<tr>" for(var key in item){原创 2020-08-24 14:15:07 · 188 阅读 · 0 评论 -
js动态处理时间
获取时间var time = new Date()//Wed Aug 19 2020 20:22:12 GMT+0800 (中国标准时间)var c = new Date().getTime()//1597839732075第二个值为毫秒时间有关的demo–倒计时样式:链接:demo<html> <head> <meta charset="utf-8"> <title></title> <style t原创 2020-08-19 20:49:18 · 252 阅读 · 0 评论 -
随机数与随机颜色
随机数一般都是整数,而单独使用,random会出现小数,这个时候可以使用,round方法四舍五入,也可以使用floor或者.ceil方法向下或向上取整.使用round的时候会出现随机范围两边的数据随机到的概率较低的问题,所以这里推荐使用floor方法进行随机.随机 30-80的整数这里的用得.floor向下取整,10.5 = 10, 所以要有第11个值,这里的51为随机范围,由80-30==50得来,再加上一个1,这是0-50的范围,放到30-80就需要+30var num = Math.flo原创 2020-08-12 20:59:05 · 596 阅读 · 0 评论 -
js中几个常用的math方法
Math属性解释.random0-1之间的随机数(没有1).pow(x,y)求x的y次方.sort开方.round四舍五入.ceil向上取整.floor向下取整.PI取π的值.abs取绝对值.max取最大值.min取最小值原创 2020-08-12 13:01:21 · 222 阅读 · 0 评论 -
js中几个有关数组与字符串的练习
给一段文章中的全部指定词语进行过滤// 比如我要过滤 "SM"var str = 'asdasdSMasdasdasdSMsdasdasdSMsadasd'// 需要结果// asdasd**asdasdasd**sdasdasd**方法一,用spilt()方法把str分割成以SM为分界的数组,然后用join()方法把数组用**粘合成字符串,有些取巧,但是很好用var str = 'asdasdSMasdasdasdSMsdasdasdSMsadasd'var res = str.spl原创 2020-08-12 12:44:52 · 215 阅读 · 0 评论 -
字符串的创建与方法
字符串的创建使用字面量形式创建的字符串没有length和index属性,但是用的时候会生成,不用的时候会消散.var str = 'qwer'使用内置构造函数创建的字符串有length和index属性var str1 = new String('qwer')charAt()找到字符串对应的下标并返回其下标var res = str.charAt(4)charCodeAt()找到字符串对应下标的字符集编码(Unicode)var res = str.charCodeA原创 2020-08-11 20:54:49 · 289 阅读 · 0 评论 -
ES5新增的数组方法
forEach()forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。但是本身没有返回值,回调函数能够对原数组进行改变这是标准的改变原数组的方法,这里的a也可以用数组名arr,也可以用变量a,都是一个意思.var arr = [1,2,3,4]arr.forEach(function(item,index,a) { a[index] = item *10; })发现num与item其实是一个变量类型,所以他的变量类型定义是由位置来决定的,从左到右分原创 2020-08-11 20:27:24 · 74 阅读 · 0 评论 -
JavaScript中this的指向
this是一个关键字,而非具体的变量this一般情况下只会指向局部变量(如object)或全局变量(window)在全局条件下出现的this都是指向window的在函数内出现的this要根据函数调用的情况来找寻指向变量:fun(),函数内部的this指向windowxxx.fun(),函数内部的this指向xxx事件处理函数,如id.fun()指向事件源(由谁触发)<body> <div style="width:200px;height:200px;原创 2020-08-11 17:40:19 · 120 阅读 · 0 评论 -
冒泡排序与选择排序
冒泡排序for(循环k次(数组长度-1)){ for(循环i次(数组长度-1-k)) { if(根据需求选择谁放前面) }}for(需要循环到每个数字,但是最后一个数字除外,因为根本不需要对其进行排序) for(随着排序的进行,如果是从小到大排序的话,后面的数据会越发的稳定, 因为每进行一次大循环就会把当前循环中最大的数放到了最后面.-k没有也没事, 算是一个算法优化) if(这没啥好说的)选择排序for(每个数循环一次,除了最后一个数){ var 最小值 for(原创 2020-08-11 17:23:28 · 67 阅读 · 0 评论 -
数组的基本方法
创建方式内置构造函数: var arr = new Array(value)字面量: var arr = [value]注 : 这里的value可以是"", 数字, 数组内容, 或数字+数组内容的形式1. 这里的""代表无内容且未定义length的数组2. 仅单独数字代表数组的length3. 仅数组内容代表数组的内容4. 数字+数组内容代表数组length+数组内容...原创 2020-08-11 11:50:52 · 70 阅读 · 0 评论 -
几个有价值的关于js预解析的例子
1. 函数的内容var data = [];for (var i = 0; i < 3; i++) { data[i] = function () { console.log(i); };}data[0](); data[1](); data[2]();这里在预解析的过程中会有data[i]变量的声明,且会伴随一个地址。地址的内容不会进行解析,当做字符串处理,当且仅当调用函数的时候才会解析函数内容。所以这里的动作为:for循环把i增加为3console.lo原创 2020-08-07 19:58:10 · 115 阅读 · 0 评论 -
JS的操作符与switch穿透
逻辑操作符的权重由大到小为! && ||swtich()中的的case有穿透属性,case 1:case 3:case 4: break其中的1,3,4都会触发break.count一般用于计数.flag常用于存放布尔值continue可以立即结束,并进行下一次循环,并不理睬continue之下的内容(单次)....原创 2020-08-05 19:53:08 · 789 阅读 · 0 评论 -
JS的书写位置与类型
js书写位置内部样式: 标签为<script>,位置通常在body标签里面的下部.外联样式: 使用script src标签引入外部js文件.内联样式: 使用a标签时用JavaScript: js内容的方式写在href属性的值里面.注:在外联中只可引入文件,直接写脚本将无效.需要另起scrpit标签js数据类型五个常用数据类型:number, boolean, string, null ,undefined.数据类型检测typeof(value)或typeof value原创 2020-08-03 17:32:43 · 154 阅读 · 0 评论