JavaScript learning Content-changing styles, canceling settings, displaying content, hiding content

Source: Internet
Author: User
Tags variable scope

<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

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.