javascript - 使用javascript输出html

Question

我有一个引用另一个 .js 文件的 javascript 链接。我一直在尝试输出图像(用于测试目的)，但我不确定执行此操作的正确方法是什么。

    alert("beginning");
    //var link = $("<a href='http://juixe.com'>Hello, <b>World</b>!</a>");
    //$('body').append(link);
    //document.write("hi");
    //document.write("<div><img src='http://s3-media2.ak.yelpcdn.com/bphoto/xqC6Iy5mOLb_8mwMKGv8_w/l.jpg' /></div>");
    alert("before function");
(function(){



    alert("middle");
    var links = $("<a href='http://juixe.com'>Hello, <b>World</b>!</a>");
    $('body').append(links);
    alert("after middle");
    //alert($("img").attr("id"));
    document.write("hi");
    document.write("<div><img src='http://s3-media2.ak.yelpcdn.com/bphoto/xqC6Iy5mOLb_8mwMKGv8_w/l.jpg' /></div>");

    alert("end");
}());

从开始到中间，我都能保持警惕。似乎 var links 不起作用。我正在尝试在此 .js 文件中使用 HTML。本质上，我希望能够做一些模态窗口，但我现在正在尝试输出图像以进行测试。

此外，这是 jquery 的正确方法吗？

提前致谢!

Answer 1

您的代码是一个奇怪的组合。 Jquery 代码几乎总是需要在页面加载后运行，而 document.write 永远不能在页面加载后使用。

您错误地将 jQuery 包装在立即执行的函数中。 jQuery 的正确包装在 :

$(document).ready(function(){
  /* html of page exists now, run jQuery here */
});// notice no extra "()" after close brace as you have

或者做同样事情的速记版本:

$(function(){
  /*html of page exists now, run jQuery here */
});// notice no extra "()" after close brace  as you have

如果您将所有 document.write 更改为 $('body').append(/* your content*/) 并将所有代码放在在 wrapper 之上，您将获得更大的成功。

jQuery 文档和 API 中包含丰富的信息。可以在此处找到关于我展示的包装的更多详细信息的良好起点:http://docs.jquery.com/How_jQuery_Works