Home > Developer > Web Develop
<! DOCTYPE html>
<meta charset= "UTF-8" >
<title> Process Control </title>
<style type= "Text/css" >
. mg {
Display:inline-block;
padding:45px;
padding-top:5px;
margin-bottom:10px;
BORDER:3PX solid Rosybrown;
-webkit-border-radius:23px;
-moz-border-radius:23px;
border-radius:23px;
}
Input {
-webkit-border-radius:12px;
-moz-border-radius:12px;
border-radius:12px;
border:1px solid royalblue;
padding:10px;
}
#dx {
width:100px;
Text-align:center;
}
</style>
<script type= "Text/javascript" >
If Else multiple
CC () function, by practicing if else, executes a multiple judgment statement to get a person's score at what level and write it into the tag by innerHTML
function cc () {
var VJ = parseint (Prompt (' Please enter your score '));
var nr = document.getElementById (' H1 ');
nr.style.textAlign = ' center ';
var cc = document.getElementById (' cc ');
Cc.value = VJ;
if (VJ! = undefined) {///not empty, then judge
if (VJ >= 0 && VJ < 60) {
nr.innerhtml = ' Very sorry! You didn't pass the exam. Come on! ‘; Write the summary into a H1 inside
Cc.style.color = Nr.style.color = ' Red '; Different grades, different color representations.
} else if (VJ >= && VJ < 75) {
nr.innerhtml = ' Congratulations on your good grades! ‘;
Cc.style.color = Nr.style.color = ' green ';
} else if (VJ >= && VJ < 85) {
nr.innerhtml = ' Yes, good grades! Come on! ‘;
Cc.style.color = Nr.style.color = ' Royalblue ';
} else if (VJ >= && VJ <= 100) {
nr.innerhtml = ' You are excellent! Great! Please keep trying! ‘;
Cc.style.color = Nr.style.color = ' Darkmagenta ';
Nr.style.backgroundColor = ' green ';
} else if (VJ < 0 | | VJ > 100) {//If the input exceeds the score value, also pops up the reminder
Alert (' Stop it, just enter your correct score! ');
} else {
Alert (' Seriously!! Do not enter an illegal value. ‘)
}
} else {
Alert (' Why don't you tell me? Quickly enter a valid score value Ah! ‘);
}
}
2--if Else multiple
The CB () function, also multiple if else, is the value of the form that is given by value to determine when this age period
Function CB () {
var sv = document.getElementById (' Se_v '). Value;
var TV = document.getElementById (' t_sc ');
if (SV = = ' 0-44 ') {
Tv.value = ' adolescent stage ';
} else if (SV = = ' 45-59 ') {
Tv.value = ' middle age ';
} else if (SV = = ' 60-89 ') {
Tv.value = ' old age ';
} else {
Tv.value = ' longevity elderly ';
}
}
The
//3--switch
//CJ () function exercises switch to write a comment based on the score. Note the difference between the switch and if else
//Here is always the error, the label content you use value to get, and input form content you instead of innerHTML, do not error, but is wrong, remember,
function CJ () {
var CJ = parseint (Prompt (' Please enter your score '));
var hv = document.getElementById (' Hvs ');
Switch (CJ) {
Case 1:
Case 2:
Case 3:
Case 4:
Case 5:
Hv.innerhtml = ' continue efforts ';
Break
Case 6:
hv.innerhtml = ' pass, come on! ‘;
break;
Case 7:
hv.innerhtml = ' Make it, forge ahead! ‘;
break;
Case 8:
hv.innerhtml = ' Great, great! ‘;
break;
Case 9:
Case:
hv.innerhtml = ' master, Daniel! ‘;
break;
}
document.getElementById (' CJ '). Value = CJ;
Alert (' H1 ' value must be innerHTML to get ' + ' <br/> ' + hv.innerhtml)
}
4--switch
CD () make the output content in multi-Select Case
Not successful
function CD () {
var dx = document.getElementById (' dx '). Value;
var dxv = document.getElementById (' DXV ');
var arr = [];
for (var i = 0; i < dx.length; i++) {
Arr[i] = document.getElementById (' dx '). Value;
dxv.innerhtml = arr + ', ';
}
Switch (DX) {
Case ' Apple ':
Case ' banana ':
Case ' Orange ':
Case ' nectarine ':
Case ' Lemon ':
Case ' grapefruit ':
Case ' watermelon ':
Case ' pineapple ':
Case ' lychee ':
//
Break
//}
}
</script>
<body>
<div>
<ol>
<li> <strong>if </ Strong><br/> Individual is made to judge (into, on execution. No, just fuck off! ) </li>
<li> <strong>if Else </strong><br/> A group is two select one (into, execute condition 1, otherwise, execute another) </li>
<li> <strong>if Else </strong><br/> Many are multiple judgments (more than one condition to see who became, the last only to execute into the one) </li>
<li > <strong>switch </strong><br/> is a variety of options (you can perform multiple functions that meet the criteria at the same time compared to multiple if else) </li>
<li> <strong>for </strong><br/> is repetitive repetition (traversal) </li>
<li> <strong>while </strong ><br/> is repeatedly </li>
<li> <strong>do while </strong><br/> is to go back and forth </li>
<li> <strong>break </strong><br/> is the exit loop </li>
<li> <strong> Continue </strong><br/> is the Skip and continue loop </li>
</ol>
</div>
<!--1-->
<span class= "mg" >
Exercise 1 if Else
<H1 id= "H1" ><input type= "text" id= "CC" onclick= "CC ()" placeholder= "Input score"/>
</span>
<!--2-->
<span class= "mg" >
Exercise 2 if Else<br/>
<strong> Please select your age </strong>
<select id= "Se_v" >
<option>0-44</option>
<option>45-59</option>
<option>60-89</option>
<option>90 </option> above
</select>
<input type= "button" value= "Submit" onclick= "CB ();"/>
<br/>
<input type= "text" id= "T_sc"/>
</span>
<!--3-->
<span class= "mg" >
Practice 3:switch
<H1 id= "Hvs" ><input type= "text" id= "CJ" onclick= "CJ ()" placeholder= "Input score"/>
</span>
<!--4-->
<span class= "mg" >
Exercise 4 switch<br/>
<p style= "color:red;" > Not successful </p>
<p> Choose the fruit you like:</p>
<strong> Multi-Choice </strong>
<select id= "DX" multiple= "multiple" >
<option> Apple </option>
<option> Banana </option>
<option> oranges </option>
<option> nectarine </option>
<option> Lemon </option>
<option> Grapefruit </option>
<option> Watermelon </option>
<option> Pineapple </option>
<option> lychee </option>
</select>
<input type= "button" value= "Submit" onclick= "CD ();"/>
<BR/><span id= "DXV" ></span>
</span>
<!--4-->
<script type= "text/javascript";
function Xq () {
var xqv = document.getElementById (' Xq '). Value;
var jhv = document.getElementById (' JH ');
Switch (XQV) {
case ' Monday ':
Case ' Tuesday ':
jhv.innerhtml = ' Learning concept knowledge ';
Jhv.style.color = ' red ';
break;
Case ' Wednesday ':
Case ' Thursday ':
jhv.innerhtml = ' to Enterprise practice ';
Jhv.style.color = ' Blueviolet ';
break;
Case ' Friday ':
jhv.innerhtml = ' lessons learned ';
Jhv.style.color = ' Blue ';
break;
Case ' Saturday ':
Case ' Sunday ':
jhv.innerhtml = ' casual entertainment ';
Jhv.style.color = ' green ';
break;
}
}
</script>
<span class= "mg" >
Exercise 5 switch<br/>
Look at my plan.
<select id= "XQ" >
<option> Monday </option>
<option> Tuesday </option>
<option> Wednesday </option>
<option> Thursday </option>
<option> Friday </option>
<option> Saturday </option>
<option> Sunday </option>
</select>
<input type= "button" value= "Submit" onclick= "Xq ()"/>
</span>
<!--6-->
<span class= "mg";
Exercise 6 for
<p> do less than 100 addition </p>
<input type= "button" value= "Result" id= "JG"/
<input type= "text" id= "JGV"/>
<pre> here, I should <=100, no = number is not possible </pre>
</span>
<script type= "Text/javascript";
var ojg = document.getElementById (' JG ');
Ojg.onclick = function () {
var sum = 0;
for (var i = 0; I <=; i++) {//note = number
Sum + = i;
}
document.getElementById (' JGV '). Value = SUM;
}
</script>
<!--7-->
<span class= "mg";
Exercise 7 while
<br/> use the while statement to output the corresponding number
<input type= " Button "Value=" fill the number Results "onclick=" SC () "/>
<br/> result <p id=" SC "></P>
<!--<input/>- ->
</span>
<script type= "text/javascript";
function sc () {
var x = parseint (' Please enter a number ‘));
//alert (x)
if (IsNaN (x)) {//To determine if it is empty or not a number, do not execute
Alert (' Enter a value and then determine ')
} else {
var num = 1;
while (num <= x) {
//document.write (' <br/> take Out ' +num);
document.getElementById (' SC '). InnerHTML + = num + ', ';
//alert (document.getElementById (' SC '). InnerHTML);
num = num + 1;
}
}
}
</script>
<p>js thinking, writing--the first step is to think of a simple, given number that allows the condition to circulate within this given number. <br/> then the second step to improve the code is to change the value of death into a number that can be filled in by the user. <br/> Finally, the third step is to continue to modify, add if code to determine whether the user fills in the value, and whether it conforms to the specification </p>
<!--8-->
<span class= "mg" >
Exercise 8
Do While
<p> Make sure the code is executed once before the loop judgment condition is done </p>
<input type= "button" value= "Fill Number" onclick= "Dov ()"/>
<span id= "Dov" ></span>
</span>
<script type= "Text/javascript" >
The first step is to think of a simple, given number that allows the condition to circulate within the given number. Then the second step to improve the improvement of the code, that is, the death of the value of the user can fill in the number. The final third step is to continue the modification by adding the if code to determine if the user is filling in a value, and whether it conforms to the specification, etc.
First step Example
var num = 1;
do{
document.getElementById (' Dov '). InnerHTML + = num + ', ';
num++;
}while (num <= 9);
Second Step example
var numa = parseint (Prompt (' Please fill in numbers '));
var numb = 0;
do{
document.getElementById (' Dov '). InnerHTML + = numb + ', ';
numb + +;
}while (Numb <= numa);
Third Step Example
Function Dov () {
var numa = parseint (Prompt (' Please fill in numbers '));
var numb = 0;
do {
document.getElementById (' Dov '). InnerHTML + = numb + ', ';
numb++;
} while (numb <= NUMA);
if (IsNaN (NUMA)) {
Alert (' Just enter the correct numbers! ‘);
} else {
}
}
</script>
</body>
js-Process Control Collection
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
