zoukankan      html  css  js  c++  java
  • 1、原生javascript方法小汇

    Js 对象

    使用new 关键字来创建对象,举例如下,

    var a = new String();
    如构造函数无参数,则不必加括号,

    JS内部对象
    数组(Array)对象
    创建数组
    var myarray = new Array(0); //创建一个长度为0的数组

    var myarray = new Array(1,2,3); //创建一个指定长度的数组,禀赋初值
    数组长度不固定,赋值即可改变长度,数组的主要属性为lengh,返回数组长度,

    数组的常用方法:
    reverse 方法 :将JavaScript 数组对象内容反转。
    contact 方法 :将两个或更多数组组合在一起,举例如下。

    var newArray = tmtArray.contact(tmpArray);

    join 方法:返回一个将数组所有元素用指定符号连在一起的字符串,举例如下:

    var newArray = tmpArray.join(".");

    pop()方法:移除数组中的最后一个元素,并返该元素
    shift()方法:将移除数组中的第一个元素,并返回该元素
    slice()方法:返回数组的一部分,

    var newArray = tmpArray.slice(1,3);

    日期(Date)对象

    Date 对象可以用来表示任意的时间和日期

    创建Date

    必须使用new操作符来创建对象

    var date = new Date(“2017,12,26”);

    获取日期的时间和方法:

    getYear();返回年数
    getMonth();返回当日号数
    getDay();返回星期几,0代表周日

    gethours();返回小时数,
    getMinutes() 返回分钟数
    getSeconds();返回秒数
    getTime 返回毫秒数

    设置日期和时间的方法:

    setYear();设置年数
    setMonth();设置当日号数
    setDay();设置星期几,0代表周日

    sethours();设置小时数,
    setMinutes() 设置分钟数
    setSeconds();设置豪秒数
    setTime 设置毫秒数


    String 对象

    创建String对象
    创建字符串对象的示例代码如下
    var firstString = “this is a String”;
    var secondString = new String ("this is a String");

    String 对象的主要属性为length,返回字符串长度

    String对象的常用方法:
    charAt 返回指定索引位置处的字符,索引从0开始
    contact(str)连续字符串
    indexof(str) 返回String 对象内第一次出现字符串的字段位置(从左到右查找)

    lastindexof(str) 返回String对象中子字符串最后出现的位置
    replace(str1,str2)返回将str替换为str2后的字符串
    split(s.l) 将字符串s作为分隔符,切割成多个字符串,并将它返回一个数组,如果有l参数,则返回数组l个因素;
    SubString返回一个指定位置之间的子字符串,包头不包尾、
    tolowerCase,返回字符串,转小写
    toUpperCase 返回字符串,转大写


    Math 对象

    Math对象是全局对象,使用时不需要创建,
    Math对象的属性

    LN10;10的自然对数
    LN2;2的对数
    PI:圆周率
    SQRT1_2:1/2的平方根

    SQRT2:2的平方根

    abs(x)返回x的绝对值
    celi(x)返回大于等于X的最大整数
    floor(x)返回小于等于X的最大整数
    round(x)舍入到最近整数
    sqrt(x)返回X的平方根
    random(): 返回0~1之间的随机数

    Js对象模型

    窗口(window)对象

    使用Open()方法可打开一个新窗口,示例代码如下,
    open 方法有3个参数:第一个参数代表要载人新窗口页面的URL,第二个参数代表新窗口的名称,第三个参数代表窗口的属性,多个属性间

    用逗号隔开,

    对话框(与用户交互)方法
    alert
    该方法的功能是弹出一个提示框
    prompt
    该方法的功能是弹出可以输入信息的文本框,第一个参数代表文本框的默认值
    confirm
    该方法的功能是弹出对话框,提示确认信息,示例代码如下

    history
    history对象记录着浏览器浏览过的每一个页面,这些页面组成了一个历史记录列表,它有3个有效方法:
    forward();将历史记录向前移动一个页面。
    back();将历史记录向后移动一个页面,网页中经常使用该方法提供一个返回功能
    go 转向历史记录中指定地址,使用此方法需要一个参数,参数可以是正负整数或字符串。如果参数是字符串,那么浏览器就会被搜索列表

    ,找到最接近当前页面位置且url 地址中含有此字符串的页面,然后跳转到该页面。

    location对象

    window对象的location属性可以直接改变URL地址,


    还可以使用location对象的href属性清空页面,

    还可以使用location 对象的href 属性或replace(URL)方法改变URL地址,


    document 对象

    forms集合

    在同一个页对象面上有多个表单,通过document。forms[]数组获得这些表单对象要比使用表单名称方便的多

    getELementById(id)方法
    该方法的功能是获得指定id值的表单控件
    getELementByName(name)
    该方法的功能是获得指定name值得表单控件对象,返回的是对象数组。

    document.forms[0]; //通过forms对象的索引

    document.forms["myForm"]; // 通过forms对象和表单名称

    document.myForm; // 通过表单名称


    使用document对象示例代码如下:

    <script type="text/javascript" src="引入JS的文件">
    function t(){

    /*
    通过表单获取控件
    */
    var name_1 = document.forms[0].nameTest;
    //var name_1 = document.forms["myform"].nameTest;
    //var name_1 = document.myform.nameTest;
    //var name_1 = document.myform.elements["nameTest"]
    alert("name_1="+name_1.value);

    /*
    通过name获取控件
    */
    var name_1 = document.getElementsByName("nameTest")
    alert("name_1="+name_1.value);
    /*
    通过ID获取控件
    */

    var name_1 = document.getElementsById("idTest")
    alert("name_1="+name_1.value);


    }


    </script>
    <body>

    <form action="myform">

    通过name 获取:<input type="text" name="nameTest" value="firstTextValue"><br>
    通过id获取:<input type="text" id="idTest"value="secondTextValue"> <br>

    <input type="button" value="点击我" onclick="t()">

    </form>

    </body>


    操作HTML
    1.事件处理
    通常将鼠标或热键的动作成为事件

    (1) 窗口或页面的事件处理
    窗口和页面的事件处理


    事件 说明
    onblur 当前元素失去焦点时触发
    onfocus 当某个元素获得焦点时触发
    onload 页面内容完成装载时触发
    onUpload 页面内容完成装载时触发
    当前页面被退出或重置时触发


    键盘或鼠标的事件处理


    事件 说明
    onClick 当鼠标单击时触发
    onDbClick 当鼠标双击时触发
    onMouseDown 当按下鼠标时触发
    onMouseMove 当鼠标移动时触发
    onMouseOut 当鼠标离开某对象范围时触发
    onMouseOver 当鼠标移动到某对象范围上方时触发
    onMouseUp 当鼠标按下后松开鼠标时触发
    onKeyPress 当键盘上的某个键被按下并且释放时触发
    onKeyDown 当键盘上某个键被按下时触发
    OnKeyUp 当键盘上某个键被按放开时触发

    表单元素的事件处理

    button 按钮 onClick onBlur onFocus
    checkbox 复选框 onClick onBlur onFocus
    file 上传文件 onClick onBlur onFocus
    password 密码框 onBlur onfocus onSelect
    radio 单选按钮 onClick onBlur onFocus
    select 列表 onFocus onBlur onChange
    text 文本框 onClick onBlur onFocus onChange
    textarea 文本域 onClick onBlur onFocus onChange

    表单元素
    表单元素的通用属性与方法:
    form属性:获取该表单控件所属的表单对象
    name :获取或设置表单控件的名称
    type 获取表单控件的类型
    value 获取和设置表单控件的值
    focus方法:让表单控件对象获得焦点
    blur 让表单控件对象失去焦点


    文本框

    value属性: 获得文本框的值,值是字符串类型
    defaultValue属性:获得文本框的默认值,值是字符串类型
    readonly属性: 只读,文本框中的内容不能修改,
    focus方法:获得焦点,即获得鼠标光标。
    blur:失去焦点
    select方法:选中文本框内容,突出显示输入区域。

    复选框:

    checked属性:复选框是否被选中,选中为true,未选中为false。
    value属性:设置或获取复选框的值

    单选框值:
    checked: 单选按钮是否被选中,选中为true,为选中为false
    value属性: 设置或获取单选按钮的值。

    下拉列表:

    length 属性:选项个数
    selectIndex属性:当前被选中选项的索引
    options属性 :所有的选项组成一个数组,options表示整个选项数组,第一个选项即为options[0],第二个即为options[1].其它以此类推


    option 的value属性:<option>标记中value所指定的值
    option 的text属性,显示于界面中的文本,即<option>....</option> 之间的一部分

    增加选项;每个选项都是一个option对象,可以创建option对象,然后添加到select末尾,如select,options[select,length] = new

    Option(text,value);。

  • 相关阅读:
    继承—泛型
    单例模式
    继承 4—Monkey
    继承 3—A B E
    继承 2—people
    继承 1—Mucic
    面向对象—汽车
    面向对象—封装—汽车
    Linux下查看CPU型号,内存大小,硬盘空间的命令
    redis源码——数据结构与对象
  • 原文地址:https://www.cnblogs.com/dorseych/p/8195619.html
Copyright © 2011-2022 走看看