时间戳

首页 > 解决方案 > Wordpress：如何在 html 正文中使用 javascript 变量

javascript - Wordpress：如何在 html 正文中使用 javascript 变量

问题描述

我真的是 Wordpress、Javascript 和 HTML 的新手，所以我知道这个问题非常基础，但我无法在任何地方找到它的解决方案。

我想在 javascript 中创建一些变量，然后将它们显示在我在 Wordpress 中创建的页面中。

阅读其他帖子我发现我需要插入一个 javascript 代码，最后以这种方式存储我的变量（虚拟版本）：

<script type="javascript"> 
     document.getElementById('test').innerHTML = 'hello';
</script>

然后在我想显示要显示的变量的文本块上，我应该添加以下代码：

<body>
    <p id="test"></p>
</body>

但是，我尝试在标头（Tatsu 标头）中添加 javascript，并尝试以不同的组合将其添加到文本块（HTML 版本）中，但它从未奏效。尝试在script块之前和之后添加body块，并尝试在显示行之前和之后将它放在里面。

如果我尝试以下方法，它会起作用：

<body>
    <p>hello</p>
</body>

所以我想我的问题是我没有正确设置变量。

任何人都可以帮忙吗？抱歉，如果这已经在某个地方解决了，花了几个小时却找不到它。

先感谢您。

标签： javascripthtmlwordpress

解决方案

您的问题是您在此处使用的类型：

<script type="javascript">

我在构建此问题的示例时注意到了这一点。

javascript不是正确的 mime 类型。

它应该text/javascript按照https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types

请注意，这不是一个完整的列表。比如application/javascript也是有效的。另请参阅https://www.iana.org/assignments/media-types/media-types.xhtml

工作示例：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
</head>
<body>
    <p id="test">
      This shouldn't show up
    </p>
    <script type="text/javascript"> 
         console.log("####### JAVASCRIPT IS RUNNING ######")
         document.getElementById('test').innerHTML = 'hello';
    </script>
</body>
</html>

推荐阅读