看看我这个函数为啥没反应？

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>IFE JavaScript Task 01</title>
  </head>
<body>

  <label>请输入北京今天空气质量：<input id="aqi-input" type="text"></label>
  <button id="button" onclick=span_click() >确认填写</button> 

  <div>您输入的值是：<span id="aqi-display">尚无录入</span></div>
  
<script type="text/javascript">

(function(){
  /*    
  在注释下方写下代码
  给按钮button绑定一个点击事件
  在事件处理函数中
  获取aqi-input输入的值，并显示在aqi-display中
  */
      function span_click(){
        var content=document.getElementById("aqi-input").value;
        docement.getElementById("aqi-display").innerHTML=content;
      }
  };   

})();

</script>
</body>

因为你使用了自执行函数，span_click函数的作用域被限制了。所以在全局作用域(window)下访问不到span_click函数，你把script标签中内容换成如下：

function span_click(){
  var content=document.getElementById("aqi-input").value;
  document.getElementById("aqi-display").innerHTML=content;
}

1.多了个大括号的关闭。
2.是document，不是docement。
3.函数作用域，将其暴露到全局里。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>IFE JavaScript Task 01</title>
  </head>
<body>

  <label>请输入北京今天空气质量：<input id="aqi-input" type="text"></label>
  <button id="button" onclick="spanClick()">确认填写</button> 

  <div>您输入的值是：<span id="aqi-display">尚无录入</span></div>
  
<script type="text/javascript">

(function(document){
  /*    
  在注释下方写下代码
  给按钮button绑定一个点击事件
  在事件处理函数中
  获取aqi-input输入的值，并显示在aqi-display中
  */
      var spanClick = window.spanClick = function () {
          var content = document.getElementById("aqi-input").value,
              innerTarget = document.getElementById("aqi-display");
          innerTarget.innerHTML = content;
      }
  };   

})(document);

</script>
</body>

这样？
（不过还是感觉怪怪的……为什么要在一个匿名函数里写具名函数……直接挂到click事件上写匿名回调不就得了……）

你这样找不到函数声明，建议还是手动绑定函数吧
document.getElementById("button").onclick=span_click;

(function(){
      span_click = function (){
        var content=document.getElementById("aqi-input").value;
        docement.getElementById("aqi-display").innerHTML=content;
      }
})();

修改了一下，感觉比较多余，简单的做法就像楼上那样：


 function span_click(){
       var content=document.getElementById("aqi-input").value;
       docement.getElementById("aqi-display").innerHTML=content;
}

span_click=(function(){
    function span_click(){
        var content=document.getElementById("aqi-input").value;
        document.getElementById("aqi-display").innerHTML=content;
    }  
  return span_click;
})();

这样，虽然感觉没啥意义

【热门文章】