草庐IT

前端面试

全部标签

前端笔记——Swiper(持续更新中)~

目录介绍安装1、CDN2、安装到本地引入使用初始化配置Basic基本配置Loop循环配置Effects滑动效果配置Pagination分页器Navigation前进后退按钮Autoplay自动切换介绍Swiper是一个流行的、免费的、开源的 JavaScript 库,用于创建移动设备和桌面端的滑块轮播图、触摸滑动页面、图片和内容的滑动和切换效果。Swiper可以实现多种滑动效果,如淡入淡出、平移、3D立体翻转等,同时也支持响应式设计和自动播放等功能。 Swiper具有良好的可定制性和易用性,支持多种平台和浏览器,还提供了丰富的API和事件,可以轻松地实现各种复杂的滑动效果和交互动画。Swipe

解决前后端分离项目后端设置响应头前端无法获取

问题描述在开发前后端分离项目中出现后端设置响应头,前端一直无法获取等问题。后端设置响应头代码如下response.setHeader("Content-Disposition","attachment;filename="+java.net.URLEncoder.encode(fileName,"UTF-8"));在浏览器中我们是可以看到设置的响应头Content-Disposition属性,但是在前端接收到的响应信息中却看不到我们设置的Content-Disposition属性。问题解决原来在前后端分离的项目中除了需要定义响应头之外还需要暴露响应头,这样才能被前端获取。默认情况下,heade

前端如何中断请求 ( axios、原生 ajax、fetch)

使用场景在前端开发中,我们经常需要中断请求来优化性能或处理特定的业务需求。以下是一些常见的使用场景:比如重复请求:当页面中多个组件并发调用同一个接口时,在第一个请求返回后,我们可能需要中断其他组件对该接口的调用,以避免重复请求和冗余数据。这在组件高度复用、不依赖公共API的情况下特别有用。竞态请求:当页面定时轮询发起请求时,如果上一个请求的响应速度比下一个请求慢,会导致数据错乱。中断较慢的请求可以确保只处理最新的数据,避免竞态条件。无效请求:在单页应用中,当组件加载过慢,路由跳转后可能会导致组件卸载,但请求仍在进行中。如果接口返回错误,错误提示可能会在其他页面弹出。中断无效请求可以避免不必要的

前端学习 node 快速入门 系列 —— 初步认识 node

其他章节请看:前端学习node快速入门系列初步认识nodenode是什么node(或者称node.js)是javaScript(以下简称js)运行时的一个环境。不是一门语言。以前js只能运行在浏览器中,浏览器中的js包含:bom(例如window)、dom(例如document)、ecmascript、js引擎;现在js也可以运行在node中,node中的js包含:ecmascript(服务端不操作页面,所以不需要bom和dom)和js引擎。我们编写的js只是一些字符串文本,只有js引擎才能识别和处理它们;js引擎有很多种,chromev8引擎是目前最好的,而且开源;node的作者就是基于ch

前端学习 node 快速入门 系列 —— 模块(module)

其他章节请看:前端学习node快速入门系列模块(module)模块的导入核心模块在初步认识node这篇文章中,我们在读文件的例子中用到了require('fs'),在写最简单的服务器的例子中用到了require('http'),除了fs和http,node提供了很多核心模块,例如:path(路径)、os(操作系统)、events(事件)、url等等。如果我们需要使用核心模块的功能,就使用require(模块名)方法进行引入。第三方模块在npm一文中,我们知道了如何用npm下载包。如果我们需要使用第三方的模块,也可以像引入核心模块那样。请看示例://首先得下载包。后续不再提醒$npminstal

极致性能优化:前端SSR渲染利器Qwik.js | 京东云技术团队

引言前端性能已成为网站和应用成功的关键要素之一。用户期望快速加载的页面和流畅的交互,而前端框架的选择对于实现这些目标至关重要。然而,传统的前端框架在某些情况下可能面临性能挑战且存在技术壁垒。在这个充满挑战的背景下,我们引入了Qwik.js框架。Qwik.js不仅是一个前端框架,更是一种前端性能的终极解决方案。它不仅提供了卓越的性能,还以其独特的特点和优势脱颖而出。让我们一起深入探索Qwik.js,发现它如何超越传统,成为前端性能优化的新标杆。一、现有框架的问题1.传统CSR方案慢加载时间:CSR技术通常要求在浏览器中加载和渲染整个页面,这导致初始页面加载时间较长。用户必须等待页面完全加载才能进

【网络安全/前端XSS防护】一文带你了解HTML的特殊字符转义及编码

文章目录为什么要进行特殊字符转义及编码?前端XSS的危害及转义用处如何进行特殊字符转义及编码?常见的特殊字符转义及编码总结为什么要进行特殊字符转义及编码?在HTML中,有一些特殊字符不可直接使用,需要使用转义字符或实体编码来表示。这是为了避免这些字符与HTML标签和语法产生冲突。同时,也是为了防范前端XSS。例如,有些特殊字符(如和>)作为HTML标签的一部分,要是没有被特殊处理可能被恶意XSS。前端XSS的危害及转义用处HTML的特殊字符转义及编码在防范跨站脚本攻击(Cross-SiteScripting,XSS)方面起到关键作用。XSS是一种常见的安全漏洞,攻击者通过在受信任网站上插入恶意

前端新手Vue3+Vite+Ts+Pinia+Sass项目指北系列文章 —— 第五章 组件库安装和使用(Element-Plus基础配置)

系列文章目录(点击查看)文章目录系列文章目录(点击查看)前言一、安装二、快速开始三、自动引入1、首先你需要安装`unplugin-vue-components`和`unplugin-auto-import`这两款插件2、在`vite.config.ts`文件中添加如下代码四、自己配置vite和plugins1、安装`plugins`2、添加`vite.plugins.ts`文件3、修改`vite.config.ts`文件五、测试组件1、删除无用文件2、测试是否可用总结前言使用Element-Plus组件库进行开发,正如官网介绍,Element-Plus有如下好处:一致Consistency与现

前端vue3——实现二次元人物拼图校验

文章目录⭐前言⭐vue3拖拽实现拼图💖思路分解💖布局结构💖拖拽函数💖校验函数💖inscode整体代码⭐运行效果💖随机顺序💖拖拽中💖校验失败💖校验通过⭐总结⭐结束⭐前言大家好,我是yma16,本文分享关于前端vue3——实现二次元人物拼图校验。vue3系列相关文章:vue3+fastapi实现选择目录所有文件自定义上传到服务器前端vue2、vue3去掉url路由“#”号——nginx配置csdn新星计划vue3+ts+antd赛道——利用inscode搭建vue3(ts)+antd前端模板认识vite_vue3初始化项目到打包python_selenuim获取csdn新星赛道选手所在城市用ech

前端实现水印效果的多种方案

❝前端开发不断创新,其中之一是实现水印效果。水印可以用于保护内容的版权,提供额外信息,或者美化页面。本文将深入探讨几种常见的前端水印方案,帮助大家更好地理解如何实现水印效果。❞1.使用CSS伪元素添加水印使用CSS伪元素是一种简单而灵活的方式来添加水印,以下是一个示例:/* 示例代码 */div class="watermark">div>.watermark::before {  content: "我是水印";  position: fixed;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);  opacity: 0.5;