<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<script>
window.onload = function () {
var buttonA = document.getElementById('button-a');
var buttonB = document.getElementById('button-b');
var counterA = document.getElementById('counter-a');
var counterB = document.getElementById('counter-b');
buttonA.onclick = function () {
counterA.innerHTML = Number(counterA.innerHTML) + 1;
};
buttonB.onclick = function () {
counterB.innerHTML = Number(counterB.innerHTML) + 1;
};
};
/* 시계
window.onload = function () {
var clock = document.getElementById('clock');
setInterval(function () {
clock.innerHTML = new Date().toString();
}, 1000);
};
*/
</script>
<meta charset="utf-8" />
<title>Click</title>
</head>
<body>
<button id ="button-a">ButtonA</button>
<input type="button" name="button-b" value=" ButtonB" id="button-b"/>
<h1>Button A - <span id="counter-a">0</span></h1>
<h1>Button B - <span id="counter-b">0</span></h1>
</body>
</html>
스크립트 안에서 버튼의 id로 스크립트 변수와 연결 한 후, 버튼을 누르게 되면 onclick을 호출
숫자를 +1씩 증가시킨다.
'IT프로그래밍' 카테고리의 다른 글
C언어 선택 정렬 / C언어 선택 정렬 소스 / C언어 선택 정렬 설명 (0) | 2015.01.12 |
---|---|
c언어 계산기 / c언어 계산기 소스 / c로 만든 계산기 (0) | 2015.01.11 |
C언어 구구단 출력 / C언어 구구단 / C 구구단 소스 (0) | 2015.01.11 |
My Bulletin Board (0) | 2015.01.09 |
PHP 문자열 함수 / PHP 문자 함수 / PHP 함수 정리 (0) | 2014.12.20 |
MySQL 기본 문법 part 2 (0) | 2014.12.12 |
PHP 한글 깨짐 / SQL 한글 깨짐 / PHP SQL 한글 깨짐 / PHP SQL 한글 (1) | 2014.12.12 |
자바 구구단 / 자바 구구단 소스 / 자바 구구단 주석 / Java 구구단 / Java 구구단 소스 (0) | 2014.12.12 |
댓글