如何在 JavaScript 中编辑 widget/snippet 的样式

Question

我得到了以下代码，我已将其嵌入到我的网站中，但我需要编辑此代码段的样式并更改 header.

的颜色

<script type="text/javascript">
var bkt_init_widget = {
    type: "default",
    srvsrc: "https://app.book.com",
    publickey: "somerandomnumbersinhere",
    lang: "es",
    scroll: false,
    services: [],
    agendas: []
};
var oScriptHtmlElement = document.createElement("script");
oScriptHtmlElement.setAttribute("type", "text/javascript");
oScriptHtmlElement.setAttribute("src", bkt_init_widget.srvsrc + "/js/widgets/loader.js?v=" + (new Date().getFullYear()) + (new Date().getMonth()) + (new Date().getDate()) + (new Date()).getHours());
(document.getElementsByTagName("head")[0] || document.documentElement).appendChild(oScriptHtmlElement);
</script>

但是我不知道该怎么做，因为从以下 url:

加载了一个 js 文件

https://app.book.com/js/widgets/loader.js

此文件包含一个负责加载不同样式的函数。如果我没有 "access" 来编辑那些 css 个文件，我该如何修改样式。

提到的功能：

function loadCss() {
    var someCss = ['reset.css', 'common.css', 'fields.css',  'default/services.css', 'default/agendas.css', 'default/datetime.css',
        'default/signup.css', 'default/summary.css', 'default/signin.css', 'button/button.css', 'default/creditcardcapture.css', 'default/account.css', 
        'default/changepassword.css', 'default/history.css', 'default/custom.css'];...etc

Answer 1

您可以随时调整它的特定规则，如果您只想更改段落的 line-heights 或段落的颜色，则无需重新创建整个 CSS 文件header。如果小部件实际上在您的页面中并且不是 iframe，您可以创建自己的文件来覆盖您选择的元素（如果您别无选择，可以使用更强大的选择器和 !important）。更强的选择器通常是指当前选择器加上:not(#a)，这加强了选择器，是无害的。

确保 Bookitit 不提供覆盖某些样式的本机方法。有些小部件不具有该选项，因为它会 'break' 它的身份，它的构建基于的愿景。

如何在 JavaScript 中编辑 widget/snippet 的样式

How to edit the style of a widget/snippet in JavaScript

javascript

css

widget

code-snippets