最近写了一个员工管理作业，暴露了一些问题就是。
JS的查找标签的时候，要确定返回的是DOM对象还是数组，document对象可以是任意dom对象，将查询范围限制在当前dom对象，
1、直接查找标签
document.getElementsByTagName("标签名")
document.getElementById("id值")
document.getElementsByClassName("类名")
2、导航查找标签
elementNode.parentElement // 父节点标签元素 elementNode.children // 所有子标签 elementNode.firstElementChild // 第一个子标签元素 elementNode.lastElementChild // 最后一个子标签元素 elementNode.nextElementSibling // 下一个兄弟标签元素 elementNode.previousElementSibling // 上一个兄弟标签元素
3、CSS选择查找器
document.querySelector("css选择器") //根据css选择符来获取查找到的第一个元素，返回标签对象（dom对象）
document.querySelectorAll("css选择器"); // 根据css选择符来获取查找到的所有元素,返回数组
尤其注意在返回多个DOM对象，后形成数组后，还会返回HTMLCollection，这在循环的时候需要特别注意。
而在DOM对象（document Object Model 文档对象模型）下，每个部分都是节点，例如元素节点、属性节点等，DOM 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。
拿到这些元素节点后，我们可以对这些节点进行绑定事件。
1、静态绑定：直接把事件写在标签元素中。
一般会直接调用对应的函数，例如
<div id="div" onclick="foo(this)">click</div>
<script>
function foo(self){ // 形参不能是this;
console.log("foo函数");
console.log(self);
}
</script>
2、动态绑定：在js中通过代码获取元素对象,然后给这个对象进行后续绑定。一般会用到匿名函数。
<p id="i1">试一试!</p>
<script>
var ele=document.getElementById("i1");
ele.onclick=function(){
console.log("ok");
console.log(this); // this直接用
};
</script>
当然绑定事件不止这些，例如：
1、onload事件
2、onsubmit事件
3、onchange事件
4、onmouse事件
5、onkey事件
6、onfocus事件与onblur事件
拿到标签、绑定事件，我们会进行操作标签，一般有文本操作、value操作（只限input、select、textarea标签）、CSS的样式操作、属性操作等。
当然JS里面还有一些基础语法会经常用到，例如
1、最基础的变量声明：
// 方式1 先声明再赋值 var 变量名; // 声明的变量如果没有进行赋值,或者没有被定义的变量,值默认是undefined 变量名 = 变量值; // 方式2 声明并赋值 var 变量名 = 变量值; // 方式3 一行可以声明多个变量.并且可以是不同类型 var name="yuan", age=20, job="lecturer";
2、数据类型以及数据类型之间的转换，这里就简单放一些，注意JS也会有时会自动转换，且JS的数据类型有空值（Undefined和Null）。
// 1. 转换数据为数值类型 // parseInt 把数据转换成整数 // parseFloat 把数据转换成小数 // Number 把数据转换成数值 // 2. 转换数据为字符串 // 变量.toString() // String(数据) // 3. 转换数据成布尔类型 // Boolean()
3、流程控制语句，则分为if分支语句和switch语句
if(条件1){
// 条件1为true时,执行的代码
}else if(条件2){
// 条件2为true时,执行的代码
}....
}else{
// 上述条件都不成立的时候,执行的代码
}
switch(条件){
case 结果1:
满足条件执行的结果是结果1时,执行这里的代码..
break;
case 结果2:
满足条件执行的结果是结果2时,执行这里的代码..
break;
.....
default:
条件和上述所有结果都不相等时,则执行这里的代码
}
4、还有JS的Object对象，多用于应用程序之间存储和传输数据。
var person = {
name : "alvin",
age : 18
};
Object可以通过. 和 []来访问。
console.log(person["age"]); console.log(person.age)
5、JS的function对象
// 函数的定义方式1
function 函数名 (参数){
函数体;
return 返回值;
}
// 函数的定义方式2
用 Function 类直接创建函数的语法如下：
var 函数名 = new Function("参数1","参数n","function_body");
虽然由于字符串的关系，第二种形式写起来有些困难，但有助于理解函数只不过是一种引用类型，它们的行为与用 Function 类明确创建的函数行为是相同的。
还有函数调用、函数参数、返回值等，JS预编译等这里就不一一细讲了。
另外放一个JS预编译面试题，有空的时候可以多回顾一下。
<script>
var num3 = 10;
function func3(){
console.log(num3);
var num3 = 20;
}
func3();
console.log(num3);
</script>
答案为:undefined，10
今天就写在这里，最后贴上自己的javaScript的课程总结
标签：知识点,console,log,标签,JavaScript,JS,var,整理,document From： https://www.cnblogs.com/MJM666/p/17099701.html