JavaScript 实现元素兄弟节点样式添加脚本

作者:像素猫

时间:2026-10-23

浏览:192

本文介绍了一段用于自动处理网页元素样式的 JavaScript 脚本。该脚本通过遍历指定 HTML 标签(如 h1)的兄弟节点,利用 getNextElement 函数定位相邻元素,并调用 addClass 函数为其添加指定的 CSS 类名。代码包含处理类名冲突的逻辑,旨在简化前端样式批量应用的操作。

文章目录

JavaScript 实现元素兄弟节点样式添加脚本

function styleHeaderSiblings(){


if(!document.getElementByTagName)return false;


var headers = document.getElementByTagName("h1");


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


addClass(elem,"intro");


}
}

function styleElementSiblings(tag,thechass){


if(!document.getElementByTagName)return false;


var elems = document.getElementsByTagName(tag);


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


var elem = getNextElement(elem[i].nextSibling);


addClass(elem,theclass);


}
}

function addClass(elemnt,value){


if(!element.className){


element.className = value;


}else{


newClassName = element.className;


newClassName +="";


newClassName +=value;


element.className = newClassName;}


}
}

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章