js对象

最新推荐文章于 2024-09-16 09:19:02 发布

Q_Quiet

最新推荐文章于 2024-09-16 09:19:02 发布

阅读量275

点赞数

分类专栏： 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>