用js给dom对象设置样式,然后改变样式

JavaScript018

用js给dom对象设置样式,然后改变样式,第1张

<script type="text/javascript">

var obj = document.getElementById(id)

function style(obj){

obj.style = "font-size:30pxbackground:tealheight:900px"

obj.style = "font-size:100pxopacity:.67width:100px"

}

style(obj)

</script>

代码如下:

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Test</title>

<script src="http://pu-datacastle.oss-cn-qingdao.aliyuncs.com/master.third.source/js/jquery-2.1.4.min.js" type="text/javascript" charset="utf-8"></script>

<style>

*{

/*margin: 0px

padding: 0px*/

}

.test1{

width: 100%

height: 22px

line-height: 22px

border: 2px solid #ccc

}

</style>

</head>

<body>

<div class="test1">公告内容</div>

<br />

<button class="changestyle">更改样式</button>

<script>

$(function(){

$(".changestyle").off("click").on("click",function(){

$(".test1").css({

"font-size":"16px",

"font-weight":"bold",

"border":"2px solid blue",

"width":"200px",

"height":"100px",

"text-align":"center",

"line-height":"100px",

"color":"red"

})

})

})

</script>

</body>

</html>

望采纳!