javascript - 如何为 HEAD 标签动态添加 CSS 样式?

标签 javascript jquery html css

我有一个不寻常的场景,我需要从 HTML 文档 A 中获取 STYLE 标签的内容(只有 second 标签)并将其添加到HTML DOCUMENT BLINK标签后的HEAD标签中。 A 和 B 在同一台服务器上。 它必须是动态的,我无法控制生成的 CSS (cms)。

我想知道:

  • 最好的方法是什么,我需要避免页面闪烁
  • 哪个比较便宜

我可以使用 HTML5 和 JQUERY。我主要针对 web-kit。

    HTML A

    <html>
    <head>
    <style type="text/css">
                .styleA {}
    </style>
<!-- I am interested just in the following style tag
    <style type="text/css">
                .styleB {}
    </style>
//>
    </head>
    <body>
    </body>
    </html>



    HTML B

    <html>
    <head>
      <link rel="stylesheet" type="text/css" href="someothercss.css">
    <!-- should be injected here -->
    </head>
    <body>
    </body>
    </html>

最佳答案

您可以使用 jQuery 创建一个单独的 .js 文件来操作 css(或者只是将其添加到 HTML 代码本身),然后如果需要,只需将 .js 链接到 HTML B 或两者。只需将所有需要继承样式的元素设置为一个类,然后编写jQuery来操作该类的css即可。

示例代码:

    $(".className").css({"background-color":"black","font-size":"12px"});

您可以在大括号内添加和操作任何 css 样式。

关于javascript - 如何为 HEAD 标签动态添加 CSS 样式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19973311/

相关文章:

javascript - jquery 和原生 javascript 简单 DOM 选择器

javascript - 使用 jasmine 模拟对服务器的调用

javascript - 从AngularJS中的对象数组中通过id获取特定对象

javascript - 可以使用变量值来指定 jquery 对象名称吗?

javascript - ajax 调用永远不会回发到服务器

javascript - Openlayers - LayerRedraw()/特征旋转/线串坐标

javascript - 使用 Uniqe ID 添加段落数组中的句子

html - 自动分配有间隙的选择/输入字段

javascript - knockout js : data-bind click not working

javascript - React-Native:保存用户偏好