javascript可以用来做的三件最基础的事
1.改变html中的内容
2.改变html中的样式
3.对输入检测
下面是案例
<!DOCTYPE html>
<html>
<body>
***************************************************************************************************
<h1>JavaScript Can Change Images</h1>
<img id="myImage" onclick="changeImage()" src="pic_bulboff.gif" width="100" height="180">
<p>Click the light bulb to turn on/off the light.</p>
***************************************************************************************************
<br>
<h1>What Can JavaScript Do?</h1>
<p id="demo1">JavaScript can change the style of an HTML element.</p>
<button type="button" onclick="myFunction()">Click Me!</button>
<br>
***************************************************************************************************
<h1>JavaScript Can Validate Input</h1>
<p>Please input a number between 1 and 10:</p>
<input id="numb" type="number">
<button type="button" onclick="validate()">Submit</button>
<p id="demo2"></p>
<script>
function changeImage() {
var image = document.getElementById('myImage');
if (image.src.match("bulbon")) {
image.src = "pic_bulboff.gif";
} else {
image.src = "pic_bulbon.gif";
}
}
function myFunction() {
var x = document.getElementById("demo1");
x.style.fontSize = "25px";
x.style.color = "red";
}
function validate() {
var x, text;
// Get the value of the input field with id="numb"
x = document.getElementById("numb").value;
// If x is Not a Number or less than one or greater than 10
if (isNaN(x) || x < 1 || x > 10) {
text = "Input not valid";
} else {
text = "Input OK";
}
document.getElementById("demo2").innerHTML = text;
}
</script>
</body>
</html>