susu1198-CSDN博客

原创 todolist的详细说明

$(function() { // 检测引入函数是否成功 // alert(11) // 渲染 load() $('#title').on('keydown', function(e) { // console.log(e.keyCode); 得到空格的阿斯克码值 if (e.keyCode === 13) { // 声明一个变量接收存储的 localStorage的数据存起来(模拟向.

2021-05-12 18:31:32 697

原创 this指向及详细小案例

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do

2021-06-08 18:39:18 181

原创 ES6 块级变量const 和 let

let 有一定稳定性 1 let声明的变量具有块级作用域（{} 里面的区域）var关键字是不具备这个特点的 2 防止循环变量变成全局变量 3 let声明的变量没有声明提升(必须先声明，才能使用) 4 let声明的变量具有暂时性死区：如果当前块级作用域中有声明该变量，就不会使用上层作用域的变量/* --------let关键字就是用来声明变量的-------- */ ...

2021-05-25 20:13:17 178

概念浅拷贝只把复杂类型数据的第一层做复制操作，深层次数据依然会相互影响Object.assign( 新对象, 老对象)把老对象第一层的数据拷贝一份给新对象，深层次的数据新、老对象依然会相互影响深拷贝把复杂类型数据中包含的所有数据都做复制操作，赋值之后不会相互影响浅拷贝如果是简单数据类型，改变值，另一个不会变，如果是复杂数据类型，它是一个对象或者数组，里面存储空间是通过它的地址(在一个空间里)，如果更改值，另外一个也会改变 // 浅拷贝只拷贝一层，更深层次对象级别的只拷贝引用

2021-05-22 15:32:54 168

原创利用递归函数求阶乘

函数内部自己调用自己, 这个函数就是递归函数递归函数的作用和循环效果一样由于递归很容易发生“栈溢出”错误（stack overflow），所以必须要加退出条件 return。 // 利用递归函数求1~n的阶乘 1 * 2 * 3 * 4 * ..n // function fn(n) { // if (n == 1) { // return 1; // } // return

2021-05-22 10:51:43 1101

原创利用原型对象求最大值

Array.prototype.max = function() { var num = this[0]; for (var i = 0; i < this.length; i++) { if (this[i] > num) { num = this[i] } } return num; .

2021-05-20 13:38:38 75

原创类的本质

// // 一 // function Father(uname, age) { // this.uname = uname; // this.age = age; // } // Father.prototype.money = function() { // console.log(100000); // }; // // 二 //..

2021-05-20 09:03:36 219

原创利用闭包点击li输出索引号

闭包就是有权访问另一个函数作用域中变量的函数主要作用延伸了变量的作用范围点击li输出索引号 <ul class="nav"> <li>巧克力</li> <li>酸奶</li> <li>可可豆</li> <li>沙冰</li> </ul> var lis = document.q

2021-05-16 18:58:42 272

原创严格模式规则

开启严格模式：'use strict' 在作用域开始位置书写开启严格默认则该作用域中的代码要遵循严格模式 <script> 'use strict'; // 下面的js 代码就会按照严格模式执行代码 </script> 严格模式的部分规则： 1) 变量名必须先声明再使用（重点） 2) 不能随意删除已经声明的变量 3) 独立函数中的 this 是 undefined（重...

2021-05-16 18:30:56 104

原创 ES5新增方法

数组方法： 1 forEach语法array.forEach(function(currentValue, index, arr))currentValue：数组当前项的值index：数组当前项的索引arr：数组对象本身// forEach 迭代(遍历) 数组 var arr = [1, 2, 3]; var sum = 0;//申明一个变量相加 arr.forEach(function(value, index, array) {..

2021-05-14 20:02:10 61

原创借用原型对象继承父类型方法

// 借用父构造函数继承属性 // 1. 父构造函数 function Father(uname, age) { // this 指向父构造函数的对象实例 this.uname = uname; this.age = age; } // 创建了一个共有的原型对象里面存储了money值 Father.prototype.money = function...

2021-05-14 19:33:37 172

原创使用面向对象功能，增，删，改

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>面.

2021-05-14 19:15:51 110

原创借用父构造函数继承属性

// 借用父构造函数继承属性 // 1. 父构造函数 function Father(uname, age) { // this 指向父构造函数的对象实例 this.uname = uname; this.age = age; } // 2 .子构造函数 function Son(uname, age, score) { //使用cal..

2021-05-14 19:12:07 79

原创原生wed，显示隐藏文本框

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>D.

2021-05-13 18:26:21 122

原创使用原生wed，鼠标经过变色，不经过不变色

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>D.

2021-05-13 18:22:45 157

原创原生js 随机选择学员

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&g...

2021-05-13 18:18:37 484

原创数据可视化里边框图片

属性描述 border-image-source 用在边框的图片的路径。（那个图片？） border-image-slice 图片边框向内偏移。（裁剪的尺寸，一定不加单位，上右下左顺序） border-image-width 图片边框的宽度（需要加单位） border-image-repeat 图像边框是否应平铺(repeat)、铺满(round)或拉伸(stretch) 默认拉伸样式设置如上表格 1 内容在中间显示 div {

2021-05-13 18:11:12 579

原创多库共存

$(function() { console.log($); // 声明一个变量名接收$ var demo = $.noConflict(); // 其他人使用$ $ = 10; // 打印最后得到的是$之前的值 console.log(demo); // 1 别人已经使用$，我们放弃使用$,开始使用jquery..

2021-05-13 09:20:28 60

原创使用jquery书写全选反选复选框

$(function() { // 全选框 $('.checkall').change(function() { // console.log($(this).prop('checked')); $('.j-checkbox ,.checkall').prop('checked', $(this).prop('checked')) }) // 判断小复选框都被选中后全选也被选中 $('.j-checkb.

2021-05-10 10:01:26 116

原创停止动画排队

动画或者效果一旦触发就会执行，如果多次触发，就造成多个动画或者效果排队执行。停止动画排队的方法为：stop() ;- stop() 方法用于停止动画或效果。- stop() 写到动画或者效果的前面，相当于停止结束上一次的动画。总结: 每次使用动画之前，先调用 stop() ,在调用动画。动画排队解决方法：某个元素上如果同时设置了多个动画，则这些动画会按照添加的顺序依次执行可以简单理解为把所有动画都清除了添加...

2021-05-09 18:39:19 106

原创自定义动画

<body> <button>动起来</button> <div></div> <script> $(function() { $('button').click(function() { $('div').animate({ width: '500px', lef.

2021-05-09 18:38:22 55

原创动画效果淡入淡出

fadeIn()/fadeOut()/fadeToggle()/fadeTo() 淡入淡出动画 fadeIn(1000,fn) 第一个参数动画时间第二个参数动画完成后的回调函数注意：即使不传入动画时间参数，也有动画效果 fadeTo(1000,value,fn)动画时长/透明度/回调函数修改透明度 fadeTo() 这个速度和透明度要必须写 ...

2021-05-09 18:37:09 260

原创动画效果滑入滑出

slideDown()/slideUp()/slideToggle()滑入滑出动画 slideDown(1000,fn) 第一个参数动画时间第二个参数动画完成后的回调函数注意：即使不传入动画时间参数，也有动画效果<body> <button>下拉滑动</button> <button>上拉滑动</button&gt...

2021-05-09 18:17:09 238

原创动画效果显示隐藏

显示隐藏show()/hide()/toggle()对角线动画 show(1000,fn) 第一个参数动画时间第二个参数动画完成后的回调函数注意：如果不指定动画时长，则无动画效果 <body> <button>显示</button> <button>隐藏</butto...

2021-05-09 18:13:37 85

原创使用jquery做tab栏切换

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>D.

2021-05-09 18:09:11 161

原创传统，监听函数解绑事件

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D.

2021-04-30 16:01:21 151 1

原创克隆节点

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D.

2021-04-30 15:09:31 157 1

原创选择框全选反选思路解析

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> * { padding: 0; margin: 0; } .wrap { width: .

2021-04-29 14:48:57 436

原创排他思想执行思路，点击某项执行某项操作

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>D.

2021-04-29 10:53:28 101

原创仿京东显示与隐藏

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D.

2021-04-28 16:15:01 161

原创判断一个字符串中出现次数最多的字符，并统计其次数

// 重判断一个字符串 'abcoefoxyozzopp' 中出现次数最多的字符，并统计其次数 var arr = 'abcoefoxyozzopp'; var o = {} // 使用对象存储 for (var i = 0; i < arr.length; i++) { var chars = arr.charAt(i) // 获取里面的字母值用变量暂时存储 if (o[chars]) { ...

2021-04-26 20:31:35 170

原创日期对象倒计时案例

// 日期对象 // var s = new Date(); // // 年 // var year = s.getFullYear() // console.log(year); // // 月 // var month = s.getMonth() + 1 // console.log(month); // // 日 // var data = s.get...

2021-04-25 18:08:27 137

原创工厂函数

//工厂函数functionSyhi(age,uname,sex,song){//1.创建一个空对象，把obj指向该对象varobj={};//2.给obj添加属性和方法obj.age=ageobj.uname=uname;obj.sex=sex;ob...

2021-04-25 18:04:35 113

原创 ATM取款机

// ATM取款机 var money = 100; //固定的金额 while (true) { var opa = prompt('请输入你要做的操作：\n1.存钱。\n2.取钱。\n3.显示余额。\n4.退出') console.log(opa); switch (opa) { case '1': console.log(...

2021-04-22 16:22:02 149

原创数组翻转 2

//数组翻转vararr=['red','green','blue','pink'];for(vari=0;i<arr.length/2;i++){ //i<arr.length/2中除以2是因为两边交换完为一半,如果不除以2相当于又交换回来了vartemp=arr[i] //声明一个变量存储数组元素中的值arr[i]=...

2021-04-22 15:29:27 57

原创数组翻转 1

//数组翻转vararr=['red','green','blue','pink'];vararrArr=[]for(vari=arr.length-1;i>=0;i--){arrArr[arrArr.length]=arr[i]}console.log(arrArr);...

2021-04-22 11:33:15 55

原创数组大于10 ，数组去除 0

//数组总大于10的vararr=[2,0,6,1,77,0,52,0,25,7];vararrArr=[]for(vari=0;i<arr.length;i++){if(arr[i]>10){arrArr[arrArr.length]=arr[i]}}...

2021-04-22 11:19:23 216

原创如何连续插入数组

var arr = ['red', 'green', 'blue', 'pink']; // arr[数组最后一个元素 + 1(是添加的次数)] ='haha' // arr[当前数组的长度 -1(因为索引值从0开始，要添加最后一个只能-1得到) + 1] = 'haha' // arr[当前数组的长度] = 'haha' arr[arr.length] = 'haha'; console.log(arr); ...

2021-04-22 11:10:01 239

原创利用 JS 编写的一个非常简单的交互效果程序。

弹出一个输入框，需要用户输入年龄，之后弹出一个警示框显示“您今年 xx 岁啦”（xx 表示刚才输入的年龄）分析//弹出一个对话框让用户输入年龄//拼接一个字符串拿到刚刚输入的值//打印拼接的字符串就得到数据varage=prompt('请输入你的年龄');varstr='我今年'+age+'岁了';alert(str);...

2021-04-17 15:51:18 392

原创字符串的拼接

字符串的拼接+只要有字符串和其他类型相拼接最终的结果是字符串类型console.log('沙漠'+'骆驼');//字符串的沙漠骆驼console.log('老师'+18);//'老师18'console.log('red'+true);// redtrueconsole.log(12+12);//24console.log('12'+12);//'1212...

2021-04-17 15:33:40 86

空空如也

空空如也