Change border in JavaScript

Description

The following code shows how to change border.

Example


<!DOCTYPE html>
<html>
<body>
<div id="div1">
This is a DIV element. Click me to see the change.
</div><!--from  www  .  ja  va2 s.co m-->
<script type="text/javascript">
var div = document.getElementById("div1");

div.style.backgroundColor="#00f";
div.style.width="500px";
div.style.color="#fff";
div.style.height="200px";
div.style.paddingLeft="50px";
div.style.paddingTop="50px";
div.style.fontFamily="Verdana";
div.style.fontSize="2em";
div.style.border="3px dashed #ff0";
div.style.position="absolute";
div.style.left="20px";
div.style.top="10px";
div.style.textDecoration="underline";

</script>
</body>
</html>

Click to view the demo

The code above generates the following result.

Change border in JavaScript
Home »
  Javascript Tutorial »
    Style »
      Border
Javascript Tutorial Border
Change border bottom in JavaScript
Change border in JavaScript
Change border left in JavaScript
Change border right in JavaScript
Change border top in JavaScript
Change bottom in JavaScript
Change the border of an element in JavaScri...