代码：

<!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. uboot流程分析--修改android启动模式按键【转】

    本文转载自:http://blog.csdn.net/dkleikesa/article/details/9792747 本人用的android平台用的bootloader用的是uboot,貌似大多数 ...

  2. SuperSocket中的Server是如何初Start的

    第一个函数 d:\sourcecode\github\supersocket\quickstart\basic\telnetserver_startbyconfig\program.cs static ...

  3. 水晶报表的宽度调整方法（设计器、代码调整、rpt文件属性）

    水晶报表的宽度调整方法(设计器.代码调整.rpt文件属性) Posted on 2010-08-07 23:52 moss_tan_jun 阅读(1725) 评论(0) 编辑 收藏 经过个人反复研究后 ...

  4. 在Struts2中ognl.MethodFailedExceptiond异常的解决办法

    问题描述: 在 Struts2 里面,当页面向服务器提交参数时报ognl.MethodFailedException:和java.lang.NoSuchMethodException:异常 异常信息  ...

  5. EasyUI 之 easyui-datagrid 字段格式化

    后台返回的json格式: 列表字段要显示username 用户的真实姓名: formatter="formatterByUserName" <table id="d ...

  6. shell脚本-基础

    shell脚本-基础 编程基础 程序是指令+ 数据 程序编程风格: 过程式:以指令为中心,数据服务于指令 对象式:以数据为中心,指令服务于数据 shell 程序提供了编程能力,解释执行. 计算运行二进 ...

  7. Java - HashTable、HashMap和LinkedHashMap的区别

    一般情况下,我们用的最多的是HashMap,在Map 中插入.删除和定位元素,HashMap 是最好的选择.但如果您要按自然顺序或自定义顺序遍历键,那么TreeMap会更好.如果需要输出的顺序和输入的 ...

  8. 知识记忆1：标志寄存器PSW

    8086CPU的flag寄存器结构如下: [ ] [ ] [ ] [ ] [OF][DF][IF][TF][SF][ZF][ ][AF][ ][PF][ ][CF] 其中debug中的显示为: 标志 ...

  9. ACM_小凯的排序（字符串）

    小凯的排序 Time Limit: 2000/1000ms (Java/Others) Problem Description: 调皮的小凯喜欢排序,拿到什么东西都要排一下序.现在他觉得单一的递增递减 ...

  10. 【转】Linux下使用locale命令设置语言环境

    转自:http://www.cnblogs.com/dolphi/p/3622570.html locale命令设置语言环境 在Linux中通过locale来设置程序运行的不同语言环境,locale由 ...