0

我在一个站点上进行了此操作,并且尝试重新创建它,但现在它无法正常工作...我希望通过 Javascript 替换内容来更改 div 中的内容而不加载。

这是HTML:

<li><a onclick="mish()">Click me</a></li>

<div id="about">
  <h2>Im a header.</h2>
  <p>And Im a paragraph!</p>
</div>

这是位于外部 .js 文件中的 JS:

function mish()
{
document.getElementById("about").innerHTML='<h2>Header am I.</h2>
<p>Paragraph am I and too.</p>';
}

它们与 html 头部的这一行相关联(我也在正文中尝试过):

<script type="text/javascript" src="script.js"></script>

同样,我从另一个站点复制了几乎所有的代码,这些代码仍然有效,所以我非常不知道为什么这个不工作。

编辑:这是头部:

<head>
    <title>Shaq</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    <script type="text/javascript" src="script.js"></script>
</head>

双重编辑:和整个身体:

<body>

<div class="crusty">

    <div class="content">

        <nav>   
            <ul>
                <li><a onclick="bout()">Click Me</a></li>
                <li><a onclick="mish()">Click Me</a></li>
            </ul>
        </nav>

        <div class="actual">

            <div id="about">
            <h2>Im a Header</h2>
            <p>And Im a Paragraph</p>
            </div>

        </div><!-- end actual -->

    </div><!-- end content-->

</div><!-- end crusty -->

</body>

并三重编辑以显示 .js 文件的确切内容:

function mish() {
    document.getElementById("about").innerHTML = '<h2>Header am I.</h2>'+ '<p>Paragraph am I and too.</p>';
}
4

2 回答 2

1

在 JavaScript 中编写多行字符串的常见做法如下。目前,您在字符串中有一个换行符(未转义),这在 JavaScript 中是不允许的。

function mish() {
    document.getElementById("about").innerHTML = [
        '<h2>Header am I.</h2>',
        '<p>Paragraph am I and too.</p>'].join('\n');
}

主要的收获是换行符可以像\n在 JavaScript 字符串中一样进行通信。

于 2013-07-18T02:16:08.170 回答
1

您发布了代码片段,但没有向我们展示完整的 HTML。尝试使用此代码,因为您应该这样做。

<html>
<head>
<script type="text/javascript">
   function mish() {
      document.getElementById("about").innerHTML = '<h2>Header am I.</h2><p>Paragraph am I and too.</p>';
    }
</script>
</head>
<body>
    <li><a onclick="javascript:mish();">Click me</a>
    </li>
    <div id="about">
         <h2>Im a header.</h2>    
         <p>And Im a paragraph!</p>
    </div>
</body>
</html>

这应该有效。检查你在做什么不同。

如果您使用 JS 的外部文件,请将以下代码复制到 JS 文件中:

   function mish() {
      document.getElementById("about").innerHTML = '<h2>Header am I.</h2><p>Paragraph am I and too.</p>';
    }

确保不要将其包裹在<Script></script>标签内。你不需要这个。然后将这个 JS 文件准确地保存在您的 HTML 文件所在的位置。

最后将其包含在您的头部部分中:

<script type="text/javascript" src="script.js"></script>

而且,这必须奏效。

于 2013-07-18T02:28:27.303 回答