如何在js中通过innerHtml向html插入style样式

查了百度的几种方法都不行

功能为通过js向表格中的某一行传入颜色变化的样式，百度上的这两种方法都不行

请问这该如何解决？

var a = document.getElementById("xx")
xx.className = "originClass styleClass"

1，获取dom

2，给dom增加class，利用class控制style

1.js 可以通过 innerHtml 向 html 插入 style 样式，但是这个对象是 style 标签

2.你的需求很奇怪，js 想表格某一行传入样式，一般是通过给这一行的父标签（tr）加个 class，然后给 class 写样式

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    /* #styleTag {
      width: 500px;
      height: 500px;
      border: 1px solid black;
      display: block;
      margin-top: 20px;
    } */
  </style>
</head>

<body>
  <h1>在下面输入css样式</h1>
  <input type="text" id="inputTag" onblur="inputFinish()">
  <!-- <style id="styleTag" contenteditable></style> -->
  <style id="styleTag"></style>
  <script>
    function inputFinish() {
      document.getElementById("styleTag").innerHTML = document.getElementById("inputTag").value
    }
  </script>
</body>

</html>

可以直接在innerHtml里写类名行内都行。例如：


.sp{
  background:red;
 }

div.innerHtml="<span class="sp"></span>" //直接行内样式也行