JS 搜索整个html标签,对特定的class进行获取并取得元素之后,进行样式或元素更改

6 篇文章 0 订阅
这篇博客探讨了如何在JavaScript中动态地修改网页元素的显示。通过`mounted()`方法初始化引用,然后查找并处理所有带有'van-action-sheet__name'类名的元素,当元素文本超过14个字符时,将其拆分为两部分,并使用内联样式添加高亮。同时,还展示了如何批量隐藏具有'el-popper'类名的div元素,通过改变它们的`display`属性实现。
摘要由CSDN通过智能技术生成
mounted(){

        this.getClass() //初始化引用

}

getClass(){

   var odiv = document.getElementsByTagName("*");

for(var i = 0; i<odiv.length; i++){

if(odiv[i].className == 'van-action-sheet__name'){

let val = odiv[i].innerText;

if(val && val.length>14){

let prevVal = val.substring(0,11);

let nextVal = val.substring(11,val.length);

odiv[i].innerHTML = `${prevVal}<span style='color:#568fff'> ${nextVal} </span>`

}

}

}

},

OR

 let divsToHide = document.getElementsByClassName("el-popper"); //divsToHide is an array

    for(let i = 0; i < divsToHide.length; i++){

       // divsToHide[i].style.visibility = "hidden"; // or

        divsToHide[i].style.display = "none"; // depending on what you're doing

    }

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值