hello，各位亲，为什么我的在这边鞥运行，但在subline上运行不了呢？

 function Color()
  {
    var con=document.getElementById("con");
    con.style.color="red";
  }
  function Width()
  {
    var con=document.getElementById("con");
    con.style.width="400px";
    con.style.height="250px";
  }
  function hidetext()
  {
    var con=document.getElementById("con");
    con.style.display="none";
  }
  function showtext()
 {
    var con=document.getElementById("con");
    con.style.display="block";
  }

  function Cancel()
  {
    var con=document.getElementById("con");
    var ifcancel=confirm("do you really want to cancel?")
    if (ifcancel==true)
      {
        var con=document.getElementById("con");
        con.removeAttribute("style");
      }
 
  }  
 html中是这样写的，一直提示color没定义

<h2>javascript 改变颜色等</h2>
<div id="con">
  <h2>JavaScript为网页添加动态效果并实现与用户交互的功能。 </h2>
  <p id="p">1. JavaScript入门篇，让不懂JS的你，快速了解JS。</p>
  <p id="p">2. JavaScript进阶篇，让你掌握JS的基础语法、函数、数组、事件、内置对象、BOM浏览器、DOM操作。</p>
  <p id="p">3.学完以上两门基础课后，在深入学习JavaScript的变量作用域、事件、对象、运动、cookie、正则表达式、ajax等课程。</p>
</div>
<form>
  <input type="button" value="改变颜色" onclick="Color()"/>
  <input type="button" value="改变尺寸" onclick="Width()"/>
  <input type="button" value="设置隐藏" onclick="hidetext()"/>
  <input type="button" value="设置显示" onclick="showtext()"/>
  <input type="button" value="取消设置" onclick="Cancel()"/>
</form>