- 博客(78)
- 收藏
- 关注
RSS订阅原创 多级下拉框的实现
var DataList = [];/* 后端传回的下拉框数据放在这里 */var isopen = [];/* 用来存放下拉框的展开或者是收缩状态 *//* lessSonImg方法是在初始化的时候调用，目的是把所有的子数据收起 */lessSonImg = function () { for (var i = 0; i < DataList.length; i++) {...
2020-05-05 10:07:55
760
原创 文字走马灯效果的实现
核心思路是通过用margin-left这个属性来控制div的定位，通过不断提高margin-left的值来实现走马灯的效果。下面是JS的代码 var marginleft = $('#demo').css('marginLeft'); marginleft = marginleft.toString(); marginleft = marginleft.substring(0, ...
2020-04-15 10:15:04
1095
原创 antd的异步加载树组件使用
import { TreeSelect } from 'antd';class Demo extends React.Component { state = { value: undefined, treeData: [ { id: 1, pId: 0, value: '1', title: 'Expand to load' }, { id: 2, ...
2020-03-14 10:37:50
6083
原创 利用github和hexo搭建个人的博客
一.下载git1.git的网址https://git-scm.com/2.我的是windows版，打开页面点击红框中的Download XXX for Windows，点开后会自动跳转页面并弹出下载框，没有弹出的可以等一会或者是刷新重试。3.下载完成后开始准备安装git基本上安装步骤就这几个，有可能随着安装版本的不同会多...
2020-02-06 10:59:17
149
原创 JS导出文件的方式
### 第一种是新开一个网页下载window.open(filepath);### 第二种是在当前网页下载window.location.href = filepath;
2020-01-19 14:53:19
808
原创 CSS的一些小总结
CSS的一些小总结在实现当删除某个div块后，后续的div块能自动补位时，可以不用JS的效果，直接把div设置成float属性，利用浮动的特性来完成这样效果。在设置浮动时，如果div里还需要一个通过弹性布局完成的效果，那就再加一个，反而能节省很多代码量，效果也更好。...
2019-12-28 11:47:03
106
原创 jQuery实现判断文本行数
现在有一个项目，需要我去判断一个div中的文本有几行。如果超过两行则省略并显示省略号，同时会弹出一个显示全部按钮，点击按钮加载全部文本。多行省略的话用CSS就可以实现了。以下是超过两行省略的CSS代码，即：.webkit2 { display: -webkit-box; overflow: hidden; text-overflow: ellipsis; ...
2019-11-26 11:40:15
2407
1
原创 React中的this为什么需要bind()来绑定(初步认识)
为什么要用bind等方法来绑定this？- 这是因为在实际使用的过程中，我们肯定是希望this指向的是触发dom事件的对象，但是由于组件本身是有一个渲染的过程的，实例函数都是由构造函数不断重新构造渲染的，所以就算一开始this指向的是触发时间的实例函数，但是在重新渲染的时候由于需要重新走一下构造函数，所以this所指的对象就会改变(应该是变为构造函数，或者是windows(也就是全局))所以我...
2019-11-19 09:29:14
924
原创 React组件的生命周期(粗略)
Mountingconstructor()componentWillMount()render()componentDidMount()UpdatingcomponentWillReceiveProps()shouldComponentUpdate()componentWillUpdate()render()componentDidUpdate()Unmounting...
2019-11-15 09:40:37
113
原创 ES6中的箭头函数部分总结(This)
箭头函数箭头函数中的This箭头函数中的this是确定好目标的(ES5中的this是谁调用，指向谁)，即ES6中的this是定义的时候就已经确定好的。箭头函数中的This总是指向其父级上下文环境(也就是父级的环境)。箭头函数是不可以用new的，也就是不能作为构造函数(因为箭头函数里根本就没有this)。同时也是无法使arguments参数(想使用可以用rest参数来代替)。个人理解：普...
2019-11-08 17:30:50
263
原创 React的一些理解(部分)
React-CSDN在元素集合中要用一个标签把所有的标签都包裹起来(通常用< div >…< /div >)。如果要给一个标签元素添加一个自定义属性的话用data-(XX)前缀,前缀可以自己起，data-是一定要的。jsx中可以使用js在React中使用css样式的话不要写class，用className，因为在es6中class是一个保留字，还有一个就是for要...
2019-11-04 19:47:08
177
原创 jquery实现类似微信输入框的输入聊天框
最近在切一张聊天页面的时候需要实现一个类似于像微信一样的聊天输入框，即输入框的高度会随着内容的增加不断增高。综合了一下网上的思路目前有依靠keyup来判断的，但是这种方法在遇到一次性输入大量文本的时候好像有点问题，而且在遇到删除文字时好像也有点问题。还有一种是依靠定时器来解决。当用户的焦点在输入框的时候隔一段时间就检查输入框里文本的实际高度，一旦实际高度大于输入框的高度，即把输入框的高度调成与...
2019-10-22 17:26:56
1242
原创 用juqery实现的简单轮播图
这几天一直有需要用到轮播图的需求。之前也没写过，索性自己写一个自己的轮播图轮子。目前是实现了自动轮播，按左右箭头和序列点可以左右跳转和固定跳转图片。感觉目前也没什么很缺的功能了，轮播图的要求大部分也就以上三点。我的轮播图的实现思路是通过图片的显示隐藏配合图片的变换动画，我还有看到是通过调整图片条的显示范围来达到轮播图的效果和通过层级显示来达到相同效果的。以下是代码：<!...
2019-10-22 10:40:33
165
原创 frame和iframe
frame和iframe的区别frame的作用是设置一个框架页面，即在打开的页面里都是frame的内容。而iframe的作用是设置一个行内框架，即打开的页面里部分是iframe。这个部分的具体大小由自己决定。frame和iframe的使用差别frame需要放在frameSet中配套私用，而iframe不需要。frame不能放在body中，iframe可以如果iframe嵌套在...
2019-09-28 17:51:23
299
原创 用JS实现的猜数字游戏
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script defer type="text/javascript" src="JS/jquery-3.4.1.min.js...
2019-09-25 14:02:01
936
1
原创 JavaScript标签中的sync和defer
JavaScript中的sync和defer都是异步加载的属性，使得加载JS时不会阻碍H5元素的加载，那么两者的区别在哪呢？defer的加载是按顺序顺序的，即一个JS2号文件异步加载好后，只要你前面的JS1号文件没有加载好，那么JS2号也会等一号JS文件加载好后在开始加载。而sync的异步加载是谁先好了谁先上。所以在实际运用中，当各个JS包互相依赖时，不要使用sync，毕竟你没法确定当你的一...
2019-09-25 10:03:30
978
原创 HTTP的三次握手和四次挥手
三次握手和四次挥手我尝试用简单的话来解释三次握手和四次挥手，因为我也刚刚开始学，如有错误欢迎指正。通俗版的解释1.1三次握手客服端向服务器发送请求服务端收到请求，同意发送客户端收到了服务端的答复，并表示知道了。1.2四次挥手客户端表示我想要关闭连接了服务器表示知道了(但是这时候还没有关闭，因为可能服务端的信息还没传完)。服务器表示我已经关闭了(这时候确认信息传完了)。客...
2019-09-24 09:40:12
188
原创 AJAX的使用
AJAX1.AJAX是什么Ajax的全称是Asynchronous JavaScript and XML,中文定义为”异步JavaScript和XML”，Web2.0技术的核心。由多种技术组合而成。使用Ajax技术不必刷新整个页面，只需对页面的局部进行更新，可以节省网络带宽，提高网页加载速度，从而缩短用户等待时间，改善用户体验。个人的感觉AJAX就是一个用来的交换获取/传输数据的JS方法...
2019-09-18 14:52:36
123
原创 CSS中的:first-child、nth-child()与nth-of-type()
今天运用到了first-child与nth-child()，发现怎么也用不对，重新查了下发现自己对这两个伪类的理解有错误，就重新开个帖子。first-child先来段代码:H5:<div> <h2>2</h2> <p>XX</p> <p>XXX</p> <p>XXXX</p>...
2019-09-15 11:00:15
381
原创 JS中For循环中嵌套setTimeout()方法的执行顺序
今天突然想到了之前看过一个在For循环中执行setTimeOut()方法的代码，那时候对输出的结果不是很理解。今天就来详细的记录下。先贴一段简单的代码：function time() { for(var i= 0;i<5;i++){ setTimeout(function () { console.log(i...
2019-09-12 11:27:37
3616
原创 jQuer的一些方法
jQuery这是为了防止文档在完全加载（就绪）之前运行 jQuery 代码，即在 DOM 加载完成后才可以对 DOM 进行操作。$(document).ready(function(){ 代码内容...});简写版本:$(function(){ 代码内容...});事件方法语句(以点击为例)$('.button').click(function(){ 代码内容......
2019-09-10 14:52:53
238
原创 变量提升和函数声明提升
变量提升和函数声明提升之前一直在看变量提升和函数声明提升的讲解。看了很多但是实际操作中感觉掌握的还是不太好，索性整理一下1.变量提升变量提升的作用域是整个函数，var声明的函数会被提升到所在作用域的最顶端。意思就是说函数中的所有地方都是变量提升的范围，但是只会提升到所在作用域的顶端。function f (){ console.log(y)//undefined var y =...
2019-09-07 10:37:06
444
1
原创 CSS实现超出一定行数后省略文字并显示点点点
单行省略： width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; 多行后省略的情况： width:100% overflow : hidden;//超出的部分隐藏 text-overflow: ellipsis;//...
2019-09-07 09:43:40
656
原创 2.JS中的命名规范
JS中的命名规范1.严格区分大小写2.使用数字、字母、下划线、美元符(其中不能以数字开头)一般用$开头的变量都代表的是用Jquery获取的变量。以_开头的一般代表的是公共变量3.使用驼峰命名法即首字母小写，其余有意义的单词首字母大写，命名尽可能的语义化。(即小驼峰)常用的缩写add(增加)/insert(插入)/create/new(创建)/update(更新)/d...
2019-09-05 22:04:16
121
原创 1.创建变量的几种方式
创建变量的几种方式ES3中创建变量是用1.var a =10;而在ES6中是用2.let a=10;3.const c =10;用const创建的变量是不可修改的，一般是用来声明π这样不变的。即可以理解成是常量。 创建函数也相当于是一个变量。4.function fn（）{ xxx}ES6中创建类也相当于是一个变量5.class a{ xxx}ES6...
2019-09-05 22:03:48
1404
原创 5.数据类型的检测
数据类型的检测检测数据类型的方式有四种：typeof [val]: 用来检测数据类型的运算符instanceof :用来检测当前实例是否率属于某个类constructor :基于构造函数检测数据类型(也是基于类的方式)object.prototype.toString.call(): 检测数据类型最好的办法其中最完美的是object.prototype.toString.call...
2019-09-05 22:03:11
213
原创 4.内存存储
内存存储第一种是普通的简单类型。分为三步。第一步是先创建变量存储空间第二部是创建值储存空间第三部是将两个关联。leta = 12;letb = a;b = 13;console.log(a); =>12第二种是复杂的类型。这时候会先创建一个堆内存，然后将堆内存的地址放到值存储空间里。letn = {name: '南宁'};let m = n;m.na...
2019-09-05 22:02:33
142
原创 3. JS中常用的数据类型
基本数据类型数字Number 常规数字和NaN字符串String 所有用单引号，双引号，反引号(反引字符串)包起来的布尔Boolean True/False空对象指针Null未定义undefined引用数据类型对象数据类型 object{} 普通对象[] 数组对象/1?[1-9]$/ 正则表达式Math 数学函数对象Data...
2019-09-05 21:59:26
206
原创 响应式布局的一些总结
由于我刚刚接触响应式布局，所以这些总结很水，熟手就没必要看了。1.宽度一部分都是用百分比来解决。内部的一些小框架可以用rem来解决。2.响应式布局百分比一定要确定好。最好是10PX的整数倍。3.目前来看公司的响应式布局都是用比例来解决的，CSS代码只有一套，而我在网上看到的似乎是有多套CSS代码(多套的是自适应布局)。4.在宽度为百分比显示的块中，不要使用position来定位，因...
2019-09-04 11:13:25
194
原创 用Jquey实现双击图片放大和触摸放大的功能。
最近有个新的需求，就是双击图片会显示原图。个人的思路是先让图片按百分比显示，在通过jquery 的dblcliock()方法来实现双击触发的思路。这个是H5的代码：<div class="body-div1"> <img id="dbutton" class="photo" src="shuangjifangda.jpg" alt=""> ...
2019-08-27 12:03:29
2296
原创 JS的延迟加载
今天写一个很简单的JS代码的时候遇到一个问题，就是第一次获取H5里的class数目永远都是为0，找了很久后来发现的JS的加载顺序问题。因为很多时候都是把JS文件放在head里，这时JS的加载就会先于H5的内容，所以在加载时JS查找class的数目当然就为0。知道了问题出在哪就好解决了，只要把JS的链接放在H5的</bady>前就可以，这样网页就是先加载H5内容在加载JS代码。...
2019-08-16 15:32:29
135
原创 在输入框加入搜索图标的问题
最近遇到了一个需要在搜索框内加入一个放大镜图标的需求，就像是这样。这个本来是挺好解决的一个问题，只要在搜索框内加两句background-image: url('../Imgry/fangdajing.png');background-repeat:no-repeat;/*图标是否重复*/就可以了。都是现在的问题是图标并不是在边缘(网上搜索了下大部分都是在最左或者最右)，所以必...
2019-08-13 09:50:50
3270
原创 inline-block的上下排列对齐问题
今天使用inline-block想在一个div里上下排列两个p元素，都是怎么排都不对。如图：具体的H5代码：<div class="modify-rank-install"> <ul> <li class="modify-rank-install-big"><div><p>KKKKKK</p...
2019-08-10 18:09:06
2118
原创 position布局
position也是flex的其中一种。position的属性有absolute，relative,fixed,static,sticky,inherit,initial。其中主要用到的就是前四个。1.static就是默认值，没有采取定位。2.absolute会将元素脱离文本流，同时相对于父元素进行定位。3.relative会保留其文本位置，同时相对于原本的位置进行定位。4...
2019-08-10 15:26:49
311
原创 inline-block布局
最近在看一个H5网页怎么用inline-block来调整布局。因为在工作中公司不提倡使用position来定位。所以最近看了flex的弹性布局，float浮动和今天的inline-block内联块元素。一般来说用到inline-block都会想到inline和block。所以就说说这两的特点。inline的特点:1.能使元素变成行内元素。让元素可以在一行里并排，不会换行。2.不能更...
2019-08-10 14:40:29
399
原创 自适应状态下图片的缩放问题
今天遇到了一个问题，就是在制作自适应网页时DIV中的图片无法做到同div一同缩放。后来发现以下代码可以解决。这个是H5的代码<div class="badyOneBlock1Photo"> <img src="Imagry/photo.png" alt="" class="badyOneBlock1Photo1"></div>CSS代码：...
2019-08-08 15:40:06
1024
原创 Flex布局
之前一直都是使用position来定位块的位置。现在新学了一个比较主流的flex来定位块的位置。感觉确实比之前的好多了。现在总结下大概的用法。flex是把一个div分成主轴和交叉轴，其中主轴方向的定位有三个。1.flex-direction：这个是决定主轴的方向。row(从左到右)|row-revers(从右到左)|column(从上到下)|column-revers(从下到上)...
2019-08-07 15:02:31
4125
原创 Jquery
之前一直在想着要怎么才能使用Jquery，似懂非懂。昨天临时需要做一个div滑出的效果，尝试用Js写了一下，真的是要累死人。后来想起来Jquery也有类似的效果，只要七八行就完成了，瞬间秒懂了为啥都在说Jquery好用。具体是用是先去Jquery官网(https://jquery.com/download/)下一个文件，文件很小，放心下。下完放到自己前端的文件里，然后就可以舒舒服服的用Jq...
2019-08-06 16:45:00
163
原创 个人博客毕业设计设计总结
用个人博客来做毕业设计是我很久以来就有的想法，原先最初的想法的为班级做一个类似于贴吧一样的使用平台。因为营长已经给班级做了一个班级网页。如果我在做一个类似相符合的贴吧或者博客平台，也能为接下来的班里的学弟学妹提供一个更加私密的交流空间。但是事与愿违，由于大一大二都一心放在ACM的训练里，会的只有C与C++。JAVA、PHP、Pythone、html5虽然都有接触过，但是由于接触太短，只能读懂代...
2019-05-25 16:35:56
9973
2
原创 后端留着自己看
@RequestMapping("/kkk")@ResponseBodypublic String kkk(String schoolid, String sjh, Login login){ System.out.printf(schoolid); System.out.printf(sjh); Student studentList = studentMapp...
2018-09-27 10:05:00
103
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人