【问题标题】:Document ready error文档就绪错误
【发布时间】:2013-04-18 02:54:47
【问题描述】:

我正在尝试运行此代码,但它破坏了我的整个页面。页面标记如下:

<script type="text/javascript">
$(document).ready(function() {
  $("#right_column h1").each( function() {  
   var link = $(this).html()+"<br />";
   document.write(link); 
});
});
</script>
<div id="right_column">
<h1>Company Profile</h1>
blablablablabla<br />

<h1>Nulla turpis nunc, dapibus ultricies.</h1>
blablablabla<br />
<h1>Pellentesque habitant morbi tristique proin laoreet.</h1>
blablablabla<br />

当我尝试运行代码时,它只显示 3 个 h1 的内容,页面的其余部分(h1 本身)不再加载。当我删除 $(document).ready() 函数并将脚本块放在所有内容之后,它就可以正常工作了。

【问题讨论】:

标签: jquery document ready


【解决方案1】:

阅读文档后不要使用document.write

如果要附加到页面,请执行以下操作:

  $(document).ready(function() {
     $("#right_column h1").each( function() {  
       var link = $(this).html()+"<br />";
       $(document.body).append($(link));   
     });
   });

【讨论】:

  • 把它改成这个工作-> $(document).ready(function() { $("#right_column h1").each( function() { var link = $(this).html ()+"
    "; $("#location_where_i_wanted_them_to_show").append(link); }); }); $(link) 应该只是链接
【解决方案2】:

我会使用这样的东西:

<script type="text/javascript">
$(document).ready(function() {
  $("#right_column h1").each( function() {  
   var link = $(this).html()+"<br />";
   $("#container-element").html('<a href="' + link + '">TEXT-YOU-WANT</a>');
});
});
</script>

【讨论】: