2

我有一个简单的类来在调用content.html时附加文件。MyClass.display()

class MyClass
    @display: (display) ->
      $.get 'content.html', (data) ->
        $('body').append data

上面的代码总是将数据附加到body.

HTML代码就是这样

<html>
  <head></head>
  <body>
    <p>text before</p>
    <script src="file.js" type="text/javascript"></script>
    <script type="text/javascript">
      MyClass.display();
    </script>
    <p>text after</p>
  </body>
</html>

我想知道如何在</script>触发函数的封闭标记之后附加数据。那将在 the</script>和以下<p>标签之间。

一项要求是我不应该修改 HTML 标记。我无法按照以下答案之一的建议将 ID 直接添加到标记中。

我知道这是可能的,因为我可以在 Google AdSense 代码中看到它。但由于他们的 javascript 代码似乎是加密的,我无法解码它是如何完成的。

知道如何实现这一目标吗?

4

2 回答 2

1

当 javascript 代码运行时,其包含的 script 标签是 DOM 对象中可用的最后一个元素

您可以像这样获取它的参考,

var ele = $('script:last');

从那里,根据您的内容,content.html您可以做必要的工作将内容放在脚本标签之后(不要附加在脚本标签内,这不是您要寻找的内容)

例如,如果content.html有自己的顶级元素,p

<p>
  <strong>hello</strong> world!
</p>

那么你可以简单地

var MyClass = {
  display: function() {
    var ele = $('script:last');
    $.get('content.html', function(data) {
      ele.after(data);
    });
  }
}

注意 1:您必须在回调ele之外获得参考。$.get回调异步运行 - 到那时 DOM 可能会加载更多元素并且script:last可能不再是您的脚本标记。

注意2:如果content.html不包含包装整个事物的顶级元素,那么您必须自己将其包装在回调中,例如ele.after("<div class='my-own-wrapper'>" + data + "</div>");

供参考:https ://gist.github.com/4122339

于 2012-11-21T00:40:34.183 回答
-1

我明白你在做什么。您想在某些标记区域内插入 HTML。

我建议你这样做:

class MyClass
    @display: (display) ->
      $.get 'content.html', (data) ->
        document.write data

<html>
  <head></head>
  <body>
    <p>text before</p>
    <script src="file.js" type="text/javascript"></script>
    <script type="text/javascript">
      MyClass.display();
    </script>
    <p>text after</p>

  </body>
</html>

将脚本放在页面底部很重要,这样标记就有机会加载。否则,您的脚本可能会在页面完成加载之前运行。

于 2012-11-20T07:09:04.083 回答