js match 来点击切换图片
定义和用法
match() 方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。
该方法类似 indexOf() 和 lastIndexOf(),但是它返回指定的值,而不是字符串的位置。
返回值
成功: ["on", index: 66, input: "http://127.0.0.1:8020/js/%E8%8F%9C%E9%B8%9F%E6%95%99%E7%A8%8B/img/on.png"]
失败: null
具体实现
html:
<img src="./img/on.png" id="change" onclick="changeImg()" />
js:
function changeImg(){
var element = document.getElementById("change");
if(element.src.match("on")){
element.src = "./img/off.png";
}else{
element.src = "./img/on.png";
}
}
结果
点击后
总结
match() 方法将检索字符串 stringObject,以找到一个或多个与 regexp 匹配的文本。
js match 来点击切换图片的更多相关文章
- jquery插件jquery.LightBox.js之点击放大图片并左右点击切换图片(仿相册插件)
该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现目前较为流行的点击放大图片并左右点击切换图片的效果,您可以根据自己的实 ...
- 22.用demo通过点击切换图片路径
用demo通过点击切换图片路径 html: <img src="images/driving.png" class="driving"/> js: ...
- 利用DOM的方式点击切换图片及修改文字
本案例主要学习理解,用到的几个DOM方法 01.getAttribute()方法,获取元素的属性值 02.setAttribute('src',source) 方法,用后边的值修改前边这个元素的属性值 ...
- JS原生隐藏显示图片,点击切换图片的效果
今天要说的内容,看标题就都能知道了!所有知识点一览无遗啊!咱们今天的东西,是纯纯的原生JS代码, 我先说一下要求, 1.有两个按钮,内容为显示,和换, 2.当点击显示的时候,按钮文字变成隐藏,同时图片 ...
- Android之点击切换图片
package com.example.SlidePictures; import java.util.Timer; import java.util.TimerTask; import com.ex ...
- Fragment 回退栈 传递参数,点击切换图片使用Fragment ListView
Fragment回退栈 类似与Android系统为Activity维护一个任务栈,我们也可以通过Activity维护一个回退栈来保存每次Fragment事务发生的变化. 如果你将Fragment任务 ...
- C# 使用PictureBox控件--点击切换图片
效果: 1. 2. 代码: private Boolean fals = true; /// <summary> /// 单击事件 /// </summary> /// < ...
- JS练习:切换图片
代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title ...
- 根据日期切换图片KFX
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- Haybale Guessing
Haybale Guessing Time Limit: 1000MS Memory Limit: 65536K Description The cows, who always ha ...
- Master Nginx(8) - Troubleshooting Techniques
Analyzing log files Error log file formats Error log file entry examples Configuring advanced loggin ...
- broker监控dataguard配置
使用broker查看dataguard信息时有告警 DGMGRL> show configuration; Configuration - DRTEST Protection Mode: Max ...
- noip模拟赛 公交车
题目描述LYK在玩一个游戏.有k群小怪兽想乘坐公交车.第i群小怪兽想从xi出发乘坐公交车到yi.但公交车的容量只有M,而且这辆公交车只会从1号点行驶到n号点.LYK想让小怪兽们尽可能的到达自己想去的地 ...
- Nginx不转发http header
使用nginx做http代理时,在Header中使用了一个名为api_key的属性,碰到http header不转发的问题. 问题源码: rc = ngx_http_parse_header_line ...
- 越来越好玩,SPRINGMVC
了解了JSP和SERVLET的运行机制, 看完SPRING的内容,理解了一些IOC及AOP之后,进入SPRINGMVC和SPRINGBOOT,感觉轻松多啦.
- HDU 1561&HDU 3449 一类简单依赖背包问题
HDU 1561.这道是树形DP了,所谓依赖背包,就是选A前必须选B,这样的问题.1561很明显是这样的题了.把0点当成ROOT就好,然后选子节点前必须先选根,所以初始化数组每一行为该根点的值.由于多 ...
- mongodb mapreduce使用总结
文章来自本人个人博客: mongodb mapreduce使用总结 大家都知道,mongodb是一个非关系型数据库.也就是说.mongodb数据库中的每张表是独立存在的,表与表之间没有不论什么依赖 ...
- HDU 5347(MZL's chemistry-打表)
MZL's chemistry Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others) ...
- COCOS学习笔记--Button类及其相关控件属性
一.Button介绍 Button就是button.Cocos中提供了Button类对button进行相关的操作.我们看一下Button类继承关系图: 能够看到.Button是继承自Widget类,W ...