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);。
1、原生javascript方法小汇的更多相关文章
- javascript学习-原生javascript的小特效(原生javascript实现链式运动)
以下代码就不详细解析了,在我之前的多个运动效果中已经解析好多次了,重复的地方这里就不说明了,有兴趣的童鞋可以去看看之前的文章<原生javascript的小特效> <!DOCTYPE ...
- javascript学习-原生javascript的小特效(多个运动效果整理)
以下代码就不详细解析了,在我之前的多个运动效果中已经解析好多次了,重复的地方这里就不说明了,有兴趣的童鞋可以去看看之前的文章<原生javascript的小特效> <!DOCTYPE ...
- javascript学习-原生javascript的小特效(改变透明度效果)
前些日子看了个视频所以就模仿它的技术来为大家做出几个简单的JS小特效 ( 以下效果兼容IE5+ IE5-以下没有测试哦) 今天为大家演示的效果是一个div,鼠标经过的时候透明度为100%,鼠标移出的时 ...
- javascript学习-原生javascript的小特效(多物体运动效果)
前些日子看了个视频所以就模仿它的技术来为大家做出几个简单的JS小特效 今天为大家做的是多个物体的运动效果, 1:HTML <body> <ul> <li> ...
- javascript学习-原生javascript的小特效(简单的运动效果)
前些日子看了个视频所以就模仿它的技术来为大家做出几个简单的JS小特效 一:运动特效(主要是通过改变元素的left,right,height,width,opacity来达到运动的效果) 我们今天做一个 ...
- 原生JavaScript常用本地浏览器存储方法一(方法类型)
有时需要将网页中的一些数据保存在浏览器端.好处就是当下次访问页面时,直接就可以从本地读取数据,不需要再次向服务器请求数据.目前常用的有以下几种方法: 1.cookie cookie会随着每次HTTP请 ...
- 原生javascript开发仿微信打飞机小游戏
今天闲来无事,于是就打算教一个初学javascript的女童鞋写点东西,因此为了兼顾趣味性与简易程度,果断想到了微信的打飞机小游戏.. 本来想用html5做的,但是毕竟人家才初学,连jquery都还不 ...
- javascript原生bind方法ie低版本兼容详解
上一篇文章讲到了javascript原生的bind方法: http://www.cnblogs.com/liulangmao/p/3451669.html 这篇文章就在理解了原生bind方法的原理以后 ...
- 原生javascript实现类似jquery on方法的行为监听
原生javascript有addEventListener和attachEvent方法来注册事件,但有时候我们需要判断某一行为甚至某一函数是否被执行了,并且能够获取前一行为的参数,这个时候就需要其他方 ...
随机推荐
- Linux0.11进程切换和TSS结构
TSS 全称为task state segment,是指在操作系统进程管理的过程中,进程切换时的任务现场信息. X86体系从硬件上支持任务间的切换.为此目的,它增设了一个新段:任务状态段( ...
- [WinForm]dataGridView背景色交替
方法一: //设置表格背景色 dgvSaleOrder.RowsDefaultCellStyle.BackColor = Color.Ivory; //设置交替行的背景色 dgvSaleOrder.A ...
- Dynamics CRM2011 通过DeveloperToolkit在VS中部署遇到的问题
接上一篇继续,说个在部署的过程中我遇到了个问题:"Error registering plugins and/or workflows. Plug-in assembly does not ...
- Android拼图游戏的设计逻辑,从切图到交互动画,从关卡到倒计时,实例提高!
Android拼图游戏的设计逻辑,从切图到交互动画,从关卡到倒计时,实例提高! 群英传的最后一章,我大致的看了一下这个例子,发现鸿洋大神也做过,就参考两个人的设计逻辑,感觉都差不多,就这样实现起来了 ...
- (C++)string类杂记
本文特记录C++中string类(注意string是一个类)的一些值得注意的地方. string类的实例是以‘\0'结束的吗? 这个问题有时还真容易混淆,因为我们可能会将 C++ 语言中的string ...
- android 打造不同的Seekbar
最近项目需要用到双向的seekbar,网上找了好多野不能达到要求,偶然一次机会看到了大众点评的例子,然后我最他做了优化,并对常用的seekbar做了总结. 向上两张图: 比如双向seekbar pub ...
- UE4 动画系统
1. 准备一套带动作的模型,并导入UE4 2. 新建一个动画蓝图,右键->Animation->AnimationBlueprint,选择继承AnimationInst ...
- Netflix公布个性化和推荐系统架构
Netflix的推荐和个性化功能向来精准,前不久,他们公布了自己在这方面的系统架构. 3月27日,Netflix的工程师Xavier Amatrain和Justin Basilico在官方博客发布文章 ...
- 数据挖掘进阶之序列模式分析算法GSP的实现
序列模式分析算法GSP的实现 一.算法简介 序列模式定义:给定一个由不同序列组成的集合,其中,每个序列由不同的元素按顺序有序排列,每个元素由不同项目组成,同时给定一个用户指定的最小支持度阈值,序列模式 ...
- Github 错误合集:Failed connect to github.com:8080 || Failed connect to github.com:443; No error
文/skay 地址:http://blog.csdn.net/sk719887916/article/details/40541199 开发中遇到github无法pull和push代码问题,原来git ...