Question

这是我在html中的页面的一部分：

<div id="FJ_TF_Cont" style="position: relative; padding: 0; margin: 0; border-width: 0px; width: 200px;">
    <iframe width="210" height="640" src="../test/content.html" name="FJIframe" scrolling="no" frameborder="0" marginwidth="0" marginheight="0" style="width: 210px; border-width: 0px; z-index: 1;">

    </iframe>
</div>

我想将这些内容转移到.js文件中，而不是在每个页面中编写这段html，因为它出现在许多html页面中。哪种方法最好？

Answer 1

<强> forall.js

    var _html = '<div id="FJ_TF_Cont" style="position: relative; padding: 0; margin: 0; border-width: 0px; width: 200px;">'
        +'<iframe width="210" height="640" src="../test/content.html" name="FJIframe" scrolling="no" frameborder="0" marginwidth="0" marginheight="0" style="width: 210px; border-width: 0px; z-index: 1;">'
        +'</iframe>'
        +'</div>';

document.getElementById("some_id").innerHTML = _html;

在.js .html个div文件中使用此id，some_id等于{{1}}

Answer 2

Dominique Fortin的帖子，没有JQuery：

<强> yourscript.js：

var _html = '<div id="FJ_TF_Cont" style="position: relative; padding: 0; margin: 0; border-width: 0px; width: 200px;">'
    +'<iframe width="210" height="640" src="../test/content.html" name="FJIframe" scrolling="no" frameborder="0" marginwidth="0" marginheight="0" style="width: 210px; border-width: 0px; z-index: 1;">'
    +'</iframe>'
    +'</div>';

document.write(_html);

<强>的index.html：

<head>
  <script src="yourscript.js"></script>
  ...
</head>
<body>
  ...
<body>

只要在页面完全加载之前执行了yourscript.js，它就不会覆盖您的页面。

Answer 3

在你的snippet.js上：

//files/js/snippet.js
var html_snippet = '<div id="FJ_TF_Cont"...  </iframe></div>';

负载：

<script src="snippet.js"></script>
<script>
    document.getElementById("hook").innerHTML = html_snippet;
</script>

Answer 4

要简单地抓取元素及其内容，您可以使用document.getElementById。

var div = document.getElementById("FJ_TF_Cont");

Answer 5

像这样

var _html = '<div id="FJ_TF_Cont" style="position: relative; padding: 0; margin: 0; border-width: 0px; width: 200px;">'
    +'<iframe width="210" height="640" src="../test/content.html" name="FJIframe" scrolling="no" frameborder="0" marginwidth="0" marginheight="0" style="width: 210px; border-width: 0px; z-index: 1;">'
    +'</iframe>'
    +'</div>';

$(document).ready( function () {
   $('body').append(_html);
});

将<div>标签转移到.js文件</div>

5 个答案: