网页引入js脚本

<script>
    document.write("Hello World");
</script>

<script src="21.js"></script>

• location对象

查找 HTML 元素

• (document).getElementById("intro");
• .getElementsByTagName("p");
• document.getElementsByClassName("intro");

<aside> ⚠️ 注意getElementsByTagName 和 getElementsByClassName 这两个方法查找多个 dom 元素，返回的是 htmlcollection 类型，是伪数组而不是真数组，故不能使用数组的方法。 我们可以使用数组原型配合 slice 方法，利用 call，apply，bind 方法将伪数组转为真数组。

var x=document.getElementById("main");
var y=x.getElementsByTagName("p");
console.log(y)//在控制台我们可以看到原型proto为htmlcollection，是伪数组
//伪数组转为真数组方法1
console.log(Array.prototype.slice.call(y))//在控制台我们可以看到原型proto为Array(0)，是真数组

//伪数组转为真数组方法2
console.log(Array.prototype.slice.apply(y))//在控制台我们可以看到原型proto为Array(0)，是真数组

//伪数组转为真数组方法3
console.log(Array.prototype.slice.bind(y)())//在控制台我们可以看到原型proto为Array(0)，是真数组

</aside>

• JQuery
  • $("input[type='text']");
  • $(".class")
  • $("#id")

改变 HTML 元素

//覆写HTML
document.getElementById(id).innerHTML=新的 HTML
//添加，改变属性
document.getElementById("id").src="landscape.jpg";
document.getElementById("p2").style.color="blue";
//添加事件
document.getElementById("myBtn").onclick=function(){displayDate()};
document.getElementById("myBtn").addEventListener("click", displayDate);
	//addEventListener() 方法添加的事件句柄不会覆盖已存在的事件句柄。
	//语法:element.addEventListener(event, function, useCapture);
	//useCapture是个布尔值用于描述事件是冒泡还是捕获。该参数是可选的。
		//冒泡和捕获的区别在于内外层的触发顺序，如果冒泡则是优先触发
		//默认值为 false, 即冒泡传递，当值为 true 时, 事件使用捕获传递。
	//注意:不要使用 "on" 前缀。 例如，使用 "click" ,而不是使用 "onclick"。
	//需要传参的时候要曲线救国:("click", function(){ myFunction(p1, p2); });
element.removeEventListener("mousemove", myFunction);
//移除某个class
.removeClass("classname");

事件

• onload 和 onunload 事件会在用户进入或离开页面时被触发。
• onchange 常用于对输入字段的验证来使用。
• onmouseover 和 onmouseout
• onmousedown, onmouseup 以及 onclick
• onfocus

事件的传参有几种