js对象

Q_Quiet

于 2019-09-29 20:31:28 发布

阅读量259

点赞数

分类专栏： js 文章标签： j's

本文链接：https://blog.csdn.net/q_quiet/article/details/96995032

版权

js 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

JavaScript对象的使用方法

对象是由属性和方法封装而成的，所以属性的引用就是使用“.”，通过上下标的方式引用

对象方法的引用:ObjectName.methods();

一、HTML DOM对象

当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model）

1.DOM操作HTML

改变HTML输出流

	<script>
        document.write("hello");
    </script>

不要在文档加载完成之后使用document.write(),这会覆盖该文档

改变页面中所有HTML元素

通过id寻找HTML元素,改变HTML内容使用innerHTML属性：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <p id="pid">Hello</p>
    <button οnclick="demo()">按钮</button>
    <script>
    function demo(){
		document.getElementById("pid").innerHTML = "world";
	}
	</script>        
</body>
</html>

通过标签名找到HTML元素

document.getElementsByTagName(“p”);

改变页面中所有HTML属性,直接使用属性名改变属性

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <a id="aid" href="http://baidu.com">Hello</p>
    <button οnclick="demo()">按钮</button>
 
    <script>
        function demo(){
            document.getElementByTagName("a").href = "http://www.sina.com";
        }
    </script>        
</body>
</html>

DOM对象控制HTML的方法:

getElementsByName()：获取name

getElementsByTagName()：获取元素

getAttribute()：获取元素属性

setAttribute()：设置元素属性

childNodes()：访问子节点

parentNodes()：访问父节点

createElement()：创建元素节点

createTextNode()：创建文本节点

insertBefore()：插入节点

removeChild()：删除节点

offsetHeight()：网页尺寸

scorllHeight()：网页尺寸

JS内置对象

1.String字符串对象 String对象用于处理已有的字符串，字符串可以使用单引号或双引号

length属性：得到当前字符串的长度

indexOf()：在字符串中查找字符串，存在返回当前字符串的位置，不存在返回-1

match()：内容匹配,存在直接返回内容，不存在返回null

replace()：替换内容

toUpperCase()/toLowerCase() 字符串大小写转换

strong>split()：字符串转为数组


<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <script>
        var str = "hello,welcome,javascript";
        var s = str.split(",");
        document.write(s[1]);
    </script>        
</body>

2.Data日期对象用来处理日期和时间
在这里插入图片描述
3.Array数组对象使用单独的变量名来存储一系列的值

var myArray=[“hello”,“welcome”,“javascript”];

通过指定数组名以及索引号码，可以访问某个特定的元素

数组常用方法：

concat()：合并数组

sort()：排序

push()：末尾追加元素

reverse()：数组元素翻转

4.Math对象执行常见的算数任务

常用方法：

round()：四舍五入

random()：返回0-1之间随机数

max()：返回其中的最大值

min()：返回其中的最小值

abs()：返回绝对值

浏览器对象

1.Window对象

window对象指当前的浏览器窗口，所有JavaScript全局对象、函数以及变量均自动成为window对象的成员，全局变量是window对象的属性，全局函数是window对象的方法

window尺寸：

window.innerHeight 浏览器窗口的内部高度

window.innerWidth 浏览器窗口的内部宽度

window方法：

window.open()：打开新窗口

window.close()：关闭当前窗口

2.计时器

通过JavaScript，可以做到在一个设定的时间间隔之后执行代码，称之为计时事件

计时方法：

setInterval()：间隔指定毫秒数不停地执行指定代码

learInterval()：用于停止setInterval()方法

setTimeout()：暂停指定的毫秒数后执行指定的代码

clearTimeout()：用于停止执行setTimeout()
在这里插入图片描述
3.History对象

window.history对象包含浏览器的历史的集合

History方法：

history.back()：与在浏览器中点击后退按钮相同

history.forward()：与在浏览器中点击向前按钮相同

history.go()：进入历史中的某个页面

4.Location对象

用于获取当前页面的地址，并把浏览器重定向到新的页面

Location对象的属性：

Location.hostname 返回主机的域名

Location.pathname 返回当前页面的路径和文件名

Location.port返回web主机的端口

Location.protocol 返回所使用的文web协议

Location.href 返回当前页面的URL

Location.assign() 方法加载新的文档

5.Screen对象

包含有关用户屏幕的信息

属性：

screen.availWidth 可用的屏幕宽度

screen.availHeight 可用的屏幕高度

screen.Height 屏幕高度

screen.Width 屏幕宽度

Q_Quiet

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js对象

JavaScript对象的使用方法对象是由属性和方法封装而成的，所以属性的引用就是使用“.”，通过上下标的方式引用对象方法的引用:ObjectName.methods();一、HTML DOM对象当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model）1.DOM操作HTML改变HTML输出流 <script> docum...
复制链接

扫一扫

专栏目录