随笔分类 -  JavaScript

1
摘要:什么是宏任务和微任务 JavaScript把异步任务又做了进一步的划分,异步任务又分为两类,分别是: 宏任务(macrotask) 异步的Ajax请求 setTimeout、setInterval 文件操作 其它宏任务 微任务(microtask) Promise.then、.catch和final 阅读全文
posted @ 2022-05-30 08:52 perfect* 阅读(61) 评论(0) 推荐(0) 编辑
摘要:JavaScript是单线程的语言 JavaScript是一门单线程的编程语言。也就是说,同一时间只能做一件事情; 单线程执行任务队列的问题: 如果前一个任务非常耗时,则后续任务就不得不一直等待,从而导致程序假死的问题 同步任务和异步任务 为了防止某个耗时任务导致程序假死的问题,JavaScript 阅读全文
posted @ 2022-05-28 17:56 perfect* 阅读(21) 评论(0) 推荐(0) 编辑
摘要:实现描述: 根据数据的多少,实现将数据动态显示在表格内,并实现删除元素的操作: 最终实现的效果图: 表格开始的搭建: 1 <style> 2 table { 3 width: 400px; 4 height: 200px; 5 margin: 100px auto; 6 text-align: ce 阅读全文
posted @ 2020-01-03 11:39 perfect* 阅读(2806) 评论(0) 推荐(0) 编辑
摘要:首先实现发布留言的功能: 运用到的知识点: 1、获取元素 2、注册事件 3、处理程序 在处理程序的时候用到的知识点: 创建元素:document.createElement(‘元素名’);由于先有元素才能赋值,因此需要先进行创建元素。 添加元素: 1、node.appendChild(child)n 阅读全文
posted @ 2020-01-03 09:46 perfect* 阅读(1320) 评论(0) 推荐(0) 编辑
摘要:一、数组去重 数组: ['red', 'yellow', 'green', 'blue', 'yellow', 'green', 'blue'] 目标,把旧数组中不重复的元素选取放到新的数组中,重复的元素只保留一个,放到新数组中去重 实现的结果: 实现数组去重的代码: 方法一: 1 var arr 阅读全文
posted @ 2019-12-23 11:00 perfect* 阅读(578) 评论(0) 推荐(0) 编辑
摘要:什么是事件对象呢? 在触发DOM上的事件时都会产生一个对象 事件对象event 1、Dom中的事件对象 a、type属性 用于获取事件类型 可以获取事件的类型: 代码: function show123(event){ //alert('欢迎来到perfect*博客园123'); alert(eve 阅读全文
posted @ 2019-11-13 21:32 perfect* 阅读(362) 评论(0) 推荐(0) 编辑
摘要:什么是事件流? 事件流 描述的是从页面中接受事件的顺序。 IE浏览器的是事件冒泡流 什么是事件冒泡呢? 事件冒泡:指事件最开始由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上传播至最不具体的那个节点(文档)。 例如: <div id="box"> <input type="butto 阅读全文
posted @ 2019-11-13 16:00 perfect* 阅读(973) 评论(0) 推荐(0) 编辑
摘要:JavaScript是干什么的? HTML是基本的网页(文字 图片 视频)CSS通过控制布局和样式让网页更加美观JavaScript是给网页添加动画和一些其他的交互事件,让网页变得更加活泼。JavaScript跟编程语言差不多,不过它不是编程语言,它是脚本语言,它的运行不需要编译,直接由解释器解释执 阅读全文
posted @ 2019-09-08 17:51 perfect* 阅读(218) 评论(0) 推荐(0) 编辑
摘要:在赌场21点游戏中,玩家可以通过计算牌桌上已经发放的卡牌的高低值来让自己在游戏中保持优势,这就叫21点算法。 根据下面的表格,每张卡牌都分配了一个值。如果卡牌的值大于0,那么玩家应该追加赌注。反之,追加少许赌注甚至不追加赌注。 需要写一个函数,实现21点算法,它根据参数 card的值来递增或递减变量 阅读全文
posted @ 2019-04-16 16:00 perfect* 阅读(450) 评论(0) 推荐(0) 编辑
摘要:我们经常会遇到选择省市县的下拉框。比如我们选择了省份的话,县的下拉框会自动筛选,接下来我们就做一个这样的省市联动吧!!! 先使用一个二维数组存储省份的信息: 定义一个onchange事件进行监听: 检验的结果: 打印出的结果说明数据已存入数组中,现在需要将它显示在下一个下拉列表中 代码: 1 <!D 阅读全文
posted @ 2019-03-16 11:58 perfect* 阅读(4754) 评论(0) 推荐(0) 编辑
摘要:最终效果: 代码: 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>全选功能</title> 6 <script> 7 8 function selectAll(choiceBtn){ 9 10 //docu 阅读全文
posted @ 2019-03-16 10:48 perfect* 阅读(3764) 评论(0) 推荐(2) 编辑
摘要:注册3次错误,最终的结果: 代码: 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>表单验证_02</title> 6 </head> 7 <body> 8 <!--把验证放在注册按钮的onclick事件属性 阅读全文
posted @ 2019-03-05 08:59 perfect* 阅读(364) 评论(0) 推荐(0) 编辑
摘要:最终效果 注:图片来源于百度图片 文件结构: 代码: 阅读全文
posted @ 2019-03-02 22:27 perfect* 阅读(544) 评论(0) 推荐(0) 编辑
摘要:表单验证可以通过 JavaScript 来完成 以下示例代码用于判断表单字段(Name)值是否存在,如果存在,则弹出信息,否则阻止表单提交: JavaScript 验证输入的数字 示例: HTML 表单验证也可以通过浏览器来自动完成。 如果表单字段 (Name) 的值为空, required 属性会 阅读全文
posted @ 2019-02-07 12:19 perfect* 阅读(6004) 评论(0) 推荐(0) 编辑
摘要:label语句 可以在代码中添加标签,以便使用。以下是label语句的语法: label:statement 示例: 该示例中定义的start标签可以在以后由break或continue语句引用,加标签语句一般都要与for语句等循环语句配合使用。 break语句和continue语句 break语句 阅读全文
posted @ 2019-02-02 11:32 perfect* 阅读(744) 评论(0) 推荐(0) 编辑
摘要:简单计算器 简单计算器 第一个数: 第二个数: + - * ... 阅读全文
posted @ 2019-01-31 19:03 perfect* 阅读(1734) 评论(1) 推荐(1) 编辑
摘要:分析说明: (1)获取Canvas元素 var canvas = document.getElementById("canvas"); (2)取到上下文 var context = canvas.getContext('2d'); (3)填充绘制边框 context.fillStyle = "#EE 阅读全文
posted @ 2018-10-25 15:24 perfect* 阅读(7483) 评论(0) 推荐(1) 编辑
摘要:布尔表达式一般用来判断某个条件或者表达式是否成立,其结果只能为true或false。 运行该段代码,在显示文本框中输入2010,单机按钮【按钮】后,系统会先判断是否为空,再判断文本框输入的数值是否合法,最后判断其是否为闰年并弹出相应的对话框。 文本框空时: 文本框中输入2018时: 文本框中输入20 阅读全文
posted @ 2018-10-24 23:50 perfect* 阅读(1310) 评论(0) 推荐(1) 编辑
摘要:甜点1:什么是脚本语言? 脚本语言是由传统编程语言简化而来的,它与传统的编程语言既有很多相似之处,又有很多的不同之处。脚本语言的最显著的特点是:首先它不需要编译成二进制,以文本的形式存在;其次就是脚本语言一般需要其他语言的调用执行。 甜点2:JavaScript是Java的变种吗? JavaScri 阅读全文
posted @ 2018-10-24 22:56 perfect* 阅读(208) 评论(0) 推荐(0) 编辑
摘要:最终效果: 页面加载时: 页面关闭时: 阅读全文
posted @ 2018-10-24 21:54 perfect* 阅读(1437) 评论(0) 推荐(0) 编辑

1
$(function() { $('#cnblogs_post_body img').each(function() { let imgSrc = $(this).attr('src'); let year = parseInt(imgSrc.substr(imgSrc.indexOf('g')+1,4)); if(year >= 2022){ imgSrc += `?watermark/2/text/amlndWl5YW4=/font/5a6L5L2T/fontsize/15/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast`; $(this).attr('src', imgSrc) } }) })
点击右上角即可分享
微信分享提示