不知道为什么我的JS不工作

-4

我一直在搞JavaScript样本，自从我编辑这一个我不知道为什么它不会工作。一切看起来没什么问题，但这里是代码（的jsfiddle）不知道为什么我的JS不工作

function click(e) { 
    document.body.style.backgroundColor='" + e.target.id + "'; 

} 


document.addEventListener('DOMContentLoaded', function() { 
    var divs = document.querySelectorAll('div'); 
    for (var i = 0; i < divs.length; i++) { 
    divs[i].addEventListener('click', click); 
    } 
});

来源

2015-12-20 nicocappa

你能不能详细的问题有点多？ –

我只想知道为什么它不起作用。我不确定如何详细说明。 – nicocappa

您将背景颜色设置为字符串“'”+ e.target.id +“''，这不是有效的颜色。通过使用调试器，跟踪代码，检查变量和DOM元素以及使用样式检查器，您可以轻松地看到这一点。顺便说一句，请把你的代码放在问题中，而不是外部网站。 –

首先，确保在JS设置启用了无包装（我用的无缠绕头）的负载类型下拉列表。

接下来，您需要明白，当您调用e.target.id时，这已经是一个字符串变量。你的字面意思是使背景色为“e.target.id”。这不是一种颜色。

简单地改变document.body.style.backgroundColor='" + e.target.id + "'; 到document.body.style.backgroundColor= e.target.id;

我不会去触碰的事实，这是要走关于这个问题，我假设你只是与事件处理玩可怕的方式。

来源

2015-12-20 07:15:42 Sinistralis

非常感谢！我只是在玩弄它，但如果你不介意解释它，我很想知道更好的方法来做到这一点 – nicocappa

ID的目的是确定一个特定的DOM元素，以这种方式使用它们是令人难以置信的不直观和混乱。我会建议使用数据属性。就像你的div上的data-clickColor =“red”一样。 https://developer.mozilla.org/zh-CN/docs/Web/Guide/HTML/Using_data_attributes 以下是关于如何使用数据属性的指南。此外，要了解上述内容，您不应该将样式表与您的html混合。把你的样式放在一个CSS文件中，并将它与你的html链接起来。这可以改变JS框架，但现在不用担心。 – Sinistralis

啊，我明白了，谢谢！我亲自将CSS写入不同的文件，但这不是我的代码。每当我写我自己的东西，我一定会使用数据属性。如果你有时间，我还有一个问题。我搞砸了多一点，并认为如果我只是复制/粘贴第一个函数和侦听器，我可以让另一个按钮做一些不同的事情，但似乎并非如此，为什么？这里是代码：https：//jsfiddle.net/1190b617/4/ – nicocappa

也许有人会发现这个有用的。使用CSS属性：background-color：rgb（x，y，z）;

你可以做简单的方式，例如：

document.getElementById("elementID").style.backgroundColor = 'rgb('+ this.red + ', ' + this.green + ', ' + this.blue + ')';

这些R，G，B值就可以了，例如：

this.red = 0; 
this.green = 255; 
this.blue = 130;

来源

2015-12-20 10:38:37

不知道为什么我的JS不工作

回答

相关问题