如何在 HTML 中使用内联 JavaScript？答案

【问题标题】：How to use inline JavaScript in HTML?如何在 HTML 中使用内联 JavaScript？
【发布时间】：2011-08-13 22:27:06
【问题描述】：

支持我有这个隐藏字段：

<input type='hidden' id='handler' name='handler' value='5534882394' />

假设我通过 jQuery AJAX 从服务器获取 HTML 片段。

<div id='result'>
    <span></span>
</div>

但是，不要这样写：

$(function(){
   $('#result span').text($('#handler').val());
});

我想使用类似的东西：

<div id='result'>
    <span>javascript:$('#handler').val();</span>
</div>

但是，我没有得到预期的结果。我可以在 JavaScript 中使用这种方法吗？

更新：大家好，我知道$(document).ready();。所以，不要提供更好的方法。我只是想知道是否可以使用内联 JavaScript，如果可以，如何？

【问题讨论】：

如果您使用的是 Jquery，请不要使用内联。你有更好的方法。
你为什么要那样做？它有什么用途？

标签： javascript jquery html inline-code

【解决方案1】：

不，您不能在 Javascript 中使用这种方法。没有内联 Javascript 之类的东西。

您在<a href="javascript:alert(1)"> 之类的链接中看到的是javascript: 伪协议，其使用类似于http: 协议。当您将浏览器指向这样的 URL 时，浏览器就会运行该脚本。

如果你想在页面中运行一个脚本，你需要一个脚本标签。

【讨论】：

很好的答案@Guffa，你真的值得你的高分哥们。 :)
为什么投反对票？如果你不解释你认为错的地方是什么，它就无法改进答案。

【解决方案2】：

虽然<script> 标签有效并且可以让你做你想做的事，但我真的建议重新考虑你的设计。这不是您所说的“不显眼的 Javascript”。

为什么你更喜欢混合 HTML 和 JS？如果是出于好奇 - 好的，但如果这是为了将其转换为生产代码，那么您可能希望尽可能多地将两者分开。最终，您将获得更好的可维护性。

【讨论】：

【解决方案3】：

你可以做-

<input type="text" id="handler" value="yes"/>
<div id='result'>
    <span>
       <script>document.write($('#handler').val());</script>
    </span>
</div>

页面会在遇到脚本标签时运行 Javascript。您必须确保“#handler”元素已加载，否则脚本将失败。

一般来说，最好将诸如此类的脚本标签远离您的标记。

工作演示 - http://jsfiddle.net/ipr101/h6zXs/

【讨论】：

这不符合 OP 的要求。
该语句返回一个字符串值，但这并不意味着该字符串将被放入 SPAN 元素中。 SCRIPT 元素不会被其语句的返回值替换。

【解决方案4】：

你忘记the <script> tag了吗？

<div id="result"></div>
<script>$('#result').text($('#handler').val();</script>

【讨论】：

谢谢，但我说的是内联 JavaScript。您在a 元素的href 中使用的JavaScript：<a href='javascript:void(0);'></a>。这不需要<script> 标签。
那你想达到什么目的？
脚本标签是内嵌 JavaScript。也许您正在寻找更像api.jquery.com/jQuery.tmpl 的东西。

【解决方案5】：

几年前，我遇到了那个确切的问题：我使用 AJAX 来检索 HTML，而 HTML 嵌入了 Javascript。我从来没有找到比手动解析 HTML 以挖掘 Javascript 标记并在其内容上调用 eval 更好的解决方案。不可靠且不可靠，但这是我能找到的最好的。

【讨论】：