javaScript基础知识汇总

1、 js的三大组成部分分别就是DOM,BOM,ECMAscript;

2、prompt(‘提示文本’,’输入的举例文本’);返回字符串。它可以允许前台数据数据给后台看。var user=prompt('请输入内容','123');

3、js中的函数调用基本结构:函数名称+小括号:  fn(); 其中小括号又称之为执行符号,具有很强的执行力。它表示马上执行函数。

4、*document.getElementById() 表示一个搜索功能,通过id来搜索标签。

5、dom.innerHTML 表示任何标签内部的内容。就是innerHTML属性可以直接修改标签内容。

6、事件源.事件类型=事件助手;

7、《事件原理》 *新的事件类型:

onclick表示单击;ondblclick表示双击;onmouseover 鼠标移上;onmouseout 鼠标离开;onmousedown 鼠标按下;onmouseup 鼠标抬起;

*所有事件的特点:  js中所有事件都是以on开头,并且整个事件类型的单词都是小写的。一切的事件使用方式都遵循事件三要素方式。

网页的制作过程中用户的操作习惯要注意是很少用到双击的。

8、动态添加内容: var user=otxt.value; obox.innerHTML+=user;   otxt.value='';

9、程序就是一堆数据加处理数据的指令,所以说数据和指令是程序永恒不变的主题。   值和指令

10、《五大数据类型》字符型:string;数字型: number;布尔型:翻译 Boolean;对象型:翻译 object;未定义型:undefined

11、***规律:一切来自于前台的数据默认都是字符型数据。

12、typeof 作用:可以返回数据的类型名称;它也有一个小技巧,它也已当成函数形式来使用。

parseInt() 作用:将数字值的字符转为真正的数值类型数据。它是一个js中的内置函数。和alert他们是一类的。

13、document.write() 作用向网页文档中书写内容,常用于测试。

14、《函数的结构》 定义式: function fn(){};  function 表示定义关键词;fn 表示函数名称; () 函数的参数集;

15、总结:函数定义式相当于存储值,调用式相当于执行值。其中要注意的是,函数的定义是占内存的但是函数的调用是不占内存的。变量里面如果存储函数形式的值

称之为高级值可以再次被执行。变量里面如果存储普通类型的值。称之为简单值固定不变不能被再次执行。

16、this:这个this表示调用函数的对象,任何的函数不能自己执行自己都是对象调用的。默认所有自定义的函数天生都是被window调用。

return:表示函数的返回值。这也是函数的一个重要知识点。

17、获取id函数 var getId=function(id){ return document.getElementById(id);  }

18、otxt.onfocus  &&  otxt.onblur     获取焦点跟失去焦点

19、-----------------------0903----------------------------------

1、if( obox.currentStyle ){   alert(obox.currentStyle.width)  }else{  var com=getComputedStyle(obox,null);alert(com.width) }

处理兼容问题,obox.currentStyle 主要是ie的  ,是计算后的样式

2、oul01.parentNode.children[2].style.background='purple'  ; parentNode表示其父类,children表示其小孩

3、parseInt()这个函数具有强制转化为数字的作用。

4、单次定时: setTimeout(指令,时间) 时间的单位是毫秒值,1000毫秒=1秒;

循环定时:setInterval(指令,时间) 特点永不间断一直循环执行。

clearTimeout(定时器所在的内存地址) 参数就是一个全局变量。

clearInterval(变量) 清除循环定时,比较常用。

5、启动动画定时器的步骤:

1.在全局声明两个变量一个num作为累加器,一个timer作为定时器存储。

2.启动定时器并在定时器的内部让累加器递增。

3.经验:如果为了保证定时器不叠加每次启动之前都可以清除一次。

动画定时器的内部永远需要做两件事情,一个是创造数据一个是使用数据。

6、代码分离

window.onload=function(){ 代码要全部写在这里; };

window表示浏览器窗口;

onload表示当加载完以后;

整个事件的作用:表示当网页文档被窗口完全加载完以后再执行助手中的命令。

7、js默认情况都是取行内css样式。

函数基本结构:getComputedStyle(要计算的标签,null)

作用:这个内置函数在任何时候可以直接使用。它计算后会得到指定标签当前所有的css最终计算后的数据集合。

是一个对象,可以再次通过点语法展开其中的css属性。

8、简介:任何的一个标签在js中都可以直接通过一个属性访问自己的父级或者子级;

父级:parentNode 作用直接返回父级标签。

子级:children 作用直接返回所有的子级。

同级:dom.parentNode.children;

总结:父子兄关系访问器可以节省大量的id标记,这是它的一个好处。

9、《随机数方法》Math.random()

------------0904---------

1、var divs=document.getElementsByTagName('div');   通过标签名获取元素

2、var oboxs = obox.getElementsByTagName('*'); 找到所有的元素

3、《排他思想》

在特效当中但凡见到只让自己怎么样,不让别人怎么样的效果都可以用到排他思想。

排他思想非常常用。一共分为两步进行:   第一:先用for循环排除所有人。  第二:再用this确立自己

4、document.createElement(新节点名称)   作用:可以在内存中直接创建任意的新标签。

5、追加函数: dom.appendChild(新节点)  作用:将内存中的新节点追加的指定容器内部的结尾处。

dom.insertBefore(新节点,参考节点);作用:将指定节点追加到容器内部的开头处,参数2表示在谁的前面。

6、《点语法的第二种访问形式》  基本结构: 任何的点语法去访问的地方都可以换成如下方式;

json.k == json[‘k’]   作用:中括号的这种访问属性的方式有自己的一个巨大的优点,就是可以将属性动态化。(可以将属性改成变量)

7、《遍历数据》  简介:一提到遍历数据肯定是挨个处理v,而不是处理K.

数组遍历主要用for循环语句。而json遍历主要用forIn语句来实现。其中json遍历要注意不能使用点语法来访问json中的属性。只能使用[]形式来访问。

------------【offset属性】----------------

dom.offsetWidth 表示一个元素的实体总尺寸。包括w,p,b;

dom.offsetHeight 同上。包括 h,p,b;

dom.offsetLeft 表示元素的当前定位偏移横坐标。

dom.offsetTop 表示元素定位偏移纵坐标。

dom.offsetParent 表示元素的相对定位父级。

总结:这一组属性都是js提供用来测量的,所以只能访问不能修改。此外还有一个好处就是测量出来的数据都不带单位。

------------【运动学公式】---------------------

引导者数字的位置:     当前位置=当前位置+(目标-当前位置)*比率;   可以简写为: 当前位置+=(目标-当前位置)*比率;

其中比率决定运动的快慢,0.2是一个比较合适的比率。

价值:运动学公式做动画是公认的效率最高的动画形式。这种动画形式是基于距离的。

-----------------事件对象---------------------------

事件对象工作原理:

当事件类型被触发的时候,它会将自己打包成一个事件对象,然后自动传递给事件助手。

事件助手通过一个形参e来接受这个事件对象。这样的话在事件助手的函数体里面就可以使用事件对象了。

-----------------事件坐标------------------------

坐标属性:

视口坐标:全兼容    e.clientX   e.clientY;             client:客户端的意思

文档坐标:ie8不兼容,  e.pageX    e.pageY;

在定级窗口和标签页中,”视口“只是实际显示文档内容的浏览器的一部分:它不包括浏览器的“外壳”(如菜单、工具条和标签页)。

-----------------兼容性问题------------------------

兼容性处理的一个小技巧:

不同浏览器的兼容性处理通过双向条件判断是最常用的方式,除此之外还可以通过或运算符来处理 ||  例如事件对象兼容性问题可以在助手中写为如下形式:

var e=e||event;

event是ie原来使用的方式,正在被淘汰,现在ie9已经采取和谷歌一样的访问对象方式了。所以如果你的项目不需要兼容低版本浏览器那么就不需要考虑这个问题。

----------------《事件对象属性》--------------------------------

e.type 表示当前发生的事件类型。

e.currentTarget 表示当前发生事件的事件源。

-----------------《右键菜单事件》----------------------------

事件类型:oncontextmenu;

事件作用:当右击鼠标的时候触发指令。

注意事项:任何的浏览器都有自己天生的右键菜单,所以这个事件是拥有自己默认行为的。

在js中很多事件都拥有默认行为有的地方又称之为事件内置行为。如果要阻止事件的默认行为最简单的办法就是在事件助手的最后执行一个 return false;

------------------------《默认结构访问》-------------------------------

document.title 访问标题元素;

document.head 访问head标签;

document.body 访问body标签

document.documentElement 访问html标签  ***

-----------------page坐标还有一个就是对事件对象本身的访问问题。------------------????

什么是事件对象???? :当触发某个事件的时候,会产生一个事件对象,这个对象包含着所有的与事件有关的信息,

包括导致事件的元素、事件的类型、以及其它与特定事件相关的信息。

事件对象:我们一般称作 为event对象 ,这个对象是浏览器通过函数把这个对象作为参数传递过来的,可以通过arguments来获得函数传递过来的参数。

---------------《client属性组》--------------------------

简介:这个属性组和offset是对应的。client这个单词表示客户,客人。可以范围以用户区或可视区的意思。

尺寸测量:

dom.clientWidth

dom.clientHeight

作用:测量盒子padding加宽高的尺寸。

坐标测量:

dom.clientLeft

dom.clientTop

作用:测量自己边框的粗细。(这两个属性实际上是测量可视区距离外容器的距离的,但是这个距离实际上肯定就等于border的尺寸。)

--------------------《滚动事件》---------------------------

事件类型:onscroll;表示当网页滚动的时候触发;

使用方式:全兼容的方式是给window绑定这个事件。

***滚动坐标值的获取:

滚动坐标值的获取一致存在兼容性问题。主要是通过两种方式得到所以可以用以下方法

解决: var num=document.body.scrollTop||document.documentElement.scrollTop;

-------------------------------------------------

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 214,904评论 6 497
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,581评论 3 389
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 160,527评论 0 350
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,463评论 1 288
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,546评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,572评论 1 293
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,582评论 3 414
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,330评论 0 270
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,776评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,087评论 2 330
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,257评论 1 344
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,923评论 5 338
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,571评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,192评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,436评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,145评论 2 366
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,127评论 2 352

推荐阅读更多精彩内容

  • 一、JS前言 (1)认识JS 也许你已经了解HTML标记(也称为结构),知道了CSS样式(也称为表示),会使用HT...
    凛0_0阅读 2,765评论 0 8
  • 国家电网公司企业标准(Q/GDW)- 面向对象的用电信息数据交换协议 - 报批稿:20170802 前言: 排版 ...
    庭说阅读 10,943评论 6 13
  • 今天早上韩黎韦看消息是枫发来的,枫:今天我就不去找你玩了,我有些事耽误了,你自己玩吧。 韩黎韦:“...
    花儿落霞阅读 311评论 0 0
  • 世间一切的现象,都是由因缘和合而产生的假相、虚相、幻相,其本身并无自主性,是随缘而现,缘灭而散,所有诸相皆属虚妄,...
    知梦阅读 395评论 0 0
  • 我们不断的成长,随着年龄的增加,好像也越来越不爱惜自己的身体了,越来越放不下的手机,明明没有人给你发消息...
    汪不器阅读 145评论 0 0