The previous article is about adding changes to property operations, and so today, by using a simple case to solidify the value of the property, a bit like controlling the text size of the news page.
First of all, look at the layout first, simply write a sentence, and write two buttons:
1 <inputID= "BTN1"type= "button"value="+"name=""/>2 <inputID= "BTN2"type= "button"value="-"name=""/>3 <PID= "P1"style= "FONT-SIZE:14PX;">This is some text which is some text which is some text which is some text</P>
As follows:
Then, by clicking the Add-minus button to control the size of the text, JS code as follows:
1<script>2Window.onload=function(){3 varOptxt=document.getelementbyid ("P1");4 varObtn1=document.getelementbyid ("Btn1");5 varObtn2=document.getelementbyid ("Btn2");6 varnum = 14;/*define an initial variable*/7Obtn1.onclick =function(){8num++;9optxt.style.fontsize=num+ ' px ';Ten }; OneObtn2.onclick =function(){ Anum--; -optxt.style.fontsize=num+ ' px '; - } the } -</script>
Click on the "+" button, then the text will be added a pixel, always click on it will always become larger:
Click on the "-" button, then the text will be reduced by one pixel, the click will always be small:
It is so simple, be sure to pay attention to the definition of the initial variable, it must be a global variable, and you need to manipulate the button to make the text changes, then the increment and decrease of the variable must be a local variable.
Come here today and continue tomorrow! Come on!
Native JS control Font size