自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(81)
  • 收藏
  • 关注

原创 定时器的定义

定时器是一种常用的程序设计工具或功能模块,它允许开发者在指定的时间间隔后执行一段特定的代码或任务。定时器广泛应用于需要时间控制的任务调度、延迟操作和周期性检查等场景。

2025-03-30 22:52:40 272

原创 Cookie可以存哪些指?

需要注意的是,由于安全性和隐私保护的原因,cookie并不适合用来储存过于机密的重要资料比如明文密码之类的东西;另外现代web架构下localstorage/sessionStorage也逐渐成为替代方案之一供开发者选择根据业务场景合理安排各自优缺点加以权衡取舍才是王道。Cookie是一种小型文本文件,通常由服务器生成并发送到用户浏览器中保存。它可以用于存储一些简单但非常有用的信息,以便于后续请求时自动附带回服务器使用。

2025-03-30 22:50:44 152

原创 页面重构过程中如何保证良好的跨浏览器一致性?

不同浏览器默认渲染某些HTML元素的方式略有差异,通过引入像Normalize.css这样的工具可以帮助消除这些偏差,使得所有浏览器都从相同的起点开始渲染您的文档。综上所述,在整个开发周期内保持高度警惕意识配合科学合理的策略规划才能够真正达成理想中的“所见即所得”效果让用户无论在哪种平台上都能够获得流畅满意的浏览经历。在页面重构的过程中,为了确保网页能够在不同的浏览器中呈现一致的效果,我们需要采取一系列措施来提高跨浏览器的一致性。

2025-03-30 22:48:45 408

原创 HTML5和CSS3的一些特性

在实际工作中,我会依据最新的W3C标准规范来进行编码实践,确保兼容主流桌面端和移动端设备浏览器显示无误的基础上追求极致用户体验。通过对原始PSD文件或其他形式的设计稿深入解析拆分,合理选择合适的标记语言版本编写框架布局,利用媒体查询适应各种屏幕尺寸适配方案调整样式规则集,并且持续关注性能指标监控反馈不断优化整体效率表现。HTML5 和 CSS3 是现代网页设计的基础技术,它们引入了许多新特性和功能,极大地丰富了网页的表现力和交互能力。: 可以轻松生成线性及径向颜色过渡,减少图片使用率的同时提升渲染速度。

2025-03-30 22:47:30 274

原创 JavaScript一行代码技巧

9. 获取URL参数:const params = Object.fromEntries(new URLSearchParams(window.location.search));4. 从数组中获取随机元素:const randomElement = array[Math.floor(Math.random() * array.length)];10. 深拷贝对象:const deepCopy = JSON.parse(JSON.stringify(object));,比parseInt()更简洁。

2025-03-23 22:46:25 143

原创 JavaScript严格模式

文章主要介绍JavaScript严格模式,包括启用原因、方式以及需避开的常见陷阱,助力开发者写出更健壮代码。◦ 未声明变量:严格模式下给未声明变量赋值会报错,应始终用var、let或const声明变量。◦ 八进制语法:严格模式下010这样的八进制语法无效,需用0o前缀表示八进制,如0o10。◦ this的值:严格模式下函数内部this不会默认指向全局对象,使用时需注意其指向变化。◦ 删除变量或函数:严格模式禁止删除变量和函数,不可执行此类操作。◦ 赋值给只读属性:不能给只读属性赋值,避免此类错误操作。

2025-03-23 22:45:46 156

原创 如何修改select中的字体?

如果你需要更高级的自定义样式(如自定义下拉箭头、背景色等),可能需要使用JavaScript和HTML/CSS来模拟<select>标签的功能,或者使用第三方库(如Select2、Chosen等)。你可以直接在<select>标签内部使用style属性来设置字体大小,或者通过CSS选择器来统一设置所有<select>标签的字体大小。在使用CSS时,建议将样式规则放在<style>标签内(位于<head>部分)或外部CSS文件中,以提高代码的可维护性和可读性。2. 修改字体样式(如字体家族)

2025-03-22 14:59:36 301

原创 CSS中px和em的区别?

em 是相对单位,根据继承它的父元素的字体大小来计算实际的大小。默认情况下,1em 等于父元素的字体大小。例如,如果父元素的字体大小为 16px,那么 1em 将等于 16px。如果一个元素的字体大小为 2em,那么它将等于父元素字体大小的两倍。在上面的例子中,.parent 元素的字体大小为 16px,所以 .child 元素的高度将等于 16px。.child 元素的宽度设置为 200px,所以它将始终显示为 200 个像素宽。例如,一个宽度为 200px 的元素将始终显示为 200 个像素宽。

2025-03-22 14:58:03 122

原创 自执行函数(Self-Invoking Function)

/ 函数体console.log('这是一个自执行函数');})();在上述代码中,首先使用括号()将匿名函数包裹起来,这是因为 JavaScript 解析器需要明确这里是一个表达式。然后紧跟另一个括号(),这个括号用于调用前面定义的函数。// 函数体console.log('这也是一个自执行函数');}());这种形式同样是将匿名函数用括号包裹,不过调用函数的括号被放在了匿名函数定义括号的内部。此外,除了用括号包裹,还可以使用!!console.log('使用!运算符的自执行函数');}()

2025-03-09 23:47:49 266

原创 闭包函数是什么?

闭包是指有权访问另一个函数作用域中的变量的函数。简单来说,即使该函数执行完毕,其作用域内的变量也不会被销毁,而是会被闭包所引用,从而可以在其他地方继续使用这些变量。

2025-03-09 23:45:47 380

原创 深入理解 DOM 元素

在网页开发的世界里,DOM(Document Object Model,文档对象模型)元素宛如一座桥梁,连接着静态的 HTML 结构与动态的 JavaScript 交互逻辑。它让原本呆板的网页变得鲜活生动,能够实时响应用户的每一个操作。今天,就让我们一同深入探索 DOM 元素的奥秘。

2025-03-09 23:43:31 451

原创 JavaScript 是什么?

在当今数字化的世界里,网页与我们的生活紧密相连,而 JavaScript(简称 JS)无疑是让网页 “动” 起来、充满交互性的神奇魔法。无论你是初涉编程的新手,还是经验丰富的开发者,深入了解 JS 都能为你的技术宝库增添强大力量。

2025-03-09 23:39:11 945

原创 原生AJAX和jQuery的Ajax区别

【代码】原生AJAX和jQuery的Ajax区别。

2025-03-02 23:58:26 377

原创 什么是 jQuery

jQuery 本质上是一个快速、小巧且功能丰富的 JavaScript 库。它将 JavaScript 中常用的功能代码进行了封装,为开发者提供了一套简洁、高效的 API,涵盖了 HTML 文档遍历与操作、事件处理、动画效果、Ajax 交互等诸多方面。通过使用 jQuery,开发者能够以更简洁的代码实现复杂的前端交互功能,大大提高开发效率。

2025-03-02 23:54:33 1255

原创 datalist 是什么?

提供预定义选项列表的容器。从外观上看,当用户在与之关联的输入框中进行输入操作时,会自动弹出一个下拉菜单,里面展示着一系列可供选择的预设值,就像一个智能助手,随时准备为用户提供输入建议。为省份输入框提供全国省份列表,用户无需记忆省份名称的准确拼写,避免了因输入错误导致的地址识别问题,几秒钟就能完成省份选择,快速进入后续城市、街道等信息的填写。中的匹配选项,比如用户输入 “苹”,下拉菜单就会优先展示 “苹果” 选项,方便用户快速选择,减少手动输入的工作量。提供的统一的下拉选择交互模式,与常见的下拉菜单(

2025-02-28 17:31:38 442

原创 相对、绝对路径的区别

绝对路径绝对路径是指文件或目录在文件系统中的完整位置描述,它从根目录开始,依次列出所有经过的目录和文件名,直到目标文件。在不同的操作系统中,根目录的表示有所不同。例如,在 Windows 系统中,通常以盘符(如 C:、D: 等)作为根目录,像就是一个指向file.txt文件的绝对路径;而在类 Unix 系统(如 Linux、Mac OS)中,根目录用表示,如。在 Web 开发中,绝对路径是指从网站的根域名开始的完整 URL 地址。例如,对于一个域名为的网站,如果有一张图片位于。

2025-02-28 17:28:47 883

原创 数组与对象的元素添加

向数组添加元素时,需要传递至少两个参数:第一个参数是要插入元素的位置,第二个参数是 0(表示不删除任何元素,只进行添加操作),后续参数就是要添加的元素。在用户信息管理系统中,当获取到用户的新信息,如用户的邮箱、电话号码等,就可以使用点表示法或方括号表示法向存储用户信息的对象中添加新属性,从而完整地记录用户信息。相反,它是在数组的开头添加一个或多个元素,并返回数组的新长度,同样会修改原数组。方法用于在数组的末尾添加一个或多个元素,并返回数组的新长度。方法添加到已有的数据数组中,实现数据的动态更新。

2025-02-23 18:26:33 394

原创 定时器的知识点总结

JavaScript 定时器是 JavaScript 提供的用于在指定时间间隔后执行代码的机制。它允许我们在程序中设置延迟执行或周期性执行的任务,为页面增添动态性和交互性。和,它们各自有着独特的功能和应用场景。

2025-02-23 18:12:04 257

原创 作用域的知识点总结

简单来说,作用域就是变量或标识符在程序中有效的范围。它就像是一个划定的区域,在这个区域内,变量可以被访问和操作。不同的编程语言对作用域的定义和实现方式略有不同,但总体概念是相似的。例如,在 JavaScript 中,作用域决定了变量在哪里以及在哪些地方可以被访问;在 Python 中,作用域决定了程序中变量的访问权限和生命周期。

2025-02-23 18:04:20 292

原创 闭包函数的优缺点

闭包函数是指在一个函数内部定义另一个函数,并且内部函数可以访问外部函数作用域中的变量。

2025-02-23 17:59:57 457

原创 JavaScript中内置对象

在 JavaScript 中,内置对象是指由 JavaScript 语言本身提供的、无需开发者自行定义就可以直接使用的对象。这些对象封装了一些常用的功能和数据结构,能够帮助开发者更高效地完成各种任务。

2025-02-16 21:11:39 358

原创 堆内存与栈内存

如果程序中动态分配的内存没有被正确释放,会导致内存泄漏。随着程序的运行,可用的堆内存会越来越少,最终可能导致程序崩溃。在 JavaScript 中,如果对象被循环引用且没有被垃圾回收机制正确处理,也会造成内存泄漏。

2025-02-16 21:05:34 261

原创 递归的示例

递归函数调用自身时,每次调用都会在调用栈(call stack)上创建一个新的栈帧(stack frame)。栈帧包含了函数的局部变量、参数和返回地址等信息。当遇到基本情况时,递归开始回溯,依次从调用栈中弹出栈帧,返回结果并继续执行上一层调用。

2025-02-16 21:01:32 349

原创 使用JavaScript实现深浅拷贝

浅拷贝创建一个新对象,新对象的顶层属性是原始对象属性的副本,但如果原始对象的属性是引用类型,新对象和原始对象会共享这些引用类型属性的内存地址。也就是说,修改新对象中引用类型的属性会影响原始对象中对应的属性。深拷贝会递归地复制对象及其所有嵌套的属性,创建一个完全独立的新对象,新对象和原始对象在内存中没有任何共享部分。修改新对象的任何属性都不会影响原始对象。基本数据类型存储的是值本身,而引用数据类型存储的是内存地址。当需要对数据进行操作且不想影响原始数据时,就需要进行拷贝。)和引用数据类型(如。

2025-02-16 20:58:43 203

原创 用 HTML、CSS 和 JavaScript 实现抽奖转盘效果

这段代码实现了一个简单的抽奖转盘效果。页面上有一个九宫格布局的抽奖区域,周围八个格子分别放置了不同的奖品名称,中间是一个 “开始抽奖” 的按钮。点击按钮后,抽奖区域的格子会快速滚动,颜色不断变化,模拟抽奖过程。经过一定圈数的滚动后,会随机停止在某一个格子上,弹出提示框显示中奖的奖品。

2025-02-01 14:35:30 1871

原创 用 JavaScript 打造交互式表格:添加与删除行功能

在网页开发中,创建交互式表格是很常见的。今天我们通过一个示例,来展示如何使用 HTML、CSS 和 JavaScript 实现一个能够动态添加和删除行的表格,并详细解释其中 JavaScript 部分的代码逻辑。

2025-02-01 14:11:42 703

原创 分页按钮功能

该文章结合运用了HTML,CSS,JS实现网页的分页按钮功能,并且可以选择每页显示的条数试试更新总页数及显示当前页和总数据条数。

2025-02-01 02:56:28 1094

原创 商品列表及商品详情展示

本文将展示一段结合 HTML、CSS 和 JavaScript 的代码,实现了一个简单的商品展示页面及商品详情,涵盖数据获取、渲染、搜索及排序等功能。

2025-01-31 15:21:55 890

原创 简单商品价格管理表

本文将结合 HTML、CSS 和 JavaScript 的代码,详细介绍如何构建一个具备商品添加、编辑、删除以及数量增减功能的表格,同时实现操作提示框的动态显示。拼接每一行商品的 HTML 代码,包含商品名称、价格、数量增减按钮、编辑和删除按钮,并为按钮绑定相应的点击事件。:表示操作类型,1 表示增加数量,2 表示减少数量,3 表示删除商品。数组中,隐藏添加输入框区域,重新渲染页面,并显示添加成功的提示框。,并将该商品的信息显示在编辑输入框中。:显示新增商品的输入框区域,并清空输入框中的内容。

2025-01-26 19:10:13 613

原创 简单树形菜单

对象从 JSON 文件中获取数据,将数据转换为树形结构,然后将树形结构渲染为 HTML 元素,并添加点击事件处理逻辑,实现菜单的展开 / 收起和内容的切换。在网页开发中,树形菜单是一种非常实用的,它可以清晰地展示具有层级关系的数据,并且能够方便用户进行导航和操作。元素的点击事件,当点击菜单项时,切换子菜单的显示 / 隐藏状态。根据树形结构生成 HTML 字符串,对于有子节点的菜单项,添加展开 / 收起的箭头图标。通过递归的方式将数据转换为树形结构,每个节点的子节点存储在。属性,显示相应的内容。

2025-01-26 17:54:13 300

原创 省市区三级联动

整体实现思路是通过 JavaScript 异步请求一个包含地区数据的 JSON 文件,将数据解析后根据用户的选择动态更新下拉框选项,最终实现三级联动效果。当用户完成地区选择后,会弹出一个提示框显示所选的地区信息,提示框会在 2 秒后自动消失。为了提供更好的用户体验,我们可以实现一个三级联动的地区选择器,让用户依次选择省份、城市和地区。文件获取数据,发送请求后监听其状态变化,当请求完成且响应状态码为 200 时,将响应的 JSON 文本解析为 JavaScript 对象,随后调用。文件中获取的地区数据。

2025-01-25 15:07:16 699

原创 使用JavaScript实现猜数字小功能

通过这个简单的猜数字游戏,我们学习了如何使用 JavaScript 生成随机数、处理用户输入、使用循环和条件语句进行逻辑判断。

2025-01-25 12:37:39 217

原创 递归树状菜单

5.递归调用parseTree,传data和当前数据的id作为pid(上面函数里是data和pid),为了查找当前数据的子集然后用child(子集)方法插入到当前数据后。想要判断一个节点有没有子节点就需要通过数据的长度来判断,如果长度大于0,那就是有内容,就进行一系列操作。3.循环遍历data数据,判断数据的pid是否等于我们传入的pid(父级的id)1.创建一个递归构建树形结构的函数接受两个参数(data,pid)递归树状菜单常用于一些网页的左边,每条都有子节点数据,让数据更可视化。

2025-01-19 08:41:37 341

原创 递归的练习

递归是一种编程技巧,它是指一个函数在其定义中直接或间接地调用自身的行为。示例:利用多层的for循环实现树状的数据排布:利用多层for循环也可以实现递归,但是如果数据量非常大的话,这样是及其不方便的。利用函数自身完成递归,代码量非常小。

2025-01-17 14:39:16 293

原创 堆内存与栈内存

堆内存(Heap Memory)和栈内存(Stack Memory)是计算机内存管理中的两个重要概念,在编程语言尤其是像 JavaScript 等高级语言的运行机制中起着关键作用。的栈内存值指向堆内存中的数组数据。当访问或修改对象、数组的属性时,需要通过引用找到堆内存中的对应位置进行操作。的赋值、修改等操作直接作用于栈内存中的值。在栈内存中有一个地址值,指向堆内存中存储。分别在栈内存中有对应的存储位置,对。这个对象的实际位置,同样。

2025-01-16 14:26:58 235

原创 JavaScript分页的制作

而显示内容的时候(当前页-1)为现实的页数,因为页数是从1开始的。后三页:调用页码跳转函数的时候(总页数-6)为传的参数,因为下标是从0开始的。而显示内容的时候(总页数-5)为现实的页数,因为页数是从1开始的。如果有很多条数据的话不可能一下就把所有的数据都显示出来,这样用户是没有耐心全部看完的,此刻就需要进行分页,比如五条数据一页,更直观的把数据展现出来。总页数小于6的情况:用简单的for循环生成所有的分页按钮(因为数据太少 所以没必要弄的复杂)总页数大于6的情况:(代表数据繁多,需要做分页处理)

2025-01-15 14:14:49 305

原创 JavaScript防抖与节流的运用

【代码】JavaScript防抖与节流的运用。

2025-01-14 16:23:03 835

原创 如何用JavaScript实现轮播图

轮播图自动轮播/鼠标放入轮播暂停/鼠标移出轮播继续/点击左右按钮切换图片/图片的防抖。4.平移函数:图片的位移逻辑都在这里面,后续通过定时器可以设置执行这个函数的时间周期.以为他的逻辑和平移函数一样,所以直接在里面调用平移函数。7.获取左右箭头,及初始化点击状态,方便后续进行一系列操作。2.AJAX部分,访问json文件并获取到里面的数据。5.鼠标事件函数,鼠标放到图上,轮播暂停。6.鼠标事件函数,鼠标移到图片外,轮播继续.部分所组成,主要的核心是js部分。1.全局声明: 以下声明放到全局。

2025-01-09 09:12:52 411

原创 关于简单购物车里的小功能解析

这篇文章将详细的解析一下购物车里的每个小功能及思路

2025-01-07 09:19:04 687

原创 利用JavaScript实现简单购物车

简单购物车是利用JavaScript和Ajax的一些基础功能来实现的一个小功能如下:JavaScript: Json部分:

2025-01-07 08:34:42 263

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除