使用 CSS :hover 还是 jQuery hover 更好？ [关闭]

【问题标题】：Is it better to use CSS :hover or jQuery hover? [closed]使用 CSS :hover 还是 jQuery hover 更好？ [关闭]
【发布时间】：2014-07-19 14:32:59
【问题描述】：

CSS :hover 还是 jQuery hover 哪个更利于网站速度？还是差不多？

【问题讨论】：

  • 不包括浏览器可以本地执行的外部库总是会更快
  • 反问：如果 CSS :hover 足以满足您的需求，您为什么会考虑用 jQuery 替换它？
  • 使用 CSS！使用jquery时，加载jquery脚本，使用css会更快。
  • 如果 CSS 和 jQuery 都需要外部库怎么办？（如 CSS 的 moz-box-styling）
  • 使用 jQuery 或纯 CSS注意。因此，请使用对您来说最简单的方法。

标签： jquery css hover jquery-hover


【解决方案1】：

CSS

  • CSS 是原生的（内置于浏览器中），类似于 HTML 解析器和 JavaScript 引擎
  • CSS 样式通过 CSSOM 暴露给脚本语言 - CSS 对象模型定义了媒体查询、选择器和 CSS 本身的 API
  • 不通过脚本语言实现（除非布局引擎本身是用一种语言编写的）

jQuery

  • jQuery 是一个 JavaScript 库，因此在浏览器之外
  • 需要通过浏览器的JavaScript实现下载运行
  • jQuery 将需要访问 DOM 和 CSSOM，这是用 JavaScript 实现的，浏览器必须运行它们

所以，theoretically，虽然您可以使用 jQuery 和 CSS 来同时使用 onEvent 方法，但 CSS 会更快，因为它是浏览器原生的，并且不必这样做添加了下载和“翻译”库的步骤。

更多信息

Performance: Pure CSS vs jQuery

How browsers work - Behind the scenes of modern web browsers

【讨论】：

  • 注意：用于动画目的的 CSS 悬停（或任何选择器）通常比 jQuery 动画慢（并且比纯动画框架 (Example) 慢。CSS 只会更快地触发事件。
【解决方案2】：

Jquery 和 CSS 都可以由 onEvent 驱动。唯一影响速度的是加载 DOM 时，因为必须下载 Jquery 库。

此类事件的事实是使用 CSS，因为它是原生的。

【讨论】：

    猜你喜欢
    • 2013-06-01
    • 1970-01-01
    • 1970-01-01
    • 2012-09-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-05-08
    • 1970-01-01
    相关资源
    最近更新 更多
    热门标签
    Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode