时间戳

首页 > 解决方案 > 如何检查元素是否包含javascript中的类

javascript - 如何检查元素是否包含javascript中的类

问题描述

具有“更改”类的 DIV 中的每个段落在鼠标悬停时应将其字体颜色变为红色，并在鼠标关闭时变回黑色。这是我所拥有的：

var para = document.getElementsByTagName('p');

var c = document.getElementsByClassName('change');

for(let i = 0; i < para.length; i++) {

    para[i].onmouseover = function () {
      para[i].style.color = "red";
    }

    para[i].onmouseout = function () {
      para[i].style.color = "black";
    }
}

我已经尝试了很多东西，感觉就像我错过了一些简单的东西。html div 类名是“更改”。

标签： javascripthtml

解决方案

我想这就是你要找的。

// Executed when page is loaded
window.addEventListener("load", siteLoaded, false);

function siteLoaded() 
{
    // Selects all p-elements
   let pTags = document.querySelectorAll("p");

   for(let i = 0; i<pTags.length; i++) {

    // Adds eventlistener to each <p> to handle mouseover
    pTags[i].addEventListener('mouseover', function(e) {
        e.target.style.color = 'red';
    }, false);

    // Adds eventlistener to each <p> to handle mouseout
    pTags[i].addEventListener('mouseout', function(e) {
        e.target.style.color = 'black';
    }, false);
   }
 }

如果要按类名和 p 元素定位，请使用：

 let pTags = document.querySelectorAll("p.change");

推荐阅读