如何在HTML中使用内联JavaScript？

Question

假设我有一个隐藏的字段：

<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，如果是，如何实现？

- Saeed Neamati

---

如果你正在使用JQuery，请不要使用内联代码，有更好的方式。 - Nishant

你为什么想要这样做？它有什么作用？ - FishBasketGordo

Answer 1

不，你不能使用那种方法来处理JavaScript。不存在内联JavaScript这样的东西。

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

如果要在页面中运行脚本，则需要使用脚本标记。

- Guffa

---

很棒的答案，@Guffa，你真的配得上高分，伙计。 :) - Saeed Neamati

为什么要点踩？如果你不解释哪里有问题，那么回答就无法得到改进。 - Guffa

Answer 2

您可以执行以下操作-

<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/

- ipr101

---

那不是 OP 想要的。 - Matt Ball

该语句返回一个字符串值，但这并不意味着该字符串将被放置在SPAN元素内。SCRIPT元素不会被其语句的返回值所替换。 - Šime Vidas

Answer 3

尽管<script>标签可用且可让您完成您想要做的事情，但我真的建议重新考虑您的设计。这并不是直接称为“非侵入式JavaScript”的东西。

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

- emboss

Answer 4

你是否忘记了 <script> 标签?

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

- Matt Ball

---

谢谢，但我说的是内联JavaScript。一个你可以在 a 元素的 href 中使用的 JavaScript: <a href='javascript:void(0);'></a>。 这不需要 <script> 标签。 - Saeed Neamati

那么你想要实现什么？ - Baz1nga

脚本标签是内联JavaScript。也许你正在寻找更像http://api.jquery.com/jQuery.tmpl/这样的东西。 - Matt Ball

Answer 5

几年前，我也遇到了同样的问题：我正在使用AJAX获取HTML，而该HTML中嵌入了Javascript。我从未能找到比手动解析HTML以挖出Javascript标签并调用eval更好的解决方法。这种方法虽然不太正规和不可靠，但它是我所能找到的最好的方法。

- Michael Lorton