如何使用JavaScript更改HTML元素的CSS

閱讀了關於此主題的一些問題/回答後，我試圖讓它適用於我，但我不能。如何使用JavaScript更改HTML元素的CSS

故事情節是我有X個元素（所以它意味着沒有ID只是類），我想改變背景，當我點擊一個。因此，與JS

我所做的：

'click .switch' (event) { 
    event.toElement.closest("li").css('background-color','black'); 


    if(this.stateMachine == 'running'){ 
     Meteor.call("switch", this.nameMachine); 
    } 

    },

得到容器（這裏是<li class="liMachine switch">），但我有這樣的錯誤：

event.toElement.closest(...).css is not a function

儘管event.toElement.closest返回正確的元素：

那麼我在做什麼錯了？

來源

2017-03-06 Jerome

變化'event.toElement'到'$（本）'或'$（event.target）'。最好是前者 –

@RoryMcCrossan沒有任何反應，沒有錯誤，但沒有變化 – Jerome

選擇器中的「click」元素是什麼？這不是有效的HTML，除非你使用了一些你沒有提到過的奇怪圖書館 –

由於您使用的流星，你可能更喜歡這種語法：

"click .switch": function(event){ 
$(event.target).css("background-color", "black"); 
}

來源

2017-03-06 13:41:09

$('.liContainer.switch').on('click', function() { 
 
    $(this).toggleClass('active'); 
 
});

.active { 
 
    background-color: powderblue; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul> 
 
    <li class="liContainer switch">one</li> 
 
    <li class="liContainer switch">two</li> 
 
    <li class="liContainer switch">three</li> 
 
</ul>

如果$(event.target)爲你工作，那麼問題是當然，你沒有通過一個jQuery對象。所以你不能在非jQuery對象上使用jQuery函數。

來源

2017-03-06 13:25:16 caramba

在它的作品，但在我的JS沒有任何反應（我把一些日誌，但沒有顯示） – Jerome

如何使用JavaScript更改HTML元素的CSS

回答

相關問題