美文网首页web入门学习
js中括号操作属性

js中括号操作属性

作者: 我本无常 | 来源:发表于2018-09-16 10:22 被阅读7次
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>js中括号操作属性</title>
        <script type="text/javascript">
            window.onload = function(){
                var oDiv = document.getElementById('div1');
                //oDiv.style.color = 'red';//red必须加引号,否则会认为它是一个变量,引起来会认为它是一个值,赋值给=号左边
                var attr = 'color';
                // oDiv.style[attr] = 'red';
                /* 通过[]操作属性可以写变量 */
                oDiv['style'][attr] = 'red';
    
                /* 通过innerHTML可以读写元素包括的内容 */
                alert(oDiv.innerHTML);//读取标签里面包裹的元素,即“这是一个div元素”
    
                var oDiv2 = document.getElementById('div2');
                // oDiv2.innerHTML = '这是第二个div元素';//向div标签中插入内容
                oDiv2.innerHTML = "<a href='http://www.baidu.com'>百度网</a>";//向div标签中插入超链接标签
    
                /*
                document.write和innerHTML的区别
                document.write只能重绘整个页面
                innerHTML可以重绘页面的一部分
                */
            }
        </script>
    </head>
    <body>
        <div id="div1">这是一个div元素</div>
        <div id="div2"></div>
    </body>
    </html>  
    

    相关文章

      网友评论

        本文标题:js中括号操作属性

        本文链接:https://www.haomeiwen.com/subject/ekvxnftx.html