JS对img进行操作

最新推荐文章于 2020-06-29 14:52:14 发布
最新推荐文章于 2020-06-29 14:52:14 发布
阅读量123 收藏
点赞数
文章标签： javascript ViewUI
原文链接：http://www.cnblogs.com/qiqiBoKe/archive/2013/04/16/3024549.html
版权

   <script type="text/javascript">         var i = 1; var n;         function showImg() {

            if (document.getElementById('img').getAttribute("src") == "images/1.jpg") {                 document.getElementById('img').setAttribute("src","images/2.jpg");             }             else {                  document.getElementById('img').setAttribute("src","images/1.jpg");             }         }

        function showImg1() {             document.getElementById('img').setAttribute("src", "images/" + i + ".jpg"); i++;             if (i > 10)             {                 i = 1;             }         }

        function show() {           n=setInterval(showImg1, 500);         }

        function show1() {             clearInterval(n);         }     </script>

</head> <body>     <img id="img" alt="" src="images/1.jpg" width="200" height="200" />     <input id="Button1" type="button" value="换图片" οnclick="showImg()" />     <input id="Button2" type="button" value="切图" οnclick="showImg1()" />     <input id="Button3" type="button" value="轮换" οnclick="show()" />         <input id="Button4" type="button" value="停止轮换" οnclick="show1()" />

</body> </html>

转载于:https://www.cnblogs.com/qiqiBoKe/archive/2013/04/16/3024549.html

weixin_30906425
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
js操作img元素的问题
李义星
05-03 252
原文地址：http://blog.blacklee.net/tech/783-summing-up-of-a-google-analytics-similar-project-javascript-part 以上文章是一篇关于网站流量统计的。 他遇到的问题是，小图片的请求次数和统计的js请求次数比率是6:10； 原因是只要img对象的src赋值了。那么浏览器就会去请求图片。 解...
js操作 img
天使的天空
06-02 758
 var verify=document.getElementById(icode);    verify.setAttribute(src,CheckCode.aspx?+Math.random());
javascript获取、设置修改img的src属性（get/setAttribute）
weixin_45673401的博客
04-07 4万+
在开发网站过程中，事先就设置好了图片img的src性，一般来说很少修改这个属性，网站加载时直接显示事先设置好的图片。但如果网页要求实现滚屏加载图片（动态加载图片），也就是一次不显示网页内的所有图片，当滚动屏幕时再显示进入屏幕区的图片。这样不但可以减少对服务器的请求次数，而且能大大节省服务器的流量。 滚屏加载图片事先把网页内要动态显示图片的所有src属性设置为一张小图，待要显示目标图片时再把src属...
js的setAttribute的使用
Picking_up_stones的博客
10-24 1492
最近在写一个剧院管理系统的前端页面，需要动态生存座位，给每个座位都要注明它的状态，查了一些资料，可以给每个座位绑定一个属性，在用的时候只要获得座位的id调用属性就行。就用了setAttribute（”class”，”value”）这个方法。这是w3school里的方法说明： 看到两个参数都是string类型，就想着自己要添加的是座位状态，就写了这么一行代码:img.setAttribute("
JSP 页面中的 img 标签添加 onclick 事件失效
呆呆papa的博客
06-29 3984
我的 <img> 标签是这样写的： <img alt="" src= "images/icon_car.gif" onclick="findMerById(${mer.id})"> onclick 事件是放在 src 属性后面的，经过测试，这个事件就是没有触发。代码虽然没有错误，但是这是出现了一个警告：Undefined attribute name (οnclick) 我的 JSP 页面不止定义了一个 <img> 标签，其他的标签也添加了 onclick 事件，但是没
JS对img进行操作(换图片/切图/轮换/停止)
01-19
function showImg() { if (document.getElementById(‘img’).getAttribute(“src”) == “images/1.jpg”) { document.getElementById(‘img’).setAttribute(“src”,”images/2.jpg”); } else { document....
JSP结合js实现img中src更新请求的方法
10-23
总结来说，这个例子展示了如何利用JavaScript和JSP进行前后端交互，实现在不刷新页面的情况下动态更新img标签的src属性，达到刷新图像的目的。这种方法在许多场景下都非常实用，特别是在需要频繁刷新内容（如验证码...
pdf2img:convert pdf to img，使用JS将PDF转换为图片，支持整图下载和多图压缩包下载，可直接在线查看demo。如有疑问，可通过个人主页邮箱联系
07-23
:diamond_with_a_dot:pdf2img使用JS将PDF文档转换为图片，并支持下载图片（.zip格式全部下载）在线页面样式模板操作步骤(选择文件-->文档上传完成-->导出图片)文档大小建议不超过10M，因为文件越大处理过程越...
JavaScript正则表达式替换字符串中图片地址(img src)的方法
10-20
在JavaScript中，正则表达式是一种强大的文本处理工具，用于匹配、...理解正则表达式的语法和`replace()`方法的工作原理对于进行此类操作至关重要。在实际开发中，根据需求调整和优化正则表达式是提升代码效率的关键。
设置属性节点（setAttribute()）
weixin_30340353的博客
10-31 366
setAttribute()：方法将为给定元素节点添加一个新的属性值或是改变它的现有属性值： element.setAttribute(attriibuteName,attributeValue); 属性的名字和值必须以字符串的形式传递给此方法，如果这个属性已经存在，它的值将被刷新，如果不存在，setAttribute()方法只能用在属性节点上。 在下例中，setAttribute(...
js-getAttribute与setAttribute的用法
XiaoQ的博客
03-13 4386
今天UI出图里有一个小小的特效，鼠标滑过图标时，图标更换颜色（字体图标本身和北京）正常情况下UI会提供相应的字体图标然后css:hover就可以搞定了，但是UI说没有，只有psd原图还得自己换颜色，本来打算自己把图片转换给字体图标，后来一想好像可以用JS来实现，在加上又是一个小网站，用户对相应速度要求很低（其实是我发现生成字体图标好麻烦还要下载AI），于是我就打算用JS来实现，正好练练手。
setAttribute()方法的使用
SHUSHANGLIUMIAN的博客
07-11 1万+
setAttribute() 方法添加指定的属性，并为其赋指定的值。如果这个指定的属性已存在，则仅设置/更改值。语法：element.setAttribute(attributename,attributevalue)getAttribute()方法返回指定属性名的属性值element.getAttribute(attributename);作业：定义一个高度和宽度都为200像素的球形盒子，通过生...
request.setAttribute的用法
热门推荐
liuminchao83的博客
04-13 6万+
request.getAttribute表示从request范围取得设置的属性，必须要先setAttribute设置属性，才能通过getAttribute来取得，设置与取得的为Object对象类型 。      request.getParameter表示接收参数，参数为页面提交的参数，包括：表单提交的参数、URL重写（就是xxx?id=1中的id）传的参数等，因此这个并没有设置参数的方法（没有
JS onclick点击事件：点击图片切换其他图片
幻
08-10 2万+
&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;script type="text/javascript"&gt;
<img>的onClick属性的问题。
weixin_33995481的博客
02-21 701
&lt;img src="a.jpg" name="anniu" onClick="anniu.src='b.jpg'" onClick="anniu.src='a.jpg'" &gt; 这段代码可以实现，点击a.jpg这张图片，就变成了b.jpg。 可是我点击b.jpg想把它变回a.jpg，可它就不回去了。怎么办。   &lt;img src="a.jpg" onclick=
HTML5 Canvas与JavaScript实现图像操作
"这篇资源主要介绍了如何使用JavaScript在HTML5的canvas标签下进行基本的图形操作和处理，包括像素级操作、图像格式转换以及解决跨域图像处理的安全问题。此外，还提到了FileReader和canvas的结合使用，以便读取和...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值