常用方法的封装
根据类名获取DOM元素
判断是否是数字
// 方法一:正则
// return /^d+$/g.test(numStr);
// 方法二:使用isNaN函数,可能存在潜在问题
return !isNaN(numStr);
}
从数组中删除指定下标的元素
声明一个临时数组,遍历原数组并判断是否等于给出的索引,如果相等则跳过本次循环;否则将其压入临时数组。
var content = [];
for (var i = 0; i < arr.length; i++) {
if(index == i){
continue;
}
content.push(arr[i]);
}
return content;
}
常用效果案例
标题栏跑马灯
var title = document.title;
var firstCh,leftChs,lastCh; // 第一个字符,剩下的字符和最后一个字符
if(dir == 'left'){
firstCh = title.charAt(0);
leftChs = title.substring(1,title.length);
document.title = leftChs + firstCh;
} else if(dir == 'right'){
lastCh = title.charAt(title.length - 1);
leftChs = title.substring(0,title.length - 1);
document.title = lastCh + leftChs;
} else {
console.error('跑马灯的方向只能是left和right');
return;
}
// console.log('当前文字的移动方向' + dir + ',' + document.title);
}
window.onload = function(){
// 标题栏跑马灯(注意带参的函数应该使用引号)
setInterval('marqueeTitle("right")',500);
}
走动的页面时钟
/**
-
走动的页面时钟
*/
function timeDate(){
var now = new Date(),year = now.getFullYear(),month = now.getMonth() + 1,day = now.getDate(),h = checkTime(now.getHours()),m = checkTime(now.getMinutes()),s = checkTime(now.getSeconds()),weekday = '星期' + '日一二三四五六'.charAt(now.getDay());
getDOMById('time').innerHTML = year + "年" + month + "月" + day + "日 " + weekday + h + ":" + m + ":" + s;
setTimeout(timeDate,1000);
}
window.onload = function(){
timeDate();
}
实现二:
抽签程序
跳出$.each() 遍历使用return false
' + val);
if (index == 2) {
return false; // 只能是return false
};
});
Excel列编号转化为数字
1,B-->2,AA-->27
*/
function convertColNumToInt(sHex) {
const START = 'A'.charCodeAt(0) - 1;
const RADIX = 26;
var ret = 0;
for(let i = 0;i < sHex.length;i++){
ret *= RADIX;
ret += sHex.charCodeAt(i) - START;
}
return ret;
}
// 法2
/**
-
将excel列转化为数字:A-->1,AA-->27
-
-
hash表存放
-
A => 1,B => 2,...Z => 26
*/
function convertColNumToInt(sHex) {
const RADIX = 26;
let m = new Map();
for(let i = 1;i <= 26;i++){
m.set(String.fromCodePoint(64+i),i);
}
let ret = 0;
for(let i = 0;i < sHex.length;i++){
ret *= RADIX;
ret += m.get(sHex.charAt(i));
}
return ret;
}
判断2个数组是否相似
具体需求如下:
- 数组中的成员类型相同,顺序可以不同。例如[1,true] 与 [false,2]是相似的。
- 数组的长度一致。
- 类型的判断范围,需要区分:String,Boolean,Number,undefined,null,函数,日期,window.
if (!Array.isArray(arr1) || !Array.isArray(arr2) || arr1.length !== arr2.length) {
return false;
}
var t1 = [],t2 = [];
// 依次取得2个数组中的元素类型并放入新的数组
for (var i = 0; i < arr1.length; i++) {
t1.push(typeOf(arr1[i]));
t2.push(typeOf(arr2[i]));
}
// 排序
t1.sort();
t2.sort();
// 比较排序后序列化的字符串
return t1.join() === t2.join();
}
/**
- 得到元素的类型
-
- 单独判断null主要是兼容低版本IE
*/
function typeOf(element) {
return null === element ? "[object Null]" : Object.prototype.toString.call(element);
}
对象克隆
基本思路是逐个枚举属性,如果属性是对象,则进行递归处理。
Array.prototype.clone = function() {
var newArr = [];
if(typeof(this[i]) == 'object' || typeof(this[i]) == 'function'){
newArr[i] = this[i].clone();
} else {
newArr[i] = this[i];
}
return newArr;
}
Function.prototype.clone = function() {
var _this = this;
var newFunc = function () {
return _this.apply(this,arguments);
};
for(var i in this){
newFunc[i] = this[i];
}
return newFunc;
}
上面的代码在绝大多数情况下有效,但是当2个对象互相引用的时候就显得无力,会陷入死循环。必须使用图论算法建立拓扑关系,依次复制每个节点并重建依赖关系!
递归删除目录及文件
复制项目模板文件到指定目录
以上的程序常用于项目的初始化,例如express init 默认生成了初始文件和项目。
判断节点是否包含另一个节点
= 522)){
return refNode.contains(otherNode);
} else if (typeof refNode.compareDocumentPosition == "function"){
return !!(refNode.compareDocumentPosition(otherNode) & 16);
} else {
var node = otherNode.parentNode;
do {
if (node === refNode){
return true;
} else {
node = node.parentNode;
}
} while (node !== null);
return false;
}
}
页面失去焦点触发标题栏切换
let originTitile = document.title
let timer;
document.addEventListener('visibilitychange',function () {
if (document.hidden) {
document.title = "(つェ?)赶快回来玩游戏啦"
clearTimeout(timer);
} else {
document.title = '(′?`) 欢迎回来继续游戏 ' + originTitile
timer = setTimeout(function () {
document.title = OriginTitile
},3000)
}
})
parseInt方法中的小坑
parseInt(string,radix) 接受2个参数,如果第一个不是数字将会调用toStirng() 方法。
再补充几个悲剧
不要将 parseInt 当做转换 Number 和 Integer 的工具。
位运算的妙用
(编辑:李大同)
【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!
|