一,易错点
- 0 == null // false
- 判断变量是否被声明过
通过if判断:
if(abcaa11112)//error
{
console.log(abcaa11112);
}else{
console.log('没有被声明过');
}
运行结果:报错
总结:通过if判断不保险.
正确的做法是通过typeof 来判断
console.log(typeof abcaa11112);//ok
运行结果:undefined
当然也可以通过下面的方式来判断:
if(window.abcaa11112)//ok
{
console.log(window.abcaa11112);
}else{
console.log('没有被声明过');
}
注意:在变量前增加了”window.”
输出结果:undefined 123 rxm
二,经典案例
- 创建一个页面,有两个下拉选择框
- 在第一个下拉框里面有一个事件 :改变事件 onchange事件
- 方法add1(this.value);表示当前改变的option里面的value值
- onchange 事件会在域的内容改变时发生。
onchange 事件也可用于单选框与复选框改变后触发的事件。
这里是下拉选项发生变化触发的事件
- 创建一个二维数组,存储数据
- 每个数组中第一个元素是省名称,后面的元素是省里面的城市
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
select{
width:100px;
}
</style>
</head>
<body>
省:
<select id="province" οnchange="selectcity()">
<option value="">请选择省份</option>
<option value="0">陕西省</option>
<option value="1">山东省</option>
<option value="2">河南省</option>
<option value="3">山西省</option>
</select>
市:
<select id="city">
<option value="">请选择市</option>
</select>
</body>
<script type="text/javascript">
var arrs = [];
arrs[0] = ["西安","咸阳","铜川","渭南","宝鸡"];
arrs[1] = ["济南","临沂","青岛","威海"];
arrs[2] = ["洛阳","郑州","开封","周口"];
arrs[3] = ["太原","大同","运城","忻州"];
function selectcity(){
var province = document.getElementById('province').value;
var city = document.getElementById("city");
var citys = arrs[province];
//清空原来的信息
//获取市的option属性
var city_opts = city.getElementsByTagName("option");
//遍历删除市中的option
for(var i= city_opts.length - 1; i >= 1; i--){
var city_opt = city_opts[i];
city.removeChild(city_opt);
}
for(var i = 0; i < citys.length; i++){
var textNode = document.createTextNode(citys[i]);
var opt = document.createElement("option");
opt.appendChild(textNode);
city.appendChild(opt);
}
}
</script>
</html>
呈现效果: