项目需要,不能使用jquery,但要实现jq的以下代码的功能:
$(".q-group a").click(function () {
$(this).siblings().removeClass("active");
$(this).addClass("active");
})
实现如下
function hasClass(obj, cls) {
return obj.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'));
}
function addClass(obj, cls) {
if (!this.hasClass(obj, cls)) obj.className += " " + cls;
}
function removeClass(obj, cls) {
if (hasClass(obj, cls)) {
var reg = new RegExp('(\\s|^)' + cls + '(\\s|$)');
obj.className = obj.className.replace(reg, ' ');
obj.className = obj.className.replace(/\s+/g, ' ');
}
}
function toggleClass(obj, cls) {
if (hasClass(obj, cls)) {
removeClass(obj, cls);
} else {
addClass(obj, cls);
}
}
function siblings_class(class_name) {
var obj_group = document.getElementsByClassName(class_name);
if (obj_group.length > 0) {
var i = 0;
for (i = 0; i < obj_group.length; i++) {
var a_group = obj_group[i].children;
var j = 0;
for (j = 0; j < a_group.length; j++) {
a_group[j].onclick = function (e) {
var loc_group = this.parentNode.children;
var k = 0;
for (k = 0; k < loc_group.length; k++) {
if (loc_group[k] != this) {
removeClass(loc_group[k], "active");
}
}
addClass(this, "active");
}
}
}
}
}
siblings_class("q-group");