网站前端

SVG、JavaScript、CSS、HTML、各种框架。Web前端开发是从美工演变而来的,名称上有很明显的时代特征。在互联网的演化进程中,Web 1.0时代,网站的主要内容都是静态的,用户使用网站的行为也以浏览为主。

各种各样的框架让人目不暇接,新技术层出不穷。让我们这些前端狗情何以堪。

目前web前端工程师的年薪待遇平均在10万以上,高级HTML前端工程师年薪达30—50万,很多企业对于与web前端相关的技术职位更是求贤若渴。

浏览器后退导致代码重复执行如何处理?

2023年06月30日

浏览器后退导致代码重复执行是由于浏览器历史记录中包含了页面的状态和 JavaScript 代码的执行状态。当用户点击浏览器的后退按钮时,浏览器会加载历史记录中的前一个页面,并重新执行其中的 JavaScript 代码,导致代码重复执行。为了处理这个问题,可以采取以下几种方法:使用无刷新页面加载技术:使用AJAX或其他无刷新页面加载技术可以在不刷新整个页面的情况下更新页面的部分内容。这样,在浏览器后...

JavaScript 时间计算

2023年06月28日

最近需要计算时间,例如:现在的时间增加两个月,或者是增加 N 个月,使用 JavaScript 应该如何计算呢?我们可以使用JavaScript中的Date对象和相关方法。下面是一个示例代码,展示了如何获取当前日期并对其进行月份增加:// 获取要操作的元素 const currentExpireDate = document.getElementById('current-expire-date...

JavaScript 字符转换成数字

2023年06月28日

在 JavaScript 中,你可以使用内置的parseInt()函数或parseFloat()函数将字符串转换为数字。这两个函数的区别在于parseInt()只会返回整数部分,而parseFloat()可以返回浮点数。下面是使用parseInt()和parseFloat()的示例代码:// 使用parseInt()将字符串转换为整数 const str1 = "123"; const num...

JavaScript 数字保留两位小数

2023年06月28日

我们在在 JavaScript 中页面上存在金额计算的时候,需要保留两位小数。我们可以使用 toFixed() 方法将数字保留指定的小数位数。这个方法会返回一个字符串,表示指定小数位数的数字。下面是使用 toFixed() 方法计算保留两位小数的示例代码:const number = 3.14159; const roundedNumber = number.toFixed(2); conso...

jQuery .ajax 返回 responseText 如何序列化成 json

2023年06月27日

在使用 jQuery .ajax 提交数据的时候,提交数据有问题,后端返回 400 错误,返回的 400 错误 responseText 为文本类型数据,如何将 responseText 序列化成 json 数据呢?要将返回的responseText序列化为JSON对象,我们以使用JSON.parse()方法。下面是使用jQuery的.ajax()方法获取responseText并将其序列化为JS...

浅谈浏览器通知 Notification

2023年06月26日

前言前段时间接到一个需求,我们的web系统有电话接听功能。产品希望有电话呼入的时候,能够有效提示用户,无论用户是否在当前的系统页签上,甚至浏览器被最小化以后也能提醒用户。就着这个需求,我做了一些探索。前端对用户的通知一般局限于页面之内,比如alert,confirm。或者js控制一个弹窗提醒用户。有些场景需要在页面之外通知用户,即当用户页签不在本页面,或者浏览器已经被收起来的情况。本文介绍一些浏览...

Fetch 提交数据与 CSRF

2023年06月24日

如果使用 fetch 的方式更新数据,同时后端需要先认证 csrf 数据,如果没有 csrf 数据 则会出现 400 错误。下面是一个使用 fetch 的方式更新数据,同时提交 csrf 数据的示例:function changeAPIToken() { // 点击更改 token 按钮之后触发的动作 const changeButton = document.getElementById('kt...

Angular FormGroup dirty 和 touched 理解

2023年06月15日

FormGroup.dirty 和 FormGroup.touched 是两个布尔值属性,它们用于表示 Angular 表单的状态。dirty 属性表示表单是否被用户修改过。如果表单的值发生了变化,则 dirty 属性为 true。touched 属性表示表单是否被用户触摸过。如果用户在表单元素上进行了触摸(通常是通过单击或聚焦),则 touched 属性为 true。这两个属性可以帮助开发人员在...