JS基础（四）--DOM编程和BOM编程

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

/**

* @author Administrator

//通过js创建年,月,日

//获取Dom

var dom = window.document;

function myYear() {

//获取年的select

var year = dom.getElementById("year");

//创建年

var minYear = 1900;

var maxYear = new Date().getFullYear();

for (var i = minYear; i <= maxYear; i++) {

//创建Option

var opt = dom.createElement("option");

//设置Option,标签体.

opt.innerHTML = i;

opt.value = i;

//挂载节点

year.appendChild(opt);

}

function myMonth() {

var month = dom.getElementById("month");

//创建月

for (var i = 1; i <= 12; i++) {

//创建Option

var opt = dom.createElement("option");

//设置Option,标签体.

if (i < 10) {

opt.innerHTML = "0" + i;

opt.value = i;

} else {

opt.innerHTML = i;

opt.value = i;

}

month.appendChild(opt);

}

month.onchange = myDay;

}

function myDay() {

clear();

//创建天

// 大月1 3 5 7 8 10 12 ,小月4 6 9 11 闰年2月非闰年的2月

//获取年

var year = dom.getElementById("year").value;

//获取月

var month = dom.getElementById("month").value;

if (year == "") {

alert("请选择年");

return;

}

if (month == "") {

alert("请选择月");

return;

}

//获取天select

var day = dom.getElementById("day");

//一个月至少有28天.

for (var i = 1; i <= 28; i++) {

var opt = dom.createElement("option");

if (i < 10) {

opt.innerHTML = "0" + i;

opt.value = "0" + i;

} else {

opt.innerHTML = i;

opt.value = i;

}

day.appendChild(opt);

}

//大月

var isBigMonth = month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12;

//小月

var isSmallMonth = month == 4 || month == 6 || month == 9 || month == 11;

//闰年可以整除4但不能整除100 或者年份可以整除400.

var isLeapYear = (year % 4 == 0 && year % 100 != 0) || year % 400 == 0;

//判断,如果是大月,添加3天

if (isBigMonth) {

//添加3天

for (var i = 29; i <= 31; i++) {

var opt = dom.createElement("option");

opt.innerHTML = i;

opt.value = i;

day.appendChild(opt);

}

} else if (isSmallMonth) {

//添加2天

for (var i = 29; i <= 30; i++) {

var opt = dom.createElement("option");

opt.innerHTML = i;

opt.value = i;

day.appendChild(opt);

}

} else if (isLeapYear) {

//如果是闰年,添加一天.专门处理闰年2月.

var opt = dom.createElement("option");

opt.innerHTML = 29;

opt.value = 29;

day.appendChild(opt);

}

function clear() {

var day = dom.getElementById("day");

var optArr = day.childNodes;

for (var i = optArr.length - 1; i >= 0; i--) {

day.removeChild(optArr[i]);

}

function getBirthday() {

//获取Dom

var dom = window.document;

myYear();

myMonth();

}

getBirthday();

</script>

<title>javascript</title>

</head>

<body>

生日:

</select>

</select>

</select>

</body>

</html>

JS基础（四）--DOM编程和BOM编程

猜你喜欢