JavaScript
文章平均质量分 74
平时使用js的一些心得体会
草木红
这个作者很懒,什么都没留下…
展开
-
用 JavaScript 实现,拖动元素在表格 (一个范围) 内移动
基于 jQuery 可以让一个元素在一个范围内拖动原创 2023-06-07 11:04:57 · 1170 阅读 · 0 评论 -
移动端滑动(touch)选项并实现多选效果
移动端实现下拉选项的多选效果原创 2023-04-03 13:25:20 · 1159 阅读 · 0 评论 -
移动端滑动(touch)选项并进行单选
移动端实现滑动选择选项原创 2023-04-03 13:26:09 · 457 阅读 · 0 评论 -
js 发送网络请求失败后,自动重新发送请求
当发送的网络请求因为各种原因失败后,希望自动重新发送请求,直到请求成功。函数模拟一个 HTTP 请求,并在前4秒失败。原创 2023-04-06 10:38:48 · 931 阅读 · 1 评论 -
js写的一个简单的时间范围日历
简单的日历,用js和flex布局实现原创 2023-01-06 16:20:36 · 999 阅读 · 1 评论 -
javascript编写的抽奖小程序
js写的抽奖系统,旨在提供一个思路原创 2022-08-01 09:14:25 · 134851 阅读 · 1 评论 -
滚动、切换、添加、删除导航栏
实现导航栏的滚动、切换、添加、删除,并执行动画效果。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"&g原创 2022-01-27 15:04:51 · 1086 阅读 · 0 评论 -
JS 中使用 setMonth 和 setFullYear 方法获得的日期有误
js中的setMoth 和 setFullYear 方法得到得日期不是自己设置的日期原创 2021-12-31 11:26:38 · 1301 阅读 · 0 评论 -
模块化
(一) 利用闭包来实现简单的模块化[1]. 当js文件过多是,为了避免变量的污染,就要将js代码模块化[2]. 使用匿名函数来将变量放在函数内部,如果需要将匿名函数内部的变量暴露到外边让其他人使用,可以在匿名函数中定义一个对象,将变量当做对象的属性,然后return出去。[3]. 一个简单的模块Avar modelA = (function(){ var obj = {}; var num1 = 1; var num2 = 2; sum = nu原创 2020-05-14 14:09:46 · 428 阅读 · 0 评论 -
bootstrap-datepicker 时间选择控件属性和方法
官方文档:https://getdatepicker.com/4/moment.js地址:https://github.com/moment/moment/tree/master需要用到的js和css(按顺序引用):bootstrap.min.cssbootstrap-datetimepicker.cssjquery.jsmoment-with-locales.js (moment.js地址中可以获取)zh-cn.js (属于moment-with-locales.js的一部分)boo原创 2021-08-04 18:02:44 · 12309 阅读 · 0 评论 -
selectpicker.js 下拉框多选控件的属性和方法
中文网:https://www.bootstrapselect.cn/index.htmgithub:https://github.com/snapappointments/bootstrap-select需要用到的js和css(按顺序引用):bootstrap.min.cssbootstrap-select.cssjquery.min.jsbootstrap.min.jsbootstrap-select.jsdefaults-zh_CN.js 显示错误时所用的语言选项选项可以原创 2021-08-03 17:42:28 · 7293 阅读 · 0 评论 -
Event.preventDefault 、Event.stopPropagation 和 Event.stopImmediatePropagation
Event.preventDefault() 取消浏览器对当前事件的默认行为。Event.stopPropagation() 阻止事件冒泡。Event.stopImmediatePropagation() 阻止同一个事件的其他监听函数被调用,不管监听函数定义在当前节点还是其他节点。也能阻止事件的冒泡。Event.preventDefault该方法生效的前提是,事件对象的cancelable属性为true,如果为false,调用该方法没有任何效果。<a id="link" href="h.原创 2021-06-21 10:39:41 · 523 阅读 · 0 评论 -
Event.currentTarget、Event.target 和 MouseEvent.relatedTarget
currentTarget 和 targetcurrentTarget 和 target 属于事件对象(Event)的实例属性Event.currentTatget 是事件当前正在通过的节点。随着事件的传播,这个属性的值会变。e.currentTarget总是等同于监听函数内部的thisEvent.target 事件的原始触发节点。这个属性不会随着事件的传播而改变。 MouseEvent.relatedTargetMouseEvent.relatedTarget 属于鼠标事件对象(Mo..原创 2021-06-21 09:47:02 · 952 阅读 · 0 评论 -
formData处理表单
一、FormData 对象和方法FormData()构造函数的参数是一个 DOM 的表单元素,构造函数会自动处理表单的键值对。这个参数是可选的,如果省略该参数,就表示一个空的表单。//生成表单实例:var form = document.getElementById("myForm");var formData = new FormData(form);表单实例的方法:方法名描述get(key)获取指定键名对应的键值,参数为键名。如果有多个同名的键值对,则返回第一个键值对原创 2021-03-12 09:29:56 · 331 阅读 · 0 评论 -
javascript的类型转换规则和判断数据类型
(一). 类型转换[1].转字符串String()参数类型结果Undefined“undefined”Null“null”Booleantrue,返回“true”;false 返回“false”Number普通数字被转换为数字字符串;NaN被转为“NaN”;10n被转为“10”Symbol“Symbol()”[2]. 转布尔值Boolean()参数类型结果false、undefined、null、+0、-0、NaN、“原创 2020-12-31 13:48:06 · 126 阅读 · 0 评论 -
validate.js 表单校验插件
菜鸟教程: https://www.runoob.com/jquery/jquery-plugin-validate.html(一) 使用步骤导入jquery.js,validate基于jquery导入validate.js页面加载成功后,对表单进行校验,$(“选择器”).validate();<form action="" id="login"> 必填: <input type="text" name="userName" id=""><br /原创 2020-12-09 12:57:56 · 3932 阅读 · 1 评论 -
前端JavaScript面试
一、JS基础知识(一) 变量类型和计算[1]. 知识点类型分类引用类型:array、function、object值类型:undefined,string,number,boolean,null强制类型转换字符串拼接var b = 100 +'10' //'10010'==运算符100 == '100' //truenull == undefined //trueif语句var a = 100if(a){ //...}逻辑运算console.l原创 2020-11-11 13:09:32 · 689 阅读 · 0 评论 -
系统面试
一、一面/二面(一) 页面布局假设高度已知,请写出三栏布局,其中左栏、右栏宽度各位300px,中间自适应。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Documen原创 2020-11-01 18:16:14 · 290 阅读 · 0 评论 -
selectize.js 单选下拉框控件的属性和方法
Selectize是一个可扩展的基于jQuery 的自定义下拉框的UI控件。它对展示标签、联系人列表、国家选择器等比较有用。它的大小在~ 7kb(gzip压缩)左右。提供一个可靠且体验良好的干净和强大的API。文档:https://github.com/selectize/selectize.js用例:https://github.com/selectize/selectize.js/tree/master/examples一、配置selectize属性会添加到原始的<select>原创 2020-10-23 10:26:18 · 3833 阅读 · 1 评论 -
8. async函数和await表达式
(一) async异步函数https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/async_functionasync函数的返回值为promise对象。promise对象的结果由async函数执行的返回值决定。一个async异步函数可以包含await指令,该指令会暂停异步函数的执行,并等待Promise执行,然后继续执行异步函数,并返回结果。(二) await 表达式https://deve原创 2020-08-26 16:57:57 · 427 阅读 · 0 评论 -
Promise 从基础到深入
promise是ES6中的特性,是异步编程的一种解决方案。promise的作用就是对异步请求的封装。promise是一个对象,对象和函数的区别就是对象可以保存状态,函数不可以(闭包除外)(一) promise 基础new Promise( (resolve, reject)=>{ //一段耗时的异步操作 //判断操作是否成功 if(true){ resolve('成功');//操作成功,并传递变量 }else{ reject('失败');//操作失败,并传递变.原创 2020-05-20 11:32:08 · 184 阅读 · 0 评论 -
6.JavaScript笔记
一、基础文档:https://developer.mozilla.org/zh-CN/(一) 数据类型1. Number 数字型[1]. Infinity 和 -Infinity表示无穷大和无穷小//无穷大//Number.MAX_VALUE获取最大值console.log(Number.MAX_VALUE *2); //无穷小console.log(Number.MIN_VAL...原创 2020-04-17 10:02:23 · 651 阅读 · 0 评论 -
8. js实现PC轮播图(banner)
图片大小为721*455css *{ padding:0; margin: 0; } ul{ list-style: none; } ol{ list-style: none; } img{ vertical-align: bottom; } .banner_box{ text-align: center; ...原创 2020-04-12 10:15:47 · 270 阅读 · 0 评论 -
7. todoList待办事情列表(js本地存储)
功能2. css代码*{ padding:0; margin:0;}ul{ list-style: none;}ol{ list-style: none;}body{ background-color: #cdcdcd;}h2{ margin:20px 0; position: relative;}h2 span{...原创 2020-04-12 10:02:09 · 345 阅读 · 0 评论 -
4. js移动端点触(tap)事件
移动端本身就有click事件,但是该事件在touch事件之后发生,延迟时间为300ms,影响用户体验tap事件(不是移动端原生事件,通过touch相关事件衍生过来)使用tap事件,响应的速度比click要快fastclick.js可以提高移动端click响应速度<!DOCTYPE html><html lang="en"><head>...原创 2020-03-22 11:34:40 · 1393 阅读 · 0 评论 -
3.js移动端滑动手势
只对触摸手势起作用,不能鼠标控制<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <t...原创 2020-03-22 10:22:22 · 420 阅读 · 0 评论 -
2.移动端web轮播图
html+css 轮播图大小为618*244,只支持触摸图片时滑动,不支持鼠标滑动。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initia...原创 2020-03-20 18:42:59 · 547 阅读 · 0 评论 -
1. JavaScript 移动端的触摸事件
触摸事件的类型touchstart:触摸绑定此事件的元素时触发touchmove:在绑定此事件的元素中滑动时触发(滑动开始的位置需要在该元素上,滑动结束的位置不在该元素上也行)touchend:离开绑定此事件的元素时触发(滑动开始的位置需要在该元素上,滑动结束的位置不在该元素上也行)touchcancel:触摸被中断时触发(如被短信,提示等)TouchEvent属性cha...原创 2020-03-20 18:33:25 · 342 阅读 · 0 评论