奇葩之小王子-CSDN博客

原创 bind方法

bind方法经常用于修改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-s

2021-04-02 17:14:04 340

原创 forEach,filter,some,trim四种方法的使用以及应用场景

forEach,filter,some,trim四种方法的使用以及应用场景1.forEach<!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-wi

2021-04-02 17:10:40 507

原创正则替换 --利用正则表达式的方法来做到替换敏感词

正则替换 --利用正则表达式的方法来做到替换敏感词<!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

2021-04-02 17:00:25 1206

原创 Set数据结构 -- es6新增语法

Set数据结构 – es6新增语法<!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">

2021-04-02 16:57:03 135

原创闭包的应用 -- 最基础的闭包演示（立即执行函数）

闭包的应用 – 最基础的闭包演示（立即执行函数）—源自作者看黑马程序员的讲解而做的笔记<!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

2021-04-02 16:47:59 160

原创查询商品案例 -- 通过ES6方法以及面向对象的思维实现

查询商品案例 – 通过ES6方法以及面向对象的思维实现—源自作者看黑马程序员的讲解而做的笔记<!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-wi

2021-04-02 16:44:38 485 1

原创面向对象的Tab栏操作

面向对象的Tab栏操作 – 源自黑马程序员讲解而做的笔记<!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=

2021-04-02 16:36:09 295

原创 react个人笔记 --三大属性之props

props是react重要的属性之一,我们可以通过props来限制或接受传入的数据先来看看它的简单使用, 接受数据<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="widt

2021-03-26 19:45:33 186

原创 react个人笔记 -- 经典案例来明白this指向的重要性以及解决方法

案例要求：通过点击文字 “今天天气很炎热”转变成“今天天气很寒冷”，再点击又转变萌新作者在线卑微记录自己学习React的历程代码及笔记来自尚硅谷学习视频先来看看使用构造器的方法来实现<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">

2021-03-26 19:25:22 137

原创 react个人笔记 -- 创建组件的两种形式

在React中，有两种创建组件的方式，下面将通过代码给大家说明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-widt

2021-03-26 19:08:43 91

原创 react个人笔记 -- 模仿数据的传入在页面上的展示 -- jsx的小练习

萌新作者在线卑微记录自己学习React的历程代码及笔记来自尚硅谷学习视频本次小练习旨在模仿数据传入，然后通过jsx的方法将数据动态的展示在页面上<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewp

2021-03-26 18:57:19 147

原创 react个人笔记 -- jsx语法规则

萌新作者在线卑微记录自己学习React的历程代码及笔记来自尚硅谷学习视频jsx语法规则分为以下几条：1.定义虚拟DOM,不要写引号。2.标签中混入JS表达式时要用{}。3.样式的类名指定不要用class,要用className。4.内联样式,要用style={{key:value}}的形式去写5.只有一个根标签6.标签必须闭合7.标签首字母（1）若小写字母开头,则将该标签转化为html中的同名元素,若无对应同名元素,则报错（2）若大写字母开头,react就去渲染对应的组件,若组件没

2021-03-26 18:49:55 139

原创学习react个人笔记 -- 创建虚拟DOM的两种方式

在React中有两种方式创建虚拟DOM：萌新作者在线卑微记录自己学习React的历程代码及笔记来自尚硅谷学习视频1.使用jsx创建虚拟DOM(也是最常用的方法)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta na

2021-03-26 18:43:04 146

原创 react个人笔记---引入那三个必须使用的库（附链接） -- 引入react库等简单操作

react个人笔记 – 引入react库等简单操作萌新作者在线卑微记录自己学习React的历程代码及笔记来自尚硅谷学习视频学习React首先要引入react库,库可在react官方网站下载,具体操作如下：1.先进入官网(百度搜索react就行)React官网2.点文档，再点右边的CDN链接复制这几段地址https://unpkg.com/react@16/umd/react.development.jshttps://unpkg.com/react-dom@16/umd/react

2021-03-26 17:53:55 2261

原创用js封装一个动画函数

用Js封装好一个animate函数实现像HTML5那样的功能function animate (obj,target,callback){} 三个参数分别传入调用函数的标签（对象）移动多少距离动画结束后执行什么操作（回调函数）第三个也可不写function animate (obj,target,callback){ //callback = function(){} 调用的时候callback() //先清除以前的定时器，只保留当前的一个定时器 cl

2021-03-20 15:29:57 129

原创固定侧边栏

固定侧边栏 – 实现当滚动条下滑到某个位置时侧边栏绝对固定并显示相应文字<!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, init

2021-03-20 15:23:08 755

原创获取URL的参数 -- 通过location将数据传到第二个页面

获取URL的参数 – 通过location将数据传到第二个页面思路：我们要做两个页面第一个是登录界面第二个接受用户名并反馈到页面中第一个页面用表单form传数据<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta na

2021-03-20 15:19:51 234

原创点击查看当前时间的案例

点击查看当前时间的案例<!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"> <

2021-03-20 15:14:12 92

原创循环精灵图效果(很多购物图标)

循环精灵图效果要做到这样的效果首先拿到的是一张这样的图我们要做的就是把这张竖直的图片变成3X4的图片<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=d

2021-03-18 16:44:20 214

原创排他思想 -- 百度换肤效果案例以及点击某按钮只是该按钮变色

排他思想 – 百度换肤效果案例以及点击某按钮只是该按钮变色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, init

2021-03-18 16:33:47 417 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

2021-03-18 16:22:45 174

原创跟随鼠标的案例

跟随鼠标的案例<!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"> <titl

2021-03-18 16:18:02 102

原创输入框隐藏 -- js案例

输入框隐藏 – 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"> &lt

2021-03-18 16:15:15 845

转载密码框验证信息 -- js案例

密码框验证信息 – 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"> &

2021-03-18 16:12:31 545

原创 tab栏切换 -- js案例

tab栏切换 – 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"> &l

2021-03-18 16:08:49 220 1

原创发布留言--js案例

发布留言–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"> <ti

2021-03-18 16:02:24 157

原创显示隐藏密码--JS案例

显示隐藏密码–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"> <

2021-03-18 15:57:42 242

原创动态生成表格--JS案例

动态生成表格–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"> <

2021-03-18 14:54:29 220

原创通过按键输入,聚焦 -- JS案例

通过按键输入,聚焦 – 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">

2021-03-16 22:17:24 145

原创输入时有字体变大的放大镜效果 -- js案例

输入时有字体变大的放大镜效果 – 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"&gt

2021-03-16 22:13:49 340

原创个人笔记之jQuery的获取内容或属性

个人笔记之jQuery的获取内容或属性<!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">

2021-03-14 11:52:35 63

原创个人笔记--学习jQuery之引用

个人笔记–学习jQuery之引用<!DOCTYPE html><html lang="en"><head> <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE

2021-03-14 11:44:52 174

原创三角形制作方法

三角形制作方法<html><head> <meta charset="utf-8"> <title>Document</title> <link rel="stylesheet" type="text/css" href="lesson6.css"> <style> .triangle{ width: 0; height: 0; border:40px solid red; borde

2021-03-14 11:35:33 230

原创制作五环

五环<html lang="en"><head> <meta charset="utf-8"> <title>Document</title> <style> *{ margin: 0; padding: 0;}.plat{ position: absolute; left: 50%; top: 50%; margin-left: -190px; margin-top: -93px; height: 18

2021-03-14 11:30:55 119

原创轮播图效果--利用html,css,js制作电影轮播图

轮播图效果–利用html,css,js制作电影轮播图html 块<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" type="text/css" href="轮播图效果.css">//引入css块</head><body&gt

2021-03-14 11:25:20 1979 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"> &l

2021-03-14 11:00:26 159

原创 3D导航栏--用CSS3制作

3D导航栏–用CSS3制作<!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"> &l

2021-03-14 10:46:07 192

原创旋转木马--利用html5和css3制作好看的图片3D旋转效果

旋转木马–利用html5和css3制作好看的图片3D旋转效果<!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-scal

2021-03-14 10:35:48 740

原创 ACM-2019 -数列有序!-直接插入排序

**数列有序!**（直接插入排序）有n(n<=100)个整数，已经按照从小到大顺序排列好，现在另外给一个整数x，请将该数插入到序列中，并使新的序列仍然有序。Input输入数据包含多个测试实例，每组数据由两行组成，第一行是n和m，第二行是已经有序的n个数的数列。n和m同时为0标示输入数据的结束，本行不做处理。Output对于每个测试实例，输出插入新的元素后的数列。Sample Input3 31 2 40 0Sample Output1 2 3 4#include &...

2020-11-05 17:56:57 523

空空如也

空空如也