[]
javascript kod yardım
javascript yeni öğreniyorum, evde çalışmak için durup dururken aşağıdaki gibi bir kronemetre yapayım dedim. elbette daha kolay veya profesyonelcesi vardır ama aşağıdaki kodlarda yazdım, sizce çok amelece duruyor mu? yani kulağı uzaktan mı gösterdik? var mı yorum, eleştri, tavsiye yapacak olan?
<html>
<head>
<style type="text/css">
div{
height: 100px;
width: 100px;
border: 2px solid gray;
}
td{
text-align: center;
font-size: 24px;
font-weight: bold;
}
</style>
<script type="text/javascript">
var s = 1;
var m = 1;
var h = 1;
function second(){
document.getElementById("second").innerHTML = s;
s++;
if(s===61){
s = 0;
document.getElementById("second").innerHTML = s;
s++;
};
};
function minute(){
document.getElementById("minute").innerHTML = m;
m++;
if(m===61){
m = 0;
document.getElementById("minute").innerHTML = m;
m++;
};
};
function hour(){
document.getElementById("hour").innerHTML = h;
h++;
}
window.setInterval("second()",1000);
window.setInterval("minute()",60000);
window.setInterval("hour()",3600000);
</script>
</head>
<body>
<table>
<tr>
<td>Saat</td>
<td>Dakika</td>
<td>Saniye</td>
</tr>
<tr>
<td><div id="hour"></div></td>
<td><div id="minute"></div></td>
<td><div id="second"></div></td>
</tr>
</table>
</body>
</html>
<html>
<head>
<style type="text/css">
div{
height: 100px;
width: 100px;
border: 2px solid gray;
}
td{
text-align: center;
font-size: 24px;
font-weight: bold;
}
</style>
<script type="text/javascript">
var s = 1;
var m = 1;
var h = 1;
function second(){
document.getElementById("second").innerHTML = s;
s++;
if(s===61){
s = 0;
document.getElementById("second").innerHTML = s;
s++;
};
};
function minute(){
document.getElementById("minute").innerHTML = m;
m++;
if(m===61){
m = 0;
document.getElementById("minute").innerHTML = m;
m++;
};
};
function hour(){
document.getElementById("hour").innerHTML = h;
h++;
}
window.setInterval("second()",1000);
window.setInterval("minute()",60000);
window.setInterval("hour()",3600000);
</script>
</head>
<body>
<table>
<tr>
<td>Saat</td>
<td>Dakika</td>
<td>Saniye</td>
</tr>
<tr>
<td><div id="hour"></div></td>
<td><div id="minute"></div></td>
<td><div id="second"></div></td>
</tr>
</table>
</body>
</html>
evet biraz uzatmışsın. gözüme batan ilk şey saat:dakika:saniye için 3 tane ayrı timer kullanmış olman. kronometre için tek timer yeter.
- nopen (25.10.16 22:11:59)
oncelikle: jsfiddle.net adresinden bizde gorelim. kronometreyi baslatici event eksik heralde ondan baslamiyor saymaya.
hocam tek bi counter'dan zaman elementlerini alabilirsin bolerek modunu alarak falan. saymak yerine Date() objesi ile de yapilabilir belki -tam detayli bilmiyorum, documentationa bakmak lazim.
hocam tek bi counter'dan zaman elementlerini alabilirsin bolerek modunu alarak falan. saymak yerine Date() objesi ile de yapilabilir belki -tam detayli bilmiyorum, documentationa bakmak lazim.
- jedilance (25.10.16 22:31:47)
60 kontrollerinde if kullanmana gerek yoktu aslında. second için örnek vermek gerekirse,
function second(){
document.getElementById("second").innerHTML = s;
s++;
if(s===61){
s = 0;
document.getElementById("second").innerHTML = s;
s++;
};
};
yerine,
function second(){
document.getElementById("second").innerHTML = s;
s = (s+1) % 60
};
yazarak kodunu biraz kısaltabilirsin.
_______________________________________________
kod yazarken okunabilirliği bozmuyorsa kod tekrarından uzak durmalısın, mesela şöyle sadeleştirilebilir yazdığın script.
s = 1;
m = 1;
wh = 1;
function tick(count, id) {
document.getElementById(id).innerHTML = window[count];
window[count] = (window[count]+1) % 60;
};
window.setInterval(function() { tick("s", "second") },1000);
window.setInterval(function() { tick("m", "minute") },60000);
window.setInterval(function() { tick("h", "hour") },3600000);
function second(){
document.getElementById("second").innerHTML = s;
s++;
if(s===61){
s = 0;
document.getElementById("second").innerHTML = s;
s++;
};
};
yerine,
function second(){
document.getElementById("second").innerHTML = s;
s = (s+1) % 60
};
yazarak kodunu biraz kısaltabilirsin.
_______________________________________________
kod yazarken okunabilirliği bozmuyorsa kod tekrarından uzak durmalısın, mesela şöyle sadeleştirilebilir yazdığın script.
s = 1;
m = 1;
wh = 1;
function tick(count, id) {
document.getElementById(id).innerHTML = window[count];
window[count] = (window[count]+1) % 60;
};
window.setInterval(function() { tick("s", "second") },1000);
window.setInterval(function() { tick("m", "minute") },60000);
window.setInterval(function() { tick("h", "hour") },3600000);
- ocanal (25.10.16 22:33:04 ~ 22:42:45)
1