Write a function to click the change button to add a red double border to the div element.
First write a < div > in < body >
<body>
<div id="k">输入文字</div>
<input type="button" value="change"/>
</body>
The output is
After you have these, you can set the css style of < div > in < head >
<head>
<meta charset="utf-8">
<title>Change</title>
<style type="text/css">
div {
width:auto;
height:auto;
margin-bottom: 20px;
margin-left: 20px;
}
</style>
</head>
Once you have the CSS style, you can use the buttons above to control the style of < div >. The
most important thing is < script >
yon
<script>
function change() {
document.getElementById("k").style.border="5px double red"
}
</script>
The " k " here is the same as the " k " of the id of the previous < div > to connect the control. Finally add onclick at the button to trigger the change function
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Change</title>
<style type="text/css">
div{
width:auto ;
height: auto;
margin-bottom: 20px;
margin-left: 20px;
}
</style>
<script>
function change() {
document.getElementById("k").style.border="5px double red"
}
</script>
</head>
<body>
<div id="k">输入文字</div>
<input type="button" value="change" onclick="change()"/>
</body>
</html>
carry out
