这是html代码,里面写了left.html

<div id='mydiv'>
  <a class='qwe'>1</a>
  <a class='qwe'>2</a>
</div>
<script>
var url = window.location.href;
var a=document.getElementById("mydiv").getElementsByTagName("a");
for(var i=0;i<a.length;i++){
if(a[i].href == url){
a[i].className = a[i].className+" on";
}
}
</script>

以上是把a标签的class改变(添加“ on”)以达到切换样式的效果。可以有其他的变化,比如改变css。等等...

简单js 切换左侧栏目的样式的更多相关文章

  1. 一个简单且丑陋的js切换背景图片基础示例

    不多说,直接上代码,非常基础的一个原生js切换元素背景图片范例 <html> <head> <meta http-equiv="Content-Type&quo ...

  2. js之如何获取css样式

    js之如何获取css样式   一.获取内联样式 1 <div id ="myDiv" style="width:100px;height:100px; border ...

  3. js基础 1.简单js 语法 关键字 保留字 变量

    简单js JavaScript 是一个松散性的语言 对象属性却不想c中的结构体或者c++ 和java的对象, 对象继承机制 使用原型的prototype(原型链),js的分为三部分ECMAScript ...

  4. 简单JS全选、反选代码

    1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org ...

  5. python爬虫的一个常见简单js反爬

    python爬虫的一个常见简单js反爬 我们在写爬虫是遇到最多的应该就是js反爬了,今天分享一个比较常见的js反爬,这个我已经在多个网站上见到过了. 我把js反爬分为参数由js加密生成和js生成coo ...

  6. 简单js表单验证

     简单js表单验证demo <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org ...

  7. js简单图片切换

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title> ...

  8. 百度图表插件echart简单应用,简单配置一些要显示的样式及种类

    从echart官网下载js,然后引入jq即可运行.足够简单应用了 关键词:echart控制:图标标题.数据标题.折线图.柱状图切换按钮.恢复刷新图表按钮.保存为图片按钮.坐标系控制.坐标数据.坐标倾斜 ...

  9. 一个简单js select插件

    现在,通过一个select插件,来介绍一下js插件的构建过程. 1.先上效果图 2.目录构建 (1)这个select插件,我给它起名交hongselect,所以呢,首先建个hongselect的文件夹 ...

随机推荐

  1. [干货教程]仿网易云课堂微信小程序开发实战经验

    本篇文章想跟大家分享下:我们公司“湖北诚万兴科技”最近刚帮客户定制开发.目前已上线的“哎咆课堂”微信小程序的开发经验分享.首先大概介绍下这个小程序所涉及到的主要技术点:微信登录.微信支付.微信小程序F ...

  2. Vivado Design Suite用户指南之约束的使用第二部分(约束方法论)

    Constraints Methodology(约束方法论) 关于约束方法论 设计约束定义了编译流程必须满足的要求,以使设计在板上起作用. 并非所有步骤都使用所有约束在编译流程中. 例如,物理约束仅在 ...

  3. HOOK IDT频繁蓝屏(Window 正确 HOOK IDT)

    环境 win7x64 Microsoft Windows [版本 6.1.7601]也是一个朋友 HOOK IDT 测试 问我IDT为啥老是蓝屏.结果是因为swapgs问题. 如果你知道swapgs作 ...

  4. Android学习:简易图片浏览

    这个例子学习混合使用XML布局和代码来控制UI,习惯上把变化小.行为固定的组件放在XML布局文件中管理,而那些变化较多.行为控制复杂的组件则交给Java代码来管理. 先在布局文件中定义一个线性布局容器 ...

  5. java.lang.Exception: No tests found matching [{ExactMatcher:fDisplayName=test]解决办法

    在进行简单的Junit单元测试时,测试一直报错: 先来看一下我的单元测试类: import org.junit.Test; import org.junit.runner.RunWith; impor ...

  6. gitlab+jenkins+tomcat war包部署(此文有新版本)

    对本文进行格式整理,url: https://www.cnblogs.com/huandada/p/9969234.html 整个项目的框架为: 1.gitlab的安装(Centos7) 新建/etc ...

  7. CString 成员函数用法

    参考文档:http://www.cnblogs.com/Caiqinghua/archive/2009/02/16/1391190.html CString的构造函数CString( );例:CStr ...

  8. Spring-Boot自动装载servlet

    Spring-Boot自动装载servlet 本人spring-boot相关博客均自己手动编写,但技术均从简书 恒宇少年 处学习,该大佬一直是我的偶像,鉴于能充分理解,所以已做笔记的方式留下这些文档, ...

  9. html 中a标签的问题(无反应,跳转,调用方法)

    让超链接点击后不跳转,可以用href = "#",但是这个#就会锚点到页面最上边     点击链接后不跳转可以设置成     1.<a href="javascri ...

  10. 微信小程序开发笔记01

    微信小程序开发的优势 1,不用安装,即开即用,用完就走.省流量,省安装时间,不占用桌面: 2,体验上虽然没法完全媲美原生APP,但综合考虑还是更优: 3,对于小程序拥有者来说,开发成本更低,他们可以更 ...