javascript笔记.doc_第1页
javascript笔记.doc_第2页
javascript笔记.doc_第3页
javascript笔记.doc_第4页
javascript笔记.doc_第5页
已阅读5页,还剩48页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

Javascript是区分大小写的。Javascript中undefined是值未定义。弱类型的时候并不会报错误,而是输出NaN。Alert(true&b);返回的是b,要是true改成了false后返回的是false,所以应该是返回的是最后一个判断的值,当是false的时候后面的就不用判断了。第一个输出的是空,什么也没有,第二个是输出的是Hello,这说明当Alert(!”)的时候,此时输出的是false。字符串装换成数字此时是空字符串转换成数字,是0。乘号就是转换成数字。这样输出的是number。如果2改成了字符串就输出的是String。此时输出的是number。把字符串转换成了数值型了。两个!是可以把一种类型是转换成了布尔型。此函数弹出一个对话框,然后让用户输入一个值。并且输入的内容会作为字符串放。此时要转换成一个数字的话就是用刚才的方法。此时输出a的时候就是数字了,弹出的是number了。NaN和自身不相等,此时输出的是false。因为NaN并不是一个值,不能这样判断和自身相不相等。也可以设置日期判断一个人输入的年份是不是对的Var b=new Array(0,2,3);直接开始就初始化数组.Var b=new Array();定义数组。此中定义数组的方法也可以这样写 var b=; 更简单push也可以添加多个值计算开始时间和结束时间的相差的时间上面有两种方法,第一种使用的时间相对长一些,第二种方法好一些。Join方法是用空字符串连接ABC。输出的结果都是一样的。当遇到大量的字符串的时候最好使用join方法来连接。定义一个对象Var obj=new Object();O=”CJ”; obj.age=16; 声明对象的属性Alert(); alert(obj.age);name也可以加上引号。一般都使用图片这样的方式来声明一个对象。加了引号后,引号里面的可以是对象变量不允许的字符串等。这里对象也是可以像数组那样访问的,如下面的那张图片。也可以直接点name访问,相当于有两种方式访问。Object比Array少一些功能,少length属性和push方法和join方法。forin循环,此时输出i时时一次输出name,age,weight的名称,要想输出值此时输出了值。在ie下面获取字符串的最后一个字符应该这样写而在火狐下面直接写上s.s.length-1。String类的方法此时是把,W改成了#w号,但是如果直接输出s的话还是没有变化,因为replace是不会动原来的字符串的对象的,只是返回一个新的字符串。Join和split方法的使用此时输出的还是A。此时是每隔1000毫秒弹出一个对话框。第一个引号也可以写成函数名。此函数不用写上括号。直接写函数的名字就行了。要把一个字符串变成数组也可以用split方法。如 var s=”电风扇”.split(“”);此时输出的s是以逗号分隔的。其实也可以使用charAt的方法提取字符。标题的滚动的实例var s=滚动的字符串.split();function func()s.push(s0);s.shift();document.title=s.join();setInterval(func,1000);此时鼠标移到图片上的时候可以变成另外一张图片。此时btn的value值变成了按钮,javascript代码要写在定义按钮的后面,要不然不能获取id的值。对于onmouseover和onclick这些要是不写在html中的话就要绑定一个函数,具体是这样做的。 等号后面的a是不要加括号的,但是要是在html中onclick=”函数名()”,也是调用函数,这里的函数名是要加括号的。鼠标的事件属性:使用onload方法可以一开始就看到body体里面的代码。此时onload方法还是放在head体里面的,但是要是在得到一个body体里面的id号的话此时得到的就是null值。所以用onload方法此时在声明方法的时候来获取id。如利用onload的方法来得到id后再来处理html的标签,可以看到上面的代码知道函数里面是可以嵌套函数的。当然此时over和out函数都可以放在外面,此时运行也是对的,innerHTML这个属性可以做很多事情,现在在body体中有这样一个代码html的练习此时运行后就变成了script,也设置了颜色。在body体里面写上在head体里面写上var obj=document.getElementById(“header”);此时写上alert(obj.className);此时输出的是hide1。输出了class的名字。Obj.onmouseover=over;Obj.onmouseout=out;Function over()This.className=”hide2”; /注意这里要打引号Function outThis.className=”hide3”;然后再定义一个css样式 .hide1 Color:red; .hide2color:blue; .hide3color:green;这种方式可以变换class,然后再设置颜色。这样可以设置很多效果出来。此方法返回的是一个数组,返回所有的p标签的数组,此时第一个p标签的值变成了“第一个p标签“。这样写一个链接也可以弹出对话框。这中方法称为javascript的伪协议。不过这种写法完全抛弃了。现在举一个实际的例子window.onload=init;function init()var bb=document.getElementById(header);bb.innerHTML=aa;bb.onmouseover=over;bb.onmouseout=out;function over()this.className=mm;function out()this.className=cc;.aacolor:#FF0000;.mmcolor:#00FF00;.cccolor:#CCFF00图书馆此时s和undefined是不同的,s的类型此时也是undefined,但是当s=undefined时时false此时输出的是true,三个等号是严格的相等。如果b=”;此时要是用三个等号是不能输出结果的。用两个等号可以输出结果来。此时用了转义字符。此时才把s的字符串连接上了。此时输出的是adfsf。转移字符此时是把16进制的FF转换成8进制的数。要是用s*1的强行方法把s转成数值型的话输出的就是NAN类型,但是上面的图片输出的是234。如果此时s是23 4A,此时输出的是23,碰到空格后就不会转成数值型了。但是如果s是A234,此时就输出的是NAN。此时把AB转换成16进制的数。删除后再输出a.age的话就变成了undefine类型Outermost是标签,当i=2和j=2的时候跳到标签了。要是只写break的话就是只挑出了内层循环,而没有跳出外层循环,此时加了一个标签就跳出了外层循环。此时用了with后就不用这么麻烦每个属性前面都要写Person,此时输出的时候就不用每个属性前面写对象了。此时是针对对象的字符很长的时候用的。正则表达式:var re=new RegExp(abc);/创建正则表达式 与var re=/abc/相同的效果/re=new RegExp(模式字符串,标志); /第二种创建正则表达式的方法。re=new RegExp(abc,i);/i表示不区分大小写,i的英文是ignoreCasealert(re.test(abcafdjsjfd);此时输出的abc不管是大写还是小写,返回的都是true,只要有abc就行了。但是第一种创建的正则表达式只能是小写的abc才返回的是true。还有一种创建正则表示的方法var re=/abc/i;此中方法与上面的re=new RegExp(abc,i)一样效果。var re=/he/I; 脱字符()代表字符开始位置.alert(re.test(“he id fdjjf”);/这样才返回true,要不然不在开始位置返回的是false看看某个字符是不是在开始位置也可以这样写Var s=”he id dsfkj”;Alert(s.indexOf(“he”)=0);此时输出的是true,注意三个等号是代表严格相等。只要测试包含空格的字符就会返回true,此时就体现的了正则表达式的强大之处,用其它的方法来判断就很麻烦了。这里必须写斜杠s,要是少了斜杠,此时就是匹配s了。表示范围的,此时判断是不是包含a到z的字母,后面加一个i的话就表示不区分大小写了。或者直接在后面写A到Z的条件,re=/a-zA-Z/就这样写也可以匹配数字,只能写0到9,这样写又看是不是包含字母也看是不是包含数字。先英文后数字(不确定)。这样写也可以,下面的w表示匹配字母,d表示匹配数字。说明可以包含字母也可以不包含字母也可以包含多个字母,后面要是是加号的话表示出现多次或一次。这种复杂的正则表达式是指的是开始必须要有字母,且至少出现一次,然后至少要出现一次空格,然后至少要出现一次数字,且以数字结尾,区分大小写。这个值符合上面的正则表达式。此时执行就把Ubuntu 8全部取出来而来,输出的就是Ubuntu 8了。此时只匹配数字,就只把数字返回来了。此时就只把数字取出来了。此时就把系统名称和版本号都取出来了。但是这样写不好,现在介绍一种方法叫分组。此时把re分组括号表示分组此时执行alert(re.exec(osVersion);返回的是Ubuntu 8, Ubuntu,8,相当于返回的是数组,以逗号分隔。此时要是把osVersion前后加上一些不相干的字符用上面分组的方法还是能同样取到Ubuntu 8, Ubuntu,8,因为分组是先对整个字符进行匹配,而整个字符匹配必须先字母后空格再数字,就Ubuntu 8符合要求,然后再取出相应的系统名称和版本号。(注意:此时re里面应该不要加开始符和结束符)此时是将字符串的-号替换成#号,但是现在要将所有的-号替换成#号,现在应该怎么办呢?在正则表达式有个全文查找,此时就可以全部替换了。换成g就是表示全文查找了。Var s=-jkfjfs-.此时要将连续的-号替换成一个#号,就变成了#jkfjs#。这样写就可以了。后面要是没有g的话就输出的是# jkfjfs-,后面要是有g的话就是预期的结果了。S=” ad “此时要去除前后空格,java中有trim方法。但是在javascript中这样就行了,前后竖线是为了好观察。现在就可以定义一个函数了当输入的单词中间有很多空格的时候用正则表达式来拆分var s=prompt(请输入单词,);alert(s.split(/s+/);要是此时用户输入的不正确,这样写不管用户开头是不是空格,或者在1990后面又有空格或者中间不用-来分隔,可能用*号分隔,这些写法都能解析出来。Search方法返回的是一个数字,此时返回的是10,从0开始数起。自己可以数数。和indexOf有点相同。但是search与indexOf不同的地方时search可以用正则表达式。此时这样返回的是10,就是不加g标志也返回的是10,它只返回一个数值,且这个数值是最先找的那个符合条件的返回值。此时返回的是true。要是只匹配小数点的话就是用.。前面加一个斜杠即可。注意match方法是String对象的方法,传进去的是正则表达式,此时它与re.exec(s)输出的结果一样,但是exec是指的是正则表达式的方法,这是与String类不同的地方。此时把上面的s的0改成8,然后运行后输出的是第二个8的位置,要是没有第二个参数的话输出的是第一个8的位置。先把S字符串的中的0还是改成8。现在看看lastIndex的作用此时要查找出两个数值的位置,lastIndex的作用是把光标定位到最后一次查找的位置之后。如要是此时查找到了8,此时就会定位到点那个位置。不过此时正则表达式的值要是g,就是重复查找才行。S=”Ubuntu 8.18”;/lastIndex也是从0下标开始的。直接写RegExp点上那些属性。此时输出的是ABCDEFHIJK要是没有m标识的话DEF前面和HIJK前面都会有数字的,但是现在加了m标识后就不会有数字了。这是因为m标识是把每一行当成一个字符串来处理的。当然此时要是不加m标识的话就把开始符号去掉,因为要了开始符号g相当于就没用了,要了开始符号只是针对的是第一个数字,后面的数字不会针对了。var re=/d+./g;s=1.ABCn2.Dn3.H;alert(s.replace(re,); 这样和上面达到的效果是一样的。要匹配一个问号也要在正则表达式中写上?,直接写问号是错误的,有语法的错误,要匹配一个斜杠也要写两个斜杠才是对的。匹配数字式d,但是匹配非数字是D,同样的匹配非空白字符是S.?表示匹配表达式中的0次或1次,+是指1此或多次,*是0次或多次。表示只能匹配四个数字,这就是大括号的功能了。表示只能匹配一个或两个数字。要是把2去掉,逗号还是保留的话表示只能至少要匹配一个数字,其实可以看到/d+/等同于/d1,/ 同理其它符号也可以等同于,自己想把贪婪和惰性的匹配当用+号的时候就是匹配了100,最后一个0在匹配一个0,但是要是此时在加号后面加上一个问号的话,就是指的是惰性的匹配,此时d就只匹配了1,后面的0再匹配一个0就完了。非捕获分组前面加一个?:后表示非捕获分组,此时输出的是否则应该还要输出第二个分组的值的。非捕获分组一般用在这个方面此时只要输出后面的数字,而具体是if还是else不重要。就不要输出嵌套分组的时候是从外往内分组,最外面的是最先分组的。此时也就达到了把前后空格取出来。用非贪婪的方法,但是这样写要是遇到空字符串就会出现null错误现在可以改成这样写。$1也就表示数组中的第一个了。这样写就不会出现错误了。即使是空字符串也是对的。反向引用先是4个数字,然后是一个非数字,然后是一个数字(一位或两位)然后是一个反向引用,此时1表示与前面的D要相同,要是前面是逗号,后面的输入也一定要是逗号才能匹配,注意:前面一定要打括号进行分组,后面才能用1来表示与前面的一致。1是引用的前面的D。上面那副图片也可以直接var oNumberObject=68这样创建也可以。在正数的情况下的时候slice方法和substring方法是一样的,但是在负数的时候就不同了。Slice(-3)表示是从后面忘前面数的函数的语法这样也是一种语法,相当于Var a=function(p,p2)alert(p);a(123,333); /这么写是因为此时a相当于一个函数了。此时输出的是7。最后调用msg方法Msg(“skdfk”,1,”dsfjkj”,5,”djkf”);可以传的参数不一样也行。在javascript中函数是不能重载的,只能用arguments对象来模拟一个函数的重载。返回是120Arguments也有个属性acllee是调用自身的函数,此时其实是与上面的一样的,只不过当改动函数名的时候函数体里面就不需要改变函数的名字了。函数也有length属性,当参数是1的时候length是1,当参数是2的时候length是2。也可以把那个构造函数传参数,然后=name;This.age=age.然后在创建构造函数的时候把参数传过去。即可先定义一个Demo函数然后此时得到Name的名字CJ。创建一个prototype的时候,像上面的那种创建的方法的时候,必须创建在d的之前,然后才能访问属性getName。此时DemoB继承DemoA,此时可以可以输出CJ。函数有一个call方法,o是代表是的this指向的对象。Call方法和apply方法相似,但是就是apply方法后面的参数返回的是数组,所以要用【】号。此时先输出12|b,再输出12|b,最后输出123看看a是不是数组用instanceof,typeof是判断的类型,这里肯定是object类型,后面的返回true值。基本类型不能做比较,如0与Number比较返回的是false,随便一个字符串和String比较也返回的是false,必须要new一个对象出来。但是正则表达式与RegExp比较返回的是true。Var o=;这是创建一个o的对象。继承关系浏览器对象模型在火狐里面用screenX和screenY方法来获取。火狐中的innerWidth中的inner指的是页面显示的大小,不包括上面的菜单部分,而Outer指的是整个页面包括上面的菜单。刷新一下浏览器就会向下和向右移动100个像素。第二个参数用newWindow的时候刷新一下有一个空白页面,当再刷新的时候就没有空白页面了。但是用_blank的话刷新多少下出现多少空白页面。newWindow是自己取的名字也可以取别的名字,只要名字不同的话就可以弹出多个窗口了。但是一般是关的javascript的窗口,所以这里不能用window对象了,这里要通过一个返回值来关闭窗口了。函数不要打括号。也可以直接这样写go没有什么意义,因为后面的参数要用数字,但是你根本不知道那个数字应嘎写啥。DOM节点的用法getElementByTagName也可以使用通配符的形式来访问.如document.getElementByTagName(“*”);此时是获得的所有的html标签。要是下面有一个表单的时候访问表单中的name的名字的时候就要用到document.getElementByName(name)这样来访问一个name了,这样返回的也是一个数组。在body体中有dfj此时要javascipt中写上Var p1=document.getElementById(“p1”);Alert(p1.getAttribute(“className”);此时可以输出base。就是getAttribe的功能。此时也可以这样输出base.就是用的以前的方法Alert(p1.className);但是这样的方法没有上面的方法好。DMLvar header=document.getElementById(header);alert(header.nodeType);这样得到的是1。DMLvar header=document.getElementById(header);alert(header.firstChild.nodeType);/这里也可以改成lastChild,因为只有一个id为header此时输出的是3。要是想获得h1里面的内容用alert(header.firstChild.nodeValue)即可得到DML。nodeType是无法改变的,但是可以改变nodeValue的值,可以header.firstChild.nodeValue=”fffd”;此时就可以赋一个新的值。但是一般还是用的多的是innerHTML,他们两个的区别是innerHTML里面可以放另外一些html,而nodeValue是不行的,它不能把放进去的html解析出来,就还是当做一个字符串的形式放在页面中。比如这两个括号就转义成了特殊的字符,有时候要是你想输出一个特殊的字符,而你又不知道用什么转义字符把这个字符输出的话,此时用文本节点的方法是最好的。如此时要是你不知道输出,此时就可以取出来后你就可以看到怎么输出这个符号了。注意:取出的时候肯定还是要用innerHTML来取出来。Var de=document.documentElement;此时就可以获取文档的根节点和文档的最后一个节点了。此时最后一个节点是body,此时就可以获取body了。此时获取的是em标签。火狐把空格也当成了一个文本节点,此时输出的是7,而要是在IE下面输出的应该是3。在火狐中要想忽略那些空格此时输出的就是3了。在火狐中使用nextSibling的时候也会出现上面的那种情况,也要把空格去掉。去掉之后取下一个节点就是想要的节点。HTML DOM在html中class属性放在javascript中变成了className,for属性变成了htmlFor。记住1,2,3,8,9,其中1和3刚才说过,2表示的是属性节点,8表示的是注释节点。9表示的是文档节点。属性节点此时输出的是header(注意:第三排括号里面的是传一个属性节点的对象)。若输出时nodeName输出时id,若输出是nodeType输出的是2。说明也可以找body下面的所有的节点。创建新节点的方法一般使用第五个和最后一个方法。Var textNode=document.createTextNode(“djfjfdjfd”);Alert(textNode.nodeValue);此时就创建了一个文本对象了。此时虽然创建了这些节点,但是并不会在页面中显示,只是这时先方法在内存中,还需要我们来指定这些节点的位置。现在要把次节点插入到页面中去Document.body.appendChild(textNode);/此时就会把textNode插入到页面中去,并且是作为body的最后一个子节点插入到页面中去的。Var div=document.createElement(“div”);div.appendChild(document.createTextNode(“文本节点”);/此时给创建的div添加一些内容。此时也可以把div插入进去。Document.body.appendChild(div);此时就把div插入到body最后面了。并且div里面也已经设置了内容了。删除节点时括号里面必须是node的子节点。Var header= document.getElementById(“header”);如:document.body.removeChild(header);此时就把id号为header的那个节点移出了。这个移出仅仅是从页面中移出掉了,但是其实这个节点还在内存中的。如此时在后面添加:Alert(“header”);此时还是可以得到一个object类型的,说明header还存在。所以此时还可以再添加到页面中去的。节点的替换现在就把新创建的div节点替换了原来header节点。若现在并不是创建新的节点,而是两个节点都是原来都有的,此时要是执行上面的替换代码的话就是把新节点替换成了要被替换的节点,而要被替换的节点就不存在了。要被替换的节点一定要是某个节点的子节点。此时就在id号位Odiv的节点的前面插入一个节点,此时就达到了在两个节点之间插入一个节点的效果。也可以用一个函数来调用插入节点的方法在javascipt中开头都要这么写克隆节点。Var op=document.getElementById(“op”);Var nop=op.cloneNode(true);/true表示连同子节点一起克隆,一般都写的true。此时就克隆了一个id号为op的节点。然后再把此节点放入到浏览器中。测试某个对象是否具有某个属性用If(name in obj) 用in即可来测试现在来看看函数的好处,要想一次性添加多个节点的话,此时最好个函数出来。此时要是想添加多个节点的话,如先创建三个div,然后调用append函数即可Append(document.body,div1,div2,div3);此时一下就添加了多个节点,这种方法简单了许多。删除多个节点的方法表单Var fm=document.fm此时访问的是表单名为fm的那个表单,表单还提供了一个集合用alert(document.forms.length);此时就可以输出html中有多少个表单此时要是在form中加一个text,名字为text,此时要访问此text应该这样写Var t=fm.text; alert(t.tagName); 要访问text中的value值也可以直接alert(t.value)即可。Var el=fm.elements;/获取所有的表单控件,不包含h1,label那样的控件Alert(sl.length);fm是form的名字,此时onsubmit是点击submit的按钮时触发的事件,this就是指的是form了,对象因为是fm。当点击按钮后就会输出form中所包含的控件的value值。现在有两个单选按钮,名字是gender,此时要获得单选按钮要用到checked。此时选中第一个按钮的时候把第一个按钮的value值赋值给gender。还有defaultChecked是是判断是不是默认选中的对象。此时也以把第一个单选按钮设置成默认的属性。当点击一个text的时候要你输入内容的时候就清空text里面的数据上面的请输入搜索内容几个字也可以改成this.defaultValue 也可以实现相同的效果。文本框还有一个方法,select,可以使文本框中的文字呈选中状态。判断文本是不是有空格。Select对象的处理。有两种方法访问select对象中的选中的哪个值,有一个text可以看到选中的哪个值。这是访问的是北京,南京这些城市,要是想访问A1,B1那些value值,此时直接用Alert(select.value);即可。这些value其实也相当于城市的id值。要是option里面不写value值的话,此时直接把上面的text变成value,此时访问也是那些城市。而不是所谓的id值。现在要把option添加到一个select里面在第10个添加一个元素,此时要是要是前面的没有数值的话,第9,8,7,那些元素都是空的。当用tab键的时候使用光标到一个文本的时候也会触发事件。此时onblur表示光标移出时触发事件。Select和textarea对象都有change事件Onselect事件是当按住鼠标选中一段文本的时候才触发的事件,要是只移动光标不会触发事件表格这是得到table中的caption标签中的那个值。有两种方法获取tbody。两种方法都返回的是一个数组。Var rows=table.rows/此时是返回的是table中的行数。Rows属性不但table有,tbody也有rows属性。Var firstRow=row0;Var cells=firstRow.cells;/此时返回的是第一行有及列的集合。要是加一个点length就返回的是有几列,此时就看到了第一行第一列的里面的值了。这里插入了两个单元格,第一行代码是表示插入到表格的第一行,第二行代码是表示插入一列,此列在里面有New Cell这个值了,然后再插入一列,此列有first值,且也是插入到第一列,那么此时第一列就是first了。New Cell变成了第二列。此时删除一列后new Cell又变成了第一列了。指明这一行在表格中的下标的值。事件:一个简单的事件处理/javascript的代码不要包含到了css代码中去了。window.onload=function ()var oDiv=document.getElementById(oDiv);oDiv.onclick=toBig;/注意这里函数不要打括号function toBig()oDiv.className=big;/注意这里类名一定要加上引号。oDiv.onclick=toSmall;function toSmall()oDiv.className=small;oDiv.onclick=toBig;.smallwidth:100px;height:100px;background:#FF0000;.bigwidth:200px;height:200px;background:#33FFCC;fsd把上面的两个函数的oDiv都可以改写成this,此时也是一样的执行。其实按照上面的方法可以看到每个事件就只能执行一个函数,要是想执行多个函数的话,这样就可以执行多个函数了,但是这样就存在缺陷了,要是把函数中的oDiv改成this的话,此时就不行了。要是还是想用this的话,此时解决的方法是:此时把oDiv对象传给this指针。如果现在有两个人注册了onload函数的话,此时下面的onload函数就会覆盖上面的函数,此时要达到两个函数都执行的效果的话,此时要这样就调用此方法的时候就可以避免上面的问题了。这样下面都可以调用此方法了。当就算要用多个onload的时候也可以一直调用此方法了。此时要是把上面的图片改成if(saved) saved.call(this);fn.call(this);以后所有的调用此函数的那些fn函数里面也都可以用this了来表示对象了。同一个对象在不同的事件中也不能添加同一个函数。要不然只能执行一个事件,另外一个事件将不被执行。此时输出的是长度是1,下面一个输出的是事件MoseEventIE下面在函数内部才能访问的到,要是输出的那句话在函数的外面就是null值了。此时在ie和火狐下按下左右键就不同了。Evt=evt|event是说当有evt事件的时候返回的是evt,否则返回的是event事件。此时用if条件可以检测是哪个键按下了。检测中建IE下面有event事件,而w3c标准跟火狐一样的。还是在onmoseDown事件函数里面写上点击后可以测试鼠标在浏览器中的点击的位置。此时按什么建就输出什么建,这里转换成了键值了,否则不转换输出的是ASCii码。输出IE下面引起事件的原因。这样写可以在两个不同的浏览器中获取target属性。此时要是点击div中的p对象,本来是要先执行p事件,然后执行div事件,最后执行document事件的,但是由于有了stopPropagation,停止事件流,此时要是点击p后,只执行p上面的事件,其它事件不执行了。这种从小到到事件一次执行称冒泡。在IE下面这样写就可以使事件停止传播要达到两个浏览器的兼容可以这样上面的是冒泡事件流,捕获事件流是与冒泡事件流相反。而IE没有捕获事件流。此时事件不要加on了。此时使用的是捕获事件流,要是想改成使用冒泡事件流的话,此时要把true改成false就可以了。捕获事件流时,当点击div时,先执行document,然后再执行div。因为ie不支持捕获事件流,所以以后基本上不用捕获事件流。 这是在ie下面添加的事件,它与上面的不同,首先事件要加上on前缀。只有两个参数,此时lnk是指的一个超链接,获取一个超链接的id后,实行下面的方法,此时当点击超链接的时候也会被阻止跳到另一个页面去了。因为返回了false,此时就会阻止超链接的行为。此时也是阻止浏览器的默认方法的执行,此方法要比上面的方法要好一些,因为上面的返回要在代码的最后一行执行,但是此时就可以在代码的最前面执行了。这个方法是火狐的,在ie下面又是另外一种方法了。只是IE下面的阻止方法了。IE和火狐几个不同的地方的总结,样式:修改元素外观主要有以下三种方式,修改id,修改className,修改style属性。一个div有id,class然后定义css,还有一种就是直接在div中定义style,也就这三种方式来定义css了。window.onload=function ()var oDiv=document.getElementById(oDiv);alert(stop);oDiv.id=para;#oDivbackground:red;width:200px;height:200px;border:10px yellow solid;#parawidth:10px;background:yellow;height:20px;上面的方法是修改id来改变样式的方法。但是这种方法是不好的,元素的id是唯一的,要是修改了id的话以后再获取id就很麻烦了。所以最好还是不要修改id号。第二种方法就是修改className了。此种放法要好一些。当一个div有多个类名的时候,这些类名要在div中用空格分开,此时一下子可以实现多个类的css样式。此时要是想用javascript替换一个类,最好写两个函数。此时删除一个类,再添加一个类。然后再调用这两个方法,修改style属性。此时要修改style属性用(style属性的优先级最高)oDiv.style.width=”300px”;此时就把width修改成了300px。注意以字符串的形式修改。要是像border-color这样的属性,在javascript中不能写-这个符号,此时只要删除这个符号然后把color中的c大写即可。Style属性经常用来设置值,因为它的优先级要高一些。在IE中获取最终的style值此时要是没有style属性的话,还是能获取最终类的属性的width的值的。在火狐中这样来放问一个syle对象的最终值的属性。跨浏览器来实现两个stylefunction getRealStyle(obj,s)var style;if(window.getComputedStyle)style=window.getComputedStyle(obj,null); else if(obj.currentStyle)style=obj.currentStyle;return styles;window.onload=function ()var oDiv=document.getElementById(oDiv);alert(getRealStyle(oDiv,width);/打双引号也行。alert(getRealStyle(oDiv,height);此时调用此函数。Alert(getRealStyle(oDiv,”width”);样式表Ink.href此时向用户中添加样式表。访问样式表这是在ie下面的属性。插入某条规则,ie和火狐下是不同的。定位:function getRealStyle(obj,s)var style;if(window.getComputedStyle)style=window.getComputedStyle(obj,null); else if(obj.currentStyle)style=obj.currentStyle;return styles;window.onload=function ()var oDiv=document.getElementById(oDiv);alert(getRealStyle(oDiv,width);alert(getRealStyle(oDiv,height);此时获取的是元素的宽和高,但是当元素中css中没有定义宽和高的话,那此时在ie下面获取的是宽和高的值是auto,在火狐下面获取的是具体的值,火狐浏览器要是变化,具体的值夜在变化,还有就是要是有css中有宽和高,但是要是在css中加上了padding的值的话,此时其实div的大小是变化了,但是javascript中获取的宽和高还是css中的宽和高,并没有吧padding的大小加上去。此时要是在css中加了padding:50px,而本身的width和height都是200px,此时要是用var w=oDiv.clientWidth,h=oDiv.clientHeight;alert(w+ +h);此时获取的宽和高是300px,说明把padding的值加进去了。clentWidth表示的是可视部分的大小。当此时要是在css中加了overflow:scroll;这句话后,此时div中包含了滚动条,要是在获取大小的话此时用上面的clientWidth和ClientHeight获取的比实际要小一些,因为滚动条占据了一些位置,但是它并没有获取滚动条的大小。此时只获取了蓝色部分的大小。所以获取的值比css中width要小当div中的值很多的时候,获取的还是跟上面获取的值的大小是一样的。此时用上面的方法获取的还是可视区域的大小,现在要是想获取实际的大小,此时要用到另外一个属性。var sw=oDiv.scrollWidth,sh=oDiv.s

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论