Javascript 如何使选择器选择div类和标记名为p的？_Javascript_Html

Javascript 如何使选择器选择div类和标记名为p的？

javascript html

Javascript 如何使选择器选择div类和标记名为p的？,javascript,html,Javascript,Html,你好，我现在有点困了。我试图让我的脚本在一个div类中选择所有的段落，但是我真的不知道怎么做。html在主体中看起来像这样 <body> <div id="top" class="change"> <p> Microsoft </p> <p> Apple </p> <p> Sony </p> </div> <div id="middle"> <p> Disney

你好，我现在有点困了。我试图让我的脚本在一个div类中选择所有的段落，但是我真的不知道怎么做。html在主体中看起来像这样

<body>
<div id="top" class="change">
<p> Microsoft </p>
<p> Apple </p>
<p> Sony </p>
</div>

<div id="middle">
<p> Disney </p>
<p> Nintendo </p>
<p> Sony </p>
</div>

<div id="bottom" class="change">
<p> Ice</p>
<p> Tea</p>
<p> Water</p>
</div>
</body>

我正试图做到这一点，当鼠标光标触及任何段落中有类别变化的内容时，它会将颜色更改为我选择的颜色，但我不知道如何使用纯javascript的选择器。这是我目前的代码，但它不工作。我只能使用javascript

var fontChange = document.getElementsByClass("change").getElementsByTagName("p");

for (let i = 0; i < changeFont.length; i++) {
    changeFont[i].onmouseover=function() {
        this.style.color = "red";
    }
}

for (let i = 0; i < changeFont.length; i++) {
    changeFont[i].onmouseout=function() {
        this.style.color = "black";
    }
}

没有函数getElementsByCass，它是getElementsByCassName

document.getElementsByCassName返回一个集合。请参见，您必须对其进行索引，才能对其返回的元素使用getElementsByTagName

var fontChange = [];
var change = document.getElementsByClassName("change");
for (var i = 0; i < change.length; i++) {
    var paras = [].slice.call(change[i].getElementsByTagName("p"));
    fontChange.concat(paras);
}

你也有打字错误。您可以设置变量fontChange，但在循环中使用changeFont。

您可以在不使用javascript的情况下实现所需的功能，只需将此代码添加到css中即可

.change p:hover {
    color: red;
 }

你试过模糊吗？使用选择器…你是说，你想改变悬停时的字体颜色？或者单击？仅悬停，但我希望它只悬停在更改的div类上，因此只悬停在div top/bottom上，而不悬停在div middle上。我为您提供了一个更好、更简单的解决方案。检查我的答案

.change p:hover {
    color: red;
 }