JavaScript Instance code: Click to set page background

Source: Internet
Author: User
Tags error code return set background xmlns

Article Introduction: sets the background color according to the options.

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<title> "JavaScript daily Practice"-set background color based on options </title>
<script type= "Text/javascript" >
function SetProperty ()
{
var content = document.getElementById ("content");
var sel = document.getElementById ("Selectcolor");
var propertyvalue = Sel.options[sel.selectedindex].value;
content.style["background"] = PropertyValue;
}
</script>

<body>
<div id= "Content" >
<p> Select color and click the button "Set background color". </p>
<select id= "Selectcolor" >
<option value= "Aqua" >aqua</option>
<option value= "BLACK" >black</option>
<option value= "Blue" >blue</option>
<option value= "Fuchsia" >fuchsia</option>
<option value= "Gray" >gray</option>
<option value= "Green" >green</option>
<option value= "Lime" >lime</option>
<option value= "Maroon" >maroon</option>
<option value= "Navy" >navy</option>
<option value= "Olive" >olive</option>
<option value= "Purple" >purple</option>
<option value= "Red" >red</option>
<option value= "Silver" >silver</option>
<option value= "Teal" >teal</option>
<option value= "White" >white</option>
<option value= "Yellow" >yellow</option>
</select>
<button onclick= "SetProperty (); return false; > Set Background color </button>
<br/>
<br/>
</div>

</body>

Writing this today wasted a lot of my time, it was a very simple small code but I just can't write the effect. Finally under the Barina I seek the help of the sunylost God, in the language.
I hope you will avoid the previous error code.

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<title> "JavaScript daily Practice"-set background color based on options </title>
<script type= "Text/javascript" >
var content = document.getElementById ("content");
function SetProperty ()
{
var sel = document.getElementById ("Selectcolor");
var propertyvalue = Sel.options[sel.selectedindex].value;
content.style["background"] = PropertyValue;
}
</script>

<body>
<div id= "Content" >
<p> Select color and click the button "Set background color". </p>
<select id= "Selectcolor" >
<option value= "Aqua" >aqua</option>
<option value= "BLACK" >black</option>
<option value= "Blue" >blue</option>
<option value= "Fuchsia" >fuchsia</option>
<option value= "Gray" >gray</option>
<option value= "Green" >green</option>
<option value= "Lime" >lime</option>
<option value= "Maroon" >maroon</option>
<option value= "Navy" >navy</option>
<option value= "Olive" >olive</option>
<option value= "Purple" >purple</option>
<option value= "Red" >red</option>
<option value= "Silver" >silver</option>
<option value= "Teal" >teal</option>
<option value= "White" >white</option>
<option value= "Yellow" >yellow</option>
</select>
<button onclick= "SetProperty (); return false; > Set Background color </button>
<br/>
<br/>
</div>

</body>



Related Article

Cloud Intelligence Leading the Digital Future

Alibaba Cloud ACtivate Online Conference, Nov. 20th & 21st, 2019 (UTC+08)

Register Now >

Starter Package

SSD Cloud server and data transfer for only $2.50 a month

Get Started >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

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.