一、有关鼠标的知识点
1. 将鼠标的光标定位到某个文本框中
$("#文本框ID").focus();
2.鼠标放上去呈现手的形状
cursor: pointer;
3.判断鼠标左击还是右击
canvas.onmousedown = function(e) {
if (e.button == 0) {
alert("您点击了鼠标左键!");
} else if (e.button == 2) {
alert("您点击了鼠标右键!")
}
}4.禁止选中文本内容
onselectstart="return false"
5.禁止拖动元素
οndragstart="return false"
二、有关滚动条的知识点
1.滚动条设置
父容器：overflow: hidden;height: 200px;
子容器：overflow-y: scroll;或 overflow-y: auto !important;
2.每次打开弹窗，滚动条置顶
$("#弹窗位置")[0].scrollTop = 0;3.获取滚动条高度和宽度
//获取竖向滚动条到顶部的距离
$(document).scrollTop();
//获取横向滚动条到最左侧的距离
$(document).scrollLeft()
//获取滚动条宽度
function getScrollWidth() {
var noScroll, scroll, oDiv = document.createElement("DIV");
oDiv.style.cssText = "position:absolute; top:-1000px; width:100px; height:100px; overflow:hidden;";
noScroll = document.body.appendChild(oDiv).clientWidth;
oDiv.style.overflowY = "scroll";
scroll = oDiv.clientWidth;
document.body.removeChild(oDiv);
return noScroll-scroll;
}三、有关css样式的知识点
1.a标签去掉下划线
a{text-decoration:none}
2.文字在div里面垂直居中
vertical-align: middle;
3.css字体超出部分用省略号表示
1. 使用overflow: hidden; 把超出的内容进行隐藏
2. 然后使用white-space: nowrap; 设置内容不换行
3. 最后使用text-overflow: ellipsis; 设置超出内容为省略号
4.隐藏/展示某个模块
$("#button-batch-delete").removeClass("hidden");
$("#button-batch-delete").addClass("hidden");
或者
$("#button-batch-delete").show();
$("#button-batch-delete").hide();5.让span在div中垂直居中
<div style='display: inline-grid;text-align: center;float: left;'>
<span class='kssj'></span>
<span>至</span>
<span class='jssj'></span>
<div>6.CSS里面的>
A > B 表示选择A元素的所有子B元素
A B选择A元素的所有后代B元素，
所以，> 表示只选择一代
7.设置高度
$("#").css("height", "100%");
8.背景图片设置
background: url("../../icons/abbs-slide-left-normal.png") no-repeat;
或者
background-image: url("../../icons/abbs-slide-left-hover.png");
或者
$(“位置”).css("background-image","url(on.jpg)");
9.图片块级变行级
html
<div class='guide-img-container'>
<image class='guide-img' src='../../images/iii.png'></image>
</div>css
.guide-img-container{
display:flex;
justify-content: center;
}
.guide-img{
width: 60px;
height: 60px;
}10.父元素根据子元素的高度自适应
四、有关时间的知识点
1.JS实现间隔一段时间之后执行当前代码
setTimeout(function() {
refreshAllTrees();
}, 2500);2.JS实现间隔一段时间之后执行下一段代码
function sleep(delay) {
var start = (new Date()).getTime();
while ((new Date()).getTime() - start < delay) {
continue;
}
}五、处理对象的知识点
1. 关于span里面内容的获取与赋值
$('#word').text(place);2.关于var self = this
在全局对象中，this指向的是window对象；
在自定义函数中，this对象指向的是调用这个函数的对象;
3.关于表格单元格的获取
.data-list .table-head:nth-child(1)
.data-list tbody tr td:nth-child(1)其中，小括号里面的数字表示第几列，从1开始。
4.JSON.parse()与JSON.stringify()
JSON.stringify()，将JSON对象转换为JSON类型的字符串
JSON.parse()，将JSON类型的字符串转换为JSON对象
4.1 使用JSON.parse()
var data='{"name":"Peter"}'
JSON.parse(data)
结果：name:"Peter"
4.2 使用JSON.stringify(data)
JSON.stringify(data)结果：'{"name":"Peter"}'
5.截取字符串
str=str.substring(0,i) 0是开始下标，i是结束下标，不包括i
6.对数组中的对象进行排序
list.sort(function (a,b) {
return a.JHYF < b.JHYF;
})7.获取同级元素
$("#id").next();相邻下一个同级元素
$("#id").prev();相邻上一个同级元素
$("#id").siblings();所有同级元素
举例： $($(this).siblings().children(".device-content").children("span")).removeClass("selected-mt");8.字符串替换
var aTime = a.addTime.replace(/:/g, "").replace(/-/g, "").replace(/[ ]/g,"");上面是把2000-01-01 17:08:53中的所有非数字去掉
9.对象不支持“getElementsByClassName”属性或方法
if(!document.getElementsByClassName){
document.getElementsByClassName = function(className, element){
var children = (element || document).getElementsByTagName('*');
var elements = new Array();
for (var i=0; i<children.length; i++){
var child = children[i];
var classNames = child.className.split(' ');
for (var j=0; j<classNames.length; j++){
if (classNames[j] == className){
elements.push(child);
break;
}
}
}
return elements;
};
}
var seled = document.getElementsByClassName('seled');10.返回数组中指定元素的索引值
$.inArray(“3“，["2", "1", "3"]); //返回值为2
11.复选框选择
$("复选框位置").prop('checked',true);
