在web開發中，經常需要使用JavaScript來實現一些交互效果，其中最常見的就是點擊li元素添加CSS樣式。下面我們來通過代碼實現這一功能。
//獲取li元素的父級節點
var ul=document.getElementById("ulList");
//獲取所有li元素
var lis=ul.getElementsByTagName("li");
//為每個li元素添加click事件
for (var i=0;i代碼中首先通過getElementById()方法獲取ul元素，然后通過getElementsByTagName()方法獲取所有li元素。接著使用for循環為每個li元素添加click事件，當用戶點擊li元素時，通過this關鍵字獲取當前點擊的li元素，然后為其添加CSS樣式。
同樣的，我們也可以將CSS樣式定義在樣式表中，在點擊li元素時為該元素添加指定的class，來達到添加CSS效果的目的。代碼如下：
//獲取li元素的父級節點
var ul=document.getElementById("ulList");
//獲取所有li元素
var lis=ul.getElementsByTagName("li");
//為每個li元素添加click事件
for (var i=0;i代碼中使用classList.add()方法為當前點擊的li元素添加名為“active”的class，該class的CSS樣式在樣式表中定義。事實上，使用class的方式更加靈活，可根據需要添加多個CSS樣式。
上一篇js 書寫css樣式