Как применить стили к такому коду в теге <script>

158

27 мая 2018, 03:10

Требуется представить google-таблицу, как веб-страницу с возможностью использовать стили. Есть решение, которое позволяет быстро выводить данные. Но не могу понять, как прикручивать к нему стили.

function onSuccess(Value) {
      document.getElementById("output").innerHTML = toHTMLTable(Value);
    }
    function toHTMLTable(a) {
      var content = a.map(function(row, i) {
        var rowHTML = row.map(function(col) {
          return "<td>" + col + "</td>";
        }).join("");
        return "<tr>" + rowHTML + "</tr>";
      }).join("");
      return "<table>" + content + "</table>";
    }
google.script.run.withSuccessHandler(onSuccess).returnCellValue('A1:C3');
 <div id="output"> </div>

Пример вывода:

https://script.google.com/macros/s/AKfycbzl1nEfqH0YdMFbx-IhcDK43vbj4ujIfBjp4xzplxUVaGbz2ng/exec

Если прописывать стили внутри тега <script>, они не работают.

Answer 1

Создайте отдельный блок style и кидайте его на страницу

var css = 'td { padding: 15px; }';
css +=   'td { color: green; }';
css +=   'td { border-bottom: 1px solid green; }';
var head = document.body || document.getElementsByTagName('head')[0],
    style = document.createElement('style');
style.type = 'text/css';
if (style.styleSheet){
  style.styleSheet.cssText = css;
} else {
  style.appendChild(document.createTextNode(css));
}
head.appendChild(style);