前端小功能：小小笔记

1.控制台打印DOM节点的所有属性和方法

console.dir(dom)

1.1 console.log 变量包装

您在 console.log() 的时候，将参数用大括号括起来，这样可以同时看到变量名和变量值。

const num = 123;
console.log({num}) // {num: 123}

2.程序耗时

console.time('计时器1');
to do
console.timeEnd('计时器1');

3. 获取DOM在可视区域的位置大小

var dom = document.getElementById('id')
console.dir(dom)
var rect = gaodom.getBoundingClientRect();
console.log(rect)  // left、top、right、bottom 、width、height

4.获取DOM样式，dom.style 只能获取内嵌样式，支持读写。

Window.getComputedStyle()支持读取所有应用的最终样式。

let style = window.getComputedStyle(element, [pseudoElt]);
// element 用于获取计算样式的Element。
// pseudoElt 可选指定一个要匹配的伪元素的字符串。必须对普通元素省略（或null）。
let elem1 = document.getElementById("elemId");
let style = window.getComputedStyle(elem1, null);

 5. JS校验密码复杂度（必须包含字母、数字、特殊符号）

var pwdRegex = new RegExp('(?=.*[0-9])(?=.*[A-Z])(?=.*[a-z])(?=.*[^a-zA-Z0-9]).{8,30}');  
if (!pwdRegex.test('A3b@C2dEF')) {
 　　alert("您的密码复杂度太低（密码中必须包含大小写字母、数字、特殊字符），请及时修改密码！");
}

var pwdRegex = new RegExp('(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[^a-zA-Z0-9]).{8,30}'); 
if (!pwdRegex.test('a2b3c$def')) {
    alert("您的密码复杂度太低（密码中必须包含字母、数字、特殊字符），请及时修改密码！");
}

var pwdRegex = new RegExp('(?=.*[0-9])(?=.*[a-zA-Z]).{8,30}'); 
if (!pwdRegex.test('a2b3c4d5')) {
    alert("您的密码复杂度太低（密码中必须包含字母、数字），请及时修改密码！");
}

 

没有终点，没有彼岸，坚持就好，愿岁月如初