// 根据class 获取元素
var getElement = function(selector) {
return document.querySelector(selector);
}
// 根据class 获取所有class 的元素
var getAllElement = function(selector) {
return document.querySelectorAll(selector);
}
// 获取元素class
var getClass = function(element) {
return element.getAttribute("class");
}
// 给元素设置class
var setClass = function(element, cls) {
return element.setAttribute("class", cls);
}
// 给元素添加样式
var addClass = function(element, cls) {
var baseCls = getClass(element);
if (baseCls.indexOf(cls) === -1) {
setClass(element, baseCls + " " + cls);
}
}
// 元素删除指定样式
var delClass = function(element, cls) {
var baseCls = getClass(element);
if (baseCls.indexOf(cls) != -1) {
setClass(element, baseCls.split(cls).join(' ').replace(/\s+/g, ' '));
}
}
window.onscroll = function() {
var top = document.body.scrollTop;
if (getElement(".pro_nav")) {
if (top > 700) {
addClass(getElement(".pro_nav"), "active");
} else {
delClass(getElement(".pro_nav"), "active");
}
}
if (getElement(".sol_nav")) {
if (top > 700) {
addClass(getElement(".sol_nav"), "active");
} else {
delClass(getElement(".sol_nav"), "active");
}
}
}
function nav_onclick(el) {
var list_item = getAllElement(el);
var _len = list_item.length;
if (list_item) {
for (var i = 0; i < _len; i++) {
list_item[i].onclick = function () {
for (var i = 0; i < _len; i++) {
delClass(list_item[i],"active");
}
addClass(this,"active");
}
}
}
}
nav_onclick(".el");
js控制class常用函数
最新推荐文章于 2023-04-24 23:57:40 发布