gpt4 book ai didi

详解Javascript动态操作CSS

转载 作者:qq735679552 更新时间:2022-09-28 22:32:09 24 4
gpt4 key购买 nike

CFSDN坚持开源创造价值,我们致力于搭建一个资源共享平台,让每一个IT人在这里找到属于你的精彩世界.

这篇CFSDN的博客文章详解Javascript动态操作CSS由作者收集整理,如果你对这篇文章有兴趣,记得点赞哟.

1、使用js操作css属性的写法 。

1、对于没有中划线的css属性一般直接使用style.属性名即可.

如:obj.style.margin,obj.style.width,obj.style.left,obj.style.position 。

2、对于含有中划线的css属性,将每个中划线去掉并将每个中划线后的第一个字符换成大写即可.

如:obj.style.marginTop,obj.style.borderLeftWidth,obj.style.zIndex,obj.style.fontFamily等 。

3、js操作css float属性的特殊写法 。

因为 float 是javascript的保留字,我们不能直接使用obj.style.float来使用,这样操作是无效的。其正确的使用方法是为:IE:obj.style.styleFloat,其他浏览器Mozilla(gecko),ff等用 styleFloat:obj.style.cssFloat.

2、使用js获取css属性值 。

1、获取行内Style:obj.style. 属性名。<div id="css88" class="ss" style="width:200px; height:200px; background:#333333">JS获取CSS属性值</div> 不能访问class.

2、获取Class内及Link外部的Css属性:IE中使用的是obj.currentStyle[“属性名”]方法,而FF是用的是getComputedStyle 方法 。

3、使用js给css属性赋值 。

1、赋值class属性 。

赋值:document.getElementById('ceil').className = "class1",

如它有多个值:document.getElementById('ceil').className = "class1 class2 class3",

2、obj.style.cssText设定一个对象的css样式 。

document.getElementById('navition').style.cssText = "您的CSS代码',

总结 。

知道如何动态修改页面上所应用的样式,对创建时髦而又富于交互的 Web 页面来说是极其有用的——本文中所阐述的知识构成了诸如 JavaScript 动画之类更高级的技术的基础。需要注意的是,你应当负责任地使用动态样式修改,而且不要过度滥用。如前面所述,样式修改还能提高Web效率——内容的显示和隐藏可以有助于避免在客户端和服务器之间不必要的数据交互.

最后此篇关于详解Javascript动态操作CSS的文章就讲到这里了,如果你想了解更多关于详解Javascript动态操作CSS的内容请搜索CFSDN的文章或继续浏览相关文章,希望大家以后支持我的博客! 。

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com