| 标题 | js实现在同一窗口浏览图片 |
| 内容 | 在同一窗口浏览图片的方法有很多，本例要为大家介绍的是使用js获取img的src属性后进行替换，有此需要的朋友可以参考下 <!doctype html public -//w3c//dtd html 4.01 transitional//en > <html> <head> <meta http-equiv=content-type content=text/html; charset=utf-8> <title>insert title here</title> <style> h1{position:absolute;margin-left:150px;} ul{position:absolute;margin-top:50px;margin-left:80px;} li{float:left;list-style:none;padding:1em;} img{position:absolute;margin-top:100px;margin-left:100px;width:1000px;height:600px;} p{position:absolute;margin-top:800px;margin-left:550px;} </style> <script> function showcat(a){ var osrc=a.getattribute(href); var oimg=document.getelementbyid(img1); oimg.setattribute(src,osrc); var op=document.getelementbyid(p1); var otxt=a.getattribute(title); op.childnodes[0].nodevalue=otxt;; } </script> </head> <body> <h1>cat home</h1> <ul> <li> <a href=img/1.jpg title=我是白猫咪 onclick=showcat(this);return false;>白猫咪</a> </li> <li> <a href=img/2.jpg title=我是黑猫咪 onclick=showcat(this);return false;>黑猫咪</a> </li> <li> <a href=img/3.jpg title=我是花猫咪 onclick=showcat(this);return false;>花猫咪</a> </li> </ul> <img id=img1 src=img/4.jpg alt=猫咪/> <p id=p1>choose cat photo</p> </body> </html> |
| 随便看 |
|
在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。