javascript - 根据内容文本更改背景颜色

Question

我有一个 div，我想要背景颜色取决于 div 的上下文。例如我输入两个 div 类 #999 并将背景颜色设置为 #999。我怎么能用纯javascript做到这一点？

function myFunction() {
    var x = document.getElementsByClassName("test").textContent;
$(".test").attr({
"style" : "background-color: + x + ;"
});
}

.test{
  padding:5px;
  background-color:#555;
  color:white;
  display:inline-block;
}

<div class="test">#999</div>

标签： javascripthtmldom

Answer 1

<script>
    function setColour(e) {
        
        e.style.backgroundColor = e.innerHTML;
        
    }
</script>

<style>
    .test{
      padding:5px;
      background-color:#555;
      color:white;
      display:inline-block;
      min-width:100px;
      border:1px sloid black;
    }
</style>

    Type the colour code or name inside the div:<br><br>
    <div class="test" onkeyUp='setColour(this)' contenteditable>#999</div>