some small knowledge
cookie 增查
<!--1.语义化标签的作用-->
<!--1.1 从开发角度考虑是提高代码的可读性可维护性-->
<!--1.2 网站的发布者:seo 搜索引擎优化 --> <!--2.语义化标签的兼容问题-->
<!--2.1 IE9以下不支持H5标签(大部分css3属性,一些H5的api)-->
<!--2.2 IE9以下不认识,把这些标签当做行内元素去看待-->
<!--2.3 语义化标签需要动态创建 document.createElement('header') 同时设置块级元素-->
<!--2.4 有一款插件能帮你完成这件事件 html5shiv.js -->
<!--2.5 必须引入在头部,在页面结构之前,提前解析h5标签-->
<!--2.6 优化处理:支持H5标签的不需要加载,IE9以下不支持H5加载-->
<!--2.7 js判断客户的浏览器版本可以做到,但是不能做到js提前加载-->
<!--2.8 条件注释:网页的任何地方 根据浏览器版本去加载内容(html标签)-->
<!--2.9 固定语法 lt 小于 gt 大于 lte 小于等于 gte 大于等于 --> 条件注释
<!--[if lte IE 8]>
<script src="html5shiv.min.js"></script>
<![endif]-->
获取最近个月的时间
import moment from 'moment';
// 默认选择时间为最近7天
const defaultSelectDate = {
startDate: moment().startOf('day').subtract(, 'days').format("YYYY-MM-DD"),
endDate: moment().endOf('day').format("YYYY-MM-DD")
}
// 选择时间限制,区间是今天往前的3个月,也就是最近三个月
const limitSelectDate = {
min: moment().startOf('day').subtract(, 'months').format("YYYY-MM-DD"),
max: moment().endOf('day').format("YYYY-MM-DD")
} defaultSelectDate {startDate: "2019-09-19", endDate: "2019-09-25"}
limitSelectDate {min: "2019-08-25", max: "2019-09-25"}
js 时间格式转换
<script type="text/javascript">
// 获取当前时间戳(以s为单位)
var timestamp = Date.parse(new Date());
timestamp = timestamp / 1000;
//当前时间戳为:1403149534
console.log("当前时间戳为:" + timestamp);
// 获取某个时间格式的时间戳
var stringTime = "2018-07-10 10:21:12";
var timestamp2 = Date.parse(new Date(stringTime));
timestamp2 = timestamp2 / 1000;
//2018-07-10 10:21:12的时间戳为:1531189272
console.log(stringTime + "的时间戳为:" + timestamp2);
// 将当前时间换成时间格式字符串
var timestamp3 = 1531189272;
var newDate = new Date();
newDate.setTime(timestamp3 * 1000);
// Wed Jun 18 2018
console.log(newDate.toDateString());
// Wed, 18 Jun 2018 02:33:24 GMT
console.log(newDate.toGMTString());
// 2018-06-18T02:33:24.000Z
console.log(newDate.toISOString());
// 2018-06-18T02:33:24.000Z
console.log(newDate.toJSON());
// 2018年6月18日
console.log(newDate.toLocaleDateString());
// 2018年6月18日 上午10:33:24
console.log(newDate.toLocaleString());
// 上午10:33:24
console.log(newDate.toLocaleTimeString());
// Wed Jun 18 2018 10:33:24 GMT+0800 (中国标准时间)
console.log(newDate.toString());
// 10:33:24 GMT+0800 (中国标准时间)
console.log(newDate.toTimeString());
// Wed, 18 Jun 2018 02:33:24 GMT
console.log(newDate.toUTCString());
Date.prototype.format = function(format) {
var date = {
"M+": this.getMonth() + 1,
"d+": this.getDate(),
"h+": this.getHours(),
"m+": this.getMinutes(),
"s+": this.getSeconds(),
"q+": Math.floor((this.getMonth() + 3) / 3),
"S+": this.getMilliseconds()
};
if (/(y+)/i.test(format)) {
format = format.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length));
}
for (var k in date) {
if (new RegExp("(" + k + ")").test(format)) {
format = format.replace(RegExp.$1, RegExp.$1.length == 1
? date[k] : ("00" + date[k]).substr(("" + date[k]).length));
}
}
return format;
}
console.log(newDate.format('yyyy-MM-dd h:m:s'));
</script>
H5 知识
H5 api
1. querySelector() 获取符合选择器的第一个元素
2. querySelectorAll() 获取符合选择器的所有元素
1. jquery操作类的方法:addClass() removeClass() toggleClass() hasClass()
2. h5也有类似的api 基于一个对象classList的方法 add() remove() toggle() contains() //contains判断有误类,返回布尔值 eg:
<script>
var dom = document.querySelector('li:nth-child(2)');
/*1.获取类*/
console.log(dom.classList);
/* DOM.classList 获取的是这个DOM元素上的所有class */
/*2.操作类*/
dom.classList.add('blue');
dom.classList.remove('red'); document.querySelector('button').onclick = function () {
dom.classList.toggle('toggle');
console.log(dom.classList.contains('red'));
}
</script> H5自定义属性 : date-*
H5的date-*属性: 更改的是DOM
var div= document.querySelector('div') //获取
div.dateset //获取元素的所有date 对象
div.dateset.user //获取单个 jQuery的date-*属性 : 更改的是内存(对象存储的位置内存,并不修改DOM)
$('div').date() //获取所有date属性
$('div').date('user') // 获取单个
$('div').date('user','16') //设置属性值
<meta http-equiv="refresh" content="0; url="> 404重定向
页面定期刷新,如果加url的,则会重新定向到指定的网页,content后面跟的是时间(单位秒),把这句话加到指定网页的<head></head>里
分享到Facebook links yotube
<div class=fx><a class=fb href="javascript:window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(document.location.href)+'&t='+encodeURIComponent(document.title),'_blank','toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=600, height=450,top=100,left=350');void(0)"></a>
<a class=ytb href=#></a> <a class=tw href="javascript:window.open('http://twitter.com/home?status='+encodeURIComponent(document.location.href)+' '+encodeURIComponent(document.title),'_blank','toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=600, height=450,top=100,left=350');void(0)"></a>
<a class=in href="javascript:window.open('http://www.linkedin.com/shareArticle?mini=true&url='+encodeURIComponent(document.location.href)+'&title='+encodeURIComponent(document.title)+'&source='+encodeURIComponent(document.location.href),'_blank','toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=600, height=450,top=100,left=350');void(0)"></a>
</div>
JsFormat:
这里下载这插件包 https://github.com/jdc0589/JsFormat ,点油下角的zip就能下载
使用方法:
1、快捷键:ctrl+alt+f
html-css-js prettify:
1、快捷键:ctrl+shift+P
3、输入html-css-js prettify,选择html-css-js prettify
电子数据相关的取证:网站被侵权等
https://chenhuichao.com/ 陈回潮的学习博客
//安装ruby 配置sass 环境 移除之前的环境,使用国内镜像
gem sources --add https://gems.ruby-china.com/ --remove https://rubygems.org/ //安装完成之后,查看源
gem sources -l //提示如下
*** CURRENT SOURCES ***
https://gems.ruby-china.com/
gem install sass 编译参数:--no-cache %FileName% %FileBaseName%.css --style compact
参考链接:https://gems.ruby-china.com/
滚动到页头
<script> $(window).scroll(function(){
$("#scrolls").click(function(){
$("html, body").animate({scrollTop:0 },300);
})
});
</script>
监听span里面text 文本的变化触发事件
$("#select2-chosen-6").bind("DOMNodeInserted",function(e){
console.log($(e.target).html());
})
jquery : stickUp
#获取访问用户的IP地址
<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script> document.write(returnCitySN["cip"]+','+returnCitySN["cname"])
$.ajax({ type: "POST", url: "test.json", data: {ip:'168.122.122.12'}, dataType: "json", success: function(data){ } });
请求轮询:数据实时更新——每隔xx秒需要刷新一次接口——即需要用到定时器相关原理,只使用setInterval 会造成定时器叠加,致页面卡死
window.setInterval(() => {
setTimeout(fun, 0)
}, 30000)
//点击遮罩层隐藏,解决方案是便是判断event target ,并且保证 这个时间不会冒泡。
$('.overlay').click(function(e){
if (e.target == e.currentTarget)
closeOverlay();
});
cookie小记
//判断cookie是否存在
getCookie(name)
{
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
if(arr != null) {
this.options=JSON.parse(arr[2])
}else{
this.getScreen()
}
} //设置增加cookie params: exdays(定时过期)
设置定cookie 为数组内含对象时需要转换为字符串 eg: var data=[{a:1},{a:2}] JSON.stringify(data)
setCookie(c_name,exdays) {
var exdate = new Date();
exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
window.document.cookie = "secondCategory" + "=" + c_name + ";path=/;expires=" + exdate.toGMTString();
}
修改滚动条样式
/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar
{
width: 4px; /*滚动条宽度*/
height: 10px; /*滚动条高度*/
} /*定义滚动条轨道 内阴影+圆角*/
::-webkit-scrollbar-track
{
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
border-radius: 10px; /*滚动条的背景区域的圆角*/
background-color: #eee;/*滚动条的背景颜色*/
} /*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb
{
border-radius: 10px; /*滚动条的圆角*/
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
background-color: #999; /*滚动条的背景颜色*/
}
// 对象深度克隆方法
export function cloneObj(obj) {
let str;
let newobj = obj.constructor === Array ? [] : {};
if (typeof obj !== 'object') {
return;
} else if (window.JSON) {
str = JSON.stringify(obj); // 序列化对象
newobj = JSON.parse(str); // 还原
} else {
// 如果不支持以上方法
for (const i in obj) {
if ({}.hasOwnProperty.call(obj, i)) {
newobj[i] = typeof obj[i] === 'object' ? cloneObj(obj[i]) : obj[i];
}
}
}
return newobj;
}
邮箱校验:
REGEX_EMAIL = "^([a-z0-9A-Z]+[-|\\.]?)+[a-z0-9A-Z]@([a-z0-9A-Z]+(-[a-z0-9A-Z]+)?\\.)+[a-zA-Z]{2,}$"
当前分支是maser分支,我想将stable分支上的代码完全覆盖brush分支,首先切换到brush分支。
git reset --hard origin/stable
// 计算两个时间搓的差时
function getInterval(start, end) {
//两个日期对象,相差的毫秒数
var interval = end - start;
// 两个日期对象,相差的秒数
// interval = interval / 1000;
interval /= 1000;
//求相差的天数/小时数/分钟数/秒数
var day, hour, minute, second;
day = Math.round(interval / 60 / 60 / 24);
hour = Math.round(interval / 60 / 60 % 24);
minute = Math.round(interval / 60 % 60);
second = Math.round(interval % 60);
return {
day: day,
hour: hour,
minute: minute,
second: second
}
}
//时间格式化
1.
var date= new Date(); //获取日期
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(); //获取秒
var weekday=date.getDay(); //获取周
var week=new Array(7); //数组
week[0]=‘周日’; 2.
var unixTimestamp = new Date( 1477386005*1000 ) ;
commonTime = unixTimestamp.toLocaleString();
Date.prototype.toLocaleString = function() {
return this.getFullYear() + "年" + (this.getMonth() + 1) + "月" + this.getDate() + "日 " + this.getHours() + "点" + this.getMinutes() + "分" + this.getSeconds() + "秒";
};
console 的常用方法
1. 计算操作占用时长
console.time('timer');
console.timeEnd('timer');
2.console.table() 将数据以表格的形式显示
3.console.count() 此函数接受一个可选参数 label // 输出被调用的次数
// 4位的随机数
function rid() {
return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
}
// 再组合4个4位随机数
export function uuid() {
return (tid() + "_" + rid() + "_" + rid() + "_" + rid())
}
<script>
sessionStorage.setItem('reload', 1)
window.addEventListener('error', function (event) {
try {
const msg = event.message
const unToken = /Unexpected token/.test(msg) && /</.test(msg) && /Uncaught SyntaxError/.test(msg)
const chunkFailed = /ChunkLoadError/.test(msg) && /Loading chunk/.test(msg) && /failed/.test(msg)
let firstReload = sessionStorage.getItem('reload')
if ((chunkFailed || unToken) && (Number(firstReload) <= 5)) {
sessionStorage.setItem('reload', Number(firstReload) + 1)
window.location.reload()
}
} catch (err) {
console.log('e', err)
}
})
</script>
some small knowledge的更多相关文章
- business knowledge
Finance knowledge Trading---At the core of our business model is Trading, which involves the buying ...
- 最少知识原则(Least Knowledge Principle)
最少知识原则(Least Knowledge Principle),或者称迪米特法则(Law of Demeter),是一种面向对象程序设计的指导原则,它描述了一种保持代码松耦合的策略.其可简单的归纳 ...
- 聊一聊google的Knowledge Graph
什么是Knowledge Graph? 它是google用于增强它的搜索引擎的功能和提高搜索结果质量的一种技术.在2012年5月16日提出,除了提供基本的与主题相关的链接服务之外,它还能结构化与主题相 ...
- prior knowledge
https://en.wikipedia.org/wiki/Bayes'_theorem For example, if cancer is related to age, then, using B ...
- 前端技能汇总 Frontend Knowledge Structure
Frontend Knowledge Structure 项目起源 还记得@jayli 的这幅前端知识结构图么. 图片的形式具有诸多的不便.缺失源图的我们,无法为此图贡献些什么,随着时间的迁移,或许有 ...
- [1.1]Knowledge that should be prepared
Actually, there are a huge amount of knowledge we need to learn. So I hope you don't be scared. It's ...
- The influence of informal governance mechanisms on knowledge integration
Title:The influence of informal governance mechanisms on knowledge integration within cross-function ...
- PKM(personal knowledge management)
内化 一般含义 一般上,当涉及道德行为时,内化是巩固和植入某人信念.态度和价值的长期过程,而这一过程的实现牵扯到精神分析或行为方法的慎重使用. 当改变道德行为时,一组新的信念.态度和价值代替或适应于所 ...
- 收藏:左路Deep Learning+右路Knowledge Graph,谷歌引爆大数据
发表于2013-01-18 11:35| 8827次阅读| 来源sina微博 条评论| 作者邓侃 数据分析智能算法机器学习大数据Google 摘要:文章来自邓侃的博客.数据革命迫在眉睫. 各大公司重兵 ...
- [Paper Reading]--Exploiting Relevance Feedback in Knowledge Graph
<Exploiting Relevance Feedback in Knowledge Graph> Publication: KDD 2015 Authors: Yu Su, Sheng ...
随机推荐
- ContextCapture水面约束(水面破洞修复)
[问题描述] 对于水面而言,由于特征点较少,软件在计算时很难匹配正确,导致输出模型的水面通常是支离破碎的.软件针对这种情况提供了一个约束工具,用户手动的为水面添加平面约束后,输出的水面模型就会非常 ...
- FZU 1921——栀子花开——————【线段树单点更新】
栀子花开 Time Limit:1000MS Memory Limit:32768KB 64bit IO Format:%I64d & %I64u Submit Status ...
- 深入理解JavaScript系列(27):设计模式之建造者模式
介绍 在软件系统中,有时候面临着“一个复杂对象”的创建工作,其通常由各个部分的子对象用一定的算法构成:由于需求的变化,这个复杂对象的各个部分经常面临着剧烈的变化,但是将它们组合在一起的算法确相对稳定. ...
- [转]什么?你还不会写JQuery 插件
本文转自:http://www.cnblogs.com/joey0210/p/3408349.html 前言 如今做web开发,jquery 几乎是必不可少的,就连vs神器在2010版本开始将Jque ...
- 正则表达式过滤联系方式,微信手机号QQ等
有些输入不允许用户输入联系方式.可以使用以下正则表达式来判断是否输入敏感信息 var reg = new RegExp("(微信|QQ|qq|weixin|1[0-9]{10}|[a-zA- ...
- 新手的grid布局
html部分 <!DOCTYPE html><html><head><meta charset="utf-8"><link r ...
- 最新机动车行驶证模板PSD可编辑分层文件下载
机动车行驶证PSD模板下载地址: http://www.qijieworld.com/thread-1834752-1-1.html 模板为psd格式,内容可编辑修改,需使用 Photoshop CS ...
- Python学习系列提升篇------字符串
字符串是python学习中重要的内容,在以后的工作中,对字符串的处理也必少不了.下面总结一下关于字符串学习的经验. 1.1 字符串的连接和合并 用‘ + ’连接,将两个字符串相加. 合并, ...
- 64位MATLAB和C混合编程以及联合调试
[环境说明] 电脑操作系统:win 7 旗舰版,64位 MATLAB版本:R2013b VS版本:Microsoft Visual Studio 2010 [操作说明] 1.在原来工程的基础上添加下列 ...
- hibernate_ID生成策略
increment:主键按数值顺序递增.此方式的实现机制为在当前应用实例中维持一个变量,以保存着当前的最大值,之后每次需要生成主键的时候将此值加1作为主键.这种方式可能产生的问题是:如果当前有多个实例 ...