jsdom元素、数组以及排序

jsdom元素的操作

1.获取元素的方法：getElementsByClassName 返回集合；
例：

var btn=documennt.getElementsByClassName("btnlist")
console.log(btn[0]);

 var btn2=document.getElementById("btn");
 console.log(btn2);

2.直接获取body的方法：

console.log(document.body);

js元素的事件

1.dom事件前缀都带on;
2.dom事件可分为键盘事件 表单事件 鼠标事件 浏览器事件 触屏事件；
键盘事件可分为onkeydown(键盘按下)；onkeyup(键盘抬起)； onkeypress(按键事件)；
表单事件可分为onfouse(获得焦点事件)； onblur(失去焦点事件) ；
鼠标事件可分为onclick(单击事件)； ondbclick(双击事件)； onmouseleave(鼠标水平离开事件)； onmousemove(鼠标移动)； onmouseenter(鼠标进入)； onmouseover(鼠标悬停)；
浏览器事件可分为window事件；onload加载完成事件；onresize窗口变化事件 ；onerror报错事件
onscroll滑动事件；
触屏事件可分为touch触屏事件；touchstart开始触屏事件；touchmove触屏移动事件；touchend触屏结束事件；
3.给dom元素添加事件：
动态添加事件：

var btn = document.getElementById("btn");
    btn.onclick = function () {
        console.log(1);
    }
    btn.onclick = showinfo;
     function showinfo() {
        console.log(1);
    }
 

4.事件的监听

var btn2 = document.getElementById("btn2");
   btn2.addEventListener("click",function (){
    console.log(2);
    });
   btn2.addEventListener("click", showbtn);

   function showbtn() {
       console.log(2);
   } 

5.改变dom元素的属性和行为

 var btn=document.getElementsByTagName("button");
    btn[0].style.background="red";
    btn[0].style.width="200px";
 console.log(btn[0].style.width);

   
   

获取非行内样式：

  console.log(window.getComputedStyle(btn[0]).height);
    console.log(window.getComputedStyle(btn[0]).width);

js里面的数组

一.数组
1.赋值一个参数，代表的是数组的长度为2 例如var arr = new Array(2);
2.;多个值代表直接赋值（长度自动）：var arr1 = new Array(2, 3, 4)；
3.var k=new Array() 简写：var k=[];
4.var k = [1, 2, 3, 4, 5];
4.1 数组拼接：console.log(k.join("|"));
join是驻足转化为string，参数是按照什么符号拼接；
4.2 数组翻转：console.log(k.reverse());
reverse 数组的翻转
4.3 截断数组：1.slice（截取完成之后对原数组没有影响）
console.log(k.slice(0, 2));
console.log(k);
2.splice （截取完成之后对原数组有影响）
console.log(k.splice(0, 3));
console.log(k);
4.4数组追加：push （数组内容之后追加 返回的值是数组的长度）
console.log(k.push(0));
console.log(k);
unshift （内容之前追加 返回值是数组的长度）
console.log(k.unshift(-1))；
console.log(k);
4.5数组删除：shift （数组的删除 ，删除前面的，返回值是删除的值）
console.log(k.shift());
console.log(k);
pop（ 删除是最后边的 返回值是删除的值）
console.log(k.pop());

数组的排序

1.选择排序：

function selectionSort(array) {
if (Object.prototype.toString.call(array).slice(8, -1) === 'Array') {
var len = array.length, temp;
for (var i = 0; i < len - 1; i++) {
var min = array[i];
for (var j = i + 1; j < len; j++) {
if (array[j] < min) {
temp = min;
min = array[j];
array[j] = temp;
}
}
array[i] = min;
}
return array;
} else {
return 'array is not an Array!';
}
}

2.冒泡排序：

function bubbleSort(array) {
if (Object.prototype.toString.call(array).slice(8, -1) === 'Array') {
var len = array.length, temp;
for (var i = 0; i < len - 1; i++) {
for (var j = len - 1; j >= i; j--) {
if (array[j] < array[j - 1]) {
temp = array[j];
array[j] = array[j - 1];
array[j - 1] = temp;
}
}
}
return array;
} else {
return 'array is not an Array!';
}
}