今天做项目时其中一个环节需要用到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. calendar 类 用法

    add()和roll()区别 一.Calendar 月份从 0-11,要表示8月,应该传入7 . 二.set() 会自动转换为合法的日期,如 set(1999,8,31)  表示的是1999-09-3 ...

  2. 【Linux】ubuntu安装jdk-6u45-linux-x64.bin

    for : Android4.4源码编译 环境 : ubuntu12.04_desktop_amd64 1. 1.1.jdk-6u45-linux-x64.bin 放置于 /home 1.2.命令&q ...

  3. 使用Pycharm开发python下django框架项目生成的文件解释

    目录MyDjangoProject下表示工程的全局配置,分别为setttings.py.urls.py和wsgi.py,1.其中setttings.py包括了系统的数据库配置.应用配置和其他配置,2. ...

  4. eaysui 子页面刷新父页面datagrid

    近期碰到这样一个问题,子页面操作后需要刷新父页面datagrid元素,刚开始用这种方式刷新,$("#talbe",window.parent.document).datagrid( ...

  5. mockjs模拟数据请求

    一般项目的方法 <html> <head> <script> <script src="http://requirejs.org/docs/rele ...

  6. mui的ajax例子2

    mui.post()方法 前端页面: <!DOCTYPE html><html><head> <meta charset="utf-8"& ...

  7. 12个非常不错的javascript类库

    Javascript是一个解释性的编程语言.最初作为浏览器的一部份在浏览器中运行,可以和用户交互,并且控制浏览器,异步通讯,修改显示的document.在这篇文章中,我们收集了12款最新的Javasc ...

  8. [转]git修改远程仓库地址

    原文链接:http://www.cnblogs.com/lazb/articles/5597878.html 问:Coding远程仓库地址变了,本地git仓库地址如何更新为最新地址 git修改远程仓库 ...

  9. eclipse, idea安装lombok插件

    参考博客: https://www.cnblogs.com/quan-coder/p/8387040.html 一:在开发工具中安装插件: Eclipse: 下载地址:https://projectl ...

  10. Mysql数据库操作语句总结(二)

    Mysql字符串字段判断是否包含字符串的3中方法 方法一: select * from user where email like "%b@email.com%";// 这个理解起 ...