相关疑难解决方法(0)

如何用Javascript创建<style>标签?

我正在寻找一种<style>使用JavaScript 将标记插入HTML页面的方法.

到目前为止我找到的最佳方式:

var divNode = document.createElement("div");
divNode.innerHTML = "<br><style>h1 { background: red; }</style>";
document.body.appendChild(divNode);
Run Code Online (Sandbox Code Playgroud)

这适用于Firefox,Opera和Internet Explorer,但不适用于Google Chrome.<br>IE的前端也有点难看.

有谁知道创建<style>标签的方法

  1. 更好

  2. 适用于Chrome?

或者可能

  1. 这是我应该避免的非标准事情

  2. 三个工作浏览器很棒,谁还使用Chrome?

html javascript css

309
推荐指数
12
解决办法
29万
查看次数

如何使用jquery加载CSS

我在服务器上加载了一个css文件,所以我有一个URL跟我一起.如何使用JQuery在我的perl代码中加载它?

所以目前我在我的梅森页面中硬编码css,页面上缺少这样的东西

JQ.onReady('show', function(){
    JQ.addStyles({styles: ["\n\n.ap_classic { border-top:1px solid #ccc;border-left:1px solid #ccc;border-bottom:1px solid #2F2F1D; border-right:1px solid   #2F2F1D;background-color:#EFEDD4;padding:3px; }  .ap_classic .ap_titlebar { color:#86875D;font-size:12px;padding:0 0 3px 0;line-height:1em; }  .ap_classic .ap_close { float:right; }  .ap_classic .ap_content { clear:both;background-color:white;border:1px solid #ACA976;padding:8px;font-size:11px; } "]});
});
Run Code Online (Sandbox Code Playgroud)

我想避免硬编码这个CSS?

html css jquery stylesheet

53
推荐指数
2
解决办法
8万
查看次数

我可以根据要求加载外部样式表吗?

$.getScript('ajax/test.js', function() {
  alert('Load was performed.');
});
Run Code Online (Sandbox Code Playgroud)

..就像上面的代码在请求时加载外部JS一样,是否有类似的东西可以在需要时加载外部CSS样式表?

例如,当我在我的网站上使用灯箱(内联弹出窗口)时,我想避免加载灯箱JS和CSS文件onload,除非用户请求.

谢谢

jquery load external request lightbox

46
推荐指数
4
解决办法
6万
查看次数

如何使用jQuery在IE中附加样式表?

大家好,

我只是想创建一个插件,我需要它是用户友好的所以我想在我的插件加载时用户页面部分append<link/>标签head.它适用于所有其他浏览器(不确定IE9,IE7和IE6),但不适用于IE8!我不知道我的插件出了什么问题,所以我刚创建了一个示例页面并遇到了类似的问题!这是我的测试页面HTML + jQuery Code ------

<html>
       <head>
              <script src="../jquery-1.6.min.js"></script>
              <script>
                       $(document).ready(function () {
                          $(document.head).append('<link rel="stylesheet" type="text/css" href="style.css" />');
                       });
              </script>
       </head>
       <body>
              <h1>Text!</h1>
       </body>
</html>
Run Code Online (Sandbox Code Playgroud)

这是我的CSS代码-----

body {
 background:#ddd; 
}
h1 {
 color: #789; 
}
Run Code Online (Sandbox Code Playgroud)

所以有人能告诉我哪里出错或这是一生的问题吗?

提前致谢


在看到第一条评论并转到提供的链接之后,我刚刚创建了这个示例代码并发现了一些惊人的东西!看到这个~~~

<html>
       <head>
              <script src="../jquery-1.6.min.js"></script>
              <script>
                       $(document).ready(function () {
                          if (document.getElementsByTagName('head')[0] === document.head) {
                           $("head").append('<link rel="stylesheet" type="text/css" href="style.css" />');
                          }else {
                           alert('This doesn\'t supports head appending!');
                          }
                       });
              </script>
       </head>
       <body>
              <h1>Text!</h1>
       </body>
</html>
Run Code Online (Sandbox Code Playgroud)

在使用我的IE8浏览器执行此页面时,我收到消息

This …
Run Code Online (Sandbox Code Playgroud)

html javascript css jquery internet-explorer

13
推荐指数
2
解决办法
8559
查看次数

CSS通过javascript动态加载但未应用

我有一个javascript文件,通过AJAX加载内容,并通过加载相应的CSS文件应用适当的样式:

var ssioCss = document.createElement("link");
ssioCss.setAttribute("href", baseURL + "ssio-plugin.css");
ssioCss.setAttribute("type", "text/css");
document.head.appendChild(ssioCss);
Run Code Online (Sandbox Code Playgroud)

但不幸的是,样式未应用,文件正确加载的事件(通过chrome检查器检查).

我错过了什么吗?知道怎么解决这个问题吗?

提前致谢.

javascript css

2
推荐指数
1
解决办法
845
查看次数