js web
2018-11-05 本文已影响0人
刘xin_8
1、 机动车限行查询
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>成都机动车限行查询</title>
<style>
#search {
width: 640px;
margin: 0 auto;
text-align: center;
margin-top: 150px;
}
#carno {
display: inline-block;
width: 520px;
height: 36px;
font: 36px/36px arial;
text-align: center;
vertical-align: middle;
border: none;
outline: none;
border-bottom: 1px dotted darkgray;
}
#search input[type=button] {
width: 80px;
height: 36px;
font: 28px/36px arial;
border: none;
color: white;
background-color: red;
vertical-align: middle;
}
#result {
width: 640px;
margin: 0 auto;
text-align: center;
font: 32px/36px arial;
}
</style>
</head>
<body>
<div id="search">
<input type="text" id="carno" placeholder="请输入车牌号">
<input type="button" value="查询" onclick="showResult()">
</div>
<hr>
<p id="result"></p>
<script>
function showResult() {
var input = document.getElementById('carno');
var p = document.getElementById('result');
var carNo = input.value;
var regex = /^[川渝云贵京津沪][A-Z]\s*[0-9A-Z]{5}$/;
if (regex.test(carNo)) {
var digitStr = lastDigit(carNo);
if (digitStr) {
var digit = parseInt(digitStr);
var day = new Date().getDay();
if (digit % 5 == day || digit % 5 == day - 5) {
p.innerHTML += carNo + '今日限行<br>';
} else {
p.innerHTML += carNo + '今日不限行<br>';
}
} else {
p.innerHTML += carNo + '不是有效的车牌号<br>';
}
} else {
p.innerHTML += carNo + '不是有效的车牌号<br>';
}
input.value = '';
}
function lastDigit(str) {
for (var index = str.length - 1; index >= 0; index -= 1) {
var digitStr = str[index];
if (digitStr >= '0' && digitStr <= '9') {
return digitStr;
}
}
return null;
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style>
h1 { font: 72px arial; }
#bar { color: red; }
.foo { color: green; }
h1 { color: blue !important; }
#timer {
width: 250px;
height: 30px;
line-height: 30px;
text-align: center;
color: yellow;
background-color: blue;
float: right;
}
</style>
</head>
<body>
<div id="timer"></div>
<h1 id="bar" class="foo">Hello, world!</h1>
<button onclick="shutdown()">关闭</button>
<button onclick="openBaidu()">打开百度</button>
<script>
function openBaidu() {
window.open('https://www.baidu.com', '',
'width=300,height=200');
}
function shutdown() {
if (window.confirm('确定要退出吗？')) {
window.close();
}
}
var weekdays = ['日', '一', '二', '三', '四', '五', '六'];
function showTime() {
var now = new Date();
var year = now.getFullYear();
var month = now.getMonth() + 1;
var date = now.getDate();
var hour = now.getHours();
var minute = now.getMinutes();
var second = now.getSeconds();
var day = now.getDay();
var timeStr = year + '年' +
(month < 10 ? '0' : '') + month + '月' +
(date < 10 ? '0' : '') + date + '日 ' +
(hour < 10 ? '0' : '') + hour + ':' +
(minute < 10 ? '0' : '') + minute + ':' +
(second < 10 ? '0' : '') + second +
' 星期<b>' + weekdays[day] + '</b>';
var div = document.getElementById('timer');
div.innerHTML = timeStr;
}
showTime();
window.setInterval(showTime, 1000);
// 1TBS风格 - C/Unix - Dennis M. Ritchie
// Allman风格 - FreeBSD - Allman
// while循环 / do-while循环 / for循环
// while循环 - 不确定循环的次数
// for循环 - 循环的次数是确定的
// do-while循环 - 至少执行一次
// var flag = true;
// do {
// var yearStr = window.prompt('请输入年份: ');
// var year = parseInt(yearStr);
// if (year == yearStr && year > 0) {
// if (year % 4 == 0 && year % 100 != 0
// || year % 400 == 0) {
// window.alert(year + '年是闰年');
// } else {
// window.alert(year + '年不是闰年');
// }
// flag = window.confirm('是否继续？');
// } else {
// window.alert('请输入有效的年份!');
// }
// } while (flag);
</script>
</body>
</html>
