网页播放声音

这个非常简单,我们只需要在html和js设置即可。首先看html代码

html代码
<audio id="sound" autoplay="autoplay"></audio>
<button onclick="playAlarmSound()">播放</button>
JS代码
function playAlarmSound(){
var soundsUrl = "/static/sounds/ding.wav"
document.getElementById("sound").src=soundsUrl
}

这个时候,点击下"播放"按钮即可播放了。

慢慢滑动上下滚动条

关键js代码
    $(document).ready(
runflag = true, // 是否能够滑动的标志
dscrollTopTmp = 0, // 当前滑动位置
autoRoll()
); function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
} async function autoRoll(){
runflag = true // 是否能够滑动的标志
var d=document.getElementById("LegacyAlarmsContent");
var dlen = d.scrollHeight/3; // scroll的高度1/3,即可滑到最底部了。
//var dscrollTopTmp = 0;
while(dscrollTopTmp < dlen && runflag){
d.scrollTop = dscrollTopTmp;
dscrollTopTmp=dscrollTopTmp+1;
await sleep(200)
if(dscrollTopTmp+2>dlen ) {
dscrollTopTmp=0 // 等于0的话直接滑动到最顶部了
}
}
} function stopAutoRoll() {
runflag = false
}

HTML代码

<div id="LegacyAlarmsContent" style="height:455px;overflow-y: auto">

</div><!-- /.col -->

sleep函数

这段主要使用了promise对象来实现的, 什么是Promise对象?这种“承诺将来会执行”的对象在JavaScript中称为Promise对象。,promise对象的解释请看这里

function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
} async function demo() {
console.log('Taking a break...');
await sleep(2000);
console.log('Two second later');
} demo();

replace替换掉所有指定的值

String.prototype.myReplace=function(f,e){//吧f替换成e
var reg=new RegExp(f,"g"); //创建正则RegExp对象
return this.replace(reg,e);
} //应用示例
var str='我是生长在中国南方的纯正中国人';
var newstr=str.myReplace('中国','天朝');
alert(newstr);

js 零散知识总结的更多相关文章

  1. js 零散知识

    # 同一种类型的事件注册多个事件句柄,后面的不会覆盖前面的事件 # event.which == 13,13代表回车 # parsley.js验证框架 # JSON.stringify, avoid ...

  2. css,js零散知识的整理

    在同一个dom上以冒泡和捕获的方式绑定一个事件,如果事件源是该元素,则是先绑定的哪一个就先执行哪一个,事件源是dom的子孙节点,则先执行捕获事件

  3. 零散的JS和node.js小知识

    JS的连续赋值和曾经出现的怪异情况 let a=1; let b=a=3; 如上的真实赋值过程 => a=1 => a=3 => b=3 => 一般来说,等号是从右向左赋值的 ...

  4. [JS复习] JS 基础知识

    项目结尾,空闲时间,又把<JS 基础知识> 这本书过了一遍,温故知新后,很多知其然不知其所以然的内容 豁然开朗. [1. 用于范围的标签] display  :inline or bloc ...

  5. iOS网络相关零散知识总结

    iOS网络相关零散知识总结 1. URL和HTTP知识 (1) URL的全称是Uniform Resource Locator(统一资源定位符). URL的基本格式 = 协议://主机地址/路径   ...

  6. HTML+CSS+JS基础知识

    HTML+CSS+JS基础知识 目录 对HTML+CSS+JS的理解 基础知识 对HTML+CSS+JS的理解 基础知识 插入样式表的三种方式 外部样式表:<link rel="sty ...

  7. Node.js基础知识

    Node.js入门   Node.js     Node.js是一套用来编写高性能网络服务器的JavaScript工具包,一系列的变化由此开始.比较独特的是,Node.js会假设在POSIX环境下运行 ...

  8. 网站开发进阶(十五)JS基础知识充电站

    JS基础知识充电站 1.javascript alert弹出对话框时确定和取消两个按钮返回值? 用的不是alert对话框,是confirm confirm(str); 参数str:你要说的话或问题: ...

  9. NodeJs>------->>第三章:Node.js基础知识

    第三章:Node.js基础知识 一:Node.js中的控制台 1:console.log.console.info  方法 console.log(" node app1.js 1> ...

随机推荐

  1. BZOJ5057 : 区间k小值5

    整体二分,按时间顺序依次考虑对于权值落在$[l,r]$内的所有操作. 对于每个修改操作,若权值范围完全包含了$[l,r]$,那么在更深层的分治中它都完全包含它,对每个询问的贡献是定值,因此在当前层将贡 ...

  2. 2017-2018-2 20172310『Java程序设计』课程 结对编程练习_四则运算_第二周

    2017-2018-2 20172310『Java程序设计』课程 结对编程练习_四则运算_第二周 博客要求 组内同学需各自发表博客 博客中需包含以下内容: 相关过程截图 关键代码解释 遇到的困难及解决 ...

  3. curl: (25) Failed FTP upload: 550 解决方案

    ftp的地址一定要以”/”结束.比如:ftp://127.0.0.1/01Dev/

  4. Alpha冲刺——序言篇(任务与计划)

    所属课程 软件工程1916|W(福州大学) 作业要求 Alpha冲刺--序言篇 团队名称 待就业六人组 一.代码规范 详见项目在线文档:项目代码规范 二.本次冲刺任务与计划 任务 内容 时间 第一天 ...

  5. oracle函数返回结果集

    一.用自定义类型实现 1.创建表对象类型. 在Oracle中想要返回表对象,必须自定义一个表类型,如下所示: create or replace type type_table is table of ...

  6. ISDN简记

    简介 ISDN:(Integrated Services Digital Network,综合业务数字网) 是以综合数字电话网(IDN)为基础发展演变而形成的通信网,能够提供端到端的数字连接,用来支持 ...

  7. CSS_盒子模型

    2016-10-22 <css入门经典>第6章 1.每个HTML元素对应于一个显示盒子,但不是所有的元素都显示在屏幕上. 2.HTML元素显示为CSS显示盒子的真正方法称为“可视格式化方式 ...

  8. J - 青蛙的约会(扩展欧几里得)

    https://vjudge.net/contest/218366#problem/J 第一步追及公式要写对:y+nk-(x+mk)=pL => (n-m)k+lp=x-y 可以看出扩展欧几里得 ...

  9. tk.mybatis通用插件updateByPrimaryKeySelective无法自动更新ON UPDATE CURRENT_TIMESTAMP列的解决办法

    tk.mybatis是一个很好用的通用插件,把CRUD这些基本的数据操作全都用动态SQL语句自动生成了,mapper和xml里十分清爽,但是昨天发现有一个小坑,记录在此: 有一张表,结构如下(已经简化 ...

  10. Drools(BRMS) 速成教程(上)

    大家在日常开发中,肯定遇到过一些业务规则变来变去的需求,比如:会员积分系统(今天要新注册会员送10积分,明天要改成注册送优惠券,后天搞活动要改成注册自动变成高级会员...),此类需求,一般都是通过写i ...