是否可以在 DOM-ready 事件之前读取 HTML 正文？

Question

我需要尽快读取 HTML 正文内容（作为 DOM 或作为原始字符串）以优化其他脚本的某些加载（如果内容是 X，则加载脚本 A，或 B如果内容是 Y)。是否可以避免等待所有 sync 脚本加载（这是 DOM 就绪的条件）以读取正文？

注意：不能将脚本更改为 async。

更新：我不控制服务器，所以无法在那里进行优化。

Answer 1

也许通过订阅来查看状态变化。每个的内联 cmets。

// self envoking
(function() {
  console.log("self envoking in script");
}());
console.log(document.readyState); // logs "loading" first
window.onload = function() {
  console.log('onload'); // I fire later
}
document.addEventListener("DOMContentLoaded", function() {
  console.log('DOMContentLoaded');
});
document.addEventListener('readystatechange', function() {
  if (document.readyState == "loading") {
    //document is loading, does not fire here since no change from "loading" to "loading"
  }
  if (document.readyState == "interactive") {
    //document fully read. fires before DOMContentLoaded
  }
  if (document.readyState == "complete") {
    //document fully read and all resources (like images) loaded. fires after DOMContentLoaded
  }
  console.log(document.readyState)
});

<script id="myscript">
  // self envoking
  (function() {
    console.log("self envoking with id");
    window.customevent = new Event('customload');

    // Listen for the event.
    document.addEventListener('customload', function(e) {
      console.log("customload fired");  
    }, false);
    // another way
    var scriptNode = document.createElement('script');
    scriptNode.innerHTML = 'console.log("happy happy day inject");';
    document.head.appendChild(scriptNode);
  }());
</script>
<script id="another">
  var thisScriptElement = document.getElementById("another");
  // self envoking
  (function() {
    console.log("Another self envoking with id");
    // Dispatch the event.
    document.dispatchEvent(customevent);
  }());
</script>