关于js中利用DOM动态改变CSS样式,请大神提供代码

 我来答
只此浮生若梦中
2016-11-29 · TA获得超过302个赞
知道答主
回答量:50
采纳率:0%
帮助的人:36.1万
展开全部
代码如下:
<!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>
望采纳!
追问
只有一个疑问$(function(){
$(".changestyle").off("click").on("click",function(){
$(".test1").css 这个$是啥。。
追答
先采纳!

jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。jQuery设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。
你JS入门之后可以去学学jquery。
丶徐小岩磷
2016-11-29 · 超过40用户采纳过TA的回答
知道小有建树答主
回答量:77
采纳率:0%
帮助的人:50.5万
展开全部
$("button").click(function(){
    $(dom).css({
        "width":"200px",
        "height":"100px",
        "border":"1px solid blue",
        "font-weight":"bold",
        "font-size":"16px",
        "text-align":"center",
        "line-height":"100px"
    })
})
追问
恕我直言 不是很明白诶。。$是啥。。我现在学的定义函数是这样的 function 名字(){}
追答
$是jquery。你引入jquery的类库就可以了。你所说的定义函数的方法是传统的函数定义方式
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
thls520
2016-11-29 · TA获得超过258个赞
知道小有建树答主
回答量:213
采纳率:0%
帮助的人:110万
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
纯洁的小树
2016-11-29 · TA获得超过3386个赞
知道大有可为答主
回答量:2536
采纳率:71%
帮助的人:464万
展开全部
事先写好一个样式类名,点击按钮更改一个类名就可以了!
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式