随笔分类 -  前端

Chrome浏览器控制台有用的命令
摘要:Chrome调试 某元素上到底绑定了哪些事件,控制台输入命令: 获取元素所有事件信息(等价于控制台的Event Listeners标签) getEventListeners(document.querySelector(".common_block > button")) 监控:获得元素触发的所有事 阅读全文

posted @ 2024-08-26 11:16 anjun_xf 阅读(69) 评论(0) 推荐(0) 编辑

js 实现alert提示功能
摘要:js 简单弹框toast JS 实现一个可拖动的DIV 阅读全文

posted @ 2024-08-22 10:44 anjun_xf 阅读(4) 评论(0) 推荐(0) 编辑

web前端学习路线图
摘要:web前端学习路线图应该包括以下几个阶段: 第一阶段:基础入门阶段 HTML5+CSS3 基础结构布局,PC端和移动端。 JavaScript 基础内容,如数据类型、函数、数组等。 JavaScript 高级内容,如对象、原型链、闭包等。 JavaScript ES6 进阶,包括箭头函数、模块化等。 阅读全文

posted @ 2024-07-27 10:58 anjun_xf 阅读(63) 评论(0) 推荐(0) 编辑

js调整div顺序
摘要:js调整div顺序并保留div原有事件等 <div class="my_tabs"> <div class="el-tabs__nav-scroll"> <div class="el-tabs__nav"> <div class="el-tabs__item is-active">AAAA</div 阅读全文

posted @ 2024-04-27 13:44 anjun_xf 阅读(70) 评论(0) 推荐(0) 编辑

通过前端事件对象获得控件所在页面html
摘要://输入框获取焦点事件 function handleInputFocus() { console.log('handleInputFocus 2', event); let pgHtml = $(event.target).prop('ownerDocument').body.innerHTML; 阅读全文

posted @ 2024-04-17 16:12 anjun_xf 阅读(3) 评论(0) 推荐(0) 编辑

CSS知识点整理
摘要:CSS 函数参考手册 CSS 选择器参考手册 CSS 调整大小 div { border: 2px solid; padding: 20px; width: 300px; overflow: auto; } </style> </head> <body> <h1>resize 属性</h1> <di 阅读全文

posted @ 2024-04-05 10:57 anjun_xf 阅读(7) 评论(0) 推荐(0) 编辑

网页读取本地文件
摘要:来自【文心一言】 FileReader 是 Web API 的一部分,它提供了一种异步方式来读取存储在用户计算机上的文件。 <html> <input type="file" id="fileInput" /> <button onclick="readFile()">读取文件</button> < 阅读全文

posted @ 2024-02-05 14:38 anjun_xf 阅读(179) 评论(0) 推荐(0) 编辑

ts字符串与base64互转
摘要:字符串转base64 和 base64转字符串 /** * 字符串转base64(不推荐) * @param str * @returns */ public static myEncode(str) { // 对字符串进行编码 var encode = encodeURI(str.replace( 阅读全文

posted @ 2023-09-26 14:30 anjun_xf 阅读(746) 评论(0) 推荐(0) 编辑

less
摘要:less,浏览器不识别。需要编译成css。 @import "comm.less";//引入less文件(模块化引入多个less) .box1{ border:1px solid red; .box2{//嵌套 font-size:12px; width:100px + 100px; height: 阅读全文

posted @ 2023-02-07 19:47 anjun_xf 阅读(17) 评论(0) 推荐(0) 编辑

CSS选择器
摘要:CSS 选择器参考手册 :CSS 元素选择器 容易混淆 后代选择器 <style type="text/css"> h1 em {color:red;} </style> <h1>This is a <em>本处变红</em> heading</h1> 子元素选择器 <style type="tex 阅读全文

posted @ 2022-08-20 11:25 anjun_xf 阅读(23) 评论(0) 推荐(0) 编辑

元素设置背景图片
摘要:背景图片 background属性 background-color 背景颜色 background-image: url('i3.png') 图片 background-size 图片大小 background-repeat 平铺方式 background-position 图片位置 例子 /*图 阅读全文

posted @ 2022-08-15 15:07 anjun_xf 阅读(29) 评论(0) 推荐(0) 编辑

导航

TOP
点击右上角即可分享
微信分享提示