Home > Article > Web Front-end > How to change background with javascript
How to change background with javascript
- 醉折花枝作酒筹Original
- 2021-04-15 19:01:183772browse
How to change the background in javascript: first get the element object; then use the background property of the style object to change the background, the syntax is "element object.style.background="color value|image address"".
The operating environment of this tutorial: windows7 system, javascript version 1.8.5, Dell G3 computer.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>document</title>
<script type="text/javascript">
function bs(v) {
kuang.style.background=v;
}
</script>
</head>
<body>
<p>请选择颜色：</p>
<select id="test" name="xuanzekuang" onchange="bs(this.value)">
<option value="red">红</option>
<option value="green">绿</option>
<option value="blue">蓝</option>
<option value="black">黑</option>
</select>
<div id="kuang" style="width: 100px;height: 100px;border: 1px solid #eee">
</div>
</body>
</html>Effect:
#Description: Style background property
background property is set or returned in shorthand form at most Five independent background properties.
With this property, you can set/return:
background-color
background-image
background-repeat
background-attachment
background-position
The above attributes can also be set as separate style attributes. It is strongly recommended to use separate properties for better control.
Syntax:
1. Set the background attribute:
Object.style.background="color image repeat attachment position"
2. Return the background attribute:
Object.style.background
【 Recommended learning: javascript advanced tutorial】
The above is the detailed content of How to change background with javascript. For more information, please follow other related articles on the PHP Chinese website!