用js给导航栏动态添加active属性_IT百科

给你一个简单的原生html5实现的例子吧。没有使用jquery。

<!DOCTYPE html>

<html>

li {

display: inline-block

width: 100%

height: 30px

line-height: 30px

}

li:active, li:focus, .li-active {

background: #dddddd

color: red

}

</style>

onload = function () {

function removeActiveClass(node) {

node.className = ''

}

document.querySelector('ul[id=test]').onclick = function (e) {

Array.prototype.forEach.call(document.querySelectorAll('ul[id=test] > li'), removeActiveClass)

var target = e.target

target.className = 'li-active'

}

</script>

</head>

<body>

</ul>

</body>

</html>

var my_li = $('li')

if(my_li.hasClass("on")) {

my_li.parent().addClass("active")

}

用hasClass()方法来是否含有某个类

用parent()可以定位到当前元素的父元素

if(param == "clickNum"){ $("#cclickNum").attr('class','active') } else if(param == "showNum"){ $("#cshowNum").attr('class','active') }

欢迎分享，转载请注明来源：内存溢出

用js给导航栏动态添加active属性