Google apps script 如何使用GoogleApps脚本将CSS页面更改为具有内联样式的页面？_Google Apps Script_Gmail_Google Sites

Google apps script 如何使用GoogleApps脚本将CSS页面更改为具有内联样式的页面？

google-apps-script gmail

Google apps script 如何使用GoogleApps脚本将CSS页面更改为具有内联样式的页面？,google-apps-script,gmail,google-sites,Google Apps Script,Gmail,Google Sites,背景我正在尝试编写一个谷歌应用程序脚本，将谷歌文档的内容作为HTML，并使用该HTML在谷歌网站中创建或更新网页。我已经知道如何做到这一点，但结果是一个网页，是剥夺了几乎所有的格式。在看过Google文档中的html之后，我发现它没有使用内联样式，我相信Google站点需要内联样式有没有人有一个谷歌应用程序脚本，我可以用它将CSS转换成内联样式，然后再创建谷歌网站页面？另外，我可以在Google Apps脚本环境中使用一个库，它可以为我提供相同的功能，这也同样好。它只需要是一个库，我可以在G

背景

我正在尝试编写一个谷歌应用程序脚本，将谷歌文档的内容作为HTML，并使用该HTML在谷歌网站中创建或更新网页。我已经知道如何做到这一点，但结果是一个网页，是剥夺了几乎所有的格式。在看过Google文档中的html之后，我发现它没有使用内联样式，我相信Google站点需要内联样式

有没有人有一个谷歌应用程序脚本，我可以用它将CSS转换成内联样式，然后再创建谷歌网站页面？另外，我可以在Google Apps脚本环境中使用一个库，它可以为我提供相同的功能，这也同样好。它只需要是一个库，我可以在GoogleApps脚本环境中添加它（即，通过“资源”-“管理库”菜单）。谢谢

顺便说一下

我试着用两种方法从Google文档中获取html。这两种方式都提供了相同的CSS非内联样式，当我使用它创建Google站点页面时，这些样式会被剥离

1）我在下面的链接中使用了Romain Vialard的DocsListened Google脚本库

2）我使用了一些人建议的代码，包括hgabreu@gmail.com，以及其他在

注意：同样的问题也会影响发送给gmail用户的html电子邮件。

有一些邮件可以进行这种转换，因此您可以从Google Apps脚本中利用其中一个。（如果您只需要偶尔做一次，为什么不使用其中一项服务？）

下面是一个示例脚本，它构建在来自的

getElementByVal（）

函数的基础上

inline（）函数结果


例子
示例标题
第1段
第2段

从Google文档中获取的HTML代码是否具有对象类型（div、span等）和类名？如果是这样的话，你可以制作你自己的CSS文件，该文件在你的谷歌网站上被引用，它会自动格式化HTML，使其看起来与谷歌文档相似。指向Romain Vialard的DocsListened谷歌脚本库的链接返回“未找到页面”错误。第二个链接在我的电子邮件地址后返回“拒绝访问”。

/**
 * Convert html containing <style> tags to instead have inline css.
 *
 * This example uses an online service from MailChimp Labs, but
 * the same principle could be used to leverage several other
 * online providers.
 *
 * @param  {Text}  htmlWstyle  A block of HTML text including
 *                             <style>..</style> tags.
 *
 * @returns {Text}             Same HTML, converted to inline css.
 */
function inline(htmlWstyle) {
  // Generate a POST request to inline css web tool.
  var payload =
  {
    "html" : htmlWstyle,
    "strip" : "checked"
  };

  // Because payload is a JavaScript object, it will be interpreted as
  // an HTML form. (We do not need to specify contentType; it will
  // automatically default to either 'application/x-www-form-urlencoded'
  // or 'multipart/form-data')

  var options =
  {
    "method" : "post",
    "payload" : payload,
    "muteHttpExceptions" : true
  };

  var url = "http://beaker.mailchimp.com/inline-css";
  var response = UrlFetchApp.fetch(url, options);

  // The html from this service is non-compliant, so we need
  // to massage it to satisfy the XmlService.
  var badlink = new RegExp('<link (.*?)[\/]*>',"igm");
  var badmeta = new RegExp('<meta (.*?)[\/]*>',"igm");
  var badinput = new RegExp('<input (.*?)[\/]*>',"igm");
  var xml = response.getContentText()
                    .replace(badlink,"<link $1></link>" )
                    .replace(badinput,"<input $1></input>" )
                    .replace(badmeta,"<meta $1></meta>" )
                    .replace(/<br>/g,"<br/>");

  // So far, so good! Next, extract converted text from page. <textarea name="text" ...>
  // Put the receieved xml response into XMLdocument format
  var doc = XmlService.parse(xml);

  var inlineHTML = getElementByVal( doc, 'textarea', 'name', 'text' );
  return (inlineHTML == null) ? null : inlineHTML.getValue();
}

function test_inline() {
  var myHtml =
    '<html>'
  +   '<head>'
  +     '<title>Example</title>'
  +     '<link rel="stylesheet" href="http://inlinestyler.torchboxapps.com/static/css/example.css" ></link>'
  +   '</head>'
  +   '<body>'
  +     '<style type="text/css">'
  +        'h1{'
  +             'color:yellow'
  +        '}'
  +     '</style>'
  +     '<h1>An example title</h1>'
  +     '<p>Paragraph 1</p>'
  +     '<p class="p2">Paragraph 2</p>'
  +   '</body>'
  + '</html>';

  var inlined = inline(myHtml);
  debugger;  // pause in debugger, have a look at "inlined"
}

  <html>
    <head>
      <title>Example</title>
    </head>
    <body>
      <h1 style="color: yellow;">An example title</h1>
      <p style="margin: 0;padding: 0 0 10px 0;">Paragraph 1</p>
      <p class="p2" style="margin: 0;padding: 0 0 10px 0;">Paragraph 2</p>
    </body>
  </html>