使用javascript改变图片路径

效果预览:http://keleyi.com/keleyi/phtml/jstexiao/16.htm

代码如下:

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <title>使用js改变图片-柯乐义</title>
 5 <script>
 6 function changeImage() {
 7 var element = document.getElementById(‘myimage‘);
 8
 9 element.src = "http://keleyi.com/image/a/3cmla1pp.jpg";
10
11 }
12 </script>
13 <body>
14 </head>
15 <h1>使用js改变图片</h1>
16 <p>请点击按钮 <a href="http://keleyi.com/a/bjad/9isr0eoy.htm">原文</a></p>
17 <img id="myimage" src="http://keleyi.com/image/a/q5l1xnmf.jpg" alt="足球宝贝" />
18 <input name="keleyi" type=‘button‘ value="改变图片" onclick="changeImage()">
19 </body>
20 </html>

转载自:http://keleyi.com/a/bjad/9isr0eoy.htm

web前端汇总 :http://www.cnblogs.com/jihua/p/webfront.html

时间: 2024-08-09 06:17:49

使用javascript改变图片路径的相关文章

Javascript 将图片的绝对路径转换为base64编码

Javascript将图片的绝对路径转换为base64编码 我们可以使用canvas.toDataURL的方法将图片的绝对路径转换为base64编码:在这我们引用的是淘宝首页一张图片如下: var img = "https://img.alicdn.com/bao/uploaded/TB1qimQIpXXXXXbXFXXSutbFXXX.jpg"; 我们如下编写代码: function getBase64Image(img) { var canvas = document.create

主题切换(改变图片的加载路径)

图片路径 此路径下的图片资源 其实图片的资源是来自应用的沙盒路径,所以应该如此添加图片资源到XCODE (如果在路径文件夹修改image3的内容,XCODE是会自动更新的:在XCODE修改,路径文件夹的内容也会更新) 需要先运行一次沙盒下才会添加成功的 这有一个问题,如果添加的路径下图片减少,沙盒下并不会自动的减少,这就需要手动删除,否则还是会存在图片的, 如果是向添加的路径下添加图片,沙盒是会自动更新的,如果添加的路径下某张图替换了,那么沙盒也是会替换的. SO,如果是添加主题这样的功能,只要

MVC中用 BundleCollection 压缩CSS时图片路径问题

MVC中有个专门提供JS和CSS压缩的类,BundleCollection,其实这个类也可以在asp.net中用, 关于BundleCollection类的详细推荐个地址:http://www.cnblogs.com/lifeil/archive/2013/03/11/2954071.html 我这里只是记录下使用过程中遇到的两个小问题 1.css被压缩后,里面图片路径文件的问题 我们可以看到MVC中 BundleConfig这个类里,都是自动生成的好多需要压缩的JS和CSS bundles.A

网站更换了域名图片路径批量修改的方法

我们有可能会问,我们要是换域名了,做的网站怎么修改图片路径啊,换域名之后网站所有文章和软件的图片都不显示了,因为织梦上传图片用的是绝对地址,如果域名更换后,之前发布的文章的图片URL是不会跟着改变的,所以我们需要把旧域名替换成新的域名,方法很简单,有一段SQL语句更新一下文章正文内容就行. 复制下面SQL语句进织梦DedeCms的后台,点 系统 -> SQL命令行工具,然后看到一个文本框,在文本框内输入SQL语句,按确定之行.如果操作成功,上面会提示"成功执行x个SQL语句!"

jquery点击改变class并toggle;jquery点击改变图片src源码并toggle;jquery显示隐藏toggle

<html><head><meta charset="utf-8"><title></title><script type="text/javascript" src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js"></script><style>.bg1 {    background

ueditor图片上传,以及图片路径保存进数据库

前段时间一直忙于各种事,今天有点空也不是很困,就来写写文章吧,写的东西如题 那么我就按顺序进行说明一下吧 先废话一句吧,什么ueditor? UEditor是由百度web前端研发部开发所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点 那好,我们就来使用一下它 一:首先我们到官网下载ueditor(网址:http://ueditor.baidu.com/website/download.html),我这里使用java写的,所以选择jsp版本的进行下载,然后解压 下载: 解压: 然

使用asp.net改变图片颜色

最近奇葩经理提出了奇葩的需求,要能在网站上改变图片的颜色,比如灰色的变成彩色,彩色的变成灰色,尼玛楼主的感受你们不懂!于是有了下面的代码... 用法:调用update_pixelColor方法并传参数即可 C#代码   #region 改变图片颜色 /// <summary> /// 改变图片的颜色 /// </summary> /// <param name="filePath">图片的完整路径</param> /// <para

js动态改变图片src在ie6下的兼容问题

场景:验证码图片在ie6下出不来 这个BUG折腾了我近半个小时,最后GOOGLE成功,原因是IE6的底层BUG,我们使用<a>的href属性改变的时候会中断加载,导致我们看不到图片,这经常在验证码或动态改变图片的时候遇到. 所以我们在使用a 链接时通常href和onclick都会同时用到,链接的 onclick 事件被先执行,其次是 href 属性下的动作(页面跳转,或 javascript 伪链接),假设链接中同时存在 href 与 onclick,如果想让 href 属性下的动作不执行,o

javascript 实现图片轮播和点击切换功能

图片轮播是网页上一个比较常见的功能,下面我们来实现他吧 原理很简单: 1:固定的区域,所有的图片重叠,一次只能显示一张图片 2:通过改变图片的zIndex属性改变显示的图片,就可以达到切换的效果了 <!-- cycle_pic.html --> <!DOCTYPE html> <html> <head> <title>cycle_pic</title> <meta charset="utf-8"> &l