- 博客(66)
- 收藏
- 关注
原创 为什么元素显示的样式跟我设置的不一样?CSS优先级详解
在CSS中,选择器优先级是指确定应用于元素的最相关CSS声明的算法。这个优先级决定了哪个样式规则将被应用到元素上。根据选择器的类型和特定性,CSS规定了不同的优先级,例如ID选择器比类选择器具有更高的优先级。在CSS中,选择器的优先级决定了最终应用到元素的样式。
2024-03-24 16:00:01 700
原创 从0开始学JavaScript(一) 之什么是JavaScript
今天是2022年的第一天,也算是给自己开个好JavaScript是Web编程语言
2022-01-01 23:42:18 447
原创 2021-09-09
一、!important > 内联样式 style > ID 选择器 > 伪类选择器 > 属性选择器 = class 选择器 > 伪元素 > 元素(类型)选择器 > 关系选择器 > 通配符选择器二、不管父元素样式的权重多大,被子元素继承时,他的权重都为0,即子元素定义的样式会覆盖继承来的样式。...
2021-09-09 11:11:25 65
原创 function的arguments属性
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/arguments
2021-07-10 15:42:43 114
原创 JS 中parseInt(string, radix) 的正确用法
parseInt(string, radix)解析一个radix进制的string字符串并返回的十进制整数解析二进制字符串 “10”,并返回它对应的十进制整数parseInt('10', 2) // 2特别说明:1.radix的值是2-36之间的整数,如果radix 的值不处于 2-36 之间时,永远返回NAN2.如果string的内容不符合radix进制的值得时候,同样返回NAN比如:在二进制中是没有2这个字符的在十六进制中是没用G这个字符的研究研究:['1', '2
2021-06-28 11:15:12 810
原创 正确使用“width:100%“
如果想要正确使用"width:100%“这一属性,一定要设置"box-sizing:border-box”,否则会造成子元素溢出
2021-05-07 10:41:01 271
原创 行内元素
1、行内元素会在一条直线上排列,在同一行从左至右水平排列。直到一行排不下,才会换行。2、行内元素设置宽、高、margin上下、padding上下无效(竖直无效)。3、行内元素设置line-height,margin左右、padding左右有效(水平有效)。4、行内元素的宽高随标签里的内容而变化。...
2021-05-05 20:30:43 163
原创 CSS 外边距(margin)合并
定义:外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。情况1当一个元素出现在另一个元素上面时,第一个元素的下外边距与第二个元素的上外边距会发生合并。情况二当一个元素包含在另一个元素中时(假设没有内边距或边框把外边距分隔开),它们的上和/或下外边距也会发生合并。情况三假设有一个空元素,它有外边距,但是没有边框或填充。在这种情况下,上外边距与下外边距就碰到了一起,它们会发生合并:情况四如果这个外边距遇到另一个.
2021-05-05 11:56:25 165
原创 LeetCode 20. 有效的括号,使用哈希 解题方法
20. 有效的括号:给定一个只包括 ‘(’,’)’,’{’,’}’,’[’,’]’ 的字符串 s ,判断字符串是否有效。 有效字符串需满足: 左括号必须用相同类型的右括号闭合。 左括号必须以正确的顺序闭合。思路:使用哈希表存储每一种括号。哈希表的键为右括号,值为相同类型的左括号。 const hashS = new Map([ [')', '('], [']', '['], ['}', '{'] ])Map 对象的方法解析:(1)g
2021-05-02 21:41:37 85
原创 Vue 对象监听, JavaScript 和 TypeScript
JavaScript写法data() { str: '', obj: { a: '' }} watch: { obj: { // 对象深度监听 handler(val) { console.log('obj', val) }, deep: true // 对象深度监听 }, str(val) { console.log(a, val) }}TypeScript写法 private cat = { long: '12cm
2021-04-08 16:09:37 283
原创 JavaScript label语法 a: for
在JavaScript中,允许在语句的前面添加标签(label),相当于将语句定位,方便找寻该语句在for循环中跳出指定循环// JS label语法function f() { a: for (let i = 0; i < 5; i++) { for (let j = 0; j < 5; j++) { console.log(i, j) if (j === 3) { break a// 直接跳出外层a循环 } }.
2021-04-07 10:51:41 370
原创 微信的JS支付和H5支付
H5支付为微信客户端之外的浏览器页面提供请求微信支付的入口。场景: 即在微信客户端之后的浏览器可使用H5支付方法来唤起微信支付。微信H5支付文档JS支付即在微信内通过调用微信提供的JSAPI唤起微信支付场景:使用微信扫描线下二维码或浏览器内的二维码进行支付在微信公众号内进行支付微信JS支付文档...
2021-03-31 23:11:40 724
原创 JavaScript Array的map方法
定义和用法:map方法返回一个新数组,不会改变原数组数组中的元素为原始数组元素调用函数处理后的值array.map(function(currentValue,index,arr), thisValue)其中function的三个参数分别是:参数描述currentValue必须。当前元素的值index可选值。当前元素的索引值arr可选值。当前元素属于的数组对象实例:let arrMap:Array<string> = ['1', '2
2021-03-03 00:20:03 1631
原创 牛客网JavaScript题的输入和输出
/*** 输出使用console.log* 单行输入*/const rl = require('readline').createInterface({ input: process.stdin, output: process.stdout})rl.on('line', (line) => { console.log(line)})/*** 输出使用console.log* 多行输入*/const rl = require('readline')
2021-02-25 00:19:45 953 2
原创 针对window中atob和btoa方法的理解
atob中各个定义:a指ASCIIto即为由谁转换成谁b指base-64定义和用法:atob() 方法用于解码使用 base-64 编码的字符串btoa() 方法用于将字符串编码成 base-64 字符串window.btoa('0123456789') // MDEyMzQ1Njc4OQ==window.atob('MDEyMzQ1Njc4OQ==') // 0123456789...
2021-02-11 00:01:12 708 1
原创 DOM 操作优化
opacity替代visibility (opacity: 0 ~ 1 (隐藏 ~ 显示))多个DOM统一操作(虽然V8会有缓存优化)先将DOM离线,即display:none;修改后显示不要把DOM放在已给循环中作为循环变量
2021-02-10 23:32:32 108
原创 JS 堆栈事件调用(同步调用、异步调用);消息队列和作业队列
同步调用const bar = () => console.log('bar')const baz = () => console.log('baz')const foo = () => { console.log('foo') bar() baz()}foo()代码会打印出foobarbaz调用堆栈:异步调用const bar = () => console.log('bar')const baz = () => console.l
2021-01-17 14:36:40 448 1
原创 vue package.json文件解析
version 表明了当前的版本。name 设置了应用程序/软件包的名称。description 是应用程序/软件包的简短描述。main 设置了应用程序的入口点。private 如果设置为 true,则可以防止应用程序/软件包被意外地发布到 npm。scripts 定义了一组可以运行的 node 脚本。dependencies 设置了作为依赖安装的 npm 软件包的列表。devDependencies 设置了作为开发依赖安装的 npm 软件包的列表。engines 设置了此软件包/应用程序在
2021-01-17 11:35:15 335
原创 v-model 修饰符 v-model.lazy v-model.trim v-model.number
v-model的修饰符v-model.lazy 只有在input输入框发生一个blur时才触发v-model.trim 将用户输入的前后的空格去掉v-model.number 将用户输入的字符串转换成number
2021-01-14 15:25:02 110
原创 JS typeof 类型判断 & 判断是否是数组
typeof(undefined) // "undefined"typeof(null) // "object"typeof([1,2]) // "object"typeof({a:1}) // "object"typeof('123') // "string"typeof(1) // "number"typeof(true) // "boolean"typeof(Array) // "function"typeof(() => {}) // typeof 箭头函数返回也是 "fu
2021-01-14 11:02:45 7153
原创 JavaScript Reference Type类型解读
研究意义当我们在读取一个属性的时候,比如在obj.method()中,.返回的准确来说不是属性的值,而是一个特殊的Reference Type类型的值,在这个其中存着属性的值和它的来源对象。初步解析Reference Type是ECMA中的一个"规范类型"。但是在外部是不能直接使用Reference Type,所以它一直被用于JavaScript的内部。Reference Type本身是一个三个值的组合(base,name,strict),其中:base 是对象。name 是属性名。stri
2021-01-09 23:57:04 1410
原创 Vue ref获取vue组件dom,默认选中input中的值
如果获取的是vue组件,获取到的会是组件最外层的dom,这是我获取vant的input组件所获取到的值: <van-field ref="input" id="input" v-model="money" type="number" />console.log(this.$refs.input) // 只能获取到外层组件domconsole.log(document.getElementById('input')) // 获取dom打开选中input中
2021-01-07 11:04:53 1493
原创 JavaScript 计算精度深入研究
JavaScript 里的数字是采用 IEEE 754 标准的 64 位双精度浮点数。该规范定义了浮点数的格式,对于64位的浮点数在内存中的表示,最高的1位是符号位,接着的11位是指数,剩下的52位为有效数字,具体:第0位:符号位, s 表示 ,0表示正数,1表示负数;第1位到第11位:储存指数部分, e 表示 ;第12位到第63位:储存小数部分(即有效数字),f 表示,看看一个算数在JavaScript中做了什么举个例子: 0.1 + 0.2第一步: 将0.1 和 0.2 转换成二进.
2021-01-06 23:38:55 301
原创 字体滚动效果实现
操作滚动条方法window.scroll(x,y)是让window滚动条滚动到那个x,y坐标。//x是水平坐标,y是垂直坐标。window.scrollBy(-x,-y)是让window滚动条相对滚动到某个坐标,- 10即相对向左/向上滚动10像素。window.scrollTo(x,y)和window.scroll(x,y)一样。<template> <div class="scroll-outside"> <div class="scroll
2021-01-05 17:32:46 213
原创 Js的导出导入
单个导出// 导出数组export let months = ['Jan', 'Feb', 'Mar','Apr', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];// 导出 const 声明的变量export const MODULES_BECAME_STANDARD_YEAR = 2015;// 导出类export class User { constructor(name) { this.name = name; }}多个一起导出func
2020-12-30 00:19:09 130
原创 try...catch...finally...
try { ... 尝试执行的代码 ...} catch(e) { ... 处理 error ...} finally { ... 总是会执行的代码 ...}
2020-12-23 14:33:09 34
原创 CSS linear-gradient 实现背景双色或多色,背景一半变色
linear-gradient:第一个参数:方向(可以为角度)第二至多个参数:颜色 占比(可有可无) 至下一个参数颜色渐变background: linear-gradient(to bottom, white 0%, white 75%, #F49602 75%, #F49602 100%);//背景色调整,上部分白,下部分黄background: linear-gradient(to bottom, white 0%, white 75%, #F49602 75%, #F49602 10
2020-12-22 16:03:15 9960
原创 微信支付调用JSAPI时使用TypeScript(TS),解决Ts编译报错
declare let WeixinJSBridge: any // 解决 WeixinJSBridge 在TS编译会报错export interface Res { // 微信需要传入的数据,数据格式定义 appId?: string; timeStamp?: string; nonceStr?: string; package?: string; signType?: string; sign?: string;}expor default class Main ext
2020-12-21 13:33:23 2163
原创 npm报错,npm切换淘宝镜像源,附安装electron
npm 报错 ERR!npm cache verify将cnpm 切换为淘宝镜像npm install -g cnpm --registry=https://registry.npm.taobao.org直接将npm 设置为淘宝镜像npm config set registry https://registry.npm.taobao.org查看当前的镜像设置npm config get registry cnpm config get registry 安装electroncnp
2020-12-19 23:24:56 1136 1
原创 JS中的类检查 instanceof,查看属性是否属于class内
一、判断对象是否属于Class类或者衍生类class Rabbit {}let rabbit = new Rabbit()二、判断对象是否属于构造函数// 这里是构造函数,而不是 classfunction Rabbit() {}let rabbit = new Rabbit()alert( rabbit instanceof Rabbit ); // true三、和Array或Object之类的内建classarr 同时还隶属于 Object 类。因为从原型上来讲,Array 是继
2020-12-18 20:28:14 531
原创 手机端支付,H5支付和JS支付
手机端H5支付只能在手机浏览器内打开支付在分享到微信之后,微信只能使用JS支付H5支付和JS支付都需要在微信和支付宝申请地址
2020-12-15 21:26:16 556 1
原创 Vue + TS 24小时倒计时函数
<div class="tips-text-text">剩{{ hourText >= 10 ? hourText : ('0' + hourText) }}小时{{ minText >= 10 ? minText : ('0' + minText) }}分{{ secondText >= 10 ? secondText : ('0' + secondText) }}秒自动关闭</div> public hourText = 23
2020-12-15 18:13:40 1090
原创 Vue 页面关闭时销毁setInterval,5分钟倒计时函数
编写一个5分钟倒计时函数: public lastTimeMin = 5 public lastTimeSec = 0 public maxTime = 5 * 60 public countdownTimer: any public countdown(): void { this.$once('hook:beforeDestroy', () => { // 页面被关闭时启动 console.log('销毁') clearInterval(this
2020-12-15 18:09:05 2883
原创 不要用window.open,H5链接跳转,打开支付宝或微信支付最好采用 location.href
location.hrefwindow.location.href='URL' // 覆盖当前页location='URL' // 覆盖当前页window.open 和a 标签一样window.open('URL','_blank')// 在新窗口打开window.open('URL','_self') // 覆盖当前页
2020-12-15 18:00:26 2974 1
原创 记一下代码习惯
1、受保护的属性通常以下划线 _ 作为前缀,这只是一个简单的约定,并不是强制的,即不应该从外部访问此类型的属性和方法class John{ _children = 'Bob'}2、私有属性和方法应该以 # 开头。它们只在类的内部可被访问。class John{ #wife= 'Mary'}...
2020-12-14 21:04:09 47
原创 vue + ts中的shims-vue.d.ts文件的作用,在ts中引入vue-echarts等vue文件
shims-vue.d.ts是为了 typescript 做的适配定义文件,因为.vue 文件不是一个常规的文件类型,ts 是不能理解 vue 文件是干嘛的,加这一段是是告诉 ts,vue 文件是这种类型的。这一段删除,会发现 import 的所有 vue 类型的文件都会报错。/** * shims-vue.d.ts的作用 * 为了 typescript 做的适配定义文件,因为.vue 文件不是一个常规的文件类型,ts 是不能理解 vue 文件是干嘛的, * 加这一段是是告诉 ts,vue .
2020-12-08 23:16:32 23980
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人