点击最后一个li里的p标签,最后一个li加个类名
时间: 2024-04-07 21:33:48 浏览: 62
jquery li标签 隔若干行加空白或者加虚线的方法
要实现您所描述的功能,您可以使用JavaScript来添加一个类名到最后一个li元素。
HTML代码示例:
```html
<ul>
<li>
<p class="trigger">点击我打开弹窗<span></span></p>
<div class="popup">弹窗内容</div>
</li>
<li>
<p class="trigger">点击我打开弹窗<span></span></p>
<div class="popup">弹窗内容</div>
</li>
<li>
<p class="trigger">点击我打开弹窗<span></span></p>
<div class="popup">弹窗内容</div>
</li>
<li>
<p class="trigger">点击我打开弹窗<span></span></p>
<div class="popup">弹窗内容</div>
</li>
<li>
<p id="lastTrigger" class="trigger">点击我打开弹窗<span></span></p>
<div class="popup">弹窗内容</div>
</li>
</ul>
```
JavaScript代码示例:
```javascript
// 获取最后一个li元素和对应的p标签
var lastLi = document.querySelector("ul li:last-child");
var lastP = document.getElementById("lastTrigger");
// 给最后一个li添加类名
lastLi.classList.add("new-class");
```
通过以上代码,最后一个li元素会被添加一个名为"new-class"的类名。您可以根据需要修改类名和选择器来适应您的具体需求。
请注意,这只是一个示例代码,如果您的HTML结构发生变化,您可能需要相应地调整JavaScript代码。
阅读全文