如何在另一个元素中使用id获取元素Javascript

-1

我的代码如下。但是当我给出上面的代码时，ID为“demo”的元素没有被选中。我怎么能在JS中做到这一点？如何在另一个元素中使用id获取元素Javascript

document.getElementById("demo").onclick = function() {myFunction1()}; 
 

 
function myFunction1() { 
 
    document.getElementById("demo").classList.remove("flame"); 
 
}

.flame { 
 
    color: red; 
 
}

<div class="candle"> 
 
    <div id="demo" class="flame">Click me</div> 
 
</div>

来源

2017-09-24 Muthu

它在这里工作。 –

问题不是选择元素不起作用，而是您尝试添加点击处理程序的方式。这不是它的工作方式 –

*“但是当我给出上面的代码时，id为”demo“的元素没有被选中。”* [是的，它的确如此。]（https://jsfiddle.net/d9ska81a/ ） –

如果我的理解是正确的，尝试使用这一个

document.getElementById('demo').onclick = function(event) { 
 
    callback(event) 
 
} 
 

 
function callback (event){ 
 
    var classList = event.target.classList 
 
    
 
    if (classList.contains('flame')) { 
 
    console.log('contains') 
 
    classList.remove('flame') 
 
    } else { 
 
    console.log('notfound') 
 
    classList.add('flame') 
 
    } 
 
}

.flame { 
 
    color: red; 
 
}

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
    <div class="candle"> 
 
    <div id="demo" class="flame">Click me</div> 
 
</div> 
 
</body> 
 
</html>

来源

2017-09-24 13:47:53

-3

首先为什么您使用的方法来调用另一个函数时，你可以在HTML元素的onclick直接使用也确保你包括自函数功能1在正确的方式脚本需要在Dom元素中调用它之前进行定义。

所以，你可以在html元素

<div class="candle"> 
<div id="demo" class="flame" onclick="myFunction1()">Hello</div></div>

而对于JavaScript中使用这样的：

function myFunction1() { 
document.getElementById("demo").classList.remove("flame");}

您可以检查小提琴：https://jsfiddle.net/ytdmk6my/2/

来源

2017-09-24 13:37:47

如何在另一个元素中使用id获取元素Javascript

回答

相关问题