再谈javascript常见错误及解决方法


Posted in Javascript onSeptember 16, 2016

初学Javascript,每天总是被很小的问题折磨半天,今晚就有好几个小问题。

第一:全部使用双引号造成匹配错误

<input type="checkbox" onmouseover="document.getElementById("test").style.display="none":"/>

改行一直报错误:unexpected toke “}”  检查半天也没有发现错误,对照发现视频上是使用单引号

<input type="checkbox" onmouseover="document.getElementById('test').style.display="none":"/>

改成单引号后错误总算消除,困扰我一夜晚。。附上链接http://www.cnblogs.com/chinabc/archive/2010/11/19/1881947.html

第二:错误添加分号

<div id="test" class="test1" onmouseover="toYellow()" ;onmouseout="toRed()";>change</div>

多写了一个分号,导致分号后的代码不执行

第三:函数名后多写括号

<script> 
  function toYellow(){ 
    document.getElementById("test").className="test2"; 
    } 
  function toRed(){ 
     document.getElementById("test").className="test1"; 
    } 
  document.getElementById("test").onmouseover=toYellow(); 
  document.getElementById("test").onmouseout=toRed(); 
</script>

却掉 toYellow()和 toRed()后的括号后正常执行

第四:checkbox的checked属性修改

用三个按钮实现checkbox的全选、全部选、反选。

<!DOCTYPE html> 
<html> 
  <head> 
    <meta charset="UTF-8"> 
    <title></title> 
  </head> 
  <body> 
    <button id="btn">全选</button> 
    <button id="nobtn">全不选</button> 
    <button id="inverse">反选</button><br /> 
    <input type="checkbox" /> 
    <input type="checkbox" /> 
    <input type="checkbox" /> 
    <input type="checkbox" /> 
    <input type="checkbox" /> 
    <input type="checkbox" /> 
    <input type="checkbox" /> 
    <script> 
      var btn=document.getElementById("btn"); 
      var input=document.getElementsByTagName("input"); 
      btn.onclick=function(){ 
        for(var i=0;i<input.length;i++){ 
          input[i].checked="checked"; 
        } 
      } 
      var nobtn=document.getElementById("nobtn"); 
      nobtn.onclick=function(){ 
        for(var i=0;i<input.length;i++){ 
          input[i].checked=false; 
        } 
      } 
      var inverse=document.getElementById("inverse"); 
      inverse.onclick=function(){ 
        for(var i=0;i<input.length;i++){ 
          if(input[i].checked==false){ 
            input[i].checked=true; 
          }else{ 
            input[i].checked=false; 
          } 
        } 
      } 
    </script> 
  </body> 
</html>

以上这篇再谈javascript常见错误及解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery+jqmodal弹出窗口实现代码分明
Jun 14 Javascript
EASYUI TREEGRID异步加载数据实现方法
Aug 22 Javascript
js自动下载文件到本地的实现代码
Apr 28 Javascript
JS操作数据库的实例代码
Oct 17 Javascript
JavaScript cookie的设置获取删除详解
Feb 11 Javascript
标题过长使用javascript按字节截取字符串
Apr 24 Javascript
Bootstrap3 多个模态对话框无法显示的解决方案
Feb 23 Javascript
JavaScript创建对象的七种方式全面总结
Aug 21 Javascript
vue+element搭建后台小总结 el-dropdown下拉功能
Apr 10 Javascript
基于JavaScript获取base64图片大小
Oct 18 Javascript
Vue data的数据响应式到底是如何实现的
Feb 11 Javascript
简单了解JavaScript弹窗实现代码
May 07 Javascript
使用JQuery中的trim()方法去掉前后空格
Sep 16 #Javascript
浅谈jQuery效果函数
Sep 16 #Javascript
jQuery插件easyUI实现通过JS显示Dialog的方法
Sep 16 #Javascript
jQuery实现的右下角广告窗体跟随效果示例
Sep 16 #Javascript
jQuery实现磁力图片跟随效果完整示例
Sep 16 #Javascript
jQuery使用animate实现ul列表项相互飘动效果示例
Sep 16 #Javascript
jQuery中fadein与fadeout方法用法示例
Sep 16 #Javascript
You might like
用session做客户验证时的注意事项
2006/10/09 PHP
微信公众平台开发之配置与请求
2015/08/26 PHP
Yii中实现处理前后台登录的新方法
2015/12/28 PHP
PHP通过文件保存和更新信息的方法分析
2019/09/12 PHP
javascript结合ajax读取txt文件内容
2014/12/05 Javascript
举例说明JavaScript中的实例对象与原型对象
2016/03/11 Javascript
JavaScript 对象字面量讲解
2016/06/06 Javascript
基于JS代码实现图片在页面中旋转效果
2016/06/16 Javascript
一个炫酷的Bootstrap导航菜单
2016/12/28 Javascript
用js制作淘宝放大镜效果
2020/10/28 Javascript
Angular4绑定html内容出现警告的处理方法
2017/11/03 Javascript
浅谈JsonObject中的key-value数据解析排序问题
2017/12/06 Javascript
vue-router 源码之实现一个简单的 vue-router
2018/07/02 Javascript
vue2.0 路由模式mode=&quot;history&quot;的作用
2018/10/18 Javascript
angular4自定义组件非input元素实现ngModel双向数据绑定的方法
2018/12/28 Javascript
微信小程序实现收货地址左滑删除
2020/11/18 Javascript
浅谈JavaScript中你可能不知道URL构造函数的属性
2020/07/13 Javascript
[49:08]FNATIC vs Infamous 2019国际邀请赛小组赛 BO2 第二场 8.16
2019/08/18 DOTA
在 Django/Flask 开发服务器上使用 HTTPS
2014/07/03 Python
python 用lambda函数替换for循环的方法
2018/06/09 Python
python2.7使用plotly绘制本地散点图和折线图
2019/04/02 Python
利用Python进行图像的加法,图像混合(附代码)
2019/07/14 Python
使用python模拟命令行终端的示例
2019/08/13 Python
python urllib爬虫模块使用解析
2019/09/05 Python
python多线程爬取西刺代理的示例代码
2021/01/30 Python
详解基于canvas的视频遮罩插件
2018/01/04 HTML / CSS
Hotels.com香港酒店网:你的自由行酒店订房专家
2018/01/22 全球购物
Baracuta官方网站:Harrington夹克,G9,G4,G10等
2018/03/06 全球购物
拉飞逸官网:Lafayette 148 New York
2020/07/15 全球购物
倡议书格式
2014/08/30 职场文书
专题民主生活会对照检查材料思想汇报
2014/09/29 职场文书
教师个人考察材料
2014/12/16 职场文书
北京英语导游词
2015/02/12 职场文书
2015年乡镇信访工作总结
2015/04/07 职场文书
校园开放日新闻稿
2015/07/17 职场文书
Golang连接并操作MySQL
2022/04/14 MySQL