如何在两个或多个DOM元素上附加图像？

发布于 2025-01-18 07:51:08 字数 583 浏览 4 评论 0原文

我正在完成我的战舰项目，并想添加船舶图像。在玩家将船放在某个坐标的情况下之前，我只是将Divs的颜色更改为放置船的颜色。现在，我想动态放置（附加）图像。

            <div class="gameBoard">
                <div class="grid"></div>
                <div class="grid"></div>
                <div class="grid"></div>
                <div class="grid"></div>
                <div class="grid"></div>
                <div class="grid"></div>
            </div>

上面的DIV游戏板代表我在DOM中的董事会。每个divs代表玩家将相互攻击的每个单独的框。因此，我该如何在对或更多divs上添加一个图像，以使图像跨越这些divs。

原文

I'm finishing up my battleship project and want to add ship images. Before if a player places a ship at a certain coordinate, I just change the color of the divs as an indication of ship being placed. Now I want to place ( append ) images dynamically.

            <div class="gameBoard">
                <div class="grid"></div>
                <div class="grid"></div>
                <div class="grid"></div>
                <div class="grid"></div>
                <div class="grid"></div>
                <div class="grid"></div>
            </div>

The div gameboard above represents my board in the dom. And each divs represent each individual boxs where the players will attack each other. So how can I add one images on lets say to or more divs, so that the image span across those divs.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

z祗昰~ 2025-01-25 07:51:08

像这样的东西吗？

function addImage(a,b){
   document.querySelectorAll(".grid")[a].style.background = "url(ship.jpg)"; 
   document.querySelectorAll(".grid")[b].style.background = "url(ship.jpg)";
}
<div class="grid" onclick='addImage(3,4)'></div>

Something like this?

function addImage(a,b){
   document.querySelectorAll(".grid")[a].style.background = "url(ship.jpg)"; 
   document.querySelectorAll(".grid")[b].style.background = "url(ship.jpg)";
}
<div class="grid" onclick='addImage(3,4)'></div>

回复收藏 0 原文

~没有更多了~