
Javascript
soosgo
这个作者很懒,什么都没留下…
展开
-
js对数组进行操作实现购物车效果
使用javascript实现购物车效果原创 2023-04-17 15:24:54 · 562 阅读 · 0 评论 -
js上传图片
js上传图像原创 2022-08-26 16:52:00 · 391 阅读 · 0 评论 -
document对象属性
document对象中,并没有特别的事件,它所支持的都是通用的。在document上讲解这些属性不具有典型性,但只要掌握了一个对象在某个事件上的处理方式,也就自然的掌握了在其它对象上处理这个事件。对于document对象所支持的事件在这里就不赘述了。下面说一下document对象属性:1.forms数组对象:代表html文档中的所有form标签对的集合。2.anchors数组对象:代表html文档中所有指定的name属性或id属性的a标签对的集合。3.links数组对象:代表html文原创 2022-03-17 16:08:49 · 1353 阅读 · 0 评论 -
ajax请求服务器端数据
ajax对象的属性和方法: 属性: responseText以字符串形式获取服务器端返回信息 readyState ajax对象状态(0 1 2 3 4) 0-->对象创建 1-->有调用open方法 2-->有调用send方法 3-->服务器返回数据(但是数据没有返回完全) ...原创 2021-03-02 14:23:50 · 330 阅读 · 0 评论 -
JavaScript中bind方法的使用
bind()方法主要就是将函数绑定到某个对象,bind()会创建一个函数,函数体内的this对象的值会被绑定到传入bind()第一个参数的值<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>bind</title> </head> <body> <button id="btn">按钮</button&g原创 2020-08-13 15:31:30 · 538 阅读 · 0 评论 -
JavaScript事件监听函数封装
//事件监听 function addEvent(type,element,fun){ if(element.addEventListener){ addEvent=function(type,element,fun){ element.addEventListener(type,fun,false); } }else if(element.attachEvent){ addEvent=function(type,element,...原创 2020-08-13 14:58:01 · 516 阅读 · 0 评论 -
JavaScript中的防抖函数
防抖:类似于上公交车,等人上齐了再走应用:百度搜索,当用户暂停输入1秒钟以后发起搜索<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>防抖函数</title> </head> <body> <input type="text" name="ipt" id="ipt" value="" /> <s原创 2020-08-13 14:24:25 · 136 阅读 · 0 评论 -
JavaScript节流函数
在前端开发中有一部分的用户行为会频繁的触发事件执行,而对于DOM操作、资源加载等耗费性能的处理,很可能导致界面卡顿,甚至浏览器的崩溃。函数节流(throttle)和函数防抖(debounce)就是为了解决类似需求应用而生的。节流:函数节流就是预定一个函数只有在大于等于执行周期时才执行,周期内调用不执行。好像水滴攒到一定重量才会滴落场景: 窗口调整(resize) 页面滚动(scroll) 抢购疯狂点击(mousedown)<!DOCT...原创 2020-08-13 14:05:49 · 374 阅读 · 0 评论 -
oninput 事件- 输入提示-纯函数
oninput 事件在用户输入时触发。该事件在 <input> 或 <textarea> 元素的值发生改变时触发。提示:该事件类似于onchange事件。不同之处在于 oninput 事件在元素值发生变化是立即触发, onchange 在元素失去焦点时触发。另外一点不同是 onchange 事件也可以作用于 <keygen> 和 <select> 元素。<!DOCTYPE html><html> <head...原创 2020-08-13 13:49:50 · 2194 阅读 · 0 评论 -
JavaScript中6大数组方法
forEach(callback[,object]) ES5新增遍历方法<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <ul> <li></li> <li></li> <li>&.原创 2020-08-12 17:02:58 · 207 阅读 · 0 评论 -
JavaScript代码执行时间线
Javascript是单线程(底层:多线程)1.同步情况:script标签中的src是同步2.异步情况:所有外部资源,出来script中的src都是异步的,img src link hrefscript标签没有设置async defer的时候会阻塞 1.形成dom树,开始绘制dom树 document.readyState="loading" 2.dom绘制完成 document.readyState="interactive" 触发DOMC...原创 2020-08-12 16:30:47 · 293 阅读 · 0 评论 -
JavaScript特点及执行过程
js特点: 1.弱类型 不需要声明数据类型 2.解释型 语法分析-->预编译-->解释执行预编译 GO(Global Object) 1.代码在执行前的一瞬间,产生GO对象 2.分析变量声明,变量名为GO对象的属性名,值为undefined 3.分析函数声明,函数名作为GO对象的属性名,值为函数体 ...原创 2020-08-12 16:23:43 · 209 阅读 · 0 评论 -
javascript函数对象及自执行函数
函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块,函数也是一个对象。Javascript函数语法:function 函数名(){//执行代码}函数就是包裹在花括号中的代码块,前面使用了关键字function且小写。函数分为:无参无返回值 无参有返回值 有参无返回值 有参有返回值四种。函数在使用过程中常遇到的一些问题:function fun(a,b,c){},在函数中可访问属性包括:length形参个数,name函数名字,prototype原型。不能访问的属...原创 2020-08-12 10:21:32 · 839 阅读 · 0 评论 -
js判断两个日期是否相等
在js编程中,一定会遇到过这样的情况,有两个日期对象,然后需要判断他们是否相等,下面我们来说说判断的方法:例如:var date1 = new Date("2020-06-06");var date2 = new Date("2020-06-06");console.log(date1 == date2); //false这里date1和date2看上去是一样的,但是运行date1==date2返回的确是false。这是因为date1、date2是对象,类型为引用类型,所以如果我们需要原创 2020-06-30 11:23:30 · 5444 阅读 · 0 评论 -
window.screenLeft&&window.Top&&window.screenX&&window.screenY
window.screenLeft设置或获取浏览器窗口左上角相对与屏幕左上角的X坐标。window.screenTop设置或获取浏览器窗口左上角相对于屏幕左上角的Y坐标。浏览器兼容性问题:在Chrome和Opera中,当浏览器窗口全屏化时,screenLeft和screenTop指的是可见的浏览器部分与屏幕左上角的距离,两者的值都为0。在Safari中,当浏览器窗口全屏化时原创 2015-12-03 20:09:37 · 857 阅读 · 0 评论 -
JS面向对象
什么是面向对象?面向对象是一种对现实世界理解和抽象的方法,是计算机编程技术发展到一定阶段后的产物。–引用自百度百科通俗的理解就是:万物皆对象!世界上的任何事和物都可以被视为对象,而我们需要关注的是对象本身可以实现的功能,不需要深入理解构成对象的元素。JS中的面向对象面向对象在js里有两个层次的含义,第一种是会使用面向对象函数;第二种是构造面向对象函数。js也是面向对象中的一种写...转载 2018-09-17 10:49:34 · 368 阅读 · 0 评论 -
ready与onload的区别
$(document).ready()和window.onload在表面上看都是页面加载时我们就去执行一个函数或动作,但是在具体的细节上$(document) ready()和window onload还是有区别的。最基本的区别1.执行时间 window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。 $(document).ready()是DOM结构绘制完毕...转载 2018-09-17 12:26:48 · 246 阅读 · 0 评论 -
JS浏览器兼容性
1、事件绑定兼容写法function add(obj,event){ if (obj.addEventListener) { obj.addEventListener(event,fn,fase); }else{ obj.attachEvent("on"+event,fn); }}小结:addEventListener()兼容...转载 2018-10-17 09:11:24 · 696 阅读 · 0 评论 -
js基本类型转换
JavaScript的数据类型分为六种,分别为null,undefined,boolean,string,number,object。object是引用类型,其它的五种是基本类型或者是原始类型。我们可以用typeof方法打印来某个是属于哪个类型的。不同类型的变量比较要先转类型,叫做类型转换,类型转换也叫隐式转换。隐式转换通常发生在运算符加减乘除,等于,还有小于,大于等。。typeof '...转载 2018-10-17 09:48:05 · 541 阅读 · 0 评论 -
删除数组中的重复数内容
//删除数组中重复的数字: var arr = [1,2,3,4,5,1,2,3,4,5]; // 1,2,3,4,5; //方法1 arr.sort();//排序 console.log(arr); var arr2=[]; arr2.push(arr[0]); for(var i=0;i<arr.length-1;i++){ if(a...原创 2019-08-23 16:22:47 · 871 阅读 · 0 评论 -
输出字符串中出现最多的字母
//找出字符串中出现最多的字母var str = 'abccccaaaewcccc';var aStr=str.split('');var f={};//求数组中出现最多的元素function maxNum(arr,obj){ var max=0; var num=0; for(var i=0;i<arr.length;i++){ if(obj[arr[i]]==und...原创 2019-08-23 16:25:44 · 941 阅读 · 0 评论 -
按单词的第二个字母在字母表中的顺序进行排序
/* 按第二个字母的升序排列,如果第二个字母相等,按第一字母的顺序排列 冒泡排序 * */ var str = 'apple banana orange parent pear aap absolute position'; var arrStr=str.split(' '); //冒泡排序 for(var i=0;i<arrStr.le...原创 2019-08-23 17:15:40 · 1150 阅读 · 0 评论 -
获取1-5之间的随机数
function getRandomInt(min,max){ return Math.floor(Math.random()*(max-min+1))+min; } console.log(getRandomInt(1,5));原创 2019-08-23 17:32:15 · 15428 阅读 · 0 评论 -
js获取css样式
css样式分为以下三种:1、内联样式(在HTML元素的内部,又称行内样式)。2、内部样式(位于<head>标签内部)。3、外部样式(通过link标签引入)。通过javascript获取元素内联样式可以直接通过elementobj.style.prop即可获取。如果要获取内部样式或外部样式上面那种方法就失效了,做法如下:DOM标准里有个全局方法getCompute...原创 2019-08-22 17:16:25 · 362 阅读 · 0 评论 -
按手机返回键APP直接退出问题
最近vue做个项目,通过HBuilder打包之后发现按手机的返回键应用直接退出了,而不是返回上一页,为此,特意解决了这一问题,具体代码如下:document.addEventListener('plusready', function() { var webview = plus.webview.currentWebview(); plus.key.addEventListener('ba...转载 2018-06-26 15:52:44 · 8981 阅读 · 2 评论 -
Object.keys用法
Object.keys()方法会返回一个由一个给定对象的自身可枚举属性组成的数组。传入对象返回属性名:var data={a:1,b:2,c:9,d:4,e:5}; console.log(data);//{a: 1, b: 2, c: 9, d: 4, e: 5} console.log(Object.keys(data));//["a", "b", "c", "d", "e"] ...原创 2018-05-22 14:01:52 · 17554 阅读 · 0 评论 -
js中的split()方法的用法
最近遇到字符分隔问题,再此简单的额总结一下:一、split()方法用于把一个字符串分割成字符串数组;stringObject.split(separator,howmany),separator:必需。字符串或正则表达式,从该参数指定的地方分隔stringObject;howmany:可选。该参数可指定返回的数组的最大长度。如果设置了该参数,返回的子串不会多于这个参数指定的数组。如果没有设置该参数...原创 2016-12-30 11:11:02 · 15597 阅读 · 0 评论 -
关于indexOf()
indexOf()方法可返回某个指定的字符串在给定字符串中首次出现的位置。语法:stringObject.indexOf(searchvalue,fromindex);其中searchvalue是必须的,指要检索的字符串,formindex是可选的整数,规定在字符串中开始检索的位置。另外:lastIndexOf();指从右面开始出现指定字符串的索引位置。lastIndexOf(原创 2015-12-06 15:14:16 · 413 阅读 · 0 评论 -
window下的navigator对象
//navigator是window下的对象alert(window.navigator);//[object navigator]alert(navigator.appName);//Netscape 网景浏览器 浏览器名称alert(navigator.userAgent);//用户代理字符串表示浏览器信息alert(navigator.platform);//win32操作系原创 2015-12-05 21:45:22 · 520 阅读 · 0 评论 -
substring()与substr()使用
substring()是指返回位于两个数之间的字符串。语法:substring(start,end)//start指开始索引的位置必填(索引从0开始),end(可以省略)指索引终止的位置,若end省略,则表示从索引位置开始知道字符串结束,否则表示,从索引位置开始start到索引位置结束end,其中包括start不包括end。substr()表示返回一个从指定位置开始指定长度的字符串。原创 2015-12-06 15:47:50 · 678 阅读 · 0 评论 -
location对象
location对象1、window.location表示当前页面的URL与window.document.location等效。2、location.hash指URL上的锚点,是一个属性值。3、location.port指URL上的端口号是一个属性值。4、location.href指url,是一个属性值。5、location.search设置或获取网页地址跟在?(问号)后面的原创 2015-12-03 22:27:51 · 416 阅读 · 0 评论 -
setTimeout()&&setInterval()实例
setTimeout()超时计时器,setInterval()可以循环执行,一般有两个参数,前一个参数表示将要执行的动作,后一个参数表示时间。实例如下://计时器 间歇调用 一般不用用超时var num=0;var max=5;var id=null;function box(){ num++; document.getElementById('a').inn原创 2015-12-03 22:15:12 · 420 阅读 · 0 评论 -
window对象
window对象:1、innerHeight属性:窗口中文档显示区域的高度,不包括菜单栏、工具栏等部分。该属性可读可写。 IE不支持该属性,IE中body元素的clientHeight属性与该属性相同。2、innerWidth属性:窗口中文档显示区域的宽度,同样不包括框。该属性可读可写。 IE不支持该属性,IE中的body元素的clientWidth属性与该属性相原创 2015-12-03 20:42:56 · 364 阅读 · 0 评论 -
Javascript中apply与call的应用
1、call方法语法:call([thisObj[,arg1[,arg2[,[,..argN]]]]]);参数thisObj是可选项。将被用作当前对象的对象。arg1,arg2,,argN可选项,将被传递方法参数序列。call方法可以用来代替另一个对象调用一个方法。call方法可以将一个函数的对象上下文从初始的上下文改为由thisObj指定的新对象。如果没有thisObj参数,则Glo原创 2015-12-17 22:26:32 · 545 阅读 · 0 评论 -
object is not afunction错误
页面执行不了,控制台显示Uncaught TypeError:object is not a function错误,这是很有可能是某个元素的name属性值与函数的函数名重名了,修改一下name值即可。原创 2015-12-14 21:54:38 · 1878 阅读 · 0 评论 -
relatedTarget与fromElement、toElement元素
mouseover与mouseout事件,会涉及把鼠标指针从一个元素的边界之内移到另一个元素的边界之内。对于mouseover而言,事件的主要目标是获取光标元素,而相关元素就是那个失去光标的元素。类似的mouseout事件而言,事件的主目标是失去光标元素,而相关元素则是获得光标元素。DOM通过event对象的relatedTarget属性提供了相关元素的信息。这个属性只对与mouseover和原创 2015-12-13 20:05:00 · 1943 阅读 · 0 评论 -
relatedTarget、fromElement、toElement相关元素
在发生mouseover与mouseout事件时,还会涉及更多元素。这两个事件都会涉及把鼠标指针从一个元素的边界之内移到另一个元素的边界之内。对mouseover事件而言,事件主目标是获取光标元素,而相关元素就是那个失去光标的元素。类似的,对于mouseout事件,主目标是失去光标的元素,而相关元素是获得光标的元素。DOM通过event对象的relatedTraget属性提供了相关元素的信息。原创 2015-12-13 17:52:58 · 962 阅读 · 0 评论 -
Date对象
UTC国际标准时间,又称统一时间,GMT格林尼治时间,两者可以看成是同一对象。Date对象的常用方法:.getDate()根据本地时间获取当前日期(本月的几号);.getDay()根据本地时间获取今天星期几(0-Sunday,1-Monday......);.getFullyear()根据本地时间获取当前年份(四位数字,如2015);.getMonth()根据本地时间获取当前的原创 2015-12-06 16:53:56 · 460 阅读 · 0 评论 -
跨浏览器检测flash是否存在
//跨浏览器检测flash是否存在function hasPlugin(name){var name=name.toLowerCase();for(var i=0;iif(navigator.plugins[i].name.toLowerCase().indexOf(name)>-1){return true;}}return false;}function原创 2015-12-05 21:51:17 · 400 阅读 · 0 评论 -
Mui事件绑定
通常我们对元素添加事件使用addEventListener()方法,但是,除了可以使用addEventListener()方法监听某个特定元素上的事件外, 也可以使用 on()方法实现批量元素的事件绑定。on( event , selector , handler )1. .on( event , selector , handler )event:Type: String转载 2017-03-29 16:52:06 · 23244 阅读 · 0 评论