问答详情
源自:4-1 编程挑战

完全没有反应,请帮我看看哪里出现问题了?

<!DOCTYPE HTML>
<html><head>
<meta http-equiv="Content-Type" Content="text/html; charset=utf-8" />
<title>javascript</title>
<style type="text/css">
body{font-size:12px;}
#txt{    height:400px;    
         width:600px;	
         border:#333 
         solid 1px;	
         padding:5px;}
   p{	line-height:18px;	
        text-indent:2em;}
</style>
</head>
<body>  
<h2 id="con">JavaScript课程</H2>  
<div id="txt">      
<h5>JavaScript为网页添加动态效果并实现与用户交互的功能。</h5>        
<p>1. JavaScript入门篇,让不懂JS的你,快速了解JS。</p>        
<p>2. JavaScript进阶篇,让你掌握JS的基础语法、函数、数组、事件、内置对象、BOM浏览器、DOM操作。</p>        
<p>3. 学完以上两门基础课后,在深入学习JavaScript的变量作用域、事件、对象、运动、cookie、正则表达式、ajax等课程。</p> 
</div>  <form>  <!--当点击相应按钮,执行相应操作,为按钮添加相应事件-->    
<input type="button" value="改变颜色" onClick="changecolor()">      
<input type="button" value="改变宽高" onClick="changewidth()">    
<input type="button" value="隐藏内容" onClick="hidetext()">    
<input type="button" value="显示内容" onClick="showtext()">    
<input type="button" value="取消设置" onClick="cancelset()">  
</form>  <script type="text/javascript">
//定义"改变颜色"的函数
var obj=document.getElementById("txt");
function changecolor(){obj.style.color="red";obj.style.backgroundcolor="gray";}
//定义"改变宽高"的函数
function changewidth(){obj.style.width="600";obj.style.height="800";}
//定义"隐藏内容"的函数
function hidetext(){obj.style.display="none";}
//定义"显示内容"的函数
function showtext(){obj.style.display="block";}
//定义"取消设置"的函数
function cancelset(){var cancel=confirm("是否取消设置?");    
if(cancel==true){obj.removeAttribute("style");}}  
</script>
</body>
</html>

请问哪里出现问题了,完全无法运行?

提问者:佐黎 2020-09-20 18:07

个回答

  • qq_慕斯7200802
    2020-11-17 11:18:49

    会不会是没有定义对象呀,直接用obj不行,先定义一个对象

  • 慕函数9046704
    2020-09-26 21:09:58

    第一段代码有的 分号 是中文的

  • 佐黎
    2020-09-20 18:40:12

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" Content="text/html; charset=utf-8" />
    <title>javascript</title>
    <style type="text/css">body{font-size:12px;}
    #txt{    
    height:400px;    
    width:600px;	
    border:#333 
    solid 1px;	
    padding:5px;}
    p{	
    line-height:18px;	
    text-indent:2em;}
    </style>
    </head>
    <body>  
    <h2 id="con">JavaScript课程</H2>  
    <div id="txt">      
    <h5>JavaScript为网页添加动态效果并实现与用户交互的功能。</h5>        
    <p>1. JavaScript入门篇,让不懂JS的你,快速了解JS。</p>        
    <p>2. JavaScript进阶篇,让你掌握JS的基础语法、函数、数组、事件、内置对象、BOM浏览器、DOM操作。</p>        
    <p>3. 学完以上两门基础课后,在深入学习JavaScript的变量作用域、事件、对象、运动、cookie、正则表达式、ajax等课程。</p>  
    </div>  <form>  <!--当点击相应按钮,执行相应操作,为按钮添加相应事件-->    
    <input type="button" value="改变颜色" onClick="changecolor()">      
    <input type="button" value="改变宽高" onClick="changeWH()">    
    <input type="button" value="隐藏内容" onClick="hidetext()">    
    <input type="button" value="显示内容" onClick="showtext()">    
    <input type="button" value="取消设置" onClick="cancelsetting()"> 
    </form>  <script type="text/javascript">
    //定义"改变颜色"的函数
    var obj=document.getElementById("txt");
    function changecolor(){obj.style.color="red"; obj.style.backgroundColor="grey";}
    //定义"改变宽高"的函数
    function changeWH(){obj.style.width="20px"; obj.style.height="500px";}
    //定义"隐藏内容"的函数
    function hidetext(){obj.style.display="none";}
    //定义"显示内容"的函数
    function showtext(){obj.style.display="block";}
    //定义"取消设置"的函数
    function cancelsetting()
    {   
    var m=confirm("是否取消设置");   
    if(m==true)
    {obj.removeAttribute('style')}
    }  
    </script>
    </body>
    </html>

    这个就可以。