如何在 R Shiny 应用程序中添加 JavaScript 以更改 CSS 文件

Question

我正在构建一个 R Shiny 应用程序，它有时会被单独看到，有时会在另一个网页的 iframe 中查看。我想根据查看的位置有一个不同的 .css 文件，所以我需要添加一个 JavaScript 语句来选择正确的 .css。我现在拥有的是：

ui.r

headerPanel(winowTitle="PageTitle",

list(tags$head(
tags$script('type = "text/javascript",  if(window.self === window.top) {
 tags$link(rel="stylesheet", type="text/css", href="FullSite.css")} 
 else{ tags$link(rel="stylesheet", type="text/css", href="InFrame.css"})'),

  (other stuff that works)), etc

当我运行它时，应用程序可以工作，但它不会读取任何一个 .css 文件。我做错了什么？

谢谢

Answer 1

这是一种方法。我已将script 中的R 代码替换为javascript。第一行使用 javascript 中的三元运算符将样式表的值设置为适当的值。

list(tags$head(tags$script('type = "text/javascript",
  stylesheet = window.self === window.top ? "FullSite.css" : "InFrame.css"
  $("head").append("<link rel=stylesheet type=text/css href=" + stylesheet + ">") 
')))

更新：这是动态添加样式表的更好方法。我用这个SO Post 修改了我的答案。

  list(tags$head(tags$script('type = "text/javascript"', '
    var ss = document.createElement("link");
    ss.type = "text/css";
    ss.rel = "stylesheet";
    ss.href = window.self === window.top ? "FullSite.css" : "InFrame.css"
    document.getElementsByTagName("head")[0].appendChild(ss);
  ')))