DomAPI

247 阅读1分钟

获取元素

document.getElementById

根据ID查找元素,如果有多个结果,只返回第一个

document.getElementsByClassName

根据类名查找元素,多个类名用空格分隔,返回一个HTMLCollection

document.getElementsByTagName

根据标签查找元素, * 表示查询所有标签,返回一个HTMLCollection

document.getElementsByName

根据元素的name属性查找,返回一个 NodeList

document.querySelector

返回单个Node,IE8+(含),如果匹配到多个结果,只返回第一个

document.querySelectorAll

返回一个 NodeList ,IE8+(含)

节点创建

基础练习

1.使用temp交换两个变量

var n1=50,n2=60;

var temp=n1;

n1=n2;

n2=temp;

2.不适用temp交换两个变量

var n1=50,n2=60;

n1=n1+n2;

n2=n1-n2;

n1=n1-n2;

3.使用prompt windows自带的input弹出-输入框

var num=prompt("请输入一个数字");

if(isNaN(num)){

console.log("不是数字")

}else {

console.log("是数字")

}

4.数值类型转换

//当字符串由字母与数字组成

var numberTrans="123ab";

alert(parseInt(numberTrans)); //123

alert(Number(numberTrans)); //NaN

//当字符串为空null时

var numberTrans="null";

alert(parseInt(numberTrans)); //NaN

alert(Number(numberTrans)); //0

//当字符串为空“ ”时

var numberTrans=" ";(或者 字符串A)

alert(parseInt(numberTrans)); //NaN

alert(Number(numberTrans)); //0

5.短路逻辑或的用法

var n1 =n1 || 0; 意思是如果n1为"" ,undefined, null 则 n1=0;