<html><head lang="en">

    <meta charset="UTF-8">

    <title></title>

</head>

<body>

<img src="img/img_01.jpg">

<p></p>

<button onclick="switchImg();">切换图片</button>

<script>

   // 拿到图片标签

  var img = window.document.getElementsByTagName('img')[];

  console.log(img.src.lastIndexOf('img_01.jpg'));

//   lastIndexOf 如果找到则返回一个任意正数,如果没有找到,则返回-1

//   indexOf

  function switchImg(){

      if(img.src.indexOf('img_01.jpg') != -){

          img.src = 'img/img_02.jpg';

      }else{

          img.src = 'img/img_01.jpg';

      }

  }

</script>

</body></html>

js 切换图片的更多相关文章

  1. jquery插件jquery.LightBox.js之点击放大图片并左右点击切换图片（仿相册插件）

    该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现目前较为流行的点击放大图片并左右点击切换图片的效果,您可以根据自己的实 ...

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

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

  3. js实现图片自动切换效果。

    js实现图片自动切换效果,简单实用,原谅我只是一只小菜鸟还在学大神天天写博文装逼. <script language="javascript"> setInterval ...

  4. jquery实现图片切换和js实现图片切换

    jquery实现图片切换: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http ...

  5. 前端设计——js实现图片切换的淡入淡出

    1.网页结构如图所示 2.页面布局设计细节 ①分块:一个小方块是一个div. ②无序列表一般是竖直排放的,可以通过float让其水平排放.float:left; ③三个小方块是浮动上去的,所以要用到p ...

  6. JS解决通过按钮切换图片的问题

    我是JS初学者,本想通过JS解决轮播图的特效,上网看了下:大部分都是JQ解决的,对于初学者的我来说理解上有点困难.于是我自己只做了一个不那么高大上的JS轮播图,下面我简单介绍下我的步骤:在HTML中创 ...

  7. 原生JS—实现图片循环切换的两种方法

    今天我们主要讲讲如何使用原生JS实现图片的循环切换的方法.多余的话我们就不多说了,我们一个一个开始讲吧. 1  原生JS实现图片循环切换 -- 方法一 在上栗子之前我们先简单介绍一下所用的一些知识点. ...

  8. 原生JS—实现图片循环切换及监测鼠标滚动切换图片

    今天我们主要讲讲如何使用原生JS实现图片的循环切换的方法以及如何检测鼠标滚动循环切换图片.多余的话我们就不多说了,我们一个一个开始讲吧. 1  原生JS实现图片循环切换 -- 方法一 在上栗子之前我们 ...

  9. Js实现图片点击切换与轮播

    Js实现图片点击切换与轮播 图片点击切换 <!DOCTYPE html> <html> <head> <meta charset="UTF-8&qu ...

随机推荐

  1. android Handler vs Timer

    Handler vs Timer 在我们Android开发过程中,经常需要执行一些短周期的定时任务,这时候有两个选择Timer或者Handler.然而个人认为: Handler 在多个方面比Timer ...

  2. Chapter 2 Open Book——22

    I dropped my head, letting my hair fall to conceal my face. 我低下了我的头,让我的头发垂下来隐藏我的脸. I was sure,though ...

  3. eclipse中向左缩进快捷键

    总是忘记,还是记下来吧,以后查找方便 Shift + Tab    

  4. Slice到C++映射

    按:本文是DPWI第6章的笔记. 客户端Slice到C++映射定义的是:怎样把Slice数据类型翻译成C++类型,客户怎样调用操作.传递参数.处理错误.C++映射线程安全,不存在内存管理问题.不建议查 ...

  5. iOS中静态库-.a文件生成和使用

    最近在使用使用一个网上的Demo的时候. 出现另一令人烦恼的问题 . 就是它里面有嵌套的工程. 如下图所示. 工程里面还嵌套有一个工程. 真的是让人煞费苦心 …其实这个问题看起来并不是很难, 如果是一 ...

  6. 近十年one-to-one最短路算法研究整理【转】

    前言:针对单源最短路算法,目前最经典的思路即标号算法,以Dijkstra算法和Bellman-Ford算法为根本演进了各种优化技术和算法.针对复杂网络,传统的优化思路是在数据结构和双向搜索上做文章,或 ...

  7. Django CRM学员系统项目

    项目需求: 1.分讲师\学员\课程顾问角色,2.学员可以属于多个班级,学员成绩按课程分别统计3.每个班级至少包含一个或多个讲师4.一个学员要有状态转化的过程 ,比如未报名前,报名后,毕业老学员5.客户 ...

  8. [转]c++ new带括号和不带括号

    ref:http://m.blog.csdn.net/blog/u012745772/42420443 在new对象的时候有加上(),有不加(),不知道这个到底是什么区别?比如:CBase *base ...

  9. 据磁力链获得BT种子

    最近研究了一下磁力链magnet和BT种子torrent文件之间的相互转换.其实通过torrent文件获得磁力链实现起来比较简单,但反过来并非是一个可逆的过程,磁力链转BT种子理论上来说是不可能实现的 ...

  10. WinForm 子窗体在父窗体范围内移动,不能出父窗体 摘自于网络

    详细解释:1, 主窗体Form1属性IsMdiContainer设为True,并添加ToolStrip控件, Toolstrip中添加一个按钮toolStripButton1.         2,添 ...