前端
zLanaDelRey
开心的逗比:)
展开
-
Vue项目打包后ELementUI图标字体失效
在使用npm run build命令对vue项目打包后,先是页面空白,解决之后,又出现了图片失效。解决办法修改build文件夹下的utils.js文件。找到generateLoaders函数,将'publicPath'修改为‘../../’就可以了。...原创 2019-11-13 19:25:50 · 1074 阅读 · 1 评论 -
Vue项目打包之后页面空白的具体原因及解决办法
本地运行时,页面还是正常的。但在使用npm run build对项目进行打包之后,index.html打开之后一片空白。解决办法修改config下的index.js文件。找到build将assetsPublicPath默认路径修改为'./'修改之后再运行npm run build之后就会正常显示了将路由模式history改成hash模式,改为mode: "hash"。路由默认配置为ha...原创 2019-11-13 19:14:35 · 1583 阅读 · 0 评论 -
使用node.js连接SqlSever并进行增删改查操作
前言最近上完数据库课程,最后的大实验要求连接数据库并对其进行操作。因为对java不是很熟练,所以就选择使用node.js。在之前没有怎么接触过node.js,在做实验的时候一边学习别人的博客,一边熟悉练习。经过几天时间,实现了这个简单的功能。连接SqlServer首先需要使用npm 安装SqlServer依赖npm install mssql然后建一个db.js文件,等会会在其他的文件...原创 2019-11-07 13:17:52 · 2577 阅读 · 4 评论 -
JavaScript-Array数组
Array类型ECMAScript数组的每一项可以保存任何类型的数据。可以用第一个位置可以保存字符串,用第二个位置可以保存数值,用第三个位置来保存对象。ECMAScript数组的大小是可以动态调整的,可以随着数据的添加自动增长以容纳新增数据。创建数组创建数组的基本方式有两种。第一种是使用Array构造函数,如:var colors = new Array();var colors = ...原创 2018-11-24 14:04:22 · 181 阅读 · 0 评论 -
JS与jQuery获取任意事件的子元素下标(获取当前类数组的某一子元素下标)
JavaScript方法 var child = document.getElementsByClassName("child"); for(var i=0;i<child.length;i++) { var a = child[i]; a.index=i; //给每个类名为child的元素添加index属性 ...原创 2018-12-02 15:56:11 · 3772 阅读 · 0 评论 -
针对不同屏幕大小加载不同的js代码
$(function(){ //判断屏幕宽度 var winWide = window.screen,width; //获取当前屏幕分辨率 alert("winWide"); var wideScreen = false; if(winWide <= 1024){ //1024及以下分辨率 //这里写要加载的代码 } else{ //大于1024的分辨率 //这里写要...原创 2019-01-05 16:55:14 · 2936 阅读 · 0 评论 -
固定列宽的简单瀑布流实现
在看JavaScript实战中看到瀑布流,决定记录下代码,以备不时之需。首先写一个HTML代码&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;title&gt;瀑布流&lt;/title&gt; &lt;link rel="stylesheet&a原创 2019-01-06 14:10:33 · 1106 阅读 · 0 评论 -
延迟加载图片(懒加载)
什么是延迟加载延迟加载又称懒加载(lazyload),是前端开发人员对网页性能优化的一种方案。延迟加载主要针对两种情况进行优化,一种是针对数据做延迟加载优化,一种是针对对象实例延迟创建优化。工作原理:在HTML构造输出的时候,先不要设置图片标签img的src属性,改用其他属性(如lazy);要判断图片(其他资源同理)是否在当前可视屏范围;根据第二条的判断把其他属性(如lazy)中保存的...原创 2019-01-06 14:40:07 · 849 阅读 · 0 评论 -
JQuery对象与DOM对象间的转换
JQuery对象转换成DOM对象JQuery对象是一个特殊的数组对象,即使只有一个元素,JQuery对象仍然是一个数组。之所以说其特殊,是因为实际上JQuery对象是包含一个数组对象和各种方法的类。而jQuery对象数组里保存的是DOM对象,因此可以通过索引的方式将jQuery对象转换成DOM队形。var $cr = $("#Name"); //获取jQuery对象$crvar cr...原创 2019-01-07 13:09:22 · 174 阅读 · 0 评论 -
Node.js-用6行代码创建Web服务器
var http = require('http'); //用require内置方法调用Node.js内置模块httphttp.createServer(function(req,res){ res.writeHead(200,{'Content-Type':'text/plain'}); //设置头信息 res.end...原创 2019-01-07 19:17:23 · 196 阅读 · 0 评论 -
人脸识别外包比赛-会议室管理平台(vue+ELement+Echats)项目总结
Vue+Element+Echats项目总结源码链接 =>原创 2019-04-02 11:39:24 · 2787 阅读 · 6 评论 -
ajax使用时前后端交互获取数据失败的问题所在及解决办法
主要针对于jQuery中ajax方法出现的问题提出的解决办法http 状态码为415出现这个状态码的原因在于后台不支持提交的content-type,这种时候一般都是在请求返回数据时,没有设置请求头造成的,我们只需要在ajax里面设置好请求头就能解决。 $.ajax({ url: "/api", type: "post", ...原创 2019-08-16 14:04:58 · 3838 阅读 · 0 评论 -
利用Vue+ElementUi实现评论功能-仿掘金
前言这两天在用vue重构之前写的一个社区博客项目,之前评论的样式和效果都差强人意,所以仿照掘金重写了一个评论功能(但不是完全照搬模仿)在写完这个功能后,由心觉得Vue真的非常好用。话不多说,先上效果图代码html代码:<template> <div> <div v-clickoutside="hideReplyBtn" @cli......原创 2019-09-18 21:13:24 · 29824 阅读 · 98 评论 -
使用Hexo搭建个人博客网站
网站的搭建之旅网站链接写在前面从去年看了一个学长的个人博客之后,就想写一个属于自己的博客网站,但是苦于自己只会前端,不会后端。没有后台管理的网站还叫网站么?后来了解到Hexo是基于本地文件自动生成html的一个网站搭建工具。想着用这个应该能满足自己的需要吧,就着手开始学习搭建了。搭建了一段时间,又因为没有自己满意的模板就搁置了。到了今年才又想起自己还有一个博客,所以花了几天时间把这项任务完成...原创 2019-10-08 20:23:40 · 218 阅读 · 2 评论 -
ajax加载数据导致js失效及解决办法
问题描述:用ajax从后端返回数据后,该div中的js失效分析:ajax是异步操作。ajax和js的文件是同时加载。ajax还未返回js文件中获取的id或class,js已经加载完毕。导致js失效。解决办法:将异步操作该为同步操作。是页面先加载ajax文件在加载js文件。这样就能获取到元素的id和class值了。$.ajax({ type:"get", ...原创 2018-10-13 15:55:03 · 5651 阅读 · 3 评论 -
项目实践经验总结-(1)
运用@media实现网页自适应@media screen and (min-width: 768px){ //&gt;=768的设备 }@media screen and (min-width: 992px){ //&gt;=992的设备 }@media screen and (min-width: 1200){ //&gt;=1200的设备 }注意下顺序,如果你把@media...原创 2018-09-11 13:21:24 · 836 阅读 · 0 评论 -
JavaScript-延时提示框
延时提示框<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><style>div{ float: left; margin: 10px; color:white;}#div1{ width: 50px;原创 2018-04-12 14:06:06 · 184 阅读 · 0 评论 -
JavaScript-空位补零
<script>function toDouble(n){ if(n<10) { return '0'+n; } else { return ' '+n; }}</script>原创 2018-04-12 10:53:26 · 336 阅读 · 0 评论 -
JavaScript-选择项中的全选、全不选、反选
代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> </style> <script> window.onload=function(){ var oBtn1=document.getElemen原创 2018-04-12 10:19:33 · 208 阅读 · 0 评论 -
JavaScript-表单检验
提示表单内容为必填内容<body> <form action=""> <label for="box">昵称:</label><input type="text" id="box" required/></br> <label for="psw">密码:</label><input type="password" id="psw" required /> <input原创 2018-04-10 15:11:33 · 232 阅读 · 0 评论 -
JavaScript-无缝滚动(offset)
无缝滚动用以网站图片横向自动滚动浏览<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> *{ margin: 0;padding: 0; } img{ height:16原创 2018-04-12 16:11:32 · 268 阅读 · 0 评论 -
JavaScript-DOM
DOM基础什么是DOM-DOM(文档对象模型-document)是针对HTML和XML文档的一个API(应用程序编程接口)。DOM描绘了一个层次化的节点树,允许开发人员添加、移除和修改页面的某一部分。浏览器支持情况-FireFox>Chorem>IEDOM节点子节点childNodes/IE6-8 /数组 注意:只算第一层的,不算标签内的标签文本节点:不包含在任何便签内 元素节点:包含在标签内的原创 2018-04-23 13:43:51 · 156 阅读 · 0 评论 -
JavaScript-运用正则表达式检验表单
<!DOCTYPE html><html> <head> <title></title> <meta charset="utf-8"/> <style> span{ display:none; color: red; } </style> </head>原创 2018-04-13 16:58:49 · 234 阅读 · 0 评论 -
JavaScript-运动基础
运动基础1.让div运动起来 2.速度——物体运动的快慢 3.运动中的bug 不会停止 速度取某些值会无法停止 到达位置后再点击还会运动 重复点击速度加快(clearInterval(timer))匀速运动速度不变运动框架及应用运动框架1.在开始运动时,关闭已有的定时器 2.把运动和停止隔开(if/else)<!DOCTYPE html><html l原创 2018-05-02 15:05:55 · 234 阅读 · 0 评论 -
JavaScript-JS运动
多物体运动框架多个物体同时运动例子:多个div,鼠标移入变宽 单个定时器,存在问题 每个div一个定时器<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <style> div{width: 100px; height:原创 2018-05-09 14:20:46 · 256 阅读 · 0 评论 -
JavaScript-DOM操作应用
创建、插入和删除元素创建DOM元素creatElement('标签元素')父级.appendChild(子节点)//添加到父级末尾插入元素父级.insertBefore(子节点,在谁之前)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <scri原创 2018-04-27 21:55:05 · 188 阅读 · 0 评论 -
JavaScript-DOM操作高级应用
表格应用获取 tBodies、tHead、tFoot、rows、cells隔行变色 鼠标移入高亮<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script> window.onload=function(){ var o原创 2018-04-28 20:05:10 · 263 阅读 · 0 评论 -
JavaScript-二叉树的建立
建立二叉树<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"&g原创 2018-08-26 11:25:12 · 266 阅读 · 0 评论 -
JavaScript-二叉树的前中后排序以及删除
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">原创 2018-08-26 17:12:29 · 245 阅读 · 0 评论 -
JavaScript-定时器
定时器启用定时器setInterval(函数名,时间) //无限次执行setTimeout(函数名,时间) //只执行一次停止定时器clearInterval(函数名,时间) clearTimeout(函数名,时间)注意:时间的单位是毫秒Date对象方法一:var 日期对象 = new Date();new是创建对象 方法二:var 日期对象 = new Date(日期原创 2018-04-11 15:59:43 · 225 阅读 · 1 评论