javascript获取对象数组中指定对象属性的对象下标的方法findIndex()

一个对象数组，已知其中一个对象属性的某个属性值，然后通过该属性值获取其所属对象的对象下标。 简单地说就是通过指定对象属性值获取对象的下标，可以通过 javascript 的 findIndex() 方法实现。 findIndex() 方法的作用是传入一个函数条件，然后返回符合条件的数组的第一个元素的位置（下标）。 示例代码： var _name = 'tddx'; //已知属性值 var...
Web前端开发 / / 7043次阅读

javascript实现点击递增递减改变字体字号大小的代码

网页中常见的效果，点击按钮改变内容的字体显示大小，方便眼睛视力不同的人阅读，提高网页的用户体验。 实现方法也比较简单，通过js修改元素css的font-size属性。 实现代码 HTML代码： <a id="cut" href="javascript:void(0);">A-</a> <a id="add" href="javascript:void(0);...
Web前端开发 / / 2791次阅读

原生javascript实现tab切换效果的代码

Tab切换是网页制作中常用的效果，通过jquery很容易实现，使用原生javascript代码则稍微有点繁锁。 HTML代码： <div id="tabmenu"> <span class="current>普通会员</span> <span>超级会员</span> </div> <div id="tabbox">...
Web前端开发 / / 2341次阅读

原生javascript获取屏幕、浏览器窗口、网页的各种不同高度代码

因为浏览器窗口包含的元素比较多（如工具栏、任务栏、滚动条等），所以浏览器窗口的高度会因为元素的不同而不同，因此javascript获取浏览器窗口相关的高度的属性也有多个，如height、avaiHeight、outerHeight、innerHeight、clientHeight、offsetHeight。 下面这张图可以直观地理解各个属性： 属性介绍 电脑屏幕高度...
Web前端开发 / / 3921次阅读
原生javascript获取屏幕、浏览器窗口、网页的各种不同高度代码

jquery避免setInterval setTimeout首次执行延迟的方法

javascript 的 setInterval(fn, delay) 方法和 setTimeout(fn, delay) 方法的作用是按设置的 delay 间隔时间执行 fn 函数，所以首次执行时就会有 delay 时长的延迟，如果不想首次执行有延时，那么就在这两个方法执行前，先执行一次 fn 函数。 setInterval() 方法 var num = 0; var at = function(){ c...
Web前端开发 / / 3494次阅读

jquery判断scroll()是否停止滚动的代码

scroll()函数没有回调函数，没办法直接检测是否停止了滚动，但是可以换个思路，使用 setTimeout 定时器检测滚动状态。 var status = null; //定义一个定时器，默认为空，表示没滚动运 $(window).scroll(function(){ if(status != null){ clearTimeout(status); alert('正在滚动');...
Web前端开发 / / 3821次阅读

javascript解决Firefox浏览器不支持zoom等比例缩放方法

由于Firefox浏览器不支持CSS3属性 zoom，所以前面jQuery + CSS属性zoom实现web页面等比例缩放的代码不支持火狐浏览器，要兼容Firefox浏览器，目前想到的方法是借且CSS3属性 transform，但是有点麻烦，适合缩放元素少的网页使用。 1、给每一个需要等比缩放的元素添加class="scale" 2、然后使用下面的js代码 (function(doc, win){...
Web前端开发 / / 4187次阅读

javascript判断视频音频是否播放结束的代码

HTML DOM ended 事件在 HTML video（视频）或 audio（音频）播放完成后触发，因此通过监听 ended 事件就可以判断视频或音频是否已经播放完在，然后执行其它操作。 以下代码支持IE9+浏览器。如果是音频则把 HTML 代码改成 audio 标签的内容即可。 HTML代码： <video id="video1" src="upload/video.mp...
Web前端开发 / / 6975次阅读

javascript 单位米m转换为单位千米km的代码

js代码实现m转换为km的代码，实现思路是判断数值是否大于1000，如果大于1000就通过除以1000转为km单位，再使用toFixed保留小数点后两位数。如果小于两1000则使用m为单位。 代码如下 function kmUnit(m){ var v; if(typeof m === 'number' && !isNaN(m)){ if (m >= 1000) {...
Web前端开发 / / 12311次阅读

jQuery + CSS属性zoom实现web页面等比例缩放

非响应式web网页，在小于web网页设置的宽度的分辨率电脑下显示，会出现滚动条滚动显示超出分辨率的内容，如：网页主体宽度为设置为width:1400px，那么在1280分辨率电脑的浏览器上访问，就会出现横向滚动条。 如果想完整显示，又不做成响应式结构，可以通过等比例缩放的形式让网页完整显示在1280分辨率电脑的浏览器上，等同于浏览器“Ctrl+鼠标滚动”的缩放效果。 代码也很简单，通过jquery的resi...
Web前端开发 / / 5172次阅读

原生javascript判断数组是否包含一个指定的值

方法一 array.indexOf()方法可以返回数组中某个指定的元素位置，该方法会从头到尾地检索数组，检测是否含有对应的元素，如果检索到，则返回元素第一次出现的位置，如果没有检索到，则返回-1。 示例： var _str = 'two'; var _arr = ['one', 'two', 'three', 'five']; if(_arr.indexOf(_str) > '-1'){...
Web前端开发 / / 2324次阅读

js svg实现带箭头虚线轨迹运动代码

实现的效果：箭头按弧线的轨迹运行，运行的轨迹为虚线状态，运行到弧线末端后，变成直线运行 HTML代码 <svg width="800px" height="600px" viewbox="0 0 190 150"> <defs> <marker id="markerArrow" markerWidth="6" markerHeight="9...
Web前端开发 / / 6343次阅读
js svg实现带箭头虚线轨迹运动代码