Back to feed
Renewal·서른의 생활코딩

Sample source 3) JavaScript basic document structure (user-defined function 2 _ global variable)

NS
normalstory
cover image


If in the first user-defined function example we saw the whole picture,
this time let's dig a little deeper into variables, the actual tools used in functions.

In cooking up a function, the tools can be roughly divided into two categories.
For instance,
the sink in the kitchen is a local variable.
The cutting board and knife are global variables.

Local variables can only be used inside the function.
Global variables can be used from the outside as well.

Even I have to admit it's a remarkably apt way of putting it... lol



This time's example
is to make a program that increments by 1 every time a button defined in the body is clicked.




<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko" lang="ko">




<head>


<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />




<title> User-defined function 2. global variable </title>




<script type="text/javascript">


//<!CDATA[


var i=0; //global variable


function one_plus(){


i+=1;


alert(i);


}


// onclick-> increments by 1 each click


//]]]]]]>


</script>




</head>






<body>




<form method="post" action""]]>


<p>


<input type="button" value="one plus one" onclick="one_plus()" />


</p>


</form>




</body>




</html>

This English version was translated by Claude.

친절한 찰쓰씨
Written by
친절한 찰쓰씨

Pleasant Charles — UI/UX researcher at AIT. Keeping notes on design, planning, and slow days here since 2010.

More on the author's page

Keep reading

Renewal

Steadily, for the long haul, without burning out

Mar 31, 2026·9 min
Renewal

Tech-life balance

Feb 7, 2026·3 min
Renewal

Humanality, by Park Jeong-ryeol

Feb 7, 2026·11 min