自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(54)
  • 收藏
  • 关注

原创 查找字符串中出现次数最多的字符和次数

<script> var str="aabbbcderrtttt"; var arr=str.split(''); var max=0; var obj={} var s='' arr.map((item,i)=>{ if(!obj[item]){ obj[item]=1; }else{ obj[item]++; } }) for(var key in obj){ if(obj[key]&gt

2020-09-21 16:37:54 438

原创 上一题下一题点击切换

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> a{display: inline-block;} </style></head><body> <div id="box"> <!-- <

2020-07-11 11:08:31 2295

原创 纯前端分页

<style> *{padding: 0;margin: 0;} ul{width: 500px;margin:0 auto;} ul li{list-style: none;text-align:center;} #bottom{ width: 500px; margin:0 auto; text-align:center; } #bottom a{ .

2020-07-11 11:03:43 274

原创 点击盒子外任意位置关闭当前盒子

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> div{ width: 500px; height: 500px; backgro...

2020-03-24 09:45:29 659

原创 前端防抖和节流

<body style="height: 3000px"> <p>hello world</p> <script> window.addEventListener("scroll", () => { thr(); // deb(); }) function ajax() { ...

2020-03-21 14:06:22 315

原创 毛玻璃效果

<body> <div class="content"> 毛玻璃效果毛玻璃效果毛玻璃效果毛玻璃效果毛玻璃效果毛玻璃效果毛玻璃效果毛玻璃效果毛玻璃效果毛玻璃效果 </div></body><style> body { background: url("https://www.dia...

2020-03-21 14:02:31 290

原创 css写波浪线

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> .dash-line { width: 100%; ...

2019-11-04 11:46:22 1140

原创 多余文字隐藏用省略号代替

一,多行文字隐藏用省略号代替border:1px solid #ddd;width: 200px;word-break: break-all;text-overflow: ellipsis;display: -webkit-box; /** 将对象作为伸缩盒子模型显示 /-webkit-box-orient: vertical; / 设置或检索伸缩盒对象的子元素的排列方式 /-web...

2019-10-09 15:40:37 485

原创 react调用百度api获取地理位置和导航

第一步先引入百度api <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=81wpaEGlBjPM4KBAER0jkpg6QlIMupWu" ></script>第二部挂载到组件componentDidMount() { const _thi...

2019-10-09 15:34:23 977

原创 react处理富文本

渲染富文本 dangerouslySetInnerHTML={{ __html: data.n_message ? data.n_message.replace(/\/ueditor/g, APIHost + '/ueditor') : '' }}去掉富文本里的p标签 (item.n_message).replace(/<\/?p[^>]*>/gi,'')...

2019-06-25 18:39:03 3065

原创 react生成二维码

var QRCode = require('qrcode.react'); <QRCode className={styles.ewm} value={'http://47.92.88.214:8685/#/register?tel='+data.us_phone} size={120} />

2019-06-25 18:36:49 855

原创 react输入框的搜索

<input placeholder='请输入您想要的商品' onKeyDown={(v) => this.searchFunc(v)} /> async searchFunc(v) { var evt = window.event || v; if (evt.keyCode == 13) { ...

2019-06-25 18:34:23 2116

原创 react头像上传方法

<div className={styles.cf_tx}> <label htmlFor="txsc"> <img src={data?(APIHost+data.us_portrait):tx} /> ...

2019-06-25 18:32:15 922

原创 react使用过滤器解码url地址栏传递过来的参数

componentDidMount(){ var dz = this.filter(this.props.history.location.search) if(dz){ // var tel = dz.substring(dz.indexOf('=')+1) this.setState({p_tel:dz.tel})...

2019-06-25 18:29:40 1009

原创 react截取地址栏的id并请求接口

//初始化请求 componentWillMount() { const { location } = this.props; const parse = queryString.parse(location.search.replace('?', '')); this.setState({ id: parseFloat(par...

2019-06-25 18:26:22 1175

原创 判断设备是pc端还是移动端

if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) { window.location='' } else { window.location='' }

2019-06-01 16:00:11 278

原创 截取网址链接里的id

var id =window.location.search.substring(window.location.search.indexOf('=')+1)console.log(id);

2019-06-01 15:54:46 1143

原创 Ajax请求接口并将数据返回到页面

<script>$(function(){ $.ajax({ type: "post", //接口地址 url: "http://47.92.145.141:8111/index/index/newsList", data: ...

2019-05-30 09:24:47 9345

原创 React实现闪烁效果

<!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-U...

2019-05-25 16:02:36 2343

原创 React实现todolist效果

<!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-U...

2019-05-25 14:40:49 596

原创 React数据双向绑定

<!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-U...

2019-05-25 14:03:17 164

原创 js 原型链

可以将JS的对象分为三类:用户创建对象,构造函数对象,原型对象。javascript中一切皆对象,每个对象都有一个__proto_ 属性(由浏览器自动创建),该属性指向它原型。当一个对象在查找一个属性的时,自身没有就会根据__proto__ 向它的原型进行查找,如果都没有,直到查到Object.prototype._proto_为nul,这样也就形成了原型链。prototype的作用就是,...

2019-05-21 12:11:51 175

原创 js中的this指向

this指向的具体含义 就是函数的所属关系 就是这个函数属于哪个对象(属于谁)1.全局范围内使用this,指向的就是window2.在函数中使用this,指向的就是这个函数调用的对象3.构造函数中的this 会指向创建出来的实例对象4.如果一个函数中有this,这个函数中包含多个对象,尽管这个函数是被最外层的对象所调用,this指向的也只是它上一级的对象5.对象中的嵌套函数的this指...

2019-05-21 11:25:21 180

原创 cookie 和session 的区别

(1)cookie数据存放在客户的浏览器上,session数据放在服务器上。(2)cookie不是很安全,别人可以分析存放在本地的COOKIE并进行COOKIE欺骗考虑到安全应当使用session。(3)session会在一定时间内保存在服务器上。当访问增多,会比较占用你服务器的性能 考虑到减轻服务器性能方面,应当使用COOKIE。(4)单个cookie保存的数据不能超过4K,很多浏...

2019-05-21 11:15:44 160

原创 null和undefined的区别

null是一个表示"无"的对象,转为数值时为0;undefined是一个表示"无"的原始值,转为数值时为NaN。  undefined:  (1)变量被声明了,但没有赋值时,就等于undefined。  (2) 调用函数时,应该提供的参数没有提供,该参数等于undefined。  (3)对象没有赋值的属性,该属性的值为undefined。  (4)函数没有返回值时,默认返回un...

2019-05-21 11:13:44 214

原创 js中let和var的区别

ES6 新增了let命令,用来声明局部变量。但是所声明的变量,只在let命令所在的代码块内有效,而且有暂时性死区的约束。let非常适合用于 for循环内部的块级作用域。下面有两个例子for (var i = 0; i <10; i++) { setTimeout(function() { // 同步注册回调函数到 异步的 宏任务队列。 console.log(i);...

2019-05-21 11:03:04 265

原创 选项卡切换

盒子部分<div id="tab"> <button class="active">标题一</button> <button>标题二</button> <button>标题三</button> </div> <div id="content"> ...

2019-05-20 20:39:09 169

原创 盒子在浏览器中水平和垂直方向居中的两种方式

一,定位&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Document&lt;/title&gt; &lt;style&gt; div{ width: 200px; height: 200px; background-colo

2018-11-30 11:29:13 1583 2

原创 自定义播放器

&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Title&lt;/title&gt; &lt;style&gt; * { -webkit-u

2018-11-28 22:39:08 236

原创 JS制作一个倒计时

页面&amp;lt;div id=&quot;box1&quot;&amp;gt; &amp;lt;div id=&quot;box2&quot;&amp;gt;&amp;lt;/div&amp;gt; &amp;lt;div id=&quot;box5&quot;&amp;gt;:&amp;lt;/div&amp;gt; &am

2018-11-22 21:42:51 531

原创 微信小程序开发一个简单的摇骰子游戏

页面代码&lt;view class='top'&gt;{{txt}}&lt;/view&gt;&lt;view class='point1'&gt; &lt;image src='{{one_img}}'&gt;&lt;/image&gt;&lt;/view&gt;&lt;view class='point2'&gt; &lt;image src='{{two_img}}'&

2018-11-16 19:26:22 13612

原创 requestFullScreen元素全屏显示

&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html lang=&quot;en&quot;&amp;gt;&amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;lt;title&amp;gt;Title&amp;lt;/title&

2018-11-15 17:35:00 1247

原创 用微信小程序写一个计算器

下面是用微信小程序写的一个简单的计算器,又兴趣的小伙伴可以了解一下。页面部分&amp;amp;lt;view class='box'&amp;amp;gt; &amp;amp;lt;view class='txt'&amp;amp;gt;{{screenNum}}&amp;amp;lt;/view&amp;amp;gt; &amp;amp;lt;view capture-bind:touchstart=&amp;

2018-11-14 21:27:45 13480 10

原创 Linux链接命令

硬链接特征:1、拥有相同的i节点和存储block块2、可通过i节点识别3、在任意文件上修改另一个文件也会相对应的改动4、不能夸分区 不能针对目录使用软链接特征(推荐):1、类似于windows快捷方式2、软链接拥有自己的i节点和block块,但是数据块中储存的是文件的文件名和节点号,并没有实际的文件数据3、修改任意一个另一个都改变4、删除原文件,软链接不能用5、创建软链接时一定...

2018-11-11 16:39:46 313

原创 web常见攻击方式与防范

1.SQL注入攻击(SQL Injection)攻击者把SQL命令插入到Web表单的输入域或页面请求的字符串,欺骗服务器执行恶意的SQL命令。在某些表单中,用户输入的内容直接用来构造(或者影响)动态SQL命令,或作为存储过程的输入参数,这类表单特别容易受到SQL注入式攻击。常见的SQL注入式攻击过程类如:(1)某个Web应用有一个登录页面,这个登录页面控制着用户是否有权访问应用,它要求用户输入...

2018-11-07 19:22:53 505

原创 如何用鼠标点击页面中的任意标签,弹出该标签的名称.

话不多说,看代码&lt;!DOCTYPE&gt; &lt;html&gt; &lt;head&gt;&lt;meta charset="UTF-8"&gt;&lt;title&gt;鼠标点击页面中的任意标签,alert该标签的名称&lt;/title&gt; &lt;style&gt; .box{ height: 100px; background:red;

2018-10-26 20:33:19 1271

原创 前端页面的优化问题

html1.减少 HTTP 请求2.减少 DOM 元素数量3.使得 Ajax 可缓存css1.把 CSS 放到代码页上端2.从页面中剥离 JavaScript 与 CSS3.精简 JavaScript 与 CSSjavascript1.脚本放到 HTML 代码页底部2. 从页面中剥离 JavaScript 与 CSS3. 精简 JavaScript 与 CSS4. 移除重复...

2018-10-23 22:37:19 739

原创 面试中的闭包问题

闭包就是函数嵌套函数,函数内部可以访问外部的变量,函数内部如果访问外部的变量,则外部的变量不会被垃圾回收机制所回收。我们来看两个小例子 var arr=[]; for(var i=0;i&amp;lt;5;i++){ //数组里面push一个函数 arr.push(function(){ console.log(i) //拿到的是全局...

2018-10-23 22:16:33 294

原创 简单的几种数组去重方法

&lt;script type="text/javascript"&gt; var arr=[1,2,3,4,5,1,2,3]; var newarr=[ ] ;//定义一个空数组 for(var i=0;i&lt;arr.length;i++){ if(newarr.indexOf(arr[i])==-1){ //判断空数组中是否存在,不...

2018-10-23 20:23:52 209

原创 React生命周期钩子

通过一个简单的实例来了解一下先来看一下这个生命周期图示下面是代码块,引入的JS文件可以自行去官网上下载&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content="w

2018-10-19 15:41:02 309

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除