<Head><style>Body{font-size:12px;}#txt{Height:400px;width:600px;Border:#333 solid 1px;padding:5px;}P{Line-height:18px;text-indent:2em;}</style></Head><Body><H2ID= "Con">JavaScript courses</H2> <DivID= "txt"class= "One"> <h5>JavaScript adds a dynamic effect to a Web page and enables the ability to interact with the user.</h5> <P>1. JavaScript primer, so that you do not understand JS, quickly understand JS.</P> <P>2. JavaScript advanced, let you master the basic syntax of JS, functions, arrays, events, built-in objects, BOM browser, Dom operations.</P> <P>3. After learning the above two basic courses, in-depth study of javascript variable scope, events, objects, motion, cookies, regular expressions, Ajax and other courses.</P> </Div> <form> <!--when you click the appropriate button, do the corresponding action, add the corresponding event for the button - <inputtype= "button"value= "Change Color"onclick= "Ccolor ()"> <inputtype= "button"value= "Change the width of the height"onclick= "CWH ()"> <inputtype= "button"value= "Hide Content"onclick= "Cnone ()"> <inputtype= "button"value= "Show content"onclick= "Cblock ()"> <inputtype= "button"value= "Cancel Settings"onclick= "Csz ()"> </form>var ws1=document.getelementbyid (' txt '); function Ccolor () {ws1.style.color= "red"; Ws1.style.backgroundcolor= "Blue";} Define "Change Color" function Cwh () {ws1.style.width= "100px"; Ws1.style.height= "200px";} Defines the function Cnone () {ws1.style.display= "none" for "change width height";} Functions that define "hidden content" function Cblock () {ws1.style.display= "block";} The function Csz () {var ws5=confirm () that defines "display content" is set to cancel? if (ws5==true) {Ws1.removeattribute ("style")}//define "Cancel Settings" function}
The code page appears as follows:
JavaScript learning Content-changing styles, canceling settings, displaying content, hiding content