jquery如何添加兄弟节点 不是子节点哦 O(∩_∩)O~

jquery如何添加兄弟节点 不是子节点哦 O(∩_∩)O~,第1张

1、首先获取要添加的节点的节点,然后创建一个节点,添加到节点的前面。

2、<!DOCTYPE html><html> <head>  <meta charset="utf-8">  <title>DOM树 *** 作</title>  <script>   function f1(){。

3、找到狮子狗这个节点     通过id查找到狮子狗节点    var ul=document.getElementById("d1")。

4、</head> <body>  <!--在ul列表中追加一个蛮王英雄-->  <ul id="d1">   <li>亚索</li>   <li>狮子狗</li>   <li>披甲龙龟</li>。

5、  </ul>  <input type="button" value="追加蛮王" onclick="f2()" /> </body></html>。

6、在狮子狗节点后追加一个<li>蛮王</li>   a.找到狮子狗这个节点     通过id查找到狮子狗节点     var li=document.getElementById("l1")   b.创建<li>蛮王</li>节点对象和内容。

在vue中当我们要实现点击元素动态添加类名时,我们不能像JQ那样去用(xxx.addClass(‘class’).siblings().removeClass(‘class’))实现,那我们应该怎样去做呢

解决方案:

1.在data里面申明一个属性,默认值最好为数字类型,并且不得大于当前元素+所有兄弟元素的length,可以默认为0(第一个元素选中)

2.在当前元素中添加动态class: “:class”,使用v-bind进行绑定

3.给元素点击事件,传入当前元素的index,把元素当前的index赋值给data里面的申明的属性,这样就可以点击实现该效果

一.首先给想要添加class的元素,通过v-bind绑定一个class

二.在data中声明一个变量activeClass

三.在点击事件中

四.在style里面写想要的样式就可以了

toggleClass方法可以实现对某一class进行添加、删除 *** 作。

示例:

1

$('#test').toggleClass('className')

上面的代码将会依次为id为test的元素添加/删除名为className的class,如果test元素存在className,则删除className,如果不存在则添加className。

toggleClass的用法如下:在匹配的元素集合中的每个元素上添加或删除一个或多个样式类,取决于这个样式类是否存在或值切换属性。即:如果存在(不存在)就删除(添加)一个类。

.toggleClass( className )

className

类型: String

在匹配的元素集合中的每个元素上用来切换的一个或多个(用空格隔开)样式类名。


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/bake/11956061.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-19
下一篇 2023-05-19

发表评论

登录后才能评论

评论列表(0条)

保存