JavaScript基础(笔记)

1.3JavaScript基础
1.3.1DOM的相关知识
DOM的含义:Document Object Model,文档对象模型,
文档:指的是标记文档(html ,xml)
対象:可以使用dom里面的相关属性和方法来解析标记性文档.
Dom的组成:核心Dom,Html Dom ,XML Dom.
Dom如何解析html文档:
DOM会根据html的层级结构,在内存中形成一个树形结构,树形结构里面有标记元素和属性文本等元素,
整个html文档对应一个document对象,通过document文档对象, 可以操作html里面得到所有元素。
2.节点的访向:
节点対象. childNodes :获取该节点的所有子节点。
节点対象. parentNode:获取该节点的父节点。
3.荻取文档中的元素:
下面的方法是html dom的方法
根据标记的id属性值获取元素对象: document.getElementById(id属性对应的值);
根据标记的名称获取元素对象: document.getElementsByTagName(标记的名称);
根据标记的name属性值获取元素对象: document. getElmentsByName(name属性对应的值);
1.3.2 JavaScript概述
什么是js:它是基于对象和事件驱动的语言,它应用于客户端。
基于对象:在js里面提供了一些对象,可以直接使用。
面向对象:在java里 面先创建对象,再使用。
事件驱动: js里 面它触发事件,调用函数,实现网页里面的动态效果。
***客户端:浏览器。
javaScript和java的区别(雷锋塔和雷锋) :

  1. javaScript是网景的产品,java是sun公司的产品, 现在oracle.
  2. javaScript的运行只要系统里有浏览器就可以了。java的运行依赖于虚拟机。
  3. javaScript是弱类型语言,java是强类型语言。
    弱类型语言:在js里面,所有的变量都用var定义,比如: var a=10;var b="hello js"强类型语言:在java里面,int a=10; int b="hello java" 错误的写法。
    javaScript的组成: .
  4. EcmaScript:规范了js的基于语法。
  5. Bom: Browser Object model ,浏览器对象模型,操作浏览器。
  6. Dom: Document 0bject model, 文档对象模型,操作文档。
    js作用:它是给网页增加动态效果。
    1.内嵌式:
    在网页里,引入js代码的基本语法: <script type="text/javascript"> js代码</script>
    在上述代码中,type属性是用来指定HTML文档引用的脚本语言类型,当type属性的值为text/Javascript时,表示<script></script>元素中包含的是Javascript脚本。
    2.外链式:
    在网页里,引入外部的js文件的语法: <script type=" text/javascript" src="js文件的url"></script>
    操作步骤: 1.创建-一个js文件,2. 在script标记里面,使用src属性来引入外部的js文件。
    比如:
    <head>
    <title>insert title here</title>
    <script type="text/javaScript" src= " demo01. js"></script>
    </head>
    <body>
    <br/>
    来学习javaScript
    </body>
    3.js里的数据类型:
    Number :数字类型
    String :字符串类型
    Object:对象类型
    null:空类型
    undef ined:未知的类型
    Boolean :布尓类型
    比如:
    var a=10;
    // alert(typeof a);
    var b="hello js";
    // alert(typeof b)
    var c=null;
    // alert(typeof f);
    var d;
    // alert(typeof d)
    var e=true;
    alert(typeof e)
    4.变量
    在js里面定义变量都用var来定义。
    5.运算符

    算术运算符: + - * / 等等
    比较运算符: > < >= <=等等
    逻辑运算符: && ||等等
    赋值运算符: += -=等等
    注意: var a=10;var b="0"; var c=a-b;在进行减法(乘除法)操作时,会把string类型的值,转换为number型。
    6.条件语句:
    if ,if else,if else if else等语句
    其它语句: for语句。switch case语句等等
    比如:
    var a3=10;
    var b3=20;
    if(a3==b3){
    alert("相等的是10");
    }else{
    alert("other---")
    1.3.3 JavaScript的使用
    1.函数的定义和使用
    在js里面定义函数的三种方式:
    (1)创建普通函数
    语法:function add(a,b){
    var sum=a+b;
    return sum;
    }
    (2)创建匿名函数
    语法:var add2=function(a,b){
    var sum=a+b;
    return sum;
    }
    (3)创建动态函数:
    语法:a.定义函数的参数:
    var param=’’a,b’’;
    b.创建函数体:
    var method=”var sum=a+b;return sum;”
    c.动态函数:
    var add =new Function(param,method);
    2.事件处理
    事件:通过触发事件,去调用相关的函数,来实现网页的动态效果。
    如果在网页里面去触发事件?
    在网页里面绑定事件常用的两种方式:
    (1)直接通过事件绑定函数。
    比如:<input type=”button” name=”btn” value=”点我” onclick=”add()” >;” />
    Function add() {alert(“点我啊”);}
    (2) 通过给事件属性赋一个函数
    比如:<input type=”button” name=”bbs” value=”aa” id=”inputID” >;” />
    document.getElementById(“inputID”)onclick=function(){
    alert(“点我了么”);
    }
    常用事件:
    (4)点击事件:onclick
    (5)失去焦点事件:onblur
    (6)获取焦点:onfocuse
    (7)键盘事件:onkeyup onkeydown onkey press
    (8)页面加载事件:onload
    (9)鼠标事件:onmouseout onmouseover onmousemove
    3.常用对象
    A.window对象:
    常用的属性:history,document,navigator,location,screen
    比如:var aa=window.location.href;
    alert(aa);
    常用的方法:
    设置定时器方法:
    Var id1=setInterval(js代码,时间):每隔一段时间循环执行对应的js代码
    Var id2=setTimeout(js代码,时间):每隔一段时间,只执行一次对应的js代码
    消除定时器的方法:
    ClearInterval(id1)
    clearTimeout(id2)
    B.Date对象:
    使用方法和Java差不多
    Var myDate=new Date();
    获取年份:myDate.getFullYear();
    获取月份:myDate.getMonth();
    获取天:myDate.getDay()
    C.String对象
    获取字符串的长度:
    Length
    与HTML相关的方法:
    字体加粗:bold();字体变大:big();
    与Java相似的方法:
    IndexOf(),concat(),substr(),substring()

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章