1.声明Js代码域
    1.在head标签中使用script声明js代码域
    <head>
        ....
        <!--声明js代码域-->
        <script type="text/javascript">
            function test(){
                alert("哈哈,js学习起来很简单!!!");
            }
        </script>
    </head>
    2.在head标签中使用script引入外部声明的js文件
    <head>
        ....
        <!--声明js代码域-->
        <!--引入外部声明好的js文件-->
        <script src="js/my.js" type="text/javascript" charset="utf-8">
        </script>
    </head>
2.js的变量学习:
    js的变量学习:
    1 js的变量声明
        使用var关键字进行变量声明,格式如下:
        var 变量名=初始值;
        例如: var a="呵呵";
    2 js变量的特点
        a、变量声明只有var关键字,声明的变量可以存储任意类型的数据。
        b、js中的代码可以不适用分号结尾,但是为了提升代码的阅读性,建议使用分号。
        c、js中的变量允许出现同名变量,但是后面的会将前面的覆盖。
        d、声明不赋值,默认值是undefined
    3 js的数据类型
        使用换件typeof判断变量的数据类型
            number:数值类型
            string:字符类型,注意:在js中字符可以使用单引号也可以使用双引号
            boolean:布尔类型
            object:对象类型
    4 js的变量强转
        使用Number()函数:将其他数据类型转换为数值类型,转换失败返回NaN(not a number)
        使用Boolean()函数:将其他数据类型转换为布尔类型,有值返回true,无值返回false;
    5 特殊的值
        null object
        undefined undefined
        NaN number
3.js的运算符和逻辑结构
    等值符:==
        如果类型一致则直接比较值,如果类型不一致则先使用Number强转为同一类型后再比较值
    等同符:===
        先判断类型,如果类型一致则再比较内容,如果类型不一致则直接fasle
4.js 的数组
    1.js的数组的声明
        var arr1=new Array();//声明一个空数组
        var arr2=new Array(长度)//声明指定长度的数组。
        var arr3=[]//声明一个空数组,也可以在声明时直接赋值,例如:var arr3=["a","b","c"];
    2.js数组的使用
        数组的赋值
            数组名[角标]=值;注意:js中赋值可以跳跃角标赋值,不存在的角标也可以赋值,会对数组的大小进行改变。
    3.数组的取值:
        var 变量名=数组名[角标名]
        注意:如果获取的角标没有数据,则返回undefined;
    4.js的数组的特点
        特点1:
            js中的数组可以存储任意类型的数据。
        特点2:
            js的数组可以通过length属性动态的改变长度。可以增加,也可以缩短。
        注意:
            如果是增加,则使用逗号进行占位
            如果是缩减则从后往前减少存储的数据。
    5.js的数组的遍历:
        普通for循环:for(var i=0;i<arr.length;i++){}
        增强for循环:for(var i in arr){}
        注意:增强for循环中,循环条件声明的变量记录的是角标。
5.js的数组的常用操作方法:
    数组名.pop()//移除并返回最后一个元素。
    数组名.push(要添加的数据)//在数组最后追加数据,并返回新的长度。
6.js的函数学习:
    函数的声明:
        第一种声明方式:
            function 函数名(形参1,形参2,...){函数体....}
        第二种声明方式:
            var 变量名=new Function("形参名1","形参名2",....,"函数体");  注意:在js中函数是作为对象存在的。
        第三种声明方式:
            var 变量名=function()(形参1,形参2,...){函数体....}
    函数的形参:
        在js中函数的形参在调用的时候可以不赋值,不报错,但是默认为undefined
        在js中函数的形参在调用的时候可以不完全赋值,依次赋值。
        注意:js中没有函数重载,只有函数覆盖。
    函数的返回值:
        在函数内部直接使用return语句返回即可,不需要返回值类型
        注意:默认返回undefined;
    函数的调用:
        1、在加上代码域中直接调用(主要进行页面资源初始化)
        2、使用事件机制(主要实现和用户之间的互动)
        3、作为实参传递(主要是动态的调用函数)
        注意:小括号为函数的执行符,函数名()才会被执行,直接函数名则作为对象使用。
        注意:js的代码区域只有一个,包括引入的js代码,浏览器会将引入的js文件和内部声明的js代码解析成一个文件执行。js代码的调用和声明都在一个区域内。
7.js 的事件机制
    单双击事件:
        单击事件: onclick.
        双击事件: ondblclick
    鼠标移动事件:
        鼠标悬停事件:onmouseover 当鼠标在HTML元素之上时触发
        鼠标移出事件:onmouseout 当鼠标移出某个HTML
    元素时触发
        键盘事件:
            键盘下压事件:onkeydown 当键盘被按下时触发
            键盘弹起事件:onkeyup 当键盘弹起时触发
        焦点事件:
            获取焦点:onfocus 当获取焦点时触发
            失去焦点:onblur 当失去焦点时触发值改变事件:
        专门给select标签使用:
            onchange事件当下拉框的值改变时触发
        页面加载事件:
            专门给body标签使用onload 当页面加载成功后触发
        注意:
            事件是作为HTML标签的属性来使用的。
            一个HTML元素可以同时使用多个事件,但是注意事件之间的相互干扰。
8.js 的常用方法和对象
    String对象:操作字符的。
        使用:字符串.函数名即可
        大小写转换:
            toUpperCase() 转换大写
            toLowerCase() 转换小写
        字符串截取
            substr(0,1) 从指定开始位置截取指定
        长度的子字符串
            substring(0,1) 从指定位置开始到指定的结束位置的子字符串(含头不含尾)
        查找字符位置
            indexOf 返回指定字符第一次出现的位置。
            lastIndexOf 返回指定字符最后一次出现的位置。
    Date对象:
        使用: var 变量名=new Date();注意:获取的是客户端的时间,不能作为系统功能校验的时间的。
    Math对象:
        使用:Math.函数名
        random()
        round()
        ceil()
        floor()
    Global对象
        eval() 将字符串转换为js代码执行
        isNaN() 判断Number强转后是否是数字
        parseInt()
        parseFloat()
9.js 的window 对象的常用属性
    window对象的属性学习
        opener属性
        location属性:作用:地址栏属性,该属性是一个对象,封存了浏览器对地址栏的操作信息例如:url
                      使用:URL操作: window.location.href//返回当前网页的URL信息
                            window.location.href="资源路径"//跳转指定的URL资源。
                     页面刷新:作用:重新加载页面资源。window.location.reload();
        history属性:
            forward()//前进,相当于浏览器中的前进功能
            back()//后退,相当于浏览器中的后退功能
            go()//跳转指定的历史记录
        screen属性:获取分辨率
            window.screen.width
            window.screen.height
10.js 的document 获取HTML 元素对象
    documnet对象学习:
        解释:
            document对象是浏览器对外提供的封存了当前运行的HTML文档信息的一个对象
            通过此对象可以让我们灵活的操作HTML文档,达到修改,完善HTML文档的目的。
        使用:
          document获取HTML元素对象
            直接方式:
                通过ID
                    var 变量名=document.getElementById("uname");//返回指定的HTML元素对象
                通过name
                    var 变量名=document.getElementsByName("name属性值");
                通过标签名
                    var 变量名=document.getElementsByTagName("标签名");
                    注意:返回的是存储了该网页中指定的标签的所有对象的数组。
            间接方式:
                父子关系:
                    先获取父级节点(参照直接方式)通过父级节点获取子节点数组
                    var 变量名=父节点对象.childNodes;
                    注意:子节点数组中会包含文本节点,可以使用nodeType属性筛选出来所有的HTML节点(nodeType值为1)
                子父关系:
                    先获取子元素对象(参照直接方式)通过子元素对象获取父元素对象
                    var 变量名=子元素对象.parentNode
                兄弟关系:
                    先获取当前元素,根据兄弟关系选择对应的获取方式
                    var 变量名=元素对象.previousSibling; //兄
                    var 变量名=元素对象.nextSibling; //弟
    document操作元素对象的属性
        获取:
            元素对象.属性名//返回属性值
        修改:
            元素对象.属性名=值
        注意:
        不要修改标签的name和id属性
    document操作元素内容:
      获取HTML元素对象
        获取:
            元素对象.innerHTML :返回所有的内容包括HTML标签
            元素对象.innerText :返回所有的文本内容,不包括HTML标签
      操作元素的内容
        修改:
            元素对象.innerHTML="新的内容" HTML标签会被解析,覆盖原有内容
            元素对象.innerText="新的内容" HTML标签不会被解析,覆盖原有内容
        注意:
            如果在修改是需要保留原有内容,则使用:元素对象名+="新的内容";
    document操作元素对象的样式
        获取HTML元素对象
          操作样式:
            添加样式:
                元素对象名.style.样式名=样式值
            修改样式:
                元素对象名.style.现有样式名=新的样式值
        注意:
            还以通过元素对象.className="类选择器名"来添加样式。
    document操作元素对象的文档结构
        第一种方式:使用innerHTML
                    div.innerHTML=div.innerHTML+"内容"//增加节点
                    div.innerHTML=""//删除所有子节点
                    父节点=子节点对象.parentNode
                    父节点.removeChild(子节点对象)//删除指定的子节点。
        第二种方式:获取元素对象                    
            新建节点:
                var 变量名=document.createElement("标签名")//返回创建的HTML元素对象
                添加节点
                    节点对象.属性=属性值// 设置节点属性的值
                    节点对象.appendChild(节点对象);
                删除节点
                    节点对象.removeChild(节点对象);
11.js操作form表单
        获取form表单对象
            使用id: var fm=document.getElementById("fm");
            使用name属性:var frm=document.frm;
        获取form下的所有表单元素对象集合
            fm.elements
        form表单的常用方法
            表单对象.submit();//提交表单数据。
        form的属性操作:
            表单对象名.action="新的值"//动态的改变数据的提交路径
            表单对象名.method="新的值"//动态的改变提交方式
        js表单元素的通用属性
            只读模式:
                readonly="readonly"//不可以更改,但是数据可以提交
            关闭模式:
                disabled="disabled"//不可以进行任何的操作,数据不会提交。
12.js操作form表单元素
    js操作多选框、单选框
        被选中状态下在js中checked属性值为true,未选中状态为false;
    js操作下拉框:
        被选择的option对象在js中selected属性值为true,未选中为false
    js校验form表单

关于JS的一些东西的更多相关文章

  1. 借鉴一些关于js框架的东西

    八款Js框架介绍及比较,Dojo .Scriptaculous .Prototype .yui-ext .Jquery .Mochikit.mootools .moo.fx,componentartu ...

  2. Node.js npm 详解

    一.npm简介 安装npm请阅读我之前的文章Hello Node中npm安装那一部分,不过只介绍了linux平台,如果是其它平台,有前辈写了更加详细的介绍. npm的全称:Node Package M ...

  3. js 对象的_proto_

    js 对象呢,有个属性叫_proto_,以前没听说过,也没关注,最近看这个原型,就被迫知道了这个东西,js 这里面的东西,真是规定的很奇怪,具体为啥也不知道,就测试发现的,对象的_proto_属性,和 ...

  4. 在Visual Studio上开发Node.js程序

    [题外话] 最近准备用Node.js做些东西,于是找找看能否有Visual Studio上的插件以方便开发.结果还真找到了一个,来自微软的Node.js Tools for Visual Studio ...

  5. 浅析JS中的模块规范(CommonJS,AMD,CMD)

    如果你听过js模块化这个东西,那么你就应该听过或CommonJS或AMD甚至是CMD这些规范咯,我也听过,但之前也真的是听听而已. 现在就看看吧,这些规范到底是啥东西,干嘛的. 一.CommonJS ...

  6. 浅析JS中的模块规范(CommonJS,AMD,CMD)////////////////////////zzzzzz

    浅析JS中的模块规范(CommonJS,AMD,CMD)   如果你听过js模块化这个东西,那么你就应该听过或CommonJS或AMD甚至是CMD这些规范咯,我也听过,但之前也真的是听听而已.     ...

  7. JS, Node.js, npm简介

    序 听过JS,听过Node,也听过Node.js,还听过npm,然而并不是很清楚的知道都代表什么,这两天调接口,然后前端同学很忙,就自己把前端代码拿过来跑了,也趁机了解一下这几个概念,下边做个小的总结 ...

  8. node.js入门及express.js框架

    node.js介绍 javascript原本只是用来处理前端,Node使得javascript编写服务端程序成为可能.于是前端开发者也可以借此轻松进入后端开发领域.Node是基于Google的V8引擎 ...

  9. js作用域和词法分析

    都知道js中不存在类似于c++等语言的块级作用域,例如for循环中定义的变量,其实是属于当前对象下的属性,同一对象下可以随便访问.只有函数可以限定一个变量的作用范围,即函数才是变量的作用域. 对于函数 ...

随机推荐

  1. springboot中使用ContextLoaderListener.getCurrentWebApplicationContext();获取WebApplicationContext为空问题

    WebApplicationContext applicationContext = ContextLoaderListener.getCurrentWebApplicationContext(); ...

  2. JMD Handy Baby 2 to Decode & Adding New BMW 525 ID46 Key

    Here OBD2TOOL share the guide on how to use JMD Handy Baby II to decode and add new keys for BMW 525 ...

  3. Linux配置ntp时间服务器(全)

    时间服务器作用: 大数据产生与处理系统是各种计算设备集群的,计算设备将统一.同步的标准时间用于记录各种事件发生时序, 如E-MAIL信息.文件创建和访问时间.数据库处理时间等. 大数据系统内不同计算设 ...

  4. TensorFlow数据读取

    TensorFlow高效读取数据的方法 TF Boys (TensorFlow Boys ) 养成记(二): TensorFlow 数据读取 Tensorflow从文件读取数据 极客学院-数据读取 十 ...

  5. loadtxt()函数的糟心历程

    原计划:导入一个csv文件,然后算出平均值 import numpy as np c=np.loadtxt('d:\python36\data.csv', delimiter=',', usecols ...

  6. 学习Acegi应用到实际项目中(2)

    Acegi应用到实际项目中(1)是基于BasicProcessingFilter的基本认证,这篇改用AuthenticationProcessingFilter基于表单的认证方式. 1.authent ...

  7. drf4 视图与路由组件

    APIView和View的区别 不管是View还是APIView最开始调用的都是as_view() APIView继承了View, 并且执行了View中的as_view()方法,最后把view返回了, ...

  8. Chrome浏览器用AdBlockPlus拦截百度广告

    一:安装AdBlockPlus插件,这个貌似要FQ安装,不知道可不可以本地安装: 二:在右侧的扩展那里找到ABP扩展,然后设置-高级-我的过滤列表栏-开始创建我的过滤列表: 三:在列表栏里添加 bai ...

  9. VsCode编写和调试.NET Core

    本文转自:https://www.cnblogs.com/Leo_wl/p/6732242.html 阅读目录 使用VsCode编写和调试.NET Core项目 回到目录 使用VsCode编写和调试. ...

  10. overlay fs挂载及操作测试

    overlayfs是目前使用比较广泛的层次文件系统,实现简单,性能较好,可以充分利用不同或则相同overlay文件系统的page cache,具有 上下合并 同名遮盖 写时拷贝 等特点. 一个 ove ...