我正在寻找一种<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>标签的方法
更好
适用于Chrome?
或者可能
这是我应该避免的非标准事情
三个工作浏览器很棒,谁还使用Chrome?
我在服务器上加载了一个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?
$.getScript('ajax/test.js', function() {
alert('Load was performed.');
});
Run Code Online (Sandbox Code Playgroud)
..就像上面的代码在请求时加载外部JS一样,是否有类似的东西可以在需要时加载外部CSS样式表?
例如,当我在我的网站上使用灯箱(内联弹出窗口)时,我想避免加载灯箱JS和CSS文件onload,除非用户请求.
谢谢
大家好,
我只是想创建一个插件,我需要它是用户友好的所以我想在我的插件加载时用户页面部分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) 我有一个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检查器检查).
我错过了什么吗?知道怎么解决这个问题吗?
提前致谢.
css ×4
html ×3
javascript ×3
jquery ×3
external ×1
lightbox ×1
load ×1
request ×1
stylesheet ×1