innerHTML、document获取对象、className修改样式

<style type="text/css">
    .inn2{
        background-color: blue;
    }
    .inn3{
        font-size: 55px;
    }
    .inn4{
        width: 900px;
    }
</style>

<div id="inn">
        文本内容
    </div>
    <a name="ob2"></a>
    <div id="inn2">
        改变style样式
    </div>
    <script type="text/javascript">
        var obj = document.getElementById("inn");//根据id获取对象
        var obj4 = document.getElementById("inn2");//根据id获取对象
        var obj2 = document.getElementsByName("ob2");//根据name获取对象
        var obj3 = document.getElementsByTagName("a");//根据标签属性获取对象
        obj.innerHTML="<b>改变文本内容</b>";//识别HTML标签
        obj.innerText="<b>改变文本内容</b>";//不识别HTML标签，将所有的都当作文本内容
        obj4.style.backgroundColor="red";//backgroung-color-->backgroundColor
        obj.className="inn2";//通过加class控制样式
        obj.className="inn3 inn4";//通过加class控制样式
        obj.className="";//清空样式
        alert(obj);
        alert(obj2);
        alert(obj3.length);
    </script>

 

转载于:https://www.cnblogs.com/0710whh/p/9301462.html