Question

我正在使用其中一个SaaS进行潜在客户发现。我粘贴他们的代码就像我在页面顶部粘贴谷歌分析代码一样（例如）：

<script type="text/javascript">
    var _lfuid = 'xxxxxxxxxxxxx';

    (function (d) {
        var w = d.createElement('script');
        w.type = 'text/javascript';
        w.asynch = true;
        w.src = '//widget.website.come/widget/widget.js';
        var s = d.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(w, s);
    })(document);
</script>

但是，我从调用中收到的小部件位置是在我得到的css文件中设置的。所有类都有!important标记，所以我不能使用我在静态文件中定义的css类覆盖它。

我的问题是：如何覆盖这个ansych css？

Answer 1

您需要将一个事件侦听器添加到异步脚本的加载中，并在将带有！important规则的CSS附加到HEAD之后。实施例

var _lfuid = 'xxxxxxxxxxxxx';

(function (d) {
    var w = d.createElement('script');
    w.type = 'text/javascript';
    w.asynch = true;
    w.src = '//widget.website.come/widget/widget.js';
    w.addEventListener('load', function (e) { 
       /* We wait the load of the async script and after we use jQuery to append our CSS to the HEAD of the document.
          p.s.: you need jQuery to use the dollar sing selector ($)  */
        $('head').append('<style> #yourCSSgoHere { display: none !important; }</style>');
    }, false);
    var s = d.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(w, s);
})(document);

如何覆盖asynch css？

1 个答案: