今天做项目时其中一个环节需要用到js修改图片src属性切换图片，现在来记录一下

以下是示例：

html

<img src="/before.jpg" id="img" />

JavaScript

document.getElementById("img").src="/after.jpg";

如此就能把id为"img"的src改成自己想要改变的图片

【JavaScript】修改图片src属性切换图片的更多相关文章

  1. 网页中通过js修改img的src属性刷新图片时，图片缓存问题现象表述及问题解决【ps：引用大神案例http://blog.csdn.net/goodleiwei/article/details/50737548】

    问题:上传一张图片,通过js更新src属性刷新图片使其即时显示时, 当img的src当前的url与上次地址无变化时(只更改图片,名称不变,不同图片名称相同)图片不变化(仍显示原来的图片) 但通过fir ...

  2. 【转】Jquery修改image的src属性，图片不加载问题

    1.当点击某一按钮的时候,把图片域中的图片改变一下    <img id="randimg" src="/servlet/CreateValidateNum&quo ...

  3. vue2.0动态绑定图片src属性值初始化时报错

    在vue2.0中,经常会使用类似这样的语法 v-bind:src = " imgUrl "(缩写 :src = " imgUrl "),看一个案例 <te ...

  4. 使用定时器通过改变图片的src来切换图片

    点击以后开始自动切换图片 $("#page3_cover_1_back").click(function(){ var i=3; var haha=setInterval(func ...

  5. JS原生隐藏显示图片,点击切换图片的效果

    今天要说的内容,看标题就都能知道了!所有知识点一览无遗啊!咱们今天的东西,是纯纯的原生JS代码, 我先说一下要求, 1.有两个按钮,内容为显示,和换, 2.当点击显示的时候,按钮文字变成隐藏,同时图片 ...

  6. 用js动态的改变img标签里面的src属性实现图片的循环切换

    JS:根据循环切换的条件可以用 document.getElementById('').src=''设置, 或者jquery方法: $('#id').attr('src','图片名称’): 具体: i ...

  7. imagebutton 设置了src属性的图片更换

    <ImageButton android:id="@+id/mediacontroller_play_pause" android:layout_width="wr ...

  8. android 图片浏览器滑动切换图片

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools= ...

  9. C#跑马灯，图片滚动，后台获取图片地址。动态绑定图片，imag显示文字

    下面附下载地址. http://download.csdn.net/download/njxiaogui/10002058 1.跑马灯效果,图片连续循环滚动,图片下面并可附文字描述,图片是从数据库中获 ...

随机推荐

  1. python3+Appium自动化06-屏幕截图

    截图方法 save_screenshot() 该方法直接保存当前屏幕截图到当前脚本所在文件位置 driver.save_screenshot('login.png') get_screenshot_a ...

  2. Python 魔术方法及调用方式

    魔术方法 调用方式 解释 __new__(cls [,...]) instance = MyClass(arg1, arg2) __new__ 在创建实例的时候被调用 __init__(self [, ...

  3. Hive 环境的安装部署

    Hive在客户端上的安装部署 一.客户端准备: 到这我相信大家都已经打过三节点集群了,如果是的话则可以跳过一,直接进入二.如果不是则按流程来一遍! 1.克隆虚拟机,见我的博客:虚拟机克隆及网络配置 2 ...

  4. 2 - Bootstrap-引导类-Bootstrap/ServerBootstrap

    2.1 ChannelOption和属性 //设置属性 bootstrap.option("xxx", 1231231); bootstrap.attr("xxx&quo ...

  5. 一个简单的CI分页类

    [php] view plaincopy <span style="font-size:16px;">/** * * 关于 页码有效性的判断需要加在 控制器中判断,即当 ...

  6. ElasticSearch 处理自然语言流程

    ES处理人类语言 ElasticSearch提供了很多的语言分析器,这些分析器承担以下四种角色: 文本拆分为单词 The quick brown foxes → [ The, quick, brown ...

  7. 移植mavlink到stm32详细教程，后面附快速移植方法

    一:准备材料: mavlink源码 stm32串口程序    1.mavlink源码:        a.进入mavlink官网(http://qgroundcontrol.org/mavlink/s ...

  8. 为什么要使用Vuex?

    为什么要使用Vuex? 1. 假如不使用 1.1 父子组件依赖同一个state 1.2 兄弟组件依赖同一个state 2. 用了Vuex之后 3. 方便记忆和理解

  9. 菜鸟 学注册机编写之 “RSA”

    测试环境  系统: xp sp3 调试器 :od 1.10 RSA简单介绍 选取两个别人不知道的大素数p, q. 公共模n = p*q 欧拉值φ(n) = (p-1)(q-1) 选取公匙(加密匙) e ...

  10. JavaScript-判断语句（if...else）

    语法: if(条件) { 条件成立时执行的代码 } else { 条件不成立时执行的代码 } 假设我们通过年龄来判断是否为成年人,如年龄大于等于18岁,是成年人,否则不是成年人.代码表示如下: < ...