JavaScript基础

JavaScript

1 JavaScript概述

javaScript 简称js.是可以嵌入到html中,是基于对象 和 事件驱动 的 脚本语言

     特点:

        (1)交互性

        (2)安全性:js不能访问本地磁盘

        (3)跨平台:浏览器中都具备js解析器

js作用:

    js能够动态的修改html和css的代码,并且能够动态的校验数据。

js组成:

ECMAScript   BOM(浏览器对象模型)  DOM(文档对象模型) 

2js的引入方式

   使用<script>标签

     (1)内嵌脚本       

     (2)内部脚本

     (3)外部脚本

js代码放在哪?

   放在哪都行,一般写在<head>标签中。但是在不影响html功能的前提下 越晚加载越好

JavaScript 是所有现代浏览器以及 HTML5 中的默认脚本语言。现在可以不用在在 <script> 标签中使用type="text/javascript"。

3js基础语法

变量是用于存储信息的容器

javascript中的变量与我们在java中的变量一样。

在javascript中使用用 var 运算符(variable 的缩写)加变量名定义的

JavaScript 变量名称的规则:

变量对大小写敏感(y 和 Y 是两个不同的变量)

变量必须以字母或下划线开始

注意:由于 JavaScript 对大小写敏感,变量名也对大小写敏感。

4js数据类型

在ECMAScript中,变量可以存在两种数据类型,即原始类型和引用类型。

         原始类型,类似于java中的基本数据类型,但是不同。

         ECMAScript有五种原始类型

          string 在javascript中字符串字符串字面值,可以使用单引号或双引号声明。

          number 在javascript中任何数字都看成是Number类型,它即可以表示32位整数,也可以表示64位浮点数。八进制首数字必须是0,十六进制使用0x开始。

          boolean 它有两个值true和false.

          undefined该类型只有一个值undefined.表示的是未初始化的变量

          null 该类型只有一个值null,表示尚未存在的对象。值undefined实际上是从值null派生出来的。因此null==undefined得到的结果是true.

5类型转换

number\boolean转成string

   toString();

string\boolean转成number

   parseInt();   parseFloat();       boolean不能转

   string可以将数字字符串转换成number如果“123a3sd5” 转成123

强制转换

    Boolean()   强转成布尔

   数字强转成布尔  非零就是true   零就是false

   字符串强转成布尔  非“”(空字符串)就是true  空字符串“”就是false

    Number() 强转成数字

     布尔转数字 true转成1  false转成0

     字符串转数字 不能强转

引用类型通常叫做类(class),也就是说,遇到引用值,所处理的就是对象。

从传统意义上来说,ECMAScript 并不真正具有类。

ECMAScript 定义了“对象定义”,逻辑上等价于其他程序设计语言中的类。

对象是由 new 运算符加上要实例化的对象的名字创建的

var obj=new Object();

Object对象自身用处不大,但是 ECMAScript 中的 Object 对象与 Java 中的java.lang.Object 相似,ECMAScript 中的所有对象都由这个对象继承而来,Object 对象中的所有属性和方法都会出现在其他对象中

常用的javascript对象有 Boolean,Number,Array,String,Date,Math,RegExp.

可以使用instanceof运算符来判断对象的类型。

6运算符和语句

 JavaScript运算符与Java运算符基本一致。 

跟java一样,js也存在if、if-else、for、switch等逻辑语句,与java使用方式一致。

      稍微特别一点的:

         for in:

        var arr = [1,3,5,7,"js"];

         for(index inarr){//index代表角标

          //alert(index);

          alert(arr[index]);

         }

7js内建对象

Number Boolean String ArrayDate Math RegExp

8js函数

(1)普通方式

        语法:function 函数名(参数列表){函数体}

        示例:

          function method(){

             alert("xxx");

          }

          method();

(2)匿名函数

        语法:function(参数列表){函数体}

        示例:

          var method = function(){

             alert("yyy");

          };

          method();

(3)对象函数

        语法:new Function(参数1,参数2,...,函数体);

        注意:参数名称必须使用字符串形式、最后一个

          默认是函数体且函数体需要字符串形式

        示例:

          var fn = newFunction("a","b","alert(a+b)");

          fn(2,5);

9js事件

onclick:点击事件

onchange:域内容被改变的事件

onfoucus:获得焦点的事件

onblur:失去焦点的事件

onmouseover:鼠标悬浮的事件

onmouseout:鼠标离开的事件

绑定方式

(1)将事件和响应行为都内嵌到html标签中

        <input type="button"value="button" οnclick="alert('xxx')"/>

(2)将事件内嵌到html中而响应行为用函数进行封装

        <input type="button" value="button"οnclick="fn()" />

        <script type="text/javascript">

          function fn(){

             alert("yyy");

          }

        </script>

(3)将事件和响应行为 与html标签完全分离

        <input id="btn" type="button"value="button"/>

        <script type="text/javascript">

          var btn = document.getElementById("btn");

          btn.onclick = function(){

             alert("zzz");

          };

        </script>

10js的bom

(1)window对象

     弹框的方法:

        提示框:alert("提示信息");

        确认框:confirm("确认信息");

          有返回值:如果点击确认返回true  如果点击取消 返回false

          var res = confirm("您确认要删除吗?");

          alert(res);

        输入框:prompt("提示信息");

          有返回值:如果点击确认返回输入框的文本 点击取消返回null

          var res = prompt("请输入密码?");

          alert(res);

                     open方法:

        window.open("url地址");

                     close( )      :     关闭窗口

定时器:

        setTimeout(函数,毫秒值);  定时(只执行一次)

        clearTimeout(定时器的名称)

        setInterval(函数,毫秒值); 定时(重复执行)

        clearInterval(定时器的名称)

(2)location 

     location.href="url地址";当前页面打开URL页面

(3)history

                history.back()和history.forward()分别表示向后一页和向前一页。

     history.go(num)表示向前或向后翻多少页,num为正数表示向前翻,为         负数则向后翻。

     history.back()等价于history.go(-1),history.forward()等价于          history.go(1)。

11js的dom

DOM :DOM是Document ObjectModel文档对象模型的缩写。根据W3C DOM规范,DOM是一种与浏览器,平台,语言无关的接口,使得你可以访问页面其他的标准组件

查找元素节点getElementById()

            getElementsByName()

            getElementsByTagName()

是否存在子节点hasChildNodes()

替换节点 replaceChild()

获取属性 getAttribute()

设置属性 setAttribute()

创建新元素节点 createElement()

创建新文本节点 createTextNode()

插入节点 appendChild()

遍历节点树 childNodes()

获取第一个子节点 firstChild()

获取最后一个子节点 lastChild()

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值