suchen

Heim  >  Fragen und Antworten  >  Hauptteil

Verschlüsseln Sie HTML-Elemente, bevor der Browser versucht, sie darzustellen. Ist dies ein seltener gültiger Anwendungsfall für „document.write“?

Ich habe einen Kopfbereich auf meiner Webseite, der von einigen Hintergrundbildern durchzogen wird.

Sie haben eine etwas hohe Auflösung und befinden sich über dem Falz, daher möchte ich nicht, dass der Browser andere Bilder als das erste lädt.

Aber ich möchte auch die Reihenfolge der Bilder zufällig festlegen.

Das Problem ist, dass ich einen statischen Webhost (Netlify) verwende.

Einige Ansätze, die ich in Betracht gezogen habe:

Ich möchte etwas JS-Code ausführen, eine kurze Logik ausführen und dem Stream etwas Markup hinzufügen, bevor der Browser die gesamte HTML-Antwort sieht. Ich kann dann in

Ich finde, genau das macht document.write, nicht wahr?

Alle Quellen sagen, man solle es vermeiden wie die Pest document.write. Aber ich frage mich, ob dies ein seltener gültiger Anwendungsfall ist? 

<html>
  <body>
    <p>This seems to work, and I kind of think it's not a terrible idea.</p>
    <script type="application/javascript">
      // Standard Fisher-Yates shuffle; not relevant
      function shuffle(array) { let i = array.length, j; while (i != 0) { j = Math.floor(Math.random() * i); i--; [array[i], array[j]] = [array[j], array[i]]; } return array; }

      const paras = [
        "<p>para 1</p>",
        "<p>para 2</p>",
        "<p>para 3</p>",
        "<p>para 4</p>",
      ];
      shuffle(paras);
      document.write(paras.join(""));
    </script>
    <noscript>
      <p>para 1</p>
      <p>para 2</p>
      <p>para 3</p>
      <p>para 4</p>
    </noscript>
    <p>Change my mind.</p>
  </body>
</html>

Ist das eine schlechte Idee? Warum? Gibt es einen besseren Weg, meinen Wunsch zu verwirklichen?

P粉752290033P粉752290033323 Tage vor461

Antworte allen(1)Ich werde antworten

  • P粉349222772

    P粉3492227722024-01-11 16:07:11

    是的，这不是一个好主意。该方法非常古老，并且具有可能因浏览器而异的特定行为。请参阅 https://developer.mozilla.org/en- US/docs/Web/API/Document/write 了解更多信息。

    只需使用现代方法，例如：

    等等。随机排列元素，因为这些元素对于渲染器/浏览器来说是安全的。

    不过，针对您的特定用例的建议是：浏览器需要首先加载 JavaScript 才能使其按照您想要的方式工作，但这可能不会发生。图像可能仍在按照它们最初在 HTML 源中的顺序加载。如果可能的话，我建议将此逻辑移至服务器。 最终，任何 Javascript 都可能不适用于您的用例。可能可以不在文档本身中包含图像，然后通过 JS 添加它们（在随机加载时），这将是我的首选方法。

    Antwort
    0
  • StornierenAntwort