JS:获取元素及操作元素

本文详细介绍了JavaScript中获取和操作DOM对象的六种方式,包括getElementById、querySelector、querySelectorAll等。同时,讲解了如何设置或获取HTML内容、属性、样式,以及使用className和classList来处理元素的class属性。通过这些方法,可以实现对网页元素的全面控制。
摘要由CSDN通过智能技术生成

目录

1.获取DOM对象的     六    种方式

        2.设置或获取HTML内容

    3.设置或获取HTML属性

    4.设置或获取HTML样式

    5.element.className    设置或返回元素的class属性

    6.element.classList    返回元素的类名,作为 DOMTokenList 对象。


1.获取DOM对象的     六    种方式


        查找 HTML 元素
        
        document.getElementById();返回对拥有指定 id 的第一个对象的引用。
        document.querySelector();返回文档中匹配指定的CSS选择器的第一元素
        document.querySelectorAll();HTML5中引入的新方法,返回文档中匹配的CSS选择器的所有元素节点列表
        document.getElementsByTagName();返回带有指定标签名的对象集合。
        document.getElementsByClassName();返回文档中所有指定类名的元素集合,作为 NodeList 对象。
        document.getElementsByName();返回带有指定名称的对象集合。
    

    
    2.设置或获取HTML内容


    innerHTML:设置或获取位于对象起始和结束标签内的 HTML 
    innerText:设置或获取位于对象起始和结束标签内的文本 
    outerHTML:设置或获取对象及其内容的HTML形式 
    outerText:设置(包括标签)或获取(不包括标签)对象的文本 
    value:input,select,textarea,checkbox,radio内容的获取和设置


    3.设置或获取HTML属性


        obj.attr="新属性值";attr指属性名,如src;id;name,value,type,href,rel,type,alt,width,heigth等
        obj.属性名 = "新属性值";
        
        obj.

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值