html页面上的两个javascript代码';行不通

html页面上的两个javascript代码';行不通,javascript,html,Javascript,Html,我写了两个函数,第一个函数必须用id“hope”扩展文章 第二种方法应该会使斑点鱼的图像消失,但它不起作用,我不知道为什么。我希望你能帮助我 <!doctype html> <html> <head> <style> .hidden {display:none;} </style> </head> <body> <p id="hope">My hope for

我写了两个函数,第一个函数必须用id“hope”扩展文章 第二种方法应该会使斑点鱼的图像消失,但它不起作用,我不知道为什么。我希望你能帮助我

<!doctype html>
<html>
  <head>
    <style>
      .hidden {display:none;}
    </style>
 </head>
 <body>
   <p id="hope">My hope for you this year is that you will become a good                 problem solver.  
   <a href="javascript:void(0);" onClick="expandArt();">Click</a>
  </p>
 <img src="my_image/blobfish.jpg" id="ugly" onClick="makeInvisible();">
   <script type="text/javascript">
     function expandArt() {
      var expand = "My hope for you this year is that you will become a good  problem solver. Everyone will learn that they can figure out some tough answers  even when they feel stumped and frustrated in math, or reading, or at recess. Instead of giving up, you will say in your own mind, I can figure this out! I can do this.That's my hope for you.";
      document.getElementById("hope").innerHTML = expand;
}

  function makeInvisible() {
      document.getElementById("ugly").className = "hidden"; 
}

  </script>
 </body>
</html>

.hidden{显示:无;}

今年我对你的希望是,你将成为一名优秀的问题解决者。

函数expandArt(){ var expand=“我希望你今年能成为一名出色的问题解决者。每个人都会学到,即使在数学、阅读或课间休息时感到困惑和沮丧,他们也能找到一些棘手的答案。你不会放弃,而是会在心里说,我能解决这个问题!我能做到。这是我对你的希望。”; document.getElementById(“hope”).innerHTML=expand; } 函数makeInvisible(){ document.getElementById(“丑陋”).className=“隐藏”; }
我已经为上面的设置编写了一个工作示例,但它使用了一种不引人注目的javascript方法。(即,所有脚本都保留在
标记之间,并与其余标记分离,而不是分散在
html
中)

函数expandArticle(){
var expandedText='我希望你今年能成为一名出色的问题解决者。每个人都会学到,即使在数学、阅读或课间休息时感到困惑和沮丧,他们也能找到一些棘手的答案。你不会放弃,你会在心里说,我能解决这个问题!我能做到。这就是我对你的希望u、 ",;
this.parentNode.innerHTML=expandedText;
}
函数makeInvisible(){
this.classList.add('hidden');
}
var hope=document.getElementsByClassName('hope')[0];
var hopeAnchor=hope.getElementsByTagName('a')[0];
hopeAnchor.addEventListener('click',expandArticle,false);
var ught=document.getElementsByClassName('ught')[0];
丑陋的.addEventListener('click',make隐身,false)
。隐藏{
显示:无;
}
.希望{
字体大小:粗体;
文字装饰:下划线;
光标:指针;
}

今年我希望你能成为一名优秀的问题解决者。 点击


它应该是
onclick
(全部小写)。@pzp-HTML属性名称不区分大小写。