js的常用对象及方法使用

1、js的string对象（*****）

• **创建String对象
• **var str = "abc";
• **方法和属性
• **属性 length:字符串的长度

**方法
（1）与html相关的方法
-bold():加粗
-fontcolor():设置字符串的颜色
-fontsize():设置字体大小

-link():将字符串显示为超链接
str4.link("hello.html")

-sub():把字符显示为下标
-sup():下标

（2）与java相似的方法
-concat():连接字符串
var str1 = "abc";
var str2 = "def";
document.write(str1.concat(str2));

-charAt():返回指定位置的字符串
document.write("<hr />");
var str3 = "abcdefg";
document.write(str3.charAt(20));//字符位置不存在，返回空字符串

-indexOf():返回字符串的位置
document.write("<hr />");
var str4 = "abcdefg";
document.write(str4.indexOf("w"));

-split():切分字符串，成数组
var str5 = "a-b-c-d-e-f-g";
var arr1 = str5.split("-");
document.write(arr1.length);

-replace():替换字符串
*传递两个参数
--第一个参数是原始字符
--要替换成的字符
document.write("<hr />");
var str6 = "abcde";
document.write(str6.replace("a","Q"));

-substr()和substring():
*document.write("<hr />");
var str7 = "abcdefghuiop";
document.write(str7.substr(5,5));
//从第五位开始，向后截取五个字符
document.write("<br />")
document.write(str7.substring(5,3));
//从第几位开始，到第几位结束，但是最后一位不包括


2、js的array对象（*****）
**创建数组（三种）
-var arr1 = [1,2,3];
-var arr2 = new Array(3);
-var arr3 = new Array(1,2,3);

**属性：length：查看数组长度
**方法：

-concat(): 连接数组
document.write("<hr />");
var arr11 = [1,2,3];
var arr12 = [4,5,6];
document.write(arr11.concat(arr12));

-join():根据指定字符分割数组
document.write("<hr />");
var arr13 = new Array(3);
arr13[0] = "a";
arr13[1] = "b";
arr13[2] = "c";

document.write(arr13);
document.write("<br />");
document.write(arr13.join("-"));

-push():向数组末未添加元素，并且返回数组的新的长度
document.write("<hr />");
var arr14 = new Array(3);
arr14[0] = "tom";
arr14[1] = "lucy";
arr14[2] = "jack";
document.write(arr14);
document.write("<br />");
document.write("old length:"+arr14.length);
document.write("<br />");
document.write("new length"+arr14.push("zhangsan"));
document.write("<br />");
document.write("new array:"+arr14);

-pop():删除末尾元素
document.write("<hr />");
var arr17 = ["zhangsan","lisi","wangwu"];
document.write("old array:"+arr17);
document.write("<br />");

document.write("return:"+arr17.pop());
document.write("<br />");
document.write("new array:"+arr17);

-reverse():颠倒数组元素
document.write("<hr />");
var arr18 = ["zhang1","lisi","wangwu","niuqi"];
document.write("old array:"+arr18);
document.write("<br />");

document.write("return:"+arr18.reverse());
document.write("<br />");
document.write("new array:"+arr18);

3、js的date对象（*****）
**在java里面获取当前时间
Date date = new Date();
//格式化
//toLocaleString()
**js获取当前时间
document.write("<hr />");
var date = new Date();
document.write(date);
//转换成习惯的格式
document.write("<hr />");
document.write(date.toLocaleString());

-getFullYear(): 获取当前年
document.write("<hr />");
document.write("yesr:"+date.getFullYear());

-获取当前的月
document.write("<hr />");
var date1 = date.getMonth()+1;
document.write("month:"+date1);
**返回的是0-11，如果想要得到准确的值，加1

-获取当前的星期
getDay():星期，返回的是（0-6）
把星期日作为一周的第一天(0)
document.write(date.getDay())；
*获取星期的时候，星期日是0

-获取当前的天
//得到当前的天
document.write("<hr />");
document.write("day:"+date.getDate());

-获取当前的小时
//得到当前的小时
document.write("<hr />");
document.write("hour:"+date.getHours());

-得到当前的分钟
document.write("<hr />");
document.write("minutes:"+date.getMinutes());

-得到当前的秒
document.write("<hr />");
document.write(date.getSeconds());

-getTime():获取毫秒
//得到当前的毫秒
document.write("<hr />");
document.write(date.getTime());
**应用场景
**使用毫秒数处理缓存的效果
http://www.baidu.com?毫秒数


4、js的math对象（*****）
*静态方法，直接Math.random()
*数学的对象
**都是静态对象，可以就直接类名.方法

-ceil(x):向上舍入

-floor(x);向下舍入

-round(x);四舍五入

-random():得到随机数（）
**得到0-9的随机数
document.write("<hr />");
document.write(Math.floor(Math.random()*10));


5、js的全局函数
*直接写方法名称 eval（）
**这些函数不属于任何一个对象，直接写名称调用

-eval():执行js代码
var str = "alert('1234');";
document.write(str);
eval(str);

-encodeURI():对字符进行编码
document.write("<hr />");
var str1 = "测试中文aaa1234";
var encode1 = encodeURI(str1);
document.write(encode1);

-decodeURI():对字符进行解码
document.write("<hr />");
var decode1 = decodeURI(encode1);
document.write(decode1);

-isNaN():判断当前字符串是否是数字
var str2 = "aa";
alert(isNaN(str2));
**如果不是数字，返回true
**如果是数字，返回false

-parseInt()：类型转换
document.write("<hr />");
var str3 = "123";
document.write(str3+1);
document.write("<br />");
document.write(parseInt(str3)+1);

6、js的函数重载(方法名相同，参数不同)
面试经常问
*js不存在重载
*可以通过其他方式模拟重载的效果
*通过数组argument把传递的参数放到该数组里
*通过判断数组的长度进行计算



==========================
7、js的BOM对象（******）
浏览器对象模型

**有哪些对象
-navigator
获取浏览器的信息
-screen
获取屏幕的信息
-location
请求和设置的URL地址
-href属性
-history
请求的URL的历史记录
实现到上一个页面和下一个页面；
上一个
history.back();
到下一个
history.forward();

***window（********）
*窗口对象
*顶层对象（所有的bom对象都是在window里边操作的）

**方法
-window.alert():页面弹出一个框，显示内容
简写:alert();

-window.confirm()：确认框
var flag = window.confirm("是否删除");

-prompt():输入对话框
prompt("请输入","");

-open():打开一个新的窗口
function open1(){
window.open("day_3.1.html","","width = 200,height=100");
}
-close():关闭窗口
*浏览器兼容性差




8、window对象（******）
——方法都要掌握
——setInterval和setTimeout
***做定时器
setInterval("js代码"，毫秒数)1秒等于1000毫秒
每三秒，执行一次alert方法
window.setInterval("alert('123')",3000);
setTimeout("js代码"，毫秒数)
-表示在毫秒数之后执行，但是只会执行一次
window.setTimeout("alert('abc')",4000);

**clearInterval()清除定时器
var id1 = window.setInterval("alert('123')",3000);
function clear1(){
clearInterval(id1);
}

**clearTimeout()清除定时器
var id2 = window.setTimeout("alert('abc')",4000);
function clear2(){
clearTimeout(id2);
}
9、DOM简洁和解析html
*DOM:document cbject model:文档对象模型
**文档
超文本标记文档html、xml

**对象
提供了属性和方法

**模型
可以使用js里面提供的对象，使用这些对象的属性和方法 ，对标记型文档进行操作
**想要对标记型文档进行操作，首先需要对标记型文档里面所有的内容封装成对象
--余姚吧html里面的标签、属性、文本内容都封装成对象

**要想对标记型文档进行操作，解析标记型文档
--画图分析，如何使用dom解析html
***解析过程
根据html的层次结构，在内存中分配一个树形结构，需要把html中的每部分都封装成对象
-document对象：整个文档
-element对象：标签对象
-属性对象
-文本对象

--Node节点对象：这个对象使这些对象的父对象
***如果在对象里面找不到想要的方法，这个时候到Node对象里面去找

10、document对象
**getElementById
**getElementsByName:返回数组
**getElementsByTagName:返回数组
**write方法
11、案例：window练习
--两个输入项，一个按钮
--按钮上面事件：弹出一个新窗口open();
2.创建弹出的页面
--表格
--每一个有一个按钮和编号和姓名
--每一个按钮上有一个事件，把当前的编号和姓名复制到相应文本框
****实现S1方法
function s1(num1,name1){
//需要把num1和name1赋值到window页面
//跨页面的操作 opener：可以得到创建这个窗口的窗口
var pwin = window.opener;
pwin.document.getElementById("numid").value = num1;
pwin.document.getElementById("nameid").value = name1;
//关闭窗口
window.close;
}