Question

我是新手，如果我的问题是基本的，那就很抱歉。我已经编写了一个代码（在论坛幕后的帮助下），通过点击图像，可以看到另一个图像，当您点击新图像时，再次显示另一个图像，依此类推。问题是我无法在代码中添加样式并使图像显示在不同的位置以进行布局。这里有人可以帮助我吗？非常感谢你

    <meta charset="utf-8">
    <title> COOPER BLACK </title>
    <link rel="stylesheet" type="text/javascript" href="style.css" media="screen">

</head>

<div class="container">
<script type="text/javaSCRIPT">

        var i = 1

        function imageClick() {
            if (! this.alreadyClicked)
                {
                addimage();
                counter();
                this.alreadyClicked = true;
                }
        }

        function addimage() {
            var img = document.createElement("img");
            img.src = "images/d"+i+".jpg";
            img.onclick = imageClick;
            document.body.appendChild(img);
        }

        function counter() {
            i = i + 1
        }

</script>

 <div class="first">
         <input class="first" type="image" src="images/d0.jpg" onclick="imageClick();">

        </div>

</div>

Answer 1

尝试以这种方式设置class属性

img.setAttribute("class", "YourClassName");

然后将样式应用于CSS文件/样式标记中的YourClassName。（可能还想在加载CSS后调用脚本）像这样

.YourClassName { /* style here */ }

修改您还可以使用控制台检查元素是否呈现良好（HTML标记具有类名和onClick方法）（按页面上的F12）

动态创建的样式元素

1 个答案: