如何获取非javascript“脚本”的内容？答案

【问题标题】：How to get the content of a non-javascript 'script'?如何获取非javascript“脚本”的内容？
【发布时间】：2011-04-08 17:25:42
【问题描述】：

我在我的 HTML 页面中包含了一个 <script> 标记，其中包含一个 HTML 片段。我想得到这个片段并将其插入到页面中。片段的位置与页面本身在同一台服务器上，因此不存在跨站点问题。

<script id="frag" src="/frag.html" type="text/x-jquery-tmpl"></script>

（顺便说一句，我已经将脚本的类型指定为 text/x-jquery-tmpl，因为我一直在尝试使用 jQuery 模板来访问脚本内容，即使它只是一个 HTML 文字）。我相信“类型”的价值不是什么大问题。

我尝试过的一些事情：

// Try inserting frag.html into div hdr
// this attempt, using jQuery templates, doesn't work
$('#frag').tmpl().appendTo('#hdr');

// This is an empty string
var contents = $('#frag').text();

对于所有的 jQuery 感到抱歉，我什至不知道如何在没有它的情况下尝试这个。我是一个 javascript 的无知者，并且始终需要 jQuery 的蓬松保护。

【问题讨论】：

只是为了好奇，你为什么要在脚本标签中插入 html，而不是例如 display none div？
我只是想知道你为什么要这样做？将其放入 html 文件并检索该文件或页面上的元素不是更容易吗？好奇你为什么要这样做，仅此而已......
@Andre - 它在不同的文件中，所以没有嵌入到页面中。
@mcos - 好问题！我试图在一个需要在客户端生成 html 页面的任何动态方面（没有服务器端模板）的系统中排除许多 html 页面共有的标记。如果我有服务器端脚本，我可以将 html 部分直接生成到页面中。这可能就像泥巴一样清楚:)
嗯，好的...所以您需要将它与页面一起加载吗？这就是你不使用的原因，例如 $.get('another_page.html')?

标签： javascript jquery jquery-templates

【解决方案1】：

你必须使用“.html()”：

var contents = $('#frag').html();

我个人认为这很愚蠢，“.text()”应该可以工作，但我记录了一个关于这个问题的错误，jQuery 人员拒绝修复它。

另外，"type" 属性的值其实没什么大不了，但你肯定需要将它设置为 something，而不是（当然）实际的 JavaScript 类型。

【讨论】：

原生的innerText 或textContent 属性不起作用吗？
@Tomalak "innerText" 在 IE 中由于某种原因在 <script> 标签上不起作用。
.html() 似乎只在脚本标签内联时对我有用，而不是使用 src 属性指向内容。
啊...好吧，那完全是另外一回事了。在这种情况下，我只需使用“$.get()”或其他方式获取代码。

【解决方案2】：

或更全面：

$(document).ready(function(){

  $('#hdr').append($('#frag').html());

});

或者根本没有脚本标签...

    <div id='hdr'>
      //content
      <div id='hdr_add'></div>
    </div>
...

     $(document).ready(function(){
        $('#hdr_add').load('frag.html');
    });

.load() 是一个快捷的 AJAX 调用，它很贴心，只需将给定 URL 中的内容加载到给定元素中。

【讨论】：

可能是 .load 是简单的解决方案。我希望将它放在标签中可以确保它以某种方式“更早”下载，以减少“构建”页面的外观。但这纯粹是我的猜测。
嗯，好的。我试过了，我看不到使用 load 插入片段的视觉影响。这会教我推测。