对 js 文件中的 html 内容执行 javascript

Question

这是一个很让人头疼的问题。

我有一个简单的 js 文件，只包含 document.write() html 内容块，我需要对其执行 jquery。

从长远来看，js 文件包含如下内容：

<script language="JavaScript" src="http://external-java-file.js"/>

将新闻转储到一批 div 中。问题是，我需要在每个单独的文章div上执行javascript（将其包含到自定义javascript“滚动器”中）。无论如何，我是否可以首先“隐藏”整个新闻块，然后为每个div添加它这是我的滚动条。 基本上我从 js 文件中得到了这个：

<div class="newsContainer">
<div class="newsArticle">bla bla bla</div>
<div class="newsArticle">bla bla bla</div>
<div class="newsArticle">bla bla bla</div>
</div>

因为它都是通过 document.write 来自这个令人讨厌的外部 js 文件，所以我无法使用像这样的单独代码块访问它：

<script>
$(document).onload(function(){
$("div.newsContainer").css("display","none");
});
</script>

我很确定我在末尾这条路，但我想看看是否有聪明人有巧妙的解决方案

Answer 1

你想使用

$(document).ready(function() {
// .. put code here.
});

这将确保页面和其他 JS 已首先加载。

Firefox 中的 Firebug 控制台是您的朋友，因为您将能够在页面上测试您的 jQuery。

Answer 2

试试这个：

HTML

<div id="news">
    <script language="JavaScript" src="http://external-java-file.js"/>
</div>

JavaScript

$(function() {
    $('#news .newsArticle').hide();
});

如果脚本使用 document.write()，那么一旦页面加载并以这种方式编辑它，您将能够访问它的容器 #news。

Answer 3

创建一个 css 样式来最初隐藏 newsContainer：

.newsContainer {
  display: none;
}

然后在 jQuery 的文档就绪函数中添加其他内容：

$(function() {
  // do your stuff here
});

如果您不知道外部脚本何时对新闻 div 起作用，请使用 JavaScript 的 setTimeout< /代码>。完成后还记得将 .newsContainer 设置为可见。