jQuery动态设置样式List item

前段时间，Insus.NET有修改一个功能《激活当前视图菜单高亮呈现》http://www.cnblogs.com/insus/p/5287093.html

今天Insus.NET想改用另外一个方法来实现，使用jQuery。

在ASP.NET MVC 环境实现：

代码：

<ul><li><a href="#">Malaysia (2)</a></li><li><a href="#">Thailand (0)</a></li><li><a href="#">Philippines (2)</a></li><li class="active"><a href="#">China (0)</a></li><li><a href="#">Hong Kong (0)</a></li>
</ul>

 $(function () {$('ul li a').click(function () {$(this).parent().addClass('active').siblings().removeClass('active');});});

jQuery的语法中，使用了一个siblings()方法，这是所有同胞元素，所有同级元素或所有邻居元素。
即是说所有相同的元素中，只有一个元素使用active这个样式。如果其它元素有使用的将被移除。

动态演示：

jQuery动态设置样式List item相关推荐

Layui中Jquery动态设置的select标签加载时而正常时而失效问题排查和解决
1.背景前段使用Layui框架,jQuery动态设置的下拉框select标签,加载时而正常时而失效. 本地调试完全没有问题,但是在服务器运行加载成功和失败的比例五五开. 2.解决问题原因:Layu ...
js动态添加样式和jQuery动态添加样式
0.style方式添加样式 DOM对象.style.color = 'red'DOM对象.style.display = 'block/none' //让元素显示/隐藏 1.js动态添加样式 1.添加 ...
如何通过jQuery动态设置元素CSS的样式，以及HTML中CSS “内联式”、“嵌套式”、“外联式”使用方法
html元素使用CSS渲染标签的样式,可以通过内联式.嵌套式.外联式来将CSS样式添加到html中.有时候涉及到动态的参数,或者在事件中需要修改不同元素的CSS样式时,可以通过js获取目标元素,再其修 ...
javascript 动态设置样式style
动态修改style 1.易错:修改元素的样式不是设置class属性,而是className属性. 2.易错:单独修改样式的属性使用"style.属性名".注意在css中属性名在ja ...
jQuery动态设置输出窗口的高度
window.onscroll = function () { sc(); };//当系统滚屏时触发 window.onresize = function () { sc(); };//改变窗口大小时 ...
动态设置样式 calc计算
:style = " `height:${size - 110}px;display:${img === ''? none : inline};`" width: calc(100 ...
怎样设置html的元素属性,Jquery怎么设置元素的属性和样式？
Jquery怎么设置元素的属性和样式?下面本篇文章给大家介绍一下使用jQuery操作元素属性与样式的方法.有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助. 元素属性和Dom属性对于下 ...
vue.js 获取当前屏幕的宽度_vue 获取当前屏幕的宽度，图片等比例缩放，动态设置css样式...
vue 获取当前屏幕的宽度,图片等比例缩放这个是一个背景图,点击对应的圆圈就会出现一个蒙层上面显示详情,但是只要当前窗口大小变化了,因为我的蒙层大小是固定的px,所以不会变,就不在图片对应的位置了 ...
伪类如何动态在html设置样式,用js实现before和after伪类的样式修改的示例代码
本文介绍了使用javascript,jQuery实现修改before,after伪类的样式,分享给大家,具体如下: 最近遇到一个需要改变:before,:after 伪类的样式,发现css中并不能直接 ...

jQuery动态设置样式List item

jQuery动态设置样式List item相关推荐

最新文章

热门文章