在标题标签而不是正文标签中反应js捆绑文件

如何解决在标题标签而不是正文标签中反应js捆绑文件

<apex:page standardStylesheets="false" sidebar="false"
       showHeader="false" applyBodyTag="true" applyHtmlTag="false"
       docType="html-5.0" >
<html lang="en">
    <head>
        <Meta charset="UTF-8"/>
        <Meta name="viewport" content="width=device-width,initial-scale=1.0"/>
        <title>React in VF</title>
        <apex:stylesheet value="{!$Resource.style}"/>   
    </head>
    <body>
        <div id="root"></div>
    <apex:includeScript value="{!$Resource.reactchunckbundle1}"/>
    <apex:includeScript value="{!$Resource.reactchunckbundle2}"/>
    <apex:includeScript value="{!$Resource.reactchunckbundle3}"/>  
    </body>
    
</html> </apex:page>

source image

因为它正在标题标签上显示，所以我的脚本无法找到document.getElementById('root')

解决方法

修复loadOnReady属性

loadOnReady属性具有两个值，即false和true。默认此属性的值为false。如果此属性的值为false 然后立即加载脚本。如果此属性的值为true，则页面准备就绪后，脚本将加载。

示例：

<apex:includeScript value="{!$Resource.reactchunckbundle1}" loadOnReady="true"/>