用JS改变HTML图像和样式

来源：互联网发布：淘宝促销管理在哪里编辑：程序博客网时间：2024/05/20 05:28

开始在function函数里面忘记在element加分号，然后路径设置上本文件夹也不能多加/符号，但是可以用./表示当前目录，../表示上级目录。

然后就是注意括号，id。

match()方法，字符串匹配，在第一个改变图像中，就是检索到这个字符串就返回true，否则false，详细用法：http://www.w3school.com.cn/jsref/jsref_match.asp

<!DOCTYPE html><html>    <head>        <meta charset="utf-8">        <title>JS2</title>        <script>        // <!-- <script type="text/javascript">        // document.write("<h1>This is a heading</h1>");        // document.write("<p>This is a paragraph</p>"); -->        // <img id = "img" onclick = "changeimage" src="eg_bulboff.gif" >        function changeimage()        {            element = document.getElementById("img");            if (element.src.match("bulbon"))            {                element.src = "./eg_bulboff.gif";            }                else                 {                    element.src = "./eg_bulbon.gif";                }        }        function changecolor()        {            x = document.getElementById("demo");            x.style.color = "#ff0000";        }        </script>    </head>    <body>        <p>        <button type = "button" onclick = "alert('Welcome!')">点击</button>        <img id = "img" onclick = "changeimage()" src="eg_bulboff.gif">        </p>        <br>        <button type="button2" name="button" onclick="changecolor()">点击改变颜色</button>        <p id = "demo">JavaSript能改变HTML元素的样式</p>    </body></html>

0 0