javascript
掌握前端相关知识信息
huruiDD
这个作者很懒,什么都没留下…
展开
-
禁止浏览器自动填充el-input(vue3)
<el-input placeholder="手机号" name="login-phone" readonly // 禁止自动填充相关 v-removeReadonly // 禁止自动填充相关 v-focus="900" // focus size="medium" v-model.trim="formRule.phone"> <template #prefix> <img class="icon-image" .原创 2021-07-28 10:34:47 · 1127 阅读 · 0 评论 -
github 访问太慢的解决方法
window解决办法打开hosts文件:C:\Windows\System32\drivers\etc\hosts 用记事本等打开都行.粘贴上面代码保存即可 刷新DNS缓存ipconfig /flushdnsmacOS解决方法打开hosts文件.终端输入sudo vim /private/etc/hosts 在 vim 编辑中,输入i可以编辑hosts文件(如果按了没效果再按一下enter) 可以直接粘贴下面地址和域名的映射关系到hosts的最后一行 140.82.113.原创 2021-05-18 17:42:11 · 118 阅读 · 0 评论 -
node全局包配置/yarn 包管理配置
yarn config set global-folder "E:\Program Files\yarn\global"yarn config set cache-folder "E:\Program Files\yarn\cache"npm config set prefix "C:\node\node_global"npm config set cache "C:\node\node_cache"原创 2021-05-18 12:11:26 · 188 阅读 · 0 评论 -
webpack5 管理资源设置
const path = require('path')// json 解析const yaml = require('yaml')const json5 = require('json5')const toml = require('toml')module.exports = { entry: './src/index.js', // 入口 output: { path: path.resolve(__dirname, 'dist'), fi.原创 2021-05-06 15:21:19 · 96 阅读 · 0 评论 -
js中??和?.的意思
空值合并操作符(??)只有当左侧为null和undefined时,才会返回右侧的数 空值合并操作符(??)是一个逻辑操作符,当左侧的操作数为 null 或者 undefined 时,返回其右侧操作数,否则返回左侧操作数。与逻辑或操作符(||)不同,逻辑或操作符会在左侧操作数为假值时返回右侧操作数。也就是说,如果使用 || 来为某些变量设置默认值,可能会遇到意料之外的行为。比如为假值(例如,'' 或 0)时。见下面的例子。null ?? 20 undefined ?? 3'' ?? 30原创 2021-04-27 14:18:23 · 8656 阅读 · 0 评论 -
javascript 继承
一、原型链继承当前对象原型prototype等于另一个对象的实例;二、盗用构造函数function SuperType() { this.colors = ["red", "blue", "green"];}function SubType() { // 继承SuperType SuperType.call(this);}三、组合继承(原型链继承和盗用构造函数继承共同使用)四、原型式继承(Object.create(obj) 创建一个新的对象,并给与修改)原创 2021-04-14 17:33:02 · 48 阅读 · 0 评论 -
javascript垃圾回收
1.标记清理JavaScript 最常用的垃圾回收策略是标记清理(mark-and-sweep)。当变量进入上下文,比如在函数内部声明一个变量时,这个变量会被加上存在于上下文中的标记。而在上下文中的变量,逻辑上讲,永远不应该释放它们的内存,因为只要上下文中的代码在运行,就有可能用到它们。当变量离开上下文时,也会被加上离开上下文的标记。2.引用计数另一种没那么常用的垃圾回收策略是引用计数(reference counting。当两个对象之间相互引用时,这两个对象的引用数永远不能变成0,也就不能被.原创 2021-04-14 16:49:28 · 58 阅读 · 0 评论 -
script脚本加载和执行
1.推迟脚本执行 defer,立即下周,延迟执行。脚本会被延迟到整个页面都解析完毕后再运行<script defer src="example1.js"></script> 2.异步执行脚本 async<script async src="example2.js"></script> 异步加载,顺序未定 3.动态加载脚本let script = document.createElement('script');script.src = 'g..原创 2021-04-14 16:42:18 · 566 阅读 · 0 评论 -
requestAnimationFrame
requestAnimationFrame() // 调用串联起来,就像以前使用setTimeout()时一样: function updateProgress() { var div = document.getElementById("status"); div.style.width = (parseInt(div.style.width, 10) + 5) + "%"; if (div.style.left != "100%") { requestA.原创 2021-04-14 16:29:37 · 124 阅读 · 0 评论 -
字符串修理方法
let s = ' foo ';s.trimStart() //删除字符串前面的空格s.trimEnd() // 删除字符串后面的空格原创 2021-04-14 15:35:50 · 102 阅读 · 0 评论 -
自定义元素customElements
// 自定义元素class FooElement extends HTMLElement { constructor() { super(); // this 引用Web 组件节点 this.attachShadow({ mode: 'open' }); this.shadowRoot.innerHTML = ` <p>I'm inside a custom element!</p> `; }}customEleme.原创 2021-04-13 18:04:43 · 258 阅读 · 0 评论 -
自定义dom事件createEvent
创建自定义事件, 需要调用createEvent("CustomEvent")。返回的对象包含initCustomEvent()方法,该方法接收以下4 个参数。 type(字符串):要触发的事件类型,如"myevent"。 bubbles(布尔值):表示事件是否冒泡。 cancelable(布尔值):表示事件是否可以取消。 detail(对象):任意值。作为event 对象的detail 属性。自定义事件可以像其他事件一样在DOM中派发,比如:let div = documen原创 2021-04-13 15:33:22 · 141 阅读 · 0 评论 -
javascript生成随机数
在需要生成随机值时,很多人会使用Math.random()。这个方法在浏览器中是以伪随机数生成器(PRNG,PseudoRandom Number Generator)方式实现的。所谓“伪”指的是生成值的过程不是真的随机。function randomFloat() { // 生成32 位随机值 const fooArray = new Uint32Array(1); // 用最大可能的值来除 return crypto.getRandomValues(fooArray原创 2021-04-13 15:16:36 · 197 阅读 · 0 评论 -
键盘上所有非字符键的键码
Backspace 8 数字键盘8 104Tab 9 数字键盘9 105Enter 13 数字键盘+ 107Shift 16 减号(包含数字和非数字键盘) 109Ctrl 17 数字键盘. 110Alt 18 数字键盘/ 111Pause/Break 19 F1 112Caps L...原创 2021-04-12 17:29:16 · 751 阅读 · 0 评论 -
javascript跨浏览器事件对象
var EventUtil = { addHandler: function(element, type, handler) { if (element.addEventListener) { element.addEventListener(type, handler, false); } else if (element.attachEvent) { element.attachEvent("on" + type, handler); .原创 2021-04-12 17:11:41 · 50 阅读 · 0 评论 -
javascript跨浏览器事件处理程序(兼容模式)
var EventUtil = {addHandler: function(element, type, handler) { if (element.addEventListener) { element.addEventListener(type, handler, false); } else if (element.attachEvent) { element.attachEvent("on" + type, handler); } else { .原创 2021-04-12 16:59:33 · 48 阅读 · 0 评论 -
javascript 操作类名,className 属性实现添加、删除和替换
方法一 、// 以下面的HTML代码为例:<div class="bd user disabled">...</div>// 要删除"user"类let targetClass = "user"// 把类名拆分为数组let classNames = div.className.split(/\s+/)// 找到要删除类名的索引let idx = classNames.indexOf(targetClass)// 如果有就删除if (idx > -1)原创 2021-04-12 14:49:07 · 986 阅读 · 0 评论 -
node节点之间的关系文档树和操作方法
一、关系文档树二、节点操作方法 // appendChild()let returnNode = someNode.appendChild(someNode.firstChild)// insertBefore()returnNode = someNode.insertBefore(newNode,null) //相当于appendChild()方法,作为最后一个子节点插入returnNode = someNode.insertBefore(newNode,s...原创 2021-04-12 11:20:32 · 130 阅读 · 0 评论 -
html页面检测是否有网络连接navigation.onLine
navigator.onLine// 当有网络时,返回true,无网络返回false// 有两个监听的时间const connectionStateChange = () => console.log(navigator.onLine);window.addEventListener('online', connectionStateChange);window.addEventListener('offline', connectionStateChange);...原创 2021-04-09 17:45:43 · 337 阅读 · 0 评论 -
window视口的高度和宽度(兼容模式)
浏览器窗口自身的精度尺寸不好确定,但是可以确定页面视口的大小let pageWidth = window.innerWidth, pageHeight = window.innerHeight;// 首先检查pageWidth是不是一个数值,如果不是说明不兼容该属性if(typeof pageWidth != "number") { // document.compatMode 来检查页面是否处于标准模式,如果是使用document.documentElement获取宽度和高度,如果原创 2021-04-09 15:07:03 · 681 阅读 · 0 评论