Javascript文档写覆盖页面?

Mat*_*ddy 7 javascript coding-style

我是javascript的新手.

我正在尝试使用document.write(使用Wordpress)创建一个标记,以添加一个在预加载之前隐藏图像的样式.我不得不求助于编写Javascript样式来隐藏图像,然后再通过CSS加载它们.我不想将其实际写入CSS文件,因为用户已禁用Javascript,然后图像将永远不显示.

我正在尝试使用此代码:

jQuery(function($) {
    document.write('<style type="text/css"> .preload img { display: none; } </style>');
    $('#body-wrap').preloadThis();
});
Run Code Online (Sandbox Code Playgroud)

但是,它只是覆盖整个页面并使其变为空白.我怎么能阻止这个?我想在不删除页面的情况下添加标签.尝试使用'返回',没有运气.

对不起,我是新手.提前致谢.

And*_*y E 18

使用document.write()该页面加载完成后隐式调用document.open(),这将创建一个新的页面.您通常应该避免document.write()并坚持使用正确的DOM创建技术,或使用jQuery的速记创建方法:

jQuery(function($) {
    $('<style type="text/css"> .preload img { display: none; } </style>')
        .appendTo("head");
    $('#body-wrap').preloadThis();
});
Run Code Online (Sandbox Code Playgroud)


我假设您无法编辑页面加载的HTML或CSS文件以包含此规则?如果是这种情况,并且您希望在页面加载完成之前应用这些样式,请document.write()取出jQuery ready处理程序:

// write() before the document finishes loading
document.write('<style type="text/css"> .preload img { display: none; } </style>');
jQuery(function($) {
    $('#body-wrap').preloadThis();
});
Run Code Online (Sandbox Code Playgroud)

这将<style>在当前正在执行的<script>标记之后立即写入标记.希望这在你的<head>元素中<style>是无效的,尽管所有的浏览器都应该解析它.