event.KeyCode
keyCode 属性返回onkeypress事件触发的键的值的字符代码(表示 ASCII 字符的数字)。
提示: 如果需要知道用户按下的是打印键 (如 “a” 或 “5”),建议使用 onkeypress 事件。如果需要知道用户按下的是功能键(如 “F1”, “CAPS LOCK” 或 “Home”) 可使用 onkeydown 或 onkeyup 事件。
查询:http://www.bejson.com/othertools/keycodes/
function printCode(event){
console.log(event.keyCode);
}
//方式 1
window.addEventListener('keypress',printCode)
//方式 2
<input type="text" onkeypress="printCode(event)">
模板字符串
模板字符串可以包含特定语法(${expression})的占位符。占位符中的表达式和周围的文本会一起传递给一个默认函数,该函数负责将所有的部分连接起来。在模版字符串内使用反引号(`)时,需要在它前面加转义符(\)。
var a = 5;
var b = 10;
//多行字符串普通拼接
console.log('Fifteen is ' + (a + b) + ' and\n'+
'not' + (2 * a + b) + '.');
// "Fifteen is 15 and
// not 20."
//插入表达式
console.log(`Fifteen is ${a + b} and
not ${2 * a + b}.`);
// "Fifteen is 15 and
// not 20."
document.querySelector
匹配指定 CSS 选择器的第一个元素,如果没有找到,返回 null。如果指定的选择器不合法,会抛出错误SyntaxError,如$("##div")。
parentNode.querySelectorAll回的对象是 NodeList 。
与getElementById的区别:https://blog.csdn.net/wzj2584454/article/details/78984685
element.classList
classList 属性返回元素的类名,该属性用于在元素中添加,移除及切换 CSS 类。classList 属性是只读的,可以使用 add() 和 remove() 方法修改它。
const div = document.createElement('div');
div.className = 'foo';
// our starting state: <div class="foo"></div>
console.log(div.outerHTML);
// use the classList API to remove and add classes
div.classList.remove("foo");
div.classList.add("anotherclass");
// <div class="anotherclass"></div>
console.log(div.outerHTML);
// replace class "foo" with class "bar"
div.classList.replace("foo", "bar");
// if visible is set remove it, otherwise add it
div.classList.toggle("visible");
removeEvent
forEach()
forEach 方法按升序为数组中含有效值的每一项执行一次callback 函数。
注意:forEach 遍历的范围在第一次调用 callback 前就会确定。调用 forEach 后添加到数组中的项不会被 callback 访问到。如果已经存在的值被改变,则传递给 callback 的值是 forEach 遍历到他们那一刻的值。已删除的项不会被遍历到。而且不像 map() 或者 reduce(),它总是返回 undefined 值,并且不可链式调用。典型用例是在一个链的最后执行副作用。
const fruits = ['apple','banana','lemon'];
const empty = [];
//for循环
for(let i=0;i<fruits.length;i++){
empty.push(item[i])
}
//forEach
fruits.forEach((fruit) => {
empty.push(fruit)
})
fruits.forEach((fruit,index) => {
console.log(`[${index+1}]:${fruit}`)
})
//[1]:apple
//[2]:banana
//[3]:lemon
参考
MDN文档