- 博客(52)
- 资源 (5)
- 收藏
- 关注
原创 谷歌浏览器devtools调试javascript代码方法
文章目录Chrome渲染分析之Rendering工具使用Chrome设置断点的各种姿势, js断点调试心得, Chrome DevTools 中调试 JavaScript 入门在 Chrome DevTools 中调试 JavaScript 入门
2020-07-31 21:03:10 377
原创 前端常用框架UI组件
文章目录移动端UI组件pc后台UI框架pc端开发PC和移动端常用轮播或滑动组件mescroll上拉刷新,下拉加载框架移动端UI组件mint-uivantpc后台UI框架elementbootstrapeasyUILuLu UI框架EasyUI是一个UI框架,所以它的功能就是用于处理页面的展示效果的。通常用于完成后台管理系统的页面排版。pc端开发elementUI + vue.jsPC和移动端常用轮播或滑动组件1.SuperSlide(PC)/Tou
2020-07-30 17:22:01 1617
原创 css中的 +,~, >
文章目录css中的选择器~(波浪号)+(加号)\>(大于号)css中的选择器~(波浪号)p~ul选择器 p之后出现的所有ul。两种元素必须拥有相同的父元素,但是 ul不必直接紧随 p。P~ul { background-color: pink; }<p>快乐生活</p> <ul> <li>生活</li> <li>生活</li> &
2020-07-30 11:23:52 10462 2
原创 为每一个 v-for循环出来的添加点击事件思路
文章目录思路首先在data中写入对象数组,并且写个可以if判断的标志如下图upFlag是个标志,action也是个标志当action: 0是一个状态,action:1是另一个状态当状态改变时发生什么事件,例如改变背景色,切换显示不同的div,切换背景图片,改变背景颜色是:class不同的样式,显示不同的div是用v-if判断是true还是false来进行展示,换背景图片与切换显示一样无非就是切换显示不同的img,切换不同的背景颜色一般用到的是3元表达式,当标志为1或者为0时绑定不同
2020-07-30 10:33:44 1991
原创 $router 和 $route的区别
文章目录先说用法$router想要导航到不同url,则使用router.push方法// this.$router.push()// this.$router.replace()// this.$router.go()$route获取name、path、query、params等用$route参考$router 和 $route
2020-07-30 08:40:33 143
原创 视图内容显示不全,没有出现滚动条
错误描述如下图内容没有显示完全,没有出现滚动条解决方法加个div高度拉开整体的高度,出现滚动条<div style="height: 73px;"></div>
2020-07-30 08:32:46 450
原创 给v-for中每个item添加点击事件报错没效果
文章目录搜索到@click失效的搜索到忘加s就是methods写错了最终的解决方法是场景给v-for中的每个item添加点击事件错误描述每个item渲染出来了,但是只有刷新后点击其中一个有效果且只能点击一次,其他都没有效果其中一个报错Invalid handler for event “click”: got undefined (found in )另一个Error in nextTick: "TypeError: Cannot read property '_wrapper'
2020-07-29 20:46:47 1132
原创 css使用clac()垂直居中
文章目录一个项目中老出现clac()不知道怎么用其中一个用法是垂直居中后面的20px是你要居中盒子的高度和宽度//实现水平垂直居中 position: absolute; top: calc(50% - 20px); left: calc(50% - 20px);...
2020-07-29 17:54:37 611 1
原创 JavaScript中if真假的判断
文章目录1.定义的变量但未赋值在if中认为是假2.赋值为空字符串在if中认为是假3. 只要有字符,即使是"空格字符"if判断也为真。4. 赋值为0或者0.0在if中则为假,其他数值认为是真5. js中的特殊值null,undefined,都是假6. 已定义的函数,根据调用方式又分为两种6.1 不带括号的,如果定义了就是真,没有定义会报错6. 2带括号的,其实相当于调用函数,自然是根据函数的返回值判断真假7. 已定义的对象,未赋值时在if中则为假,赋值后是真。8. 已定义的对象的属性字段,和单独的变量是一样的
2020-07-29 15:19:16 2351 1
原创 js常用的计数器方法setInterval()、clearInterval()、setTimeout()和clearTimeout()
setInterval()window.setInterval()方法,周期性地调用一个函数(function)或者执行一段代码。例子setInterval(function(){ console.log("log")},1000)clearInterval()window.clearInterval() 取消掉用setInterval设置的重复执行动作.例子var pageTimer = {} ; //定义计算器全局变量//赋值模拟pageTimer["timer1"].
2020-07-29 14:39:37 279
原创 css--nth-child选择器
文章目录nth-child 的定义是: 选择器匹配父元素中的第 n 个子元素,元素类型没有限制。n 可以是一个数字,一个关键字,或者一个公式。这里首先知道,前面是一个选择器,如果选择到一个节点,然后会去找他的父级容器。然后再找到这个父级元素的指定元素。<body><!--<h1>这是一个标题</h1>--><p>这是第一个段落。</p><p>这是第二个段落。</p><p>这是第三
2020-07-29 11:25:28 238
原创 vue之router路由最优美写法,懒加载、打包代码分离。
https://blog.csdn.net/qq_42690547/article/details/88316897
2020-07-29 09:51:57 206
原创 vue--常用插件安装
文章目录安装vue-cookies安装axios安装Vant安装vue-cookiesnpm install vue-cookies --savemain.js中引用// requirevar Vue = require('vue')Vue.use(require('vue-cookies'))// es2015 moduleimport Vue from 'Vue'import VueCookies from 'vue-cookies'Vue.use(VueCookies)安装
2020-07-29 09:50:39 212
原创 Webkit内核的浏览器
文章目录Webkit是一个开源的浏览器引擎,与之相对应的引擎有Gecko(Mozilla Firefox 等使用)和Trident(IE 使用)。Google Chrome 谷歌浏览器Safari浏览器搜狗高速浏览器遨游浏览器3QQ浏览器360极速浏览器世界之窗浏览器阿里云浏览器WebKit是一个开源的项目。...
2020-07-29 08:34:31 945
原创 媒体查询,常用设备尺寸
pc端全屏@media screen and (min-width:1200px){ #shishi { height: 200px; width: 200px; background: #000; } }手机端/*phone<768 小屏,字体黑色,背景蓝色*/ @media s
2020-07-28 20:52:16 832
原创 css3-calc()方法
文章目录calc()语法calc()的运算规则浏览器的兼容性应用解决盒子撑破calc()用于自适应布局calc()语法calc()语法非常简单,就像我们小时候学加 (+)、减(-)、乘(*)、除(/)一样,使用数学表达式来表示:.elm { width: calc(expression);}其中"expression"是一个表达式,用来计算长度的表达式。calc()的运算规则calc()使用通用的数学运算规则,但是也提供更智能的功能:使用“+”、“-”、“*” 和 “/”四
2020-07-28 17:07:24 120
原创 vue-elementUI后台管理容器的写法实例--2
文章目录模版中引用<!-- 这是后台管理容器 --> <el-container style="height: 100%"> <el-aside width="auto"> <common-aside></common-aside> </el-aside> <el-container> <el-header> <common-heade
2020-07-28 10:23:15 132
原创 vue-elementUi后台管理侧边栏的写法实例--1
文章目录vue-elementUi后台管理侧边栏的写法实例vue-elementUi后台管理侧边栏的写法实例循环遍历没有二级菜单的<el-menu-item :index="item.path" v-for="item in noChildren" :key="item.path" @click="clickMenu(item)"> <i :class="'el-icon-' + item.icon"></i> <span slot="
2020-07-28 10:21:31 1084
原创 git push遇到错误: [rejected]master -> master (non-fast-forward)的解决方法
向远程仓库推送时遇到! [rejected] master -> master (non-fast-forward)”可能的原因:要推送的文件里与远程仓库里的文件有冲突,就是有相同文件名的文件;解决方法:git pull origin master --allow-unrelated-histories //把远程仓库和本地同步,消除差异git add .git commit -m '***'git push origin master...
2020-07-28 10:13:43 383
原创 vuex--action的使用
文章目录方法1方法2导入法场景用action,一般是异步调用,延迟调用一个方法方法1使用方法在调用的组件中使用例如methods : {handle() {this.$store.dispatch('addNAsync',5)}}在store.js中的actions中写actions: {addNAsync{context,step) {setTimeout({}=> {context.commit('addN', step)},1000)}方法2导入法在要
2020-07-27 20:41:19 176
原创 vuex--state的使用
文章目录方法1直接调用方法2导入法方法1直接调用在store.js中state中写例如state:{count: 0}在组件中调用用{{}}方法调用例如{{$store.state.count}}方法2导入法在store.js中state中写例如state:{count: 0}在调用的组件中使用首先导入import { mapState } from 'vuex'然后再computed: {...mapState(['count'])}...
2020-07-27 20:25:13 141
原创 vuex--mutation的两种调用方式
文章目录方法1方法2方法1在store.js的mutations中写函数例如mutations: { addN(state,step) {state.count += step}}在用到vuex的组件中调用在methods中写例如methods: {handle2() {this.$store.commit('addN',3)}}方法2在store.js的mutations中写函数例如mutations: { addN(state,step) {
2020-07-27 20:15:58 2543
原创 vue--博客收藏
文章目录Vue + Element-ui实现后台管理系统(2)—项目搭建 + ⾸⻚布局实现前端随笔https://www.cnblogs.com/qdhxhz/category/1589959.html
2020-07-27 20:04:21 83
原创 vue-elementUI侧边栏点击显示不同内容
文章目录步骤1.在侧边栏开启路由模式`:router = "true"`,设置子选项的`name`步骤2.新建组件和设置路由场景当我点击后台管理页面的侧边栏有关选项时,右边的main显示不同的内容算是一个总结吧,之前一直迷糊不知道怎么写步骤1.在侧边栏开启路由模式:router = "true",设置子选项的name<el-submenu index="1"> <template slot="title"><i class="el-icon-me
2020-07-27 14:35:03 3517 1
原创 flexible.js-移动端H5页面适配应用
文章目录flexible.js仓库vscode插件 px转rem插件 cssrem步骤1. 下载flexible.js步骤2.页面引入步骤3.把视觉稿中的px转换成rem前端页面适配有两大方向:一是布局适配,可以使PC、手机、平板共用一份代码,实现方法有css 媒体查询、css 弹性盒子布局、 css grid布局等。二是高清适配,面对的是移动开发中设备不同分辨率和不同尺寸,最大限度还原设计稿效果。flexible.js是高清适配的一种方法,它通过javascript根据不同设备的dpr值和设备宽度
2020-07-25 17:02:39 560
原创 vue--设置导航守卫
场景如果用户知道后台url地址但是没有登录,想通过url访问管理页面,直接跳转到登录界面,限制他的权限设置全局前置守卫下面代码实现的功能,当是到/login的页面或者是来自/login的页面不进行拦截放行,其它种情况都进行拦截提示并跳转到登录界面。可以直接复制使用,这样想通过url访问后台管理不登陆就会进行拦截router.beforeEach((to, from, next) => { //from是来的页面,to是去的页面,next是权限控制 console.log(fr
2020-07-24 08:56:17 175
原创 vue-简化登录请求代码async&await
async handleLogin() {const res = await this.$http.post('login',this.formdata)const {data,meta: {msg,status }} = res.dataif (status === 200 {} else {}
2020-07-23 11:33:41 959
原创 jQuery为相同id的标签添加相同的事件
文章目录场景例如:写了一个通用的顶部返回栏好几个页面公用,无论点击那个页面,都能返回上一个页面当为同一个标签添加相同id相同事件时只有第一个生效解决如下jQuery$(function(){ $("[id = delete]").click(function(){ alert("hi"); }); });id为你写的id选择具有相同 CSS class的元素,就要用class 选择器。建议用class选择器html页面确实不应该有相同id的元素,还是用class合
2020-07-23 09:13:42 1248 1
原创 css常用的水平居中
文章目录css常用的水平居中1. `margin: 0 auto;`法(居中元素为块级元素)2. 居中元素为行内元素(`text-align:center` )3. 块级元素宽度不确定,(`display:inline-block 改变模型`)4. 利用定位实现水平居中(已知宽度)5. 利用`absolute`定位,`translate` 实现水平居中(未知宽度)6. flex 布局实现css常用的水平居中1. margin: 0 auto;法(居中元素为块级元素)没有设置宽度的话,会独占一行2
2020-07-22 18:04:02 266
原创 css常用的垂直居中
文章目录css常用的垂直居中1.父相子绝--给定子盒子的尺寸(`margin`)2.父相子绝--可以不给定子盒子的尺寸(`transform` )3.父相子绝--(`margin: auto`)4. 父元素使用(`padding`)5. 父盒子使用flex布局6.单行文本居中7. 图片居中8. 对容器里的文字进行垂直居中css常用的垂直居中这里是引用1.父相子绝–给定子盒子的尺寸(margin)父盒子相对定位,子盒子绝对定位使用前提必须提前知道被居中块级元素的尺寸,否则无法准确实现垂直居中
2020-07-22 17:32:47 107
原创 前端css在线生成工具
应用场景例如 我想用一个带阴影的盒子,直接在网站输入对应的参数就可以生成直接复制就可以使用https://css3generator.com/在线测试html+css+js网站https://codepen.io/在线按钮生成网站https://css-tricks.com/examples/ButtonMaker/#背景渐变工具网站https://www.colorzilla.com/gradient-editor/边框阴影盒子阴影https://www.cssmatic.com.
2020-07-22 16:17:46 1433
原创 jQuery动态添加html标签
文章目录`$("p").append("Hello");`注意几点**步骤**给动态添加的标签添加事件如点击事件多个标签绑定同一个事件场景 调用后台返回的json数据解析之后,在前台动态渲染主要用的jQuery的$("p").append("<b>Hello</b>");方法里面可以添加你要显示的标签和解析的数据$(".contet-box4").append( "<div class='content content-self-1'>&
2020-07-21 17:08:16 1504
原创 jQuery选择器---3
文章目录选择器场景1. 模糊获取场景2. 获取多个class的值最近一直在用jQuery总结 一下吧选择器场景1. 模糊获取<span class="test-first"></span>jQuery选择器模糊获取模糊获取中间加个”,“,$('.test-fist,.test-two').click(function(){ console.log("试试") })场景2. 获取多个class的值<span class
2020-07-21 16:41:33 128
原创 jQuery+ajax+json---2
文章目录返回的常见json数据格式1. 对象格式2. 对象数组3. 数组对象ajax获取数据方法解析数据并输出到html返回的常见json数据格式1. 对象格式数据解析输出方式该json本身就是一个json对象,所以可以直接获取:var Id = json.id;var title = json.title;var start = json.start;var end = json.end;2. 对象数组数据解析输出方式$.each(json, function(i, it
2020-07-17 15:18:00 209
原创 Jquery tab切换栏实现
文章目录步骤1**css文件**步骤2 **js实现**完成的例子场景描述点击两个按钮切换显示不同按钮下的内容,如下图步骤1css文件一个显示一个隐藏.content div{ display: none; } .content .div_show{ display: block; }步骤2 js实现 $(document).ready(function() { $('ul li').click(fu
2020-07-17 13:45:30 175
原创 GET 和 POST 方法的区别
文章目录1、发送的数据数量2、安全性3、加入书签中4、编码5、可变大小6、缓存7、主要作用1、发送的数据数量在 GET 中,只能发送有限数量的数据,因为数据是在 URL 中发送的。在 POST 中,可以发送大量的数据,因为数据是在正文主体中发送的。2、安全性GET 方法发送的数据不受保护,因为数据在 URL 栏中公开,这增加了漏洞和黑客攻击的风险。POST 方法发送的数据是安全的,因为数据未在 URL 栏中公开,还可以在其中使用多种编码技术,这使其具有弹性。3、加入书签中GET 查询的结果可
2020-07-17 10:40:31 151
原创 jQuery点击改变背景颜色
文章目录场景描述当点击一个框时改变背景颜色新建样式.liantong { background-color: #ff7525 ;}添加js文件$(".phone").click(function () {//liantong是你的要改变的颜色 $(this).toggleClass("liantong"); });...
2020-07-16 19:36:04 2090
原创 jQuery点击切换图片
文章目录场景描述当点击一个盒子时显示已点击的标志 如下图// 点击图片打上对号 var toggle = true; $(".menu-click").click(function () { console.log("点击了") if (toggle) { $("#img-click").attr("src", "images/uncheck.png"); toggle = false; } else { $("#img-click").attr("src", "i
2020-07-16 19:21:30 527
原创 jQuery选择器&事件---2
文章目录常用的选择器事件**双击****鼠标指针穿过元素****鼠标指针离开元素****鼠标指针移动到元素上方,并按下鼠标按键****当在元素上松开鼠标按钮时****光标悬停****元素获得焦点**当元素失去焦点时常用的选择器事件单击$("p").click();双击$("p").dblclick(function(){ $(this).hide();});鼠标指针穿过元素$("#p1").mouseenter(function(){ alert('您的鼠标移到了 id=
2020-07-16 15:11:43 92
原创 jQuery样式操作---1
文章目录设置样式获取样式设置样式单个样式$(".div1").css("backgroundColor","red");多个样式$(".div1").css({"backgroundColor":"green","border":"1px solid red"});获取样式$("p").css("background-color");
2020-07-16 14:59:49 98
大学生创新创业计划书(精选篇)-pad版-40页
2024-05-19
蓝桥杯部分题目(含答案)-word版-21页
2024-05-19
上传智能车竞赛介绍之技术报告-word版61页
2024-05-19
ACM比赛经验分享之知识点详细文档非常详细
2024-05-19
SQL教程-word版28页
2024-05-19
JavaScript教程-ppt版-31页
2024-05-19
PHP & MySQL 初级教程-word版40页
2024-05-19
go语言教程学习ppt版31页
2024-05-19
delphi教程pdf版58页
2024-05-19
Rust语言教程之Rust程序逆向
2024-05-19
C#基础教程pdf版45页详细版
2024-05-19
Kotlin和Java混合开发入门教程
2024-05-19
(汇编语言教程)5-80868088汇编语言-2-pdf版总共61页
2024-05-19
Matlab教程(全),Matlab教程(全)
2024-05-19
51单片机开发流程入门(经典版)
2024-05-19
Translations: English|Chinese 开始吧 下载这篇教学 设定环境 前言 o编译 hello world
2024-05-19
目录: 1.Scratch 的简介 第1课 下载与安装 第2课 初识 Scratch 2.Scratch 基础课程 第3课 让角
2024-05-19
计算机实验报告4篇 计算机实验报告(1) xx大学校园网解决方案 一、需求分析 建设一个以办公自动化、计算机辅助教学、现代计算机
2024-05-19
华为od算法题 华为OD算法 1、什么是OD算法? OD算法(Optimized Disparity Algorithm),又称
2024-05-19
Swift 中文版教程 1简介 2Swift 入门3简单值4控制流5函数与闭包6对象与 类7枚举与结构1简介 Swift 是供
2024-05-19
Java基础案例教程Java基础案例教程
2024-05-19
超强、超详细Redis入门教程
2024-05-19
MySQL数据库应用实战教程
2024-05-19
R 语言 Slingshot 教程
2024-05-19
Unity3D游戏开发菜鸟快速上手指南
2024-05-19
深度学习实践教程《深度学习实践教程》的基本内容
2024-05-19
QT入门教程 吉林大学珠海学院计算机系 嵌入式系统实验室 ·.开发环境 ·Linux操作系统的版本有很多,目前市面比较著名的有F
2024-05-19
超详细的SpringBoot框架入门教程 Spring Boot框架快速入门教程以大量示例讲解了Spring Boot在各类情境
2024-05-19
520简单表白代码(JS) 这两天不知道咋了,迷迷糊糊的,突然知道今天是520的我,急急忙忙赶出个程序
2024-05-19
微信小程序开发教程比较详细
2024-05-16
计算机大类的学生课程实验
2024-05-16
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人