Javascript 使Div类在页面加载时悬停

我需要一个

div

在页面加载时处于

悬停状态

<script>
window.onload = function() {
  document.getElementByClassName('project-1').className = 'hover';
};
</script>

我想如果我单挑出来
.project-1
像这样

.project-1 *:hover {
  opacity: 100;
  filter: alpha(opacity=10000);
  opacity: 1;
  filter: alpha(opacity=100);
}

我可以使用我展示的
JS
作为示例来实现这一点。
但是没有运气。有什么想法吗？
基于您给定的HTML：

JS

如果您对使用Django很满意，那么可以通过以下方法轻松完成：-

在您的视图中，创建以下内容：

def abc(request):
      context = {
           'content_type':'None'
       }
      response = render(request, "index.html", context)
      return response

在模板（index.html）中，默认情况下要悬停的div使用if条件执行以下操作：-

   <div class='col-md-3 sub-heading {% if content_type == "None" %}active{% endif %}'><a href="#">all</a></div>

希望这有帮助：）
你能加把小提琴吗？我有点不明白你在请求什么：）你的CSS正在应用一个
psuedo
类
：hover
，你正在应用一个
hover
类名。。因此，您需要将css更改为类似于
.project-1.hover
，以正确应用styles@Linial可以做得比小提琴更好，在这个页面上，我希望当页面加载时第一个框悬停在上面，然后当你悬停到另一个框时，页面从那里开始正常运行@haxxxton你介意告诉我用我给你看的css做这件事的最好方法吗？我以前从未做过类似的工作。*：悬停我知道它说的*-所有在项目中徘徊的东西-2都做这件事。。。但是如何将悬停状态添加到页面加载时项目2中的项目1？您当前有
。项目1*：hover
。。将此更改为
.project-1.hover，.project-1:hover
。。如果希望此操作适用于projects-2中的所有项，请执行以下操作：
.projects-2>div:hover、.projects-2>.hover
没问题。编辑：我用一个改进的版本对其进行了更新，允许您向
.project-1
添加其他类。多亏了这么多，我仍然对修复这个问题感到困惑。但是有了这个答案，我就可以改变css和js，它应该可以工作了？非常感谢你，伙计。从我收到的评论来看，我觉得我运气不好。
.projects-2 > div:hover, .page-load-hover {
    opacity: .4;
    filter: alpha(opacity=40);
}

def abc(request):
      context = {
           'content_type':'None'
       }
      response = render(request, "index.html", context)
      return response

   <div class='col-md-3 sub-heading {% if content_type == "None" %}active{% endif %}'><a href="#">all</a></div>

.sub-heading.active a{
color:#191919 !Important;
font-weight:400;
text-decoration:none;
border-bottom:3px solid #191919;
padding-bottom:20px;     /*whatever css u put in hover put here */
 }