JAVA WEB学习笔记(二)——JavaScript脚本语言

3.1.1    什么是JavaScript
    JavaScript是一种基于对象和事件驱动并具有安全性能的解释型脚本语言,不需要编译嵌入在HTTP页面中,把静态页面转变成支持用户交互并响应应用事件的动态页面。
   
3.1.2    JavaScript的主要特征
    解释性、基于对象、事件驱动、安全性(不允许访问本地硬盘,不能写入数据到服务器上,并且不允许对网络文档进行修改和删除)、跨平台
===============================================================================   
3.2.1    JavaScript的语法
    a.JavaScript区分大小写
    b.每行结尾分号可有可无
        alert("!")
        alert("1");
    以上两行代码都是正确的。(最好每行语句结尾加上分号以保证代码的准确性)
    c.变量是弱类型,只使用var运算符就可以将变量初始化为任意的值
        var username="mrsoft";  //将变量username初始化为mrsoft
        var age=20;             //将变量age初始化为20
    d.使用大括号标记代码块
    e.注释
        单行注释    //......
        多行注释   /*......*/
3.2.2    JavaScript中的关键字(不能用作变量名、函数名以及循环标签)
    ①关键字(keywords)
    break
    case
    catch
    continue
    default
    delete
    do
    else
    finally
    for
    function
    if
    in
    instanceof
    new
    return
    switch
    this
    throw
    try
    typeof
    var
    void
    while
    with
    ②保留字(reserved words)
    abstract
    boolean
    byte
    char
    class
    const
    debugger
    double
    enum
    export
    extends
    final
    float
    goto
    implements
    import
    int
    interface
    long
    native
    package
    private
    protected
    public
    short
    static
    super
    synchronized
    throws
    transient
    volatile
3.2.3    JavaScript的数据类型
    JavaScript的数据类型比较简单,主要有数值型、字符型、布尔型、转移字符、空值、未定义值6种
    a.整型
        可以是正整数、负整数和0,并且可以采用十进制、八进制、十六进制。
    b.浮点型
        由整数和小数部分组成,只能用十进制表示,但是可以采用标准方法科学计数法表示
    ......
    f.未定义值(undefined)
        当使用了一个并未声明的变量,或者使用了一个已经声明但没有赋值的变量时,将返回未定义值(undefined)
3.2.4    变量的定义及使用
    ......
3.2.5    运算符的应用
    ......
   
3.3    流程控制语句
    ......
==================================================================================
3.4.1    函数的定义
    函数是由关键字funtion、函数名加一组参数以及置于大括号中需要执行的一段代码定义的。定义函数的基本语法如下:
    function functionName([parameter 1,parameter 2]){
        statements;
        [return expression;]
    }
    参数说明如下。
    ·functionName:必选,用于指定函数名。在同一页面中,函数名必须是唯一的,区分大小写。
    ·parameter:可选,用于指定参数列表。当使用多个参数列表时,参数间用逗号隔开。一个函数最多可以有255个参数。
    ·statements:必选,是函数体,用于实现函数功能的语句。
    ·expression:可选,用于返回函数值。expression为任意的表达式、变量、常量。
    例如,定义一个用于计算商品金额的函数account(),该函数有两个参数,分别用于指定单价和数量,返回计算后的金额,具体代码如下:
    function account(price,number){
        var sum=price*number;
        return sum;
    }
3.4.2    函数的调用
    例:account(10.6,10);
   
==================================================================================
3.5.1    什么是事件处理程序
    JavaScript与Web页面之间的交互是通过用户操作浏览器页面时触发相关事件来实现的。
3.5.2    JavaScript常用事件
        常用的无返回值事件
    属性    描述
    onabort    图像的加载被中断。
    onblur    元素失去焦点。
    onchange    域的内容被改变。
    onclick    当用户点击某个对象时调用的事件句柄。
    ondblclick    当用户双击某个对象时调用的事件句柄。
    onerror    在加载文档或图像时发生错误。
    onfocus    元素获得焦点。
    onkeydown    某个键盘按键被按下。
    onkeypress    某个键盘按键被按下并松开。
    onkeyup    某个键盘按键被松开。
    onload    一张页面或一幅图像完成加载。
    onmousedown    鼠标按钮被按下。
    onmousemove    鼠标被移动。
    onmouseout    鼠标从某元素移开。
    onmouseover    鼠标移到某元素之上。
    onmouseup    鼠标按键被松开。
    onreset    重置按钮被点击。
    onresize    窗口或框架被重新调整大小。
    onselect    文本被选中。
    onsubmit    确认按钮被点击。
    onunload    用户退出页面。
        返回鼠标或者键盘的属性
    属性    描述
    altKey    返回当事件被触发时,"ALT" 是否被按下。
    button    返回当事件被触发时,哪个鼠标按钮被点击。
    clientX    返回当事件被触发时,鼠标指针的水平坐标。
    clientY    返回当事件被触发时,鼠标指针的垂直坐标。
    ctrlKey    返回当事件被触发时,"CTRL" 键是否被按下。
    metaKey    返回当事件被触发时,"meta" 键是否被按下。
    relatedTarget    返回与事件的目标节点相关的节点。
    screenX    返回当某个事件被触发时,鼠标指针的水平坐标。
    screenY    返回当某个事件被触发时,鼠标指针的垂直坐标。
    shiftKey    返回当事件被触发时,"SHIFT" 键是否被按下。
    在JavaScript中指定事件处理程序时,事件名必须小写,才能正确响应事件。

==================================================================================
3.6    常用对象
3.6.1    Window对象
    window对象即浏览器窗口对象,是一个全局对象,是所有对象的顶级对象在JS中有举足轻重的作用。
    Window对象提供了许多属性和方法,这些属性和方法被调用来操作浏览器页面的内容。
    Window对象同Math对象一样,也不需要new关键字创建对象实例,而直接使用“对象名.成员”的格式来访问其属性和方法。
            窗口对象的属性和方法:
    格式:

    [window.]属性

    [window.]方法(参数)

    opener.属性

    opener.方法(参数)

    self.属性

    self.方法(参数)

    parent.属性

    parent.方法(参数)

    top.属性

    top.方法(参数)

    窗口名称.属性

    窗口名称.方法(参数)
    ------------------------------------------
    Window对象的常用属性
    ------------------------------------------
    属性            描述
    document    当前文件的信息
    location    当前URL的信息
    name    窗口名称
    status    状态栏的临时信息
    defaultStatus    状态栏默认信息
    history        该窗口最近查阅过的网页
    closed        判断窗口是否关闭,返回布尔值
    opner        open方法打开的窗口的源窗口
    outerHeight        窗口边界的垂直尺寸,px
    outerWidth        窗口边界的水平尺寸,px
    pageXOffset        网页x-position的位置
    pageYOffset        网页y-position的位置
    innerHeight        窗口内容区的垂直尺寸,px
    innerWidth        窗口内容区的水平尺寸,px
    screenX        窗口左边界的X坐标
    screenY        窗口上边界的Y坐标
    self        当前窗口
    top        最上方的窗口
    parent        当前窗口或框架的框架组
    frames        对应到窗口中的框架
    length        框架的个数
    locationbar        浏览器地址栏
    menubar        浏览器菜单栏
    scrollbars        浏览器滚动条
    statusbar        浏览器状态栏
    toolbar        浏览器工具栏
    offscreenBuffering        是否更新窗口外的区域
    personalbars        浏览器的个人工具栏,仅Navigator
    --------------------------------------------------
    Window对象的常用方法
    --------------------------------------------------
        方法                    属性
    alert(信息字串)            弹出警告信息
    confirm(信息字串)        显示确认信息对话框
    prompt(提示字串[,默认值])        显示提示信息,并提供可输入的字段
    atob(译码字串)        对base-64编码字串进行译码
    btoa(字串)        将进行base-64编码
    back()        回到历史记录的上一网页
    forward()        加载历史记录中的下一网页
    open(URL,窗口名称[,窗口规格])
    focus()        焦点移到该窗口
    blur()        窗口转成背景
    stop()        停止加载网页
    close()        关闭窗口
    enableExternalCapture()        允许有框架的窗口获取事件
    disableExternalCapture()        关闭enableExternalCapture()
    captureEvents(事件类型)        捕捉窗口的特定事件
    routeEvent(事件)        传送已捕捉的事件
    handleEvent(事件)        使特定事件的处理生效
    releaseEvents(事件类型)        释放已获取的事件
    moveBy(水平点数,垂直点数)        相对定位
    moveTo(x坐标,y坐标)        绝对定位
    setResizable(true|false)        是否允许调整窗口大小
    resizeBy(水平点数,垂直点数)        相对调整窗口大小
    resizeTo(宽度,高度)        绝对调整窗口大小
    scroll(x坐标,y坐标)        绝对滚动窗口
    scrollBy(水平点数,垂直点数)        相对滚动窗口
    scrollTo(x坐标,y坐标)        绝对滚动窗口
    setInterval(表达式,毫秒)
    setTimeout(表达式,毫秒)
    clearInterval(定时器对象)
    clearTimeout(定时器对象)
    home()进入浏览器设置的主页
    find([字串[,caseSensitivr,backward]])        查找窗口中特定的字串
    print()
    setHotKeys(true|false)        激活或关闭组合键
    setZOptions()        设置窗口重叠时的堆栈顺序
    ---------------------------------------------------
    由于Window对象的open()方法和close()方法在实际网站开发中经常用到,下面对其进行详细讲解
        1. open方法
    语法格式:
    window.open(URL,窗口名称,窗口风格)

    功能:打开一个新的窗口,并在窗口中装载指定URL地址的网页。

    说明:

    open方法用于打开一个新的浏览器窗口,并在新窗口中装入一个指定的URL地址;

    open方法在打开一个新的浏览器窗口时,还可以指定窗口的名称(第二个参数);

    open方法在打开一个新的浏览器窗口时,还可以指定窗口的风格(第三个参数),

    窗口风格有以下选项,这些选项可以多选,如果多选,各选项之间用逗号分隔:

    toolbar:指定窗口是否有标准工具栏。当该选项的值为1或yes时,表示有标准工具栏,当该选项的值为0或no时,表示没有标准工具栏;

    location:指定窗口是否有地址工具栏,选项的值及含义与toolbar相同;

    directories:指定窗口是否有链接工具栏,选项的值及含义与toolbar相同;

    status:指定窗口是否有状态栏,选项的值及含义与toolbar相同;

    menubar:指定窗口是否有菜单,选项的值及含义与toolbar相同;

    scrollbar:指定当前窗口文档大于窗口时是否有滚动条,选项的值及含义与toolbar相同;

    resizable:指定窗口是否可改变大小,选项的值及含义与toolbar相同;

    width:以像素为单位指定窗口的宽度,已被innerWidth取代;

    height:以像素为单位指定窗口的高度,已被innerHeight取代;

    outerWidth:以像素为单位指定窗口的外部宽度;

    outerHeight:以像素为单位指定窗口的外部高度;

    left:以像素为单位指定窗口距屏幕左边的位置;

    top:以像素为单位指定窗口距屏幕顶端的位置;

    alwaysLowered:指定窗口隐藏在所有窗口之后,选项的值及含义与toolbar相同;

    alwaysRaised:指定窗口浮在所有窗口之上,选项的值及含义与toolbar相同;

    dependent:指定打开的窗口为当前窗口的一个子窗口,并随着父窗口的关闭而关闭,选项的值及含义与toolbar相同;

    hotkeys:在没有菜单栏的新窗口中设置安全退出的热键,选项的值及含义与toolbar相同;

    innerHeight:设定窗口中文档的像素高度;

    innerWidth:设定窗口中文档的像素宽度;

    screenX:设定窗口距离屏幕左边界的像素长度;

    screenY:设定窗口距离屏幕上边界的像素长度;

    titleBar:指明标题栏是否在新窗口中可见,选项的值及含义与toolbar相同;

    z-look:指明当窗口被激活时,不能浮在其它窗口之上,选项的值及含义与toolbar相同。

    open方法返回的是该窗口的引用。

    小技巧:该方法经常用于在打开一个网页时自动打开另一个窗口。

    

    2. close方法

    语法格式:

    window.close()

    功能:close方法用于自动关闭浏览器窗口。
    -----------------------------------------------
3.6.2    String对象
    ......
3.6.3    Date对象
    ......
==================================================================================
3.7    DOM(Document Object Model文档对象模型)技术
3.7.1    DOM的分层结构
    ......
3.7.2    遍历文档
    ......
3.7.3    获取文档中的元素
    ......
3.7.4    操作文档
    ......

时间: 2024-10-12 13:15:07

JAVA WEB学习笔记(二)——JavaScript脚本语言的相关文章

Java Web 学习笔记(二)

19.CSS:即(层叠)样式表,一种美化页面的技术,可以方便.灵活地设置网页中不同元素的外观属性. 20.CSS中的定位属性: (1)position:定位,分为绝对定位(absolute).相对定位(relative).静态定位(static): (2)横坐标:left,纵坐标:top; (3)宽:width,高:height: (4)overflow:定义内容超出的处理方法: (5)z-index:定义立体效果: (6)visbility:定义可见性,visible/hidden: 21.J

Java Web学习(二) Eclipse的配置

Java Web学习(二) Eclipse的配置 一.下载Eclipse 1.进入Eclipse官网,进行下载 上图,下载Eclipse IDE for JaveEE Developers 版本,然后根据windows系统32位或64位,进行选择(建议64位).如果你的机器内存过小,可以选择Eclipse的旧版本:Eclipse Indigo .Eclipse Juno . Eclipse Kepler 等版本. 2.解压缩安装 打开压缩包,将里面的Eclipse 拖出到指定位置,进行解压缩.

[原创]java WEB学习笔记75:Struts2 学习之路-- 总结 和 目录

本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱好者,互联网技术发烧友 微博:伊直都在0221 QQ:951226918 -----------------------------------------------------------------------------------------------------------------

微信小程序开发:学习笔记[5]——JavaScript脚本

微信小程序开发:学习笔记[5]--JavaScript脚本 快速开始 介绍 小程序的主要开发语言是 JavaScript ,开发者使用 JavaScript 来开发业务逻辑以及调用小程序的 API 来完成业务需求. 在大部分开发者看来,ECMAScript和JavaScript表达的是同一种含义,但是严格的说,两者的意义是不同的.ECMAScript是一种由Ecma国际通过ECMA-262标准化的脚本程序设计语言, JavaScript 是 ECMAScript 的一种实现.理解 JavaScr

[原创]java WEB学习笔记95:Hibernate 目录

本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱好者,互联网技术发烧友 微博:伊直都在0221 QQ:951226918 -----------------------------------------------------------------------------------------------------------------

[原创]java WEB学习笔记6:Struts2 学习之路--Struts的CRUD操作( 查看 / 删除/ 添加) 使用 paramsPrepareParamsStack 重构代码 ,PrepareInterceptor拦截器,paramsPrepareParamsStack 拦截器栈

本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱好者,互联网技术发烧友 微博:伊直都在0221 QQ:951226918 -----------------------------------------------------------------------------------------------------------------

java web学习笔记-jsp篇

转载自:http://www.cnblogs.com/happyfans/archive/2015/03/17/4343571.html 1.java web简介 1.1静态页面与动态页面   表现形式 所需技术 静态网页 网页内容固定,不会更新 html,css 动态网页 网页内容由程序动态显示,自动更新 html,css,DB,java/c#/php,javascript,xml,主流的动态网页脚本(jsp,asp.net,php) 1.2搭建java web开发环境 jdk1.7+tomc

[原创]java WEB学习笔记16:JSP指令(page,include),JSP标签(forwar,include,param)

本博客为原创:综合 尚硅谷(http://www.atguigu.com)的系统教程(深表感谢)和 网络上的现有资源(博客,文档,图书等),资源的出处我会标明 本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱好者,互联网技术发烧友 微博:伊直都在0221 QQ:951226918 ---------------------------------

[原创]java WEB学习笔记44:Filter 简介,模型,创建,工作原理,相关API,过滤器的部署及映射的方式,Demo

本博客为原创:综合 尚硅谷(http://www.atguigu.com)的系统教程(深表感谢)和 网络上的现有资源(博客,文档,图书等),资源的出处我会标明 本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱好者,互联网技术发烧友 微博:伊直都在0221 QQ:951226918 ---------------------------------