文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

.css(propertyName)怎么使用

2024-04-02 19:55

关注

这篇文章主要介绍“.css(propertyName)怎么使用”,在日常操作中,相信很多人在.css(propertyName)怎么使用问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”.css(propertyName)怎么使用”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!

  描述: 获取匹配元素集合中的第一个元素的样式属性的值

  添加的版本: 1.0.css( propertyName )

  propertyName

  类型: String

  一个css属性名。

  添加的版本: 1.9.css( propertyNames )

  propertyNames

  类型: Array

  一个或多个CSS属性组成的一个数组

  .css()方法可以非常方便地获取匹配的元素集合中第一个元素的样式属性值, 对于某些属性而言,浏览器访问样式属性的方式是不同的,该方法对于取得这些属性是非常方便的(例如, 某些属性在标准浏览器下是通过的 getComputedStyle() 方法取得的,而在Internet Explorer下是通过currentStyle 和 runtimeStyle属性取得的)并且,某些特定的属性,不同浏览器的写法不一。举个例子, Internet Explorer的DOM 将float 属性写成 styleFloat实现,W3C标准浏览器将float 属性写成cssFloat。 为了保持一致性,您可以简单地使用"float",jQuery将为每个浏览器返回它需要的正确值。

  另外,jQuery同样可以解析 CSS 和 用multiple-word格式化(用横杠连接的词,比如:background-color)的DOM属性的不同写法。举个例子:jQery能解析.css('background-color') 和 .css('backgroundColor')并且返回正确的值。不同的浏览器可能会返回CSS颜色值在逻辑上相同,但在文字上表现不同,例如: #FFF, #ffffff, 和 rgb(255,255,255)。

  简写速写的CSS属性(例如: margin, background, border) 是不支持的,例如,如果你想重新获取margin,可以使用$(elem).css('marginTop') 和 $(elem).css('marginRight'),其他的也是如此。

  从jQuery 1.9开始, 传递一个CSS的样式属性的数组给.css()将返回 属性 - 值 配对的对象。例如,要获取元素4个边距宽度值border-width,你可以使用$( elem ).css([ "borderTopWidth", "borderRightWidth", "borderBottomWidth", "borderLeftWidth" ]).

  例子:

  Example: 点击div,得到它的背景颜色

  <!DOCTYPE html>

  <html>

  <head>

  <style>

  div { width:60px; height:60px; margin:5px; float:left; }

  </style>

  <script src="https://code.jquery.com/jquery-latest.js"></script>

  </head>

  <body>

  <span id="result">&nbsp;</span>

  <div style="background-color:blue;"></div>

  <div style="background-color:rgb(15,99,30);"></div>

  <div style="background-color:#123456;"></div>

  <div style="background-color:#f11;"></div>

  <script>

  $("div").click(function () {

  var color = $(this).css("background-color");

  $("#result").html("That div is <span style='color:" +

  color + ";'>" + color + "</span>.");

  });

  </script>

  </body>

  </html>

到此,关于“.css(propertyName)怎么使用”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注编程网网站,小编会继续努力为大家带来更多实用的文章!

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-前端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯