代码：

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title></title>

    <script>

        function changeImg() {

            var img = document.getElementById("img1");

            img.src = "https://i03piccdn.sogoucdn.com/1ce429cb207df745";

        }

    </script>

</head>

<body>

<input type="button" value="点击切换图片" onclick="changeImg()"/>

<br/>

<img src="https://i01piccdn.sogoucdn.com/d5d909ee8ce5249d" id="img1"/>

</body>

</html>

JS练习：切换图片的更多相关文章

  1. js多种切换图片

    分享通过js实现多种图片切换特效,这里只有手动切换哦,自动效果需自写,效果地址:http://dwz.cn/1drD5u. 下载地址:http://***/download/index/52209 适 ...

  2. js自动切换图片

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

  3. js 循环切换图片

    function changeLot(){ var minIndex = 1; var maxIndex = 100; var curIndex = 10; var src = $("ul ...

  4. js动态切换图片

    <script language =javascript > $(function () { initAds(); }); function initAds() { var curInde ...

  5. js 数组切换图片

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

  6. js 上下切换图片

    <html><head lang="en"> <meta charset="UTF-8"> <title>< ...

  7. 原生js+css3实现图片自动切换，图片轮播

    运用CSS3transition及opacity属性 制作图片轮播动画 自己这两天根据用js来控制触发CSS3中transition属性,从而写出来的以CSS3动画为基础,js控制过程的图片轮播 运用 ...

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

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

  9. [js开源组件开发]js轮播图片支持手机滑动切换

    js轮播图片支持手机滑动切换 carousel-image 轮播图片,支持触摸滑动. 例子见DEMO http://www.lovewebgames.com/jsmodule/carousel-ima ...

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

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

随机推荐

  1. jedis 2.7.2 jar

    jedis 2.7.2 已经公布. 源码https://github.com/xetorthio/jedis/releases/tag/jedis-2.7.2 jar 下载地址  http://dow ...

  2. 2015南阳CCPC C - The Battle of Chibi DP树状数组优化

    C - The Battle of Chibi Description Cao Cao made up a big army and was going to invade the whole Sou ...

  3. 又发现2个高人写的Delphi图文并茂的消息研究

    http://ymg97526.blog.163.com/blog/static/173658160201139101120862/http://ymg97526.blog.163.com/blog/ ...

  4. cookie domain and cookie path

    https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Set-Cookie Domain=<domain-value> Opt ...

  5. 【POJ 2777】 Count Color

    [题目链接] http://poj.org/problem?id=2777 [算法] 线段树 [代码] #include <algorithm> #include <bitset&g ...

  6. 【高德地图API】VS2012或者VS2013添加高德地图v2.1.1版本SDK失败

    可能由于v2.1.1版本SDK可能是在Win8.1环境下编译[这里有许多的原因,系统升级,安装VS2013等等] 有童鞋在操作正常的情况下添加SDK失败,提示版本不兼容. 如下图: 编辑项目  *.c ...

  7. 使用centos 5.x 64位系统安装astgo 2014 v7.3教程（含全套安装文件）

    版本特色: 全自动安装 安装过程中不用频繁输入yes或回车 自带完整号码归属地数据库 自带触屏版WAP ·首先确定你需要使用astgo 2014 7.0还是7.3: astgo 2014 v 7.0 ...

  8. target属性打开方式

    在HTML中target目标的四个参数的用法:1.target="_self"表示:将链接的画面内容,显示在目前的视窗中.(内定值) . 即:同(自己)窗口打开,别的数据还存在,相 ...

  9. 洛谷P1250种树（贪心）

    题目描述 一条街的一边有几座房子.因为环保原因居民想要在路边种些树.路边的地区被分割成块,并被编号成1..N.每个部分为一个单位尺寸大小并最多可种一棵树.每个居民想在门前种些树并指定了三个号码B,E, ...

  10. java 锁机制(synchronized 与 Lock)

    在java中,解决同步问题,很多时候都会使用到synchronized和Lock,这两者都是在多线程并发时候常使用的锁机制. synchronized是java中的一个关键字,也就是说是java内置的 ...