- 博客(39)
- 资源 (1)
- 收藏
- 关注
原创 el-select移动端唤不出软键盘
移动端使用element UI,select组件点击未唤起软键盘。el-select组件在移动端会默认加上readonly属性。
2024-10-31 14:10:50
628
1
原创 vue原型挂载
对于我们常用的方法,可以使用原型挂载方便使用;其中vue2与vue3所使用原型挂载方式各有不同;在 Vue 2 中, Vue.prototype 通常用于添加所有组件都能访问的 property。在 Vue 3 等同于config.globalProperties。这些 property 将被复制到应用中作为实例化组件的一部分。
2024-06-18 15:41:42
568
1
原创 Element UI:时间组件,支持开始结束时间任选其一
时间组件:1、开始时间、结束时间支持全部选择2、仅选择开始/结束时间: ①开始时间往后所有; ②结束时间往前所有
2024-01-05 16:33:15
1766
1
原创 Vue2虚拟列表,umy-ui封装
umy-ui库中的table表格组件,它改造了element-ui等等库的表格组件在表格需要展示数据量较大引起页面卡顿是,可以采用umy-ui进行虚拟加载
2023-12-05 10:00:00
3894
3
原创 vue3+ts项目采用canvas模拟批注功能
vue3+ts项目采用canvas模拟批注功能实现点击“批注”,随手指绘制出线条,线条封闭之后,视为圈记成功,进而输入评论内容——批注;
2023-02-16 15:19:57
2251
原创 前端:application中cookie值存在,但是取不到cookie的值
在application中可以查看到相关的cookie值,但是通过document.cookie值取不到相关的值出现的原因:在application中将对应cookie的HttpOnly的已勾选解决办法:需要后端将对应cookie值的HttpOnly状态修改为false...
2022-05-16 10:02:44
3044
原创 HBuilder创建uniapp项目(Vue3、Vant Weapp)
HBuilder搭建uniaop项目步骤,使用Vue3与Vant Weapp组件库
2022-05-16 09:39:26
10950
8
原创 解决:yarn : 无法加载文件 C:\Users\CNH5030\AppData\Roaming\npm\yarn.ps1,因为在此系统上禁止运行脚本。
安装yarn之后,在vscode终端中输入yarn --version等yarn相关的命令,报错如下:yarn : 无法加载文件 C:\Users\CNH5030\AppData\Roaming\npm\yarn.ps1,因为在此系统上禁止运行脚本解决办法:1、搜索PowerShell,以管理员身份运行2、执行:set-ExecutionPolicy RemoteSigned将计算机上的 执行策略更改为 RemoteSigned
2022-04-06 15:04:31
258
原创 原生JS:PHP连接Mysql
PHP连接Mysql数据库连接:<?phpheader('content-type:text/html;charset=utf-8'); // 返回文本和html内容,编码方式utf-8// PHP CORS:跨域资源共享,允许浏览器向跨源服务器,发出XMLHttpRequest请求header("Access-Control-Allow-Origin:*"); $host = 'localhost:3306'; //主机 $username = $password = '
2021-02-08 20:20:49
242
原创 原生JS:封装ajax
原生JS:封装ajax每次调用ajax都需要写核心代码,为了减少代码冗余提高代码复用率,对ajax进行封装,方便使用以下是ajax的核心代码://挖洞 修地铁 => 创建ajax对象 var xhr = new XMLHttpRequest(); // 开通地铁 确定站名 => 确定请求 xhr.open('get', './a.txt', true); //默认开启异步,所有这里的true可以不写 // 买票上车
2021-02-02 10:34:00
282
原创 原生JS:封装cookie
原生JS:封装cookiecookie的使用相对于localStorage和sessionStorage比较麻烦,为了方便cookie的使用,减少代码的冗余,对cookie进行封装 // cookie的增、改 function setCookie(name, content, iDay) { // name不能包含 ; , . = 以及空格 var date = new Date(); date.setDate(date.getDate() + iDay);
2021-01-26 09:13:47
182
原创 原生JS:判断年月日是否合格,显示是当年的第几天
判断年月日是否合格,显示是当年的第几天思路:先判断输入的年是闰年还是平年,封装求每个月的最大天数的函数(下个月的第0天就是当前月的最后一天),判断月日是否合格,最后利用switch中没有break的穿透对天数进行叠加。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-wi
2021-01-20 09:35:19
454
原创 原生JS:判断一个数是否为素数
判断一个数是否为素数素数:素数又叫质数,除了1和它本身以外不再有其他因数,例如:3、5、7、11、17、19 function checkNum(n) { if (n % 1 != 0 || n < 2) return false; if (n == 2) return true; var tag = true; for (var i = 2; i < n; i++) { if (n % i == 0) {
2021-01-18 09:22:15
334
原创 常用正则(邮政编码、压缩包、电子邮件、手机号、身份证、用户名、体温)
常用正则几种常用的正则表达式,邮政编码、压缩包、电子邮件、手机号、身份证、匹配中文、用户名1. 检查邮政编码 ------------------6位数字、第一位不能为0 let reg = /^ [ 1-9 ] [ 0- 9] {5} $/ ; let reg = /^ [ 1-9 ] \d {5} $/ ;2. 检查文件压缩包 ------------------xxx.zip || xxx.gz || xxx.rar let reg = /^ \w+ \ .(zip | gz | rar)
2021-01-16 16:57:26
1955
原创 页面和元素的常用易混淆宽高与距离
页面和元素的常用易混淆宽高与距离页面和元素有一些常用的宽高还有各种距离,比较容易混淆1.页面的几种不同的宽高和距离方法描述clientWidth / clientHeight获取浏览器的可视宽高 ,不包含滚动部分scrollWidth / scrollHeight获取页面的实际宽高 ,包含滚动部分scrollTop / scrollLeft获取或设置根元素的内容垂直(水平)滚动距离2.元素宽高和相对距离方法描述width / heigh
2021-01-16 16:28:36
137
原创 JS:数组操作
数组表格中arr代表一个数组操作作用解释arr.push(" ")尾插arr修改,返回新数组的长度arr.pop()尾删arr修改,返回被删除的项arr.unshift()前插arr修改,返回新数组的长度arr.shift()前删arr修改,返回被删除的项arr.concat(arr1,arr2)合并arr不修改,返回合并后的数组arr.join("+")将数组元素用指定字符拼接成字符串arr不修改,返回字符串(“+”代表指定字
2021-01-16 15:56:18
194
原创 实现垂直水平居中的四种方式
垂直水平居实现垂直水平居中的前三种都是定位,还有一种是使用弹性布局最常见的position: absolute;top:0;right:0;bottom:0;left:0;margin:auto;配合margin的百分比使用position: absolute;top:50%;left:50%;margin:-50%;配合位移使用position: absolute;top:50%;left:50%;transform: translate(-50%,-50%
2021-01-14 12:00:24
328
1
原创 CS3属性之弹性布局
弹性布局添加在父元素 默认状态下,交叉轴的宽度或者高度会铺满;但是如果定义了交叉轴的对齐方式,宽度或者高度会被内容撑开定义弹性盒:display:flex;确定主轴方向:flex-direction:row(左右–x轴)/column(上下–y轴) reverse反向flex-direction:column-reverse / row-reverse主轴对齐方式:justify-content:center; 居中对齐justify-content: flex-end
2020-11-21 17:56:55
211
原创 CSS之定位属性
定位属性定位属性定义建立元素布局所用的定位机制。任何元素都可以定位,不过绝对或固定元素会生成一个块级框,而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。1.参照物: 参照物是指最近的具有定位的祖先元素。 定位时需要的参照物,不一定是写在父元素上,参照物可以是任意的祖先元素,所有的定位都可以做参照物,当父元素上没有定位的话,就会先上级找定位作为参照物(就近原则,会先已最近的上级有定位的元素作为参照物)2.position属性:定位描述abso
2020-11-21 17:17:35
380
原创 CSS之清除浮动
浮动属性之清除浮动浮动属性固然好用,但是清除浮动也是一件很头痛的事情,清除浮动的方法有很多,同时缺点也是存在的,下面来简单介绍几种清除浮动的方式方法缺点给父元素设置高度高度无法自适应父元素加overflow:hidden超出部分会隐藏在所有浮动元素后加空的div,写上clear:both代码冗余浮动可以清楚浮动,给父元素加float带来新的浮动问题父元素使用fixed或者absolute定位整个元素都脱离文档流在所有浮动元素后加空的div,写上
2020-10-25 16:12:59
229
原创 CSS之浮动属性简单应用
float浮动属性float 属性定义元素在哪个方向浮动。以往这个属性总应用于图像,使文本围绕在图像周围,不过在 CSS 中,任何元素都可以浮动。浮动元素会生成一个块级框,而不论它本身是何种元素。如果浮动非替换元素,则要指定一个明确的宽度;否则,它们会尽可能地窄。注释:假如在一行之上只有极少的空间可供浮动元素,那么这个元素会跳至下一行,这个过程会持续到某一行拥有足够的空间为止。属性值作用(描述)left元素向左浮动right元素向右浮动none默认值。元素不
2020-10-25 15:25:24
206
原创 CSS背景属性之颜色渐变
这样的设计解决方案并不是只可以使用颜色渐变,我们可以使用两个div拼接,将文字放置两个div中间,但是有颜色渐变的话,我们就不需要那么复杂的解决。红色 ,黄色 ,绿色三色在0-100之间依照顺序有过渡的变化。0为红色,0-50为红色到黄色渐变, 100黄色。这里的 to top是默认的值,颜色渐变会从上而下由黄色到绿色有过渡渐变。下面两张效果图,前者是to right,后者是to left。效果图如下,左边是没有角度的,右边是45deg的。颜色渐变可以分为两种,线性渐变和径向渐变。...
2020-10-25 14:47:22
70596
原创 CSS之背景属性
背景属性在网页设计的时候也是经常使用的,在刚刚接触到前端的时候,我们可以先学习画色块来对网页进行布局。background-size不能并入background中,必须写在背景图片后面才可以生效。3.背景大小:background-size:50px 50px;边框开始 内边距开始 内容开始。background-position 背景位置。background-color 背景颜色。background-repeat 背景平铺。background-size 背景大小。...
2020-10-25 13:51:55
490
原创 CSS之文本属性
表示可以有多个选择,当没有隶书时会选择宋体,中文优先选择中文字体,英文和数字优先选择英文字体。line-height,在指定行高属性值中居中,可不写单位,是倍数的意思。当字体大小小于8(依据浏览器的版本决定)的时候,不会继续变小。oblique (倾斜力度较大,浏览器暂不支持)注:用其他的字体可能导致网站文件过大,网站加载时间较长。em是与字体相对的,在这里表达的是缩进两个字;变瘦 正常值 加粗。normal 常规。lowercase 小写。uppercase 大写。...
2020-10-24 15:39:34
497
原创 HTML与CSS之HTML标签(四)标签嵌套规则
在之前我们学习了常用的html标签,那么这些标签的嵌套有什么规则呢?是可以随意嵌套还是需要遵循某些规定来使用呢?哈哈哈哈,看了标题也会觉得这段话是废话了,都写了标签嵌套规则那就肯定是有规定的嘛!那一起来看看标签嵌套的规则吧(^ o ^)/~块级标签嵌套行内标签<div> <a href=""></a> <span></span></div><p> <a href=""></
2020-10-18 16:23:56
1320
原创 HTML与CSS之HTML标签(三)
之前有讲到常用标签input、p、a、表单、表格等,还要补充另外一种,那就是列表。列表在平时用的还是比较多的一种,最常用与导航栏。那下面我们一起来看看吧。列表分为有序列表、无序列表、定义列表有序列表(order list)有序列表是一列项目,列表项目使用数字进行标记。有序列表始于 < ol> 标签。每个列表项始于 < li> 标签。<ol> <li>首页</li> <li>关于我的</li></ol&g
2020-10-18 14:35:53
111
原创 CSS之选择器
选择器要使用css对HTML页面中的元素实现一对一,一对多或者多对一的控制,这就需要用到CSS选择器。HTML页面中的元素就是通过CSS选择器进行控制的。通配符选择器 通配符选择器顾名思义就是通用的,会对所有的标签生效,但其权重很低,会被之后书写的权重更高的代码所覆盖。(权重问题后面会额外的说明) 通配符选择器的语法为: *{ 属性:属性值; }eg:<style> *{ margin:0; padding:0; }&
2020-10-18 00:28:15
148
原创 CSS之语法与引入方式
CSS(cascading style sheets)1.语法 对象{ 属性:属性值; }2.css的引入方式 2.1 行内样式(行间样式、内嵌样式、内联样式) 在标签中直接编写css样式,代码如下:<div style="width: 200px;height: 200px;background:red;"> 我是块元素</div> 2.2 内部样式 在< head>< /head>中编写cs
2020-10-17 22:57:12
240
原创 HTML与CSS之HTML标签(二)
HTML与CSS之HTML标签(二)除却前面的一些常用标签以外,还有表格与表单常用的 标签及相关属性表格 tablethead、tbody、tfoottr、th、td属性:border 边框bordercolor 边框颜色width 宽度height 高度align="center" 表格居中cellspacing="0" 单元格间距(各个单元格之间)为0(只有一条线)cellpadding="0" 单元格内容与单元格间距bgcolor 背景颜色
2020-10-17 19:44:45
167
原创 HTML与CSS之HTML标签(一)
HTML超文本标记语言(hyper text markup language)1.web标准结构(html)+表现(css)+行为(JavaScript)<!-- 定义文档类型 --><!DOCTYPE html><!-- language en:English zh-cn:Chinese --><html lang="en"> <head> <!-- 解决乱码问题 cha
2020-10-15 19:08:14
256
1
Vue2原型挂载sessionStorage、localStorage、element弹窗
2024-03-04
element UI封装form、search
2023-11-10
常用的初始化页面.css
2020-10-25
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人