随笔分类 - JavaScript/HTML/CSS
摘要：如何理解HTML语义化？ 默认情况下，哪些元素是块级元素，哪些是内联元素？ 盒模型宽度如何计算？ margin纵向重叠的问题 margin负值的问题 BFC理解和应用 float布局的问题 flex画色子 absolute和relative依据什么定位？ 居中对齐有哪些实现方式 line-heigh
阅读全文
摘要：面试题： 👆第一张图：打印 1 3 第二张图：打印 1 2 3 第三张图：打印 1 2 欲知为何 看下面Promise的then和catch对状态的影响and then和catch的链式调用知识点 知识点： eventloop 事件循环/事件轮询 JS是怎么执行的？ 从前到后，一行一行执行 如果某
阅读全文
摘要：HTML面试题 CSS面试题 布局 盒子模型宽度如何计算？ margin纵向重叠？ margin负值的理解？ BFC理解和应用？ float布局问题以及clearfix（手写） flex画色子 定位 absolute和relative分别依据什么定位？ 居中对齐有什么实现方式？ 图文样式（宽度 高度
阅读全文
摘要：一. var有变量提升，是ES5的语法。 块级作用域 块级作用域指的是在代码块 {} 中声明的变量只在这个代码块内部有效，外部无法访问。这种作用域通常和 let、const 关键字一起使用。 for (let i = 0; i < 10; i++) { let j = i + 1; } consol
阅读全文
摘要：XSS攻击(跨站脚本攻击) XSS预防 < < > > XSRF(CSRF)攻击（跨站请求伪造） 就像是你在不知情的情况下，被别人利用你的权限发起了某个你没打算进行的请求。重点是可以把你的用户信息给带过去，你不知不觉就帮我付款了。 XSS 是恶意代码“潜伏”在页面上，欺骗你去执行它，比如
阅读全文
摘要：问题 this的不同应用场景 手写bind函数 实际开发中闭包的应用场景，举例说明 创建10个<a>标签，点击的时候弹出来对应的序号 作用域：某个变量的合法使用范围 全局 函数 块级 ** 自由变量 上面图的最里面的红框————a a1 a2都是自由变量，因为都没有被定义。会一层一层往上找。 闭包
阅读全文
摘要：让加载更快 减少资源体积：压缩代码，资源合并 减少访问次数：合并代码(比如webpack打包之后的bundle.js、CSS的雪碧图)，SSR(Server-Side Rendering)服务器端渲染、缓存 使用更快的网络：CDN 比如使用Vue的时候不用亲自去下载vue.js到本地，是可以直接用C
阅读全文
摘要：网页加载过程 网页是如何加载并渲染出来的 从输入url到渲染出页面的整个过程（经典题来了） 资源有哪些形式 加载的大致过程 请求啥就是返回啥，图片、音频都有可能。请求的是页面则返回HTML代码。 渲染过程-① Render Tree：渲染树，每个节点挂了很多CSS属性，这样就能渲染 渲染过程-② 之
阅读全文
摘要：cookie HTML5存储(localStorage 和 sessionStorage) cookie cookie本身用于浏览器和server通讯的，被借用到本地存储来。可以用document.cookie来修改。 同一个变量会覆盖，不同变量会追加。 localStorage 和 session
阅读全文
摘要：关键 Linux 命令 虽然前端开发者不需要掌握 Linux 的所有命令，但以下基本的命令对日常工作是非常有用的： 文件和目录管理 ls：列出当前目录下的文件和文件夹。 ls ls -l # 显示详细信息 ls -a # 显示隐藏文件 cd：切换目录。 cd /path/to/directory c
阅读全文
摘要：生产环境（webpack.prod.js）：需要对代码进行压缩、优化，减少文件大小，提高加载速度，确保代码能够高效运行。 代码压缩与优化：生产环境下，你希望代码被压缩、混淆，以减少文件体积，提高加载速度。开发环境中不需要压缩代码，以便更容易调试。 去掉调试工具：在开发环境下，通常会使用 source
阅读全文
摘要：ES6 模块化的基础概念 ES6 模块化的核心在于两个关键字：export 和 import。 export：用于将模块中的变量、函数、类等导出，供其他模块使用。 import：用于从其他模块中导入需要的功能。 2. 模块的导出（export） ES6 提供了两种导出方式：命名导出（Named Ex
阅读全文
摘要：git 调试工具 抓包 webpack babel linux 常用命令(测试机) git 最常用的代码版本管理工具 大型项目需要多人协作开发，必须熟用嗷~ git服务端常见的有 github、coding.net等 git init 这个命令用来初始化一个Git仓库。一般在新项目开始的时候执行。
阅读全文
摘要：JSONP( JSON with Padding ) JSONP是通过 <script> 标签来实现跨域数据传输的技术。它是为了绕过浏览器的同源策略限制而诞生的。 访问一个网址，服务端一定返回一个html文件吗？ 不是的 服务器可以任意动态拼接数据返回的，只要符合html格式的要求就可以。 JSON
阅读全文
摘要：手写一个简易的Ajax 跨域的常用实现方式 GET请求 // 创建一个 XMLHttpRequest 对象 const xhr = new XMLHttpRequest(); // 初始化一个 GET 请求 // 第三个参数 true 表示异步,一般都为 true xhr.open('GET', '
阅读全文
摘要：编写一个通用的事件监听函数 描述事件冒泡的流程 无线下拉的图片列表，如何监听每个图片的点击？ 事件代理 用e.target获取触发元素 用matches判断是否是触发元素 事件绑定 addEventListener function bindEvent(elem, type, fn) { elem.
阅读全文
摘要：如何识别浏览器的类型 分析拆解url各个部分 navigator screen loccation history navigator.userAgent screen.width screen.height
阅读全文
摘要：获取子元素 const div1 = document.getElementById('div1') const child = div1.childNodes 获取父元素 const div1 = document.getElementById('div1') const parent = div
阅读全文
摘要：概览 DOM(Document Object Model) DOM是哪种数据结构？ 树🌳 常用的API getElementById getElenmentByClassName getElementByTagName querySelector querySelectorAll createEl
阅读全文
摘要：同步和异步的区别是什么？ 手写Promise加载一张图片 前端用到异步的场景？ JS是单线程语言，只能同时做一件事 浏览器和nodejs已支持JS启动线程，比如Web Worker（不知道是啥东西） JS和DOM渲染共用一个线程，因为JS可以修改DOM结构。意味着JS在工作的时候DOM渲染要停止，反
阅读全文
