JS
文章平均质量分 86
AIU哎呀
喜交友,互相学习分享。耿直程序猿,不善言辞,见谅,哇咔咔
展开
-
原生js写tab选项卡切换功能【附加:移动端项目解决适配问题】
原生js写tab选项卡切换功能【附加:移动端项目解决适配问题】注:以下是移动端项目为例:html代码 + js代码:<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="...原创 2020-03-10 15:02:14 · 533 阅读 · 0 评论 -
JS隐藏11位手机号码中间4位为****
JS隐藏11位手机号码中间4位为****其实是用字符串的截取来实现,话不多说直接上代码:let tel = '15823561797';tel = tel.slice(0,3)+" **** "+tel.slice(-4);console.log(tel);效果如图:...原创 2020-01-08 11:17:12 · 593 阅读 · 0 评论 -
vue项目【 input输入框长度限制】
vue input输入框长度限制<input type="number" maxlength="11" placeholder="请输入手机号">经测试,发现在type为number或者text时,设置maxlength参数并不会生效。解决如下:<input type="number" oninput="if(value.length > 11)value = v...原创 2020-01-07 18:42:51 · 5735 阅读 · 1 评论 -
JavaScript 【js】回车键替换成逗号,逗号替换成回车键
JavaScript 【js】回车键替换成逗号,逗号替换成回车键一、逗号替换成回车键let text = '1,2';text = text.replace(/\uff0c/g,"\n");console.log(text);//如图所示。replace(/\n/g,",")//回车键替换成逗号二、回车键替换成逗号let text = '12';text = text.rep...原创 2019-12-12 16:05:06 · 4859 阅读 · 0 评论 -
JavaScript (js)--- 正则匹配中文标点符号
JavaScript (js)— 正则匹配中文标点符号function checkText() { var text = ","; //匹配这些中文标点符号 。 ? ! , 、 ; : “ ” ‘ ' ( ) 《 》 〈 〉 【 】 『 』 「 」 ﹃ ﹄ 〔 〕 … — ~ ﹏ ¥ var reg = /[\u3002|\uff1f|\uff01|\uff0c|\u3001|\uff1b...原创 2019-12-12 15:44:39 · 7894 阅读 · 1 评论 -
数组的flat方法【Array.prototype.flat()】
数组的flat方法【Array.prototype.flat()】一、 概念 flat() 方法会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。二、语法结构var newArray = arr.flat([depth])参数depth: 指定要提取嵌套数组的结构深度,默认值为 1。返回值: 一个包含将数组与子数组中所有元素的新数组。...原创 2019-10-12 10:48:54 · 7233 阅读 · 1 评论 -
es6 解构赋值
//一维数组解构var data = ['aa','bb','cc'];let [a,b,c] = data;alert(a,b,c) //aa bb cc//二维数组解构var data = ["aa","bb",[22,33],"cc"];let [a,b,[c,d],e] = data;alert(a,b,c,d,e) //aa ...翻译 2019-04-25 14:32:37 · 417 阅读 · 0 评论 -
正则验证手机号
正则验证手机号现在新增了166、198、199字段的手机号,以下正则表达式做了相应改进:<script> var reg = /^1([38][0-9]|4[579]|5[0-3,5-9]|6[6]|7[0135678]|9[89])\d{8}$/; function verifyTel (tel){ if(reg.test(tel)){ ret...原创 2019-03-14 12:06:30 · 535 阅读 · 0 评论 -
js获取手机号码归属地(省)
js获取手机号码归属地(省)city.html:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns=""><head> &l转载 2019-03-05 16:43:32 · 5275 阅读 · 3 评论 -
input光标颜色
input光标颜色一、 使用color实现光标的颜色是继承自当前输入框字体的颜色,所以用color属性即可改变:input { color:red;}二、使用caret-color实现只改变光标的颜色而不改变字体的颜色需要使用caret-color属性:&lt;input value="This field uses a default caret." /&gt;&lt...翻译 2019-01-21 10:53:09 · 3699 阅读 · 0 评论 -
JS 实现返回顶部效果
JS 实现返回顶部效果代码:<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scala原创 2018-12-25 16:10:29 · 576 阅读 · 0 评论 -
手机改变系统字体大小导致h5页面在webview中变形。。h5页面嵌入webview中,在有些手机上布局乱套的bug。。
解决因为手机设置系统字体大小导致h5页面在webview中变形的BUG 说实话,遇到这个问题,我内心里是崩溃的,表面还一副镇定自若的模样,事实上受到了一万点打击,我做的页面完美适配,就那一台手机,就那一台,整体都是乱的。 然后发现那台手机所有的字体都特别大,像是老年机,这时尝试去查看系统字体大小,发现设置比标准大了两个度【超小–标准–大--超大–巨大,就是五个程度,具体什么字不想看了,要吐...原创 2019-03-26 20:50:08 · 3588 阅读 · 0 评论 -
js 将13位时间戳转化为YYYY-MM-dd HH:mm:ss
方法一:var date = 1553677259000,y,m,d,h,mm,s;date = new Date(ele.createTime);y = 1900 + date.getYear();m = "0" + (date.getMonth()+1);d = "0" + date.getDate();h = "0" + date.getHours();mm = "0" + ...原创 2019-04-26 16:37:13 · 3085 阅读 · 0 评论 -
当 input 属性为 number,设置maxlength属性不生效的坑
当 input 属性为 number,设置maxlength属性不生效的坑一、现象1、 <input type="text" maxlength="11" />,有效;2、 <input type="number" maxlength="11" /> 无效当input的type属性设为number时,maxlength属性失效,长度可以无限输入。二、解决方法&...原创 2019-07-04 17:10:13 · 4625 阅读 · 2 评论 -
vue项目中,js (javascript)生成二维码
vue项目中,js (javascript)生成二维码1. 概述1.1 引入二维码生成模块 npm install qrcodejs2 --save注意:此处安装qrcodejs2,安装依赖后可在main方法中进行全局引用设置,也可单独某个页面中进行引用设置。1.2 引入使用import QRCode from 'qrcodejs2';备注:在main中设置全局可使用 Vu...原创 2019-09-22 20:20:59 · 455 阅读 · 0 评论 -
如何监听 Element 组件 el-input 标签的 回车enter事件
如何监听Element组件标签的回车事件一、现象表单提交时需要处理输入框的回车事件,一般的原生input标签可以用@keyup.enter=“onSubmit”(tips:onSubmit为定义的方法)二、解决1、@keyup.enter=“onSubmit” 改写为 @keyup.enter.native=“onSubmit” ,也就是说多加一个native标志2、如:<el...原创 2019-09-29 14:05:36 · 919 阅读 · 0 评论 -
vue项目实现记住密码到cookie功能
vue项目实现记住密码到cookie功能一、实现功能:1.记住密码勾选,点登陆时,将账号和密码保存到cookie,下次登陆自动显示到表单内2.不勾选,点登陆时候则清空之前保存到cookie的值,下次登陆需要手动输入二、思路:大体思路就是通过存/取/删cookie实现的;每次进入登录页,先去读取cookie,如果浏览器的cookie中有账号信息,就自动填充到登录框中,存cookie是在登...原创 2019-09-30 18:18:17 · 498 阅读 · 0 评论 -
javascript变量的声明、赋值、命名
javascript变量变量:存储数据信息的容器。一、声明变量使用关键字:let、const、var来声明变量。const:用于声明常量。var: 定义的变量的时候,若没有初始化,不报错,会输出undefined。其值之后可以修改。let:(ES6新增)块级作用域 。在块级{}里面用let定义的变量,离开当前的块{}之后,就不能使用(有点像局部变量,但作用域不一样)。注意:c...原创 2018-11-26 14:44:33 · 807 阅读 · 0 评论 -
JavaScript HTML DOM (文档对象模型) 增删改查
JavaScript HTML DOM一、DOM(文档对象模型Document Object Model)文档对象模型 (DOM) 是HTML和XML文档的编程接口。它给文档(结构树)提供了一个结构化的表述并且定义了一种方式—程序可以对结构树进行访问,以改变文档的结构,样式和内容。DOM 提供了一种表述形式将文档作为一个结构化的节点组以及包含属性和方法的对象。换言之,它在web 页面和脚本或...原创 2018-12-18 15:49:12 · 559 阅读 · 0 评论 -
JS字符串
字符串一、概念字符串就是零个或多个排在一起的任何字符,放在单引号或双引号之中。var str1= &amp;quot;123&amp;quot;;var str2= '123';注:引号嵌套:单引和双引之间只能互相嵌套;反引中可以嵌套双引也可嵌套双引。&amp;amp;lt;script&amp;amp;gt; var str1 = &amp;quot;我们的网址是'http://www.baidu原创 2018-11-30 14:14:24 · 370 阅读 · 0 评论 -
javascript函数(声明、命名、调用、实参、形参、返回值)
javascript函数一、概念函数:就是封装起来的可以重复被调用的代码块。【在js中,函数是头等对象,因为它们可像任何其他对象一样具有属性、方法。区别在于函数可被调用function对象】二、使用函数的优势程序更加简洁;后期维护更加方便;逻辑更加清晰。三、函数的声明(定义)(一)命名规则:函数的命名规则和变量名是一样的(同“javascript变量的声明、赋值、命名”中提...原创 2018-11-30 09:45:24 · 1506 阅读 · 1 评论 -
数据存储,堆区栈区
数据的存储(堆区、栈区)代码在运行的时候,数据都保存在计算机的内存中,内存分为堆区、栈区……栈区:保存长度固定的值,所占空间少,读取速度快;存储基础变量以及一些对象的引用变量,基础变量的值存在栈中,而引用变量存储在栈中的是指向栈中数组或对象的地址。堆区:保存长度可变的值,所占空间大,读取速度相对较慢。注意:修改引用类型总会影响到其他指向这个地址的引用变量。JS运行时,初始类型存于栈...原创 2018-11-26 16:11:38 · 444 阅读 · 0 评论 -
javascript数据类型
javascript数据类型原始数据类型:值类型(基本类型):字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、Symbol。引用数据类型:对象(Object)表现形势:数组(Array)、函数(Function)。一、数值(number)数字,不用引号包裹。&amp;amp;lt;script&amp;amp;gt; const name =...原创 2018-11-26 15:36:21 · 161 阅读 · 0 评论 -
innerHTML、innertext、outerHTML的区别
innerHTML、innertext、outerHTML的区别innerHTML指的是从对象的起始位置到终止位置的全部内容,包括Html标签。innerText 指的是从起始位置到终止位置的内容,但它去除Html标签。outerHTML指的是除了包含innerHTML的全部内容外, 还包含对象标签本身。<body> <div id="d1"><p...原创 2018-11-26 13:30:49 · 258 阅读 · 0 评论 -
JS的输出方式
JS的输出方式:JavaScript 可以通过不同的方式来输出数据,显示数据alert(“要输出的内容”); window.alert();window可省略不写在浏览器中弹出一个弹出框,将“要输出的内容”展示出来效果图:document.write(“要输出的内容”);直接在页面中展示“要输出的内容”效果图:console.log(“要输出的内容”);在控制台输出“...原创 2018-11-26 13:29:56 · 1388 阅读 · 0 评论 -
JS引入方式、书写位置
js引入方式一、书写位置(大致有3个地方):head头部中;body的不论什么位置;以事件的形式写在标签上。e.g. <p onclick="alert('叫你点,你就点啊')">点我</p> <p onclick="javascript:alert('javascript前缀,效果同上')">点我</p>二、引入方...原创 2018-11-26 11:23:26 · 1916 阅读 · 0 评论 -
小练习
1、 根据用户输入的成绩,判断成绩的优秀,良好,合格,不合格2、 求1-100累加的和3、 输出1-100内所有的偶数原创 2018-11-29 09:43:55 · 259 阅读 · 0 评论 -
javascript运算符(算数运算符、关系运算符、赋值运算符、逻辑运算符、一元运算符、三元运算符、特殊运算符)
JS运算符一、算数运算符以数值(字面量或者变量)作为其操作数,并返回一个单个数值。加法 (+);减法 (-);除法 (/);乘法 (*); 求余 (%);幂 (**);递增 (++);递减 ( --);注:如果字符串中全是数值(“123456”),也可以进行除加号之外的算术运算【e.g. console.log(“1”-“3”);//-2】}若得不出结果,不报错,得到一个NAN1...原创 2018-11-28 16:59:10 · 181 阅读 · 1 评论 -
DOM DocumentFragment对象
DocumentFragment对象一、应用场景 动态创建html元素:创建好之后直接使用appendChild()方法添加至DOM结构中 注: 但是当需要创建并添加大量的元素时,这样去动态创建元素的话会导致大量的重绘以及回流,所以需要一个 ‘缓存区’ 来暂时性的保存创建的节点,然后再一次性添加到父节点中。这时,DocumentFragment对象就作为这个缓存区被使用。 最常用的方...原创 2018-12-21 13:21:22 · 1233 阅读 · 0 评论 -
JS 实现tab效果、选项卡效果
JS 实现tab效果一、效果描述:点击标题显示对应内容效果图:二、代码:<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="wid原创 2018-12-26 16:37:29 · 551 阅读 · 0 评论 -
JavaScript数组对象
JavaScript数组对象一、概念数组对象是使用单独的变量名来存储一系列的值。二、创建数组(一)构造函数1. 常规方式:var arr=new Array(); arr[0]=&amp;amp;amp;amp;quot;1&amp;amp;amp;amp;quot;; arr[1]=&amp;amp;amp;amp;quot;2&amp;amp;amp;amp;quot;;arr[2]=&amp;原创 2018-12-05 19:43:26 · 484 阅读 · 0 评论 -
DOM HTMLCollection 和 NodeList
HTMLCollection 和 NodeList节点都是单个对象,有时会需要一种数据结构,能够容纳多个节点。DOM提供两种集合对象,用于实现这种节点的集合:NodeList和HTMLCollection。NodeList 对象:代表一个有顺序的节点列表;HTMLCollection对象 :是一个接口,表示 HTML 元素的集合,它提供了可以遍历列表的方法和属性相同点: 都是类数组对象,节...翻译 2018-12-13 11:21:02 · 283 阅读 · 0 评论 -
JavaScript:Date对象(日期对象)
Date对象(日期对象)一、概念Date对象 用于处理日期和时间。二、创建 Date 对象可以通过 new 关键词来定义 Date 对象。注:Date 对象会自动把当前日期和时间保存为其初始值。//四种方式初始化日期:new Date() // 当前日期和时间new Date(milliseconds) //返回从 1970 年 1 月 1 日至今的毫秒数new Date(dat...原创 2018-12-18 15:48:46 · 5002 阅读 · 0 评论 -
javascript流程控制
javascript流程控制流程:代码执行的顺序和方式;流程控制:在JS中,用一些特殊的语句控制程序按照我们想要的方式去选择执行(执行一次or重复执行)一、分类顺序结构选择结构(1)分支结构单路分支双路分支多路分支嵌套分支(2)条件结构循环结构for循环while循环do while循环二、顺序结构代码的正常的执行顺序:首先按引入的顺序一块一块执行...原创 2018-11-29 11:06:53 · 533 阅读 · 0 评论 -
javascript入门
javascript入门一、JS是什么?一门语言;一门计算机语言,用于任何与计算机之间的交流;一门计算机脚本语言,运用在计算机中的脚本语言;一门插入 HTML 页面后,可以运行在现在所有浏览器中的脚本语言;一门轻量级的编程语言;可插入 HTML 页面的编程代码。...原创 2018-11-26 10:19:26 · 186 阅读 · 0 评论