为什么我的 HTML 代码在 Javascript 代码之前运行 [重复]答案

【问题标题】：Why my HTML code runs before Javascript code [duplicate]为什么我的 HTML 代码在 Javascript 代码之前运行 [重复]
【发布时间】：2018-03-01 02:39:42
【问题描述】：

我有多个帖子要在单个页面中显示。我的 Java 代码动态生成 html，并为每个 div 分配一个数字。

<div onclick=\"postClicked(" + i + ");\" style=\"cursor: pointer;\">

当我点击一个 div 时，我想转到 ReadPost.xhtml 页面并显示有关点击的帖子的详细信息。

function postClicked(id) {  
  localStorage.setItem( 'objectToPass', id );
  location.href = 'ReadPost.xhtml';
}

在 ReadPost 页面中，我有以下代码：

<h:inputHidden id="postInput" value="#{postManager.clickedPostId};"/> 
 <script>                    
   var myData = localStorage['objectToPass'];
   document.getElementById("postInput").value = myData;
 </script>          

<h:outputText value="#{postManager.displaySinglePost()}" escape="false" />

我想用localStorage中的数据设置隐藏输入值。这样，当 displaySinglePost() 方法运行时 clickedPostId 已经更新，我可以显示具有正确帖子 ID 的页面。但是， postManager.displaySinglePost() 在脚本之前运行。如何在 postManager.displaySinglePost() 方法被调用之前让脚本运行？

【问题讨论】：

这是Java，这是JavaScript。他们不一样
我知道区别。基本上，生成 html 代码的 Java 代码在我的脚本之前运行。我的问题是是否有办法让 javascript 代码更早地运行。
如果你的java代码生成的html是javascript的容器，那么javascript如何在html或java之前运行？

标签： javascript html jsf

【解决方案1】：

您可能在 dom 中的按钮之前注入了 javascript。为了克服这个问题，将您的 javascript 包装在一个事件中以确保您的 dom 已加载：

document.addEventListener("DOMContentLoaded", function(event) { 
Your javascript goes here
 });

【讨论】：