JavaScript一些常用demo汇总
获取显示当前时间
代码语言:javascript复制/* jQuery代码 */
$(function () {
$("#now-time").attr("onselectstart", "return false");//禁止选中文字
$("#now-time").text(currentTime());
setInterval(function () {
$("#now-time").text(currentTime());
}, 1000);
/**
* 获取最新时间/可使用BiugleJS挂在Date原型上的方法format获取当前时间new Date().format("yyyy-mm-dd h:i:s");
* @returns {String}
*/
function currentTime() {
var date = new Date();
var time;
var year = date.getFullYear();
var month = date.getMonth() 1;
var day = date.getDate();
var hour = date.getHours();
var minute = date.getMinutes();
var second = date.getSeconds();
hour = (hour < 10) ? ("0" hour) : hour;
minute = (minute < 10) ? ("0" minute) : minute;
second = (second < 10) ? ("0" second) : second;
time = year "年" month "月" day "日" " " hour ":" minute ":" second;
return time;
}
});
前台处理字符串
代码语言:javascript复制
/**
* 处理问题字符串
* @param {String} 要处理的字符串。//可使用es6trim方法
*/
function formatStr(str) {
str = str.replace(/^s |s $/g, "");//去掉前后空格
//str = str.replace(/s /g,"");//去掉空格
//str=str.replace( /^s/, '');//去掉左空格
//str=str.replace(/(s$)/g, "");//去掉右空格
let div = document.createElement('div');
div.textContent = str;//利用textContent属性转化"<",">","&","'"等字符
let formatString = div.innerHTML;
return formatString;
}
onkeydown设置键盘事件
代码语言:javascript复制
/**
* 键盘事件
* @param {Event} 当前按下的按键。SPA网站记得离开页面时off掉原有事件
*/
function addKeyboard(e) {
//console.log(e.key);//获取键值
var keyNum = window.event ? e.keyCode : e.which;
//console.log(keyNum);
if (keyNum === XXX) {
//do something
}
if (keyNum === XXX && e.altKey) {
//do something
}
if (keyNum === XXX && e.ctrlKey) {
//do something
}
}
数组处理
代码语言:javascript复制
/* 第一种方法 */
let a = document.querySelectorAll("a");
for(let i = 0; i < a.length; i ){
console.log(a[i]);
}
--------------------------------------------------
/* 第二种方法 */
let A = document.querySelectorAll("a");
Array.prototype.filter.call(A, function (a) {
console.log(a);
});
代码语言:javascript复制/* 取第一个值 */
for (let key in response) {
result = response[key];
break;
}
for (let value of response) {
result = value;
break;
}
/* 循环处理数组/对象 jquery举例子,更多js遍历数组方法不介绍了。 */
/* 需注意,除for...of,for,for...in之外,其他方法均不能强行跳出。 */
$.each([array/object], function (key, val) {
//do something
});
/* 例a */
$.each([1, 2], function(key, value) {
alert(index ': ' value);
});
/* 这将产生两个信息 */
/* 0: 52 */
/* 1: 97 */
/* 例b */
let obj = {
"a": "AAA",
"b": "BBB"
};
$.each(obj, function(key, value) {
alert( key ": " value );
});
/* 这将产生两个信息 */
/* a: AAA */
/* b: BBB */
产生随机数
代码语言:javascript复制
/**
* 产生随机数
* @param {Number} 随机数范围
* @returns {Number} 产生的随机数
*/
function getRandnum(range) {
var num = Math.random() * range;
num = parseInt(num);
return num;
}
控制台打印内容
代码语言:javascript复制function consoleInfo() {
console.log("%c博客名称�oubleAm", "line-height:28px;padding:4px;background:#a1afc9;color:#000;font-size:16px;margin-right:15px", "color:#3fa9f5;line-height:28px;font-size:16px;");
console.log("%c网站地址%chttps://a.biugle.cn", "line-height:28px;padding:4px;background:#a1afc9;color:#000;font-size:16px;margin-right:15px", "color:#00bc12;line-height:28px;font-size:16px;");
console.log("%c扣扣号码�005760694", "line-height:28px;padding:4px;background:#a1afc9;color:#000;font-size:16px;margin-right:15px", "color:#ff9900;line-height:28px;font-size:16px;");
console.log("%c桃李春风一杯酒,江湖夜雨十年灯!", "line-height:28px;padding:5px;color:#fff;font-weight:bolder;font-size:16px;background-color:chocolate;color:#fff;");
if (window.console && window.console.log) {
console.log(`%c页面加载消耗了 %c${(Math.round(100 * performance.now()) / 100 / 1e3).toFixed(2)}s`, "background: #fff;color: #333;text-shadow: 0 0 2px #eee, 0 0 3px #eee, 0 0 3px #eee, 0 0 2px #eee, 0 0 3px #eee;", "color:tomato;font-weight:bolder;");
localStorage.getItem("access") || localStorage.setItem("access", (new Date).getTime());
let e = new Date(parseInt(localStorage.getItem("access")));
let o = `${e.getFullYear()}年${e.getMonth() 1}月${e.getDate()}日`;
let t = 0;
localStorage.getItem("hit") ? t = parseInt(localStorage.getItem("hit")) : localStorage.setItem("hit", 0);
localStorage.setItem("hit", t);
console.log(`%c这是你自 %c${o} %c以来第 %c${t} %c次在本站打开控制台,你想知道什么秘密吗~`, "", "color:chocolate;font-weight:bolder;", "", "color:chocolate;font-weight:bolder;", "");
}
}
禁止使用快捷键打开控制台
这个是闹着玩的,只需把右键点击事件取消,在把
Ctrl U
和F12
这两个快捷键原本的事件取消,或者重新设置一个监听方法就可以了。