自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 js如何渲染页面内容

可以使用 document.createElement 创建新的元素,然后使用 appendChild 将其添加到父元素中。在前端开发中,JavaScript 可以通过操作 DOM(文档对象模型)来动态地渲染页面内容。:可以通过设置元素的 innerText 或 textContent 属性来改变元素的文本内容。:可以通过设置元素的 innerHTML 属性来改变元素的内容。:可以使用 ES6 中的模板字符串来动态生成 HTML 内容。:可以使用 setAttribute 方法来设置元素的属性。

2024-07-18 08:48:18 233

原创 使用js对文本框设置字数限制

前端语言中,还是有很多内容可以用到对字数做限制的。通过textarea输入框进行限制。下面就是实现的步骤,相对来说,还是比较简单的,大家可以借鉴一下。

2024-07-15 18:16:26 255

原创 http和https分别是什么?区别是什么?

HTTP协议通常承载于TCP协议之上,有时也承载于TLS或SSL协议层之上,这个时候,就成了我们常说的HTTPS。HTTP不提供任何加密,它是明文传输的,因此数据在传输过程中可能被窃取或篡改。而HTTPS使用SSL/TLS加密所有传输的数据,因此数据在传输过程中是安全的,不易被窃取或篡改。HTTPS开发的主要目的是提供对网站服务器的身份认证,保护交换数据的隐私与完整性。HTTP和HTTPS是两种常见的网络协议,用于在Web上进行数据传输。3.端口:HTTP的默认端口是80,而HTTPS的默认端口是443。

2024-07-14 09:46:53 588

原创 什么是模板字符串?

模板字符串(Template Literals)是ES6(ECMAScript 2015)中引入的一种新的字符串表示方法,允许我们嵌入表达式,并在运行时将它们转换为字符串。1.嵌入表达式:使用${expression}语法,可以在模板字符串中嵌入JavaScript表达式,这些表达式在模板字符串被创建时会被计算并转换为字符串。3.字符串插值:模板字符串支持字符串插值,允许我们将变量、常量或表达式直接插入到字符串中。2.多行字符串:模板字符串可以包含换行符和制表符,使得创建多行字符串变得更加容易。

2024-07-14 09:44:45 304

原创 全局变量和局部变量在堆和栈的区别

总结起来,全局变量和局部变量在堆和栈的区别主要在于存储位置和生命周期。而局部变量存储在栈中,只在其所属的函数执行期间存在。栈是一种先进后出(Last-In-First-Out,LIFO)的数据结构,用于存储函数调用时的临时变量、函数的参数值等。局部变量的生命周期与其所属的函数相关。全局变量存储在静态存储区,也就是程序的全局数据区或者称为全局内存。全局变量的生命周期从程序开始运行到程序结束,它的值在整个程序的执行过程中都保持不变。全局变量和局部变量在堆和栈的区别主要体现在它们的存储位置和生命周期上。

2024-07-13 18:01:50 275

原创 js登陆验证

当开始制作网页时,就需要做一个判断,不管在第几页进入,都要加一个登陆验证,只有用户有账号,才能进入网页,浏览网页信息。下面就来看一下,使用JavaScript几行代码实现登陆验证。首先 登录页是index.html命名的。然后再登陆成功时存储一个值,值为用户的id。然后在其他页面取值,判断是否有用户id,没有则直接跳转到登录页进行跳转。

2024-07-13 17:56:15 377

原创 js中this是指向的哪个全局变量,改变this指向的方法有什么?

2. **显式绑定**:通过 `call`、`apply` 或 `bind` 方法,可以显式地指定函数内部 `this` 的指向。`this` 是指向当前执行上下文的对象,它的指向取决于函数被调用的方式。中的 `this`**:当使用 `new` 关键字调用构造函数时,`this` 会指向新创建的实例对象。4. **箭头函数**:箭头函数没有自己的 `this`,它会捕获其所在上下文的 `this` 值。1. **隐式绑定**:当一个函数作为对象的方法被调用时,`this` 会指向该对象。

2024-07-10 20:59:05 637

原创 AJAX是什么?原生语法格式?jQuery提供分装好的AJAX有什么区别?

https://i-blog.csdnimg.cn/direct/07129ff62b56421e8726da909cf6d070.jpeg

2024-07-08 09:14:54 702

原创 什么是js?

JavaScript是一种直译式脚本语言,一种动态类型、弱类型、基于原型的高级语言。简单型:js采用的是弱类型,并未使用严格的数据类型。ECMAScript是js的基础,也是js的核心。跨平台行:js是由浏览器本身而非操作系统。动态性:js是以事件驱动的方式进行的。bom:浏览器对象模型。dom:文档对象模型。

2024-07-07 20:33:52 323

原创 使用递归写树形结构

下面我们要写一个树形结构,要求打开页面只有父级显示在页面上,子级默认隐藏,只有有子级的父级才会有下拉箭头,并且鼠标放在选中的内容上有hover效果,选中的元素会和其他的元素有明显的区别。点击父级展开下拉箭头颠倒,子级出现。我们可以使用递归地方法写树形菜单栏,树形菜单栏的应用场景有很多,使用递归地方法可以快速地转化数据格式。使用for循环,一次只能到一层,要嵌套,并且数据不一定有几层,但递归的方法可以无限的转化数据格式。

2024-07-02 16:16:10 573

原创 js的循环中foreach、for in和for of的区别

`for...of` 适用于遍历可迭代对象,遍历的是对象的值,可以使用 `break` 和 `continue`,可以返回结果。- `forEach` 适用于数组和类数组对象,无法使用 `break` 或 `continue`,不能获取索引值,不能返回结果。- `for...in` 适用于遍历对象的属性,也可以遍历数组的索引,可以使用 `break` 和 `continue`。- 适用于遍历可迭代对象,如数组、字符串、Set、Map 等。- 适用于遍历对象的属性,包括继承的可枚举属性。

2024-07-02 15:46:40 333

原创 JavaScript中什么是原型?有什么用?

原型是JavaScript实现继承的基础,它构成了JavaScript中对象之间的链式关系。1. **属性和方法的继承**:当我们访问对象的属性或方法时,如果该对象本身没有这个属性或方法,JavaScript会沿着原型链向上查找,直到找到对应的属性或方法。3. **构造函数与实例**:在JavaScript中,构造函数的`prototype`属性指向了一个对象,这个对象就是实例的原型。4. **动态性**:可以通过修改原型对象,动态地为已存在的对象添加新的属性和方法,这对于类似继承和扩展的需求非常有用。

2024-07-02 15:40:03 194

原创 input的23种属性

datetime-local 定义 date 和 time 控件(包括年、月、日、时、分、秒、几分之一秒,不带时区)。datetime 定义 date 和 time 控件(包括年、月、日、时、分、秒、几分之一秒,基于 UTC 时区)。range 定义用于精确值不重要的输入数字的控件(比如 slider 控件)。date 定义 date 控件(包括年、月、日,不包括时间)。time 定义用于输入时间的控件(不带时区)。url 定义用于输入 URL 的字段。

2024-06-29 09:07:16 343

原创 团队筛选功能,上一页,下一页,数字按钮省略

团队筛选不仅可以点击上一页,下一页,数字,首页,尾页可以跳转对应页面,还可以根据数字按钮的长度省略按钮,当排序达到十页时,才会触发。小于十页,全部显示。

2024-06-29 08:35:17 319

原创 oninput和onchange事件有什么区别?

会在表单元素的值发生变化时立刻触发,无论是通过键盘输入、粘贴、剪切、拖拽等方式,都能实时响应。oninput事件:触发事件:在域内容更改时触发(严格说是用户输入时触发);l.oninput事件是在元素值发生变化时立即触发,而onchange事件是在元素失去焦点时触发。onchange事件:触发条件:在域内容更改时触发,也可用于单选框和复选框改变后触发;oninput和onchange都是常见的表单元素的事件,它们的区别在于触发的时机不同。对象:select、input、textarea。

2024-06-28 14:30:39 350

原创 使用js实现input框的模糊搜索

json假数据:使用数组包对象的方法,在json中设置了三列数据,分别是:名称,性别和交易额。上面的代码是通过假数据中的name值来进行模糊搜索,我们也可以使用性别或交易额来进行模糊搜索,将if判断中的data[i].name换成性别或交易额就可以实现。使用简单的js代码就可以实现模糊搜索功能,使用indexOf属性。

2024-06-25 16:30:48 441

原创 js中浅拷贝和深拷贝的区别

浅拷贝(shallow copy):只复制指向某个对象的指针,而不复制这个对象本身,新旧对象共享一。深拷贝(deep copy)):复制并创建一个一模一样的对象,不共享内存,修改新对象旧对象不会改。基本数据类型都是按值访问的,我们可以直接操作保存变量中的实际值,而引用数据类型如Array,我们不能直接操作对象的堆空。如何区分深拷贝和浅拷贝:简单的说,就是假设B复制了A,当修改A时,看B是否会发生变。如果B没变,那就是深拷贝,自食其力。间,引用数据类型的值都是按引用访问的,即保存在变量对象中的一个地址。

2024-06-22 17:27:34 435

原创 什么是json?json可以存放在哪几种数据类型?在什么时候用?

基于ECMAScript(欧洲计算机协会制定的js规范)的一个子集,采用完全独立于语言的文本格式来存储和表示数据。3.对象(Object):无序的键值对集合,其中每个键都是一个字符串,每个值可以是一个字符串、4.数字、对象、数组、布尔值或null。5.数组(Array):有序的值的集合,每个值可以是一个字符串、数字、对象、数组、布尔值或null。1.字符串(String):由双引号包围的任意数量的Unicode字符。6.布尔值(Boolean):可以是true或false。

2024-06-22 17:20:51 634

原创 常见的HTTP响应状态码有哪些?

HTTP状态码:200 请求成功;500 内部服务器错误;post 传输的数据量较大,一般被默认为不。请求参数会被完整保留在浏览器历史记录里,而。GET请求和POST请求的区别是什么?request body 传递参数,对于用户来说是不可见的,所有更安全。2.get 传输数据量较小,因为。3.对于参数的数据类型,get。post 中的参数不会被保留。1.get 是将参数包含在。中明文传输,不安全。post 没有限制。

2024-06-20 08:14:51 248

原创 基础购物车(Javascript)

使用Javascript写一个基础购物车,其中包含商品数量加加减减,下面的总价和总数量跟着商品数量变动,还可以自己添加需要的商品。

2024-06-18 17:19:20 366

原创 DOM的概念?获取html元素的方法有哪些?

同级元素.nextElementSibling(‘’) 获取同级元素的下一个元素;子元素.parentNode(‘’) 获取当前元素的父节点;父元素.children(‘’) 获取当前元素的子节点;Dom文档对象模型,对js的HTML具有操作能力。选择器获取匹配上的第一个元素。选择器获取匹配上的所有元素。通过标签名来查找元素。

2024-06-16 08:44:51 287

原创 js中有哪些函数?

箭头函数:允许我们用更短的语法定义函数。箭头函数可用于替代传统函数function() {}。当不确定有多少个参数被调用的时候,可以使用arguments来获取;缺点:闭包函数占有内存资源,过多的使用闭包函数会造成内存溢出的缺点。闭包函数:内部可以访问外部,外部不能访问内部,具有封闭性,安全性。自执行函数:自动执行的函数,不可以被调用,也称为一次性函数;arguments是什么?命名函数:通过function声明的函数;闭包函数的优点:封闭性,安全性,持久性;匿名函数:通过函数表达式定义的函数;

2024-06-16 08:39:25 282

原创 条件循环语句有哪些?语法?区别?

do-while不可以通过break关键字在循环过程中跳出。do-while优先执行循环体,再判断执行条件是否符合。while优先判断执行条件是否符合要求,再执行循环体。while可以通过break关键字在循环过程中跳出。while可能出现一次都不执行循环体的情况。do-while至少会执行一次循环体。区别:语法格式不同;

2024-06-15 08:00:49 564 1

原创 运算符有哪些?优先级是怎么样的?转换数据类型的方法?(最少4种)

(赋值)+=(加后赋值)-=(减后赋值)*=(乘后赋值)/=(除后赋值)%=(取模后赋值比较运算符:==(相等)===(严格相等,不仅比较值还比较类型)!==(严格不相等)>(大于)<(小于)>=(大于等于)<=(小于等于)toString;+(加法)-(减法)*(乘法)/(除法)%(取模,返回除法的余数)++(自增)--(自减)小括号>一元运算符>算数运算符>关系运算符>相等运算符>逻辑运算符>赋值运算符;逻辑运算符:&&(逻辑与)||(逻辑或)!自增,自减运算符(又叫一元运算符):++;

2024-06-15 07:59:26 275

原创 JavaScript的尺寸

打印屏幕高度 console.log(window.screen.availHeight);打印浏览器高度 console.log(window.innerHeight);window.screen.availWidth 屏幕宽度。window.screen.availHeight 屏幕高度。

2024-04-11 18:30:00 218

原创 JavaScript声明变量的几种方式

4. import命令具有提升效果,会提升到整个模块的头部,首先执行(因为import命令是在编辑阶段执行的,在代码运行之前);let没有变量提升,不可重复声明,变量需要先声明后再使用,否则会报错;let是块级作用域;1. import命令接受一对大括号,其里面的变量名必须与被导入的模块对外的名称相同;var有变量提升,var可重复声明;没有块的概念,可以跨块访问,不能跨函数访问;let 同样是块级作用域,不可重复声明,没有变量提升。3. import命令输入的变量都是只读的;定义的变量,一旦定义后,就。

2024-04-09 10:07:50 451

原创 JavaScript 输出与弹框

中的警告弹框,该语句会将内容以弹窗的形式提示用户。中常用的调试语句,该语句会将内容输出到控制台的。中的输出语句,该语句会将内容输出到页面上,并且。

2024-04-09 08:03:31 256

原创 js怎样控制浏览器前进、后退、页面跳转

-这种方法可以控制页面前进或后退,其参数为正数时前进,负数时后退,为0时刷新当前页面。-这种方法可以直接改变当前页面的地址,不打开新的标签页。--这种方法可以打开新的标签页并在新标签页跳转到页面。--这种方法可以返回上一个页面,相当于浏览器的后退。

2024-04-08 23:38:25 447

原创 js常用的几种事件

onmousedown鼠标按钮被按下、onmouseup鼠标按键被松开、onmousemove鼠标被移动、onmouseover鼠标移动到某元素上、onmouseout鼠标从某元素移开。:onkeydowm某个按键被按下、onkeyup某个按键被松开、onkeypress某个键盘按键被按下并松开选择和改变事件:onchange域的内容被改变、onselect文本被选中。:onsubmit提交按钮被点击、onreset重置按钮被点击、oninput在input框被输入内容时。

2024-04-08 23:31:49 177

原创 JavaScript的命名规则

2.js语法以分号或换行符结尾。命名规范:使用大写字母和下划线来组合命名,下划线用来分隔单词。4.类&构造函数:命名方法:大写驼峰式命名法,首字母大写。私有属性和方法:前缀为下划线_,后面跟公共属性和方法一样。首字母小写,后边单词的首字母大写。单词与单词中间以下划线链接。(1)公共属性和方法:跟变量和函数命名一样。3.函数&方法:命名方法:小驼峰式命名法。1.变量:命名方法:小驼峰式命名法。2.常量:命名方法:名词全部大写。命名规范:前缀应该为动词。命名规范:前缀为形容词。命名规范:前缀为名称。

2024-04-08 23:28:13 395

原创 JavaScript 书写位置

期维护,复用性不强,如果下一个元素有同样的功能,就造成代码重复性很高。代码比较集中,耦合度较低,便于维护,但仅限于当前页面的使用,无法被。耦合度,便于代码的维护和扩展,还有利于代码的复用。,这种方式的结构、行为分离不够彻底,不利于后。分为三种使用方法,分别为行内,内嵌,外部。代码实现有效分离,降低。

2024-04-08 22:41:02 351

原创 JavaScript的事件对象

官方解释:event 对象代表事件的状态,比如键盘按键的状态、鼠标的位置、鼠标按钮的状态等。简单理解:事件发生后,跟事件有关的一系列信息数据的集合都放到整个对象里面,这个对象就是事件对象event,它有很多属性和方法。事件可以由用户操作触发,例如:鼠标事件、键盘事件等等;也可以通过 JS 脚本代码来触发,例如:通过element.click()方法,触发对应元素的点击事件;还可以由API生成,例如:动画完成后触发对应事件、视频播放被暂停时触发对应事件;最后还可以通过自定义事件来进行触发。

2024-04-08 18:00:00 884

原创 JavaScript 事件流

同样是以上示例,document对象会先接收到click事件,然后沿着DOM树向下传播到事件的目标元素,捕获顺序为:document -> html -> body -> div,浏览器都是从window对象开始捕获的。与HTML之间的交互是通过事件实现的,而用户与浏览器页面的互动也是通过事件来实现的事件就是文档或浏览器窗口中发生的一些特定的交互瞬间,所以分为两种事件,一是发生在。页面触发一个事件时,会按照一定的顺序来响应事件,事件的响应过程为事件流。是目标元素接受事件,然后逐级向上传播到顶级元素为止。

2024-04-05 23:33:09 556

原创 jQuery的作用及入口函数

(1) jQuery :简洁、快速、灵活跨浏览器的JavaScript库,即js文件,由John Resig在2006年1月正式发布。(2) jQuery强调的理念是“write less,do more”(3) 进入jQuery官方网站http://jquery.com下载最新的jQuery库文件。(4) jQuery文件不需要安装,把下载的js文件放在网站上的一个公共位置,当某个页面上使用jQuery时,只需在相关的HTML文档中引入该库文件即可,就可以使用jQuery的功能。

2024-03-30 08:59:30 313

原创 jQuery简介

是一个快速,小型且功能丰富的JavaScript库。借助易于使用的API(可在多种浏览器中使用),使HTML文档的遍历和操作,事件处理,动画和Ajax等事情变得更加简单。jQuery是JavaScript的一个工具库,工具库就是指封装好的JavaScript函数,可以直接在程序中进行调用,那jQuery就是一款非常流行的JavaScript库。jQuery设计的宗旨是“写更少的代码,做更多的事情”。

2024-03-29 23:21:36 864 1

原创 如何使用JavaScript制作轮播图

使用以上代码写出来的轮播图,在图片下方会有相对应图片变色的小圆点,可以点击上一张或下一张更换图片。

2024-03-29 18:06:08 346

原创 分页功能制作

以下为分页功能结构,下面可以点击上一页,下一页及数字,还可以自己输入想要跳转的页面点击跳转。下面每页显示的内容也会跟着改变。还可以选择不同的每页显示数据的条数。默认为每页五条数据。使用HTML,css,js和json假数据制作分页功能。

2024-03-27 10:08:25 253

原创 鼠标事件(点击换色)分别使用js和jQuery代码实现

js代码实现:按键盘时换色,不按是另一个色。jQuery代码实现。

2024-03-17 16:02:45 458

原创 JavaScript 地址信息与页面跳转及跳转传参

window.location.href = ‘URL’ 通过改变 location.href。window.location.replace(‘URL’) 通过 location.replace。window.location.assign(‘URL’) 通过 location.assign。window.location.href 返回当前页面的。

2024-03-17 15:52:27 504

原创 JavaScript BOM 的概念(浏览器对象模型)

和浏览器进行交互,可以获取屏幕尺寸,窗口大小,页面地址,历史记录等浏览器相关信息,也可以控制浏览器执行某些。window.close() 关闭当前窗口。window.resizeTo() 调整当前窗口的尺寸。window.moveTo() 移动当前窗口。行为:弹出信息,页面跳转,打开窗口,关闭窗口,调整窗口大小等。全局变量、全局函数会自动成为。

2024-03-16 17:22:05 406

空空如也

空空如也

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

TA关注的人

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