主页 / 问题 / 975686
Accepted
recile
Asked:2020-04-28 02:28:37 +0000 UTC2020-04-28 02:28:37 +0000 UTC

如何从一个 div 中获取颜色并将其作为背景应用于另一个？

  • 772

例如，从一个正方形中取一个红色或绿色，然后用这种颜色在圆形上涂色？

.red{
  width: 10px;
  height: 10px;
  background-color: red;
}

.green{

   width: 10px;
  height: 10px;
  background-color: green;
}

.circle{
  
  width: 30px;
  height: 30px;
  border: solid;
  border-radius: 20px;
}
<div class="red" ></div>
<br>
<div class="green"></div>

<br>

<div class="circle"></div>

javascript

1 个回答

  1. Best Answer

    document.querySelectorAll(".red, .green").forEach(el => {
  el.addEventListener("click", function(e) {
    document.querySelector(".circle").style.backgroundColor = window.getComputedStyle(this).backgroundColor;
  });
});
    .red {
  width: 20px;
  height: 20px;
  background-color: red;
}

.green {
  width: 20px;
  height: 20px;
  background-color: green;
}

.circle {
  width: 30px;
  height: 30px;
  border: solid;
  border-radius: 20px;
}
    <div class="red"></div>
<br>
<div class="green"></div>
<br>
<div class="circle"></div>

    • 2

相关问题