再谈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 相关文章推荐
Javascript实例教程(19) 使用HoTMetal(6)
Dec 23 Javascript
JQuery Tips(3) 关于$()包装集内元素的改变
Dec 14 Javascript
jQuery对象和DOM对象使用说明
Jun 25 Javascript
JS如何将数字类型转化为没3个一个逗号的金钱格式
Jan 27 Javascript
原生JS:Date对象全面解析
Sep 06 Javascript
Javascript单例模式的介绍和实例
Oct 08 Javascript
详解微信小程序——自定义圆形进度条
Dec 29 Javascript
JS同步、异步、延迟加载的方法
May 05 Javascript
Bootstrap导航菜单点击后无法自动添加active的处理方法
Aug 10 Javascript
关于js陀螺仪的理解分析
Apr 11 Javascript
Antd下拉选择,自动匹配功能的实现
Oct 24 Javascript
Node.js path模块,获取文件后缀名操作
Nov 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
PHP动态图像的创建
2006/10/09 PHP
php安全开发 添加随机字符串验证,防止伪造跨站请求
2013/02/14 PHP
基于ThinkPHP5.0实现图片上传插件
2017/09/25 PHP
ExtJs之带图片的下拉列表框插件
2010/03/04 Javascript
JavaScript内核之基本概念
2011/10/21 Javascript
整理8个很棒的 jQuery 倒计时插件和教程
2011/12/12 Javascript
jquery中插件实现自动添加用户的具体代码
2013/11/15 Javascript
JQuery勾选指定name的复选框集合并显示的方法
2015/05/18 Javascript
JS组件系列之Bootstrap table表格组件神器【二、父子表和行列调序】
2016/05/10 Javascript
通过jquery-ui中的sortable来实现拖拽排序的简单实例
2016/05/24 Javascript
JS实现太极旋转思路分析
2016/12/09 Javascript
BootStrap学习系列之布局组件(下拉,按钮组[toolbar],上拉)
2017/01/03 Javascript
SpringMVC简单整合Angular2的示例
2017/07/31 Javascript
JS获取子、父、兄节点方法小结
2017/08/14 Javascript
react-native-fs实现文件下载、文本存储的示例代码
2017/09/22 Javascript
动态Axios的配置步骤详解
2018/01/12 Javascript
jquery多级树形下拉菜单的实例代码
2019/07/09 jQuery
浅析Vue中拆分视图层代码的5点建议
2019/08/15 Javascript
Node如何后台数据库使用增删改查功能
2019/11/21 Javascript
Javascript模拟实现new原理解析
2020/03/03 Javascript
js实现类选择器和name属性选择器的示例步骤
2021/02/07 Javascript
[01:11]辉夜杯战队访谈宣传片—CDEC.Y
2015/12/26 DOTA
Python中encode()方法的使用简介
2015/05/18 Python
Python中使用插入排序算法的简单分析与代码示例
2016/05/04 Python
深入解析Python中的上下文管理器
2016/06/28 Python
使用django-guardian实现django-admin的行级权限控制的方法
2018/10/30 Python
Pandas时间序列:时期(period)及其算术运算详解
2020/02/25 Python
HTML5 device access 设备访问详解
2018/05/24 HTML / CSS
Sunglasses Shop丹麦:欧洲第一的太阳镜在线销售网站
2017/10/22 全球购物
Desigual英国官网:在线购买原创服装
2018/03/09 全球购物
2014年上半年工作自我评价
2014/01/18 职场文书
住院医师规范化培训实施方案
2014/06/12 职场文书
讲文明懂礼貌演讲稿
2014/09/11 职场文书
Python实现智慧校园自动评教全新版
2021/06/18 Python
MongoDB日志切割的三种方式总结
2021/09/15 MongoDB
以下牛机,你有几个
2022/04/05 无线电