js 零散知识总结
网页播放声音
这个非常简单,我们只需要在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 零散知识总结的更多相关文章
- js 零散知识
# 同一种类型的事件注册多个事件句柄,后面的不会覆盖前面的事件 # event.which == 13,13代表回车 # parsley.js验证框架 # JSON.stringify, avoid ...
- css,js零散知识的整理
在同一个dom上以冒泡和捕获的方式绑定一个事件,如果事件源是该元素,则是先绑定的哪一个就先执行哪一个,事件源是dom的子孙节点,则先执行捕获事件
- 零散的JS和node.js小知识
JS的连续赋值和曾经出现的怪异情况 let a=1; let b=a=3; 如上的真实赋值过程 => a=1 => a=3 => b=3 => 一般来说,等号是从右向左赋值的 ...
- [JS复习] JS 基础知识
项目结尾,空闲时间,又把<JS 基础知识> 这本书过了一遍,温故知新后,很多知其然不知其所以然的内容 豁然开朗. [1. 用于范围的标签] display :inline or bloc ...
- iOS网络相关零散知识总结
iOS网络相关零散知识总结 1. URL和HTTP知识 (1) URL的全称是Uniform Resource Locator(统一资源定位符). URL的基本格式 = 协议://主机地址/路径 ...
- HTML+CSS+JS基础知识
HTML+CSS+JS基础知识 目录 对HTML+CSS+JS的理解 基础知识 对HTML+CSS+JS的理解 基础知识 插入样式表的三种方式 外部样式表:<link rel="sty ...
- Node.js基础知识
Node.js入门 Node.js Node.js是一套用来编写高性能网络服务器的JavaScript工具包,一系列的变化由此开始.比较独特的是,Node.js会假设在POSIX环境下运行 ...
- 网站开发进阶(十五)JS基础知识充电站
JS基础知识充电站 1.javascript alert弹出对话框时确定和取消两个按钮返回值? 用的不是alert对话框,是confirm confirm(str); 参数str:你要说的话或问题: ...
- NodeJs>------->>第三章:Node.js基础知识
第三章:Node.js基础知识 一:Node.js中的控制台 1:console.log.console.info 方法 console.log(" node app1.js 1> ...
随机推荐
- ES6 原始类型 Symbol
1. 创建Symbol (没有字面格式) Symbol是原始值,没有构造函数 Symbol接受一个可选参数,可以让你添加一段文本描述即将创建的Symbol,这段描述不可用于属性访问,以便于代码阅读和调 ...
- html5页面拨打电话实现的方法
拨打电话:<p>咨询电话 <a href="tel:17337956096">拨号: 17337956096</a></p> 发送 ...
- openstack 之~keystone基础
第一:keystone是什么? keystone是 OpenStack Identity Service 的项目名称,是一个负责身份管理验证.服务规则管理和服务令牌功能.它实现了openstack的i ...
- 【管用】 使用VMtools实现主机Windows与虚拟机Linux文件共享
实现windows主机与linux虚拟机文件共享,有很多方法,包括使用samba文件服务器等,本文介绍通过vmware虚拟机软件中的vmtools工具来实现文件共享. 一.环境 1.主机:Window ...
- SpringBoot无废话入门03:SpringMVC支持
1.默认配置 Springboot对于路径的默认位置为: spring.resources.static-locations=classpath:/META-INF/resources/,classp ...
- 卷积的三种模式:full, same, valid
通常用外部api进行卷积的时候,会面临mode选择. 本文清晰展示三种模式的不同之处,其实这三种不同模式是对卷积核移动范围的不同限制. 设 image的大小是7x7,filter的大小是3x3 1,f ...
- SPI协议详解
原帖地址:https://blog.csdn.net/weiqifa0/article/details/82765892
- [Python设计模式] 第28章 男人和女人——访问者模式
github地址:https://github.com/cheesezh/python_design_patterns 题目 用程序模拟以下不同情况: 男人成功时,背后多半有一个伟大的女人: 女人成功 ...
- Docker配置参考
Docker配置参考 一.参数列表 参考网址:https://docs.docker.com/engine/reference/commandline/dockerd/#options Usage: ...
- 关于snowflake算法生成的ID转换为JS的数字类型由于过大导致JS精度丢失的问题
JS的数字类型目前支持的最大值为:9007199254740992,一旦数字超过这个值,JS将会丢失精度,导致前后端的值出现不一致. JAVA的Long类型的 最大值为:922337203 ...