weixin_44817062的博客

原创 css笔记

HTML（Hyper Text Markup Language），称为超文本标记语言CSS(Cascading Style Sheets) ，通常称为CSS样式表或层叠样式表（级联样式表）css难点：盒子模型；浮动；定位；css书写规范：1、空格规范：（1）选择器 与 { 之间必须包含空格。（2）属性名 与之后的 : 之间不允许包含空格， : 与 属性值 之间必须包含空格。2、选择器规范：（1）并集选择器，每个选择器声明必须独占一行。（2）一般情况情况下，选择器的嵌套层级应不大于 3 级，

原创 闭包练习：闭包实现累加器+闭包实现增加删除信息

闭包练习：闭包实现累加器+闭包实现增加删除信息一、闭包实现累加器需求：每次调用counter（），都会在原有基础上+1 function add() { var count = 0; function demo() { count++; console.log(count); } return demo; } var counter = add(); counter(); counter(); count

原创 作用域和闭包图解

作用域和闭包原理图解一、作用域例题1：例题1图解：二、闭包例题2：例题2图解：

原创 jquery实现轮播图

jquery实现轮播图（带小圆点和左右箭头切换效果的）原理：定义索引，定时任务实现轮播切换，切换时同样需要切换小圆点的样式 var j = 0;//定义索引，图片和小圆点共用 var cusTimer;//定义定时函数 $('.cons-middle .cons-mid').eq(0).show().siblings().hide();//定义默认的显示图片，也就是索引为0的那张图片 cusStart();//开始实现图片轮播，用到了定时器

原创 el-input 按键绑定Enter方法、 .native 的含义与使用、vue锚点跳转、路由跳转下一页默认停留在顶部

el-input 按键绑定Enter方法、 .native 的含义与使用、vue锚点跳转、路由跳转下一页默认停留在顶部一、el-input 按键绑定Enter方法给enter键绑定@click="searchEntInfo()查询方法@keyup.enter.native="searchEntInfo" 二、@click.native中 .native 的含义与使用.native：侦听组件根元素上的原生事件作用： 给组件绑定原生事件@click是我们在vue开发中经常用到的事件绑定，而@实际

原创 关于赋值、js打开链接的方式、切割字符串、el-upload上传工具钩子函数、el-tabs使用在分页时注意

问题总结一、代码保持最新版，否则就是自己挖坑埋自己二、赋值时，判断返回数据是不是json串，是的话怎么处理，不是的话怎么处理返回数据类似这种的："\"https://static.xinchacha.com/jiamibao/3ee77d0f-7ebd-429a-b130-8fea047389a7.jpg?Expires=3204882106&OSSAccessKeyId=LTAI4GFjBCimq7VBgRQ5LKfq&Signature=DFgRbyBfnojc595zLsNDq

原创 VUE组件通信--bus兄弟传值、props父子传值、vuex数据公用

VUE组件通信–bus兄弟传值、props父子传值、vuex数据公用一、bus通常使用在兄弟与兄弟组件之间在组件中，使用emit on, off分别来分发，监听，取消监听事件这里的off分别来分发，监听，取消监听事件 这里的off分别来分发，监听，取消监听事件这里的off可以取消多次使用$bus监听的事件1、使用用法新建bus.js文件，引入vueimport Vue from 'vue'const bus = new Vue();// 使用 Event Busexport defau

原创 JS30-03---滑动条控制CSS效果（模糊，边框，背景颜色）、css变量

JS30-03—滑动条控制CSS效果（模糊，边框，背景颜色）一、CSS变量 /* 伪类选择器，--开头初始化css变量，使用时var(--base) 代替具体值*/ :root{ --spacing:0px; --blur:0px; --base: #ffc600 }二、CSS模糊效果img{ padding: var(--spacing); background-color: var(--base);

原创 浏览器状态码

浏览器状态码1xx：临时回应，表示客户端请继续。2xx：请求成功。​ 200：请求成功。3xx: 表示请求的目标有变化，希望客户端进一步处理。​ 301&302：永久性与临时性跳转。​ 304：跟客户端缓存没有更新。4xx：客户端请求错误。​ 403：无权限。​ 404：表示请求的页面不存在。​ 418：It’s a teapot. 这是一个彩蛋，来自 ietf 的一个愚人节玩笑。（超文本咖啡壶控制协议）5xx：服务端请求错误。​ 500：服务端错误。​

原创 Vuex简单梳理+使用步骤

Vuex简单梳理+使用步骤一、基础梳理使用情景（中大型单页面应用）多个视图依赖同一个状态来自不同视图的行为需要变更同一个状态1、状态：State——需要公用的数据调用方法：this.$store.state.name;或<script>import { mapState } from 'vuex'; // 从vuex中导入mapStateexport default { mounted() { console.log(this.name);

原创 媒体查询-背景图自适应

媒体查询-背景图自适应技巧：当某部分需要加图片时，最好将其作为背景图，比直接加在页面更便于操作一、页面组件<template> <div class="newEnter"> <div class="newEnter-box"> <div class="zhaobiao-img" @click="goZhaobiao()"> </div> <div class="qiye-img" @cli

原创 uniapp中网络请求的封装、普通页面跳转与Tab页面跳转携带数据

uniapp中网络请求的封装、普通页面跳转与Tab页面跳转携带数据一、uniapp中网络请求的封装1、新建一个MinRequest类，对uni.request进行简单封装，并添加拦截器import axios from 'axios'const config = Symbol('config')const isCompleteURL = Symbol('isCompleteURL')const requestBefore = Symbol('requestBefore')const reque

原创 el-upload 上传图片和文件并显示

el-upload 上传图片和文件并显示一、先看页面 //图片 <el-form-item label="营业执照图" prop="businessLicensePhotos" ref="zhizhao2"> <el-upload class="upload-demo" :action="imageurl"

原创 JS30-02时钟---JS选择器，样式更改，旋转效果，定时调用，时分秒角度计算

JS30-02时钟—JS选择器，样式更改，旋转效果，定时调用，时分秒角度计算一、JS选择器1、getElementsByClassName：取到的是一个数组，通过序号取到元素 const hand =document.getElementsByClassName('hand'); console.log(hand[0])；2、querySelector：取到的是对应元素 const hour = document.querySelector('.hour-hand');二、样式更改

原创 JS30-01:打击鼓---JS选择器、JS原生增加and移除class样式、事件监听、data-自定义属性、模板字符串、播放音频

JS30-01:打击鼓—JS选择器、JS原生增加and移除class样式、事件监听、data-自定义属性、模板字符串、播放音频一、JS选择器const key = document.querySelector(`div[data-key = "${e.keyCode}"]`);const keys=document.querySelectorAll('.key') 二、给元素增加、移除class样式的两种方法：1、元素的classList属性，用来存放所有的class属性值 conso

原创 el-form的整体校验---动态调用校验规则

el-form的整体校验—动态调用校验规则一、重点: 计算属性computed二、分析：1、页面相关代码块 （重点 :rules=“rulesList”） <el-form :model="ruleForm" ref="ruleForm" :rules="rulesList" label-width="140px" class="demo-ruleForm"> <el-form-item label="身份证正反面" prop="idCardPhotos" ref="

原创 uniapp开发前后端对接踩过的坑

uniapp开发前后端对接踩过的坑一、表单提交，两种都可以1、提交表单触发form中 @submit=“formSubmit”2、点击提交按钮触发button中 @click=“formSubmit”<view class="user"> <!--提交表单触发form中 @submit="formSubmit" --> <form v-model="userform" > <image :src="imgsrc" class="user

原创 高效搜索-搜索引擎指令搜索

原创 uni-app小程序---记账本

uni-app小程序—记账本首页头像、用户名问题：图片传值思路：要转换为base64格式总帐单总价、具体物品及其花费想法：路由跳转后的页面是否重写，可否复用详情记录页详情记录物品、消费类型、时间、地点、描述问题：下拉框、日期选择器、地图解决：下拉框、日期选用原生组件标签：picker，类型不同而已未解决：地图map为尝试...

原创 JS05--作业（对象+函数）

每日作业-JavaScript第05天1 - 作业题目创建一个电脑对象，该对象要有颜色、重量、品牌、型号，可以看电影、听音乐、打游戏和敲代码。题目描述：颜色、重量、品牌、型号是属性；看电影、听音乐、打游戏、敲代码是方法，在调用方法时打印 “我在看电影/听音乐/打游戏/敲代码”var computer = { color: 'white', weight: '1.6kg', logo: 'lenovo',

原创 JS03--作业

每日作业-JavaScript第03天1 - 基本作业收获1：while括号里的条件是什么时候进行循环，而不是什么时候停止循环收获2： prompt()获得的数据类型默认是字符串，如果需要Number类型，要对其进行转换parseInt(prompt(str));1.1 求100以内所有能被3和7整除的数的和题目描述：把1-100之间所有能够被3和7同时整除的数找出来，计算累加和题目提示：在算入累加和之前，使用%判定遍历到的数字是不是可以被3和7整除1.2 使用for循环打

原创 css学习4：css高级技巧

css高级技巧：元素的显示与隐藏、css用户界面样式、垂直居中的应用、溢出的文字省略号显示、css精灵技术（重要、常用）、滑动门技术、margin负值的应用、css三角形一、元素的显示与隐藏（1）display【隐藏】display:none;（隐藏元素、不保留位置）【显示】display:block;（2）visibility（可见性）【隐藏】visibility:hidden;（隐藏元素、保留位置）【显示】visibility:visible;（3）overflow（溢出）:隐藏和显示溢

原创 css学习3：浮动、定位、书写顺序

css学习3：浮动、定位、书写顺序盒子模型、浮动、定位是css布局的三大难点浮动注：浮动元素默认之间是没有空隙的一行装不下所有盒子，浮动元素会自动换行实际重要的导航栏中，我们不会直接用链接a 而是用 li 包含链接(li+a)的做法。（1）li+a 语义更清晰，一看这就是有条理的列表型内容。（2）如果直接用a，搜索引擎容易辨别为有堆砌关键字嫌疑（故意堆砌关键字容易被搜索引擎有降权的风险），从而影响网站排名1、定义：元素的浮动是指设置了浮动属性的元素会（1） 脱离标准普通流的控制（2）移动到指

原创 css实操：学成网综合案例

css实操：学成网综合案例页面效果：易错点很多，需要注意的地方都有注释。常看！HBuilder X > css > 学成网首页.html<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>学成网首页</title> <style type="text/css"> * { margin: 0; pad

原创 关于line-height使文字垂直居中失败的原因和解决方法

关于line-height使文字垂直居中失败原因：font简写形式使line-height失效解决方法：在需要设置line-height时，不使用font简写形式

原创 css学习2-css背景、css三大特性and盒子模型

css学习-css背景、css三大特性and盒子模型css背景1、颜色：background-color:red2、图片：background-image: url(不要加引号)3、背景图片平铺：background-repeat:repeat(默认的，平铺)/no-repeat(不平铺)/repeat-x(横向平铺)/repeat-y(纵向平铺)4、*****背景位置：background-position: x坐标 y坐标注意：（1）必须先指定background-image属性（2

原创 css学习1-标签显示模式and复合选择器

css学习-标签显示模式and复合选择器标签分类：块级元素、行内元素、行内块元素一、块级元素：<h1>~<h6>、<p>、<div>、<ul>、<ol>、<li>等，其中<div>标签是最典型的块元素。*****块级元素的特点：（1）比较霸道，自己独占一行（2）高度，宽度、外边距以及内边距都可以控制。（3）宽度默认是容器（父级宽度）的100%（4）是一个容器及盒子，里面可以放行内或者块级元素。

原创 css实操：day01

css实操：day01字体字体综合性写法：(顺序不能乱，且必须有字号和字体)font: font-style font-weight font-size font-family;例：font: italic 700 20px “微软雅黑”;字体粗细：font-weight:100~900400=normal、700=bold(加粗)文本文字居中对齐：text-align:center行间距：line-height:25px (一般比字号大7,8像素)段落首行缩进：text-indent