属性的操作

1.取得属性
每个元素都有一或多个特性,这些特性的用途是给出相应元素或其内容的附加信息。

var div = document.getElementById('mydiv');
alert(div.getAttribute("id"));   //"mydiv"

HTMLElement也会有5个属性与相应的特性一一对应。不过只有公认的(非自定义的)特性才会以属性的形式添加到DOM对象中。

<div id="btn" align="left" haha="xiao"></div>
var div = document.getElementById('mydiv');
alert(div.id);   //"mydiv"
alert(div.align);  //"left"
alert(div.haha);   //undefined (IE除外)

2.设置属性
setAttribute(),这个方法接收两个参数:要设置的特姓名和值,如果特性存在,会将原先的值替换掉,如果不存在则创建该属性并设置相应的值

div.setAttribute('id','oDiv');

3.彻底删除元素的特性。

div.removeAttribute("class");

4.创建元素
document.createElement()方法只接收一个参数,即要创建的元素名;

var div=document.createElement(div);

5.元素的子节点,因为childNodes把文本节点也都当作子节点,所以判断一下他的nodeType如果为元素的才打印。

          <ul id=ul>
            <li>1</li>
            <li>2</li>
            <li>3</li>
          </ul>
        <script type="text/javascript">
            var oUl = document.getElementById("ul");
            for(var i=0;i<oUl.childNodes.length;i++){
                if(oUl.childNodes[i].nodeType == 1){
                    console.log(oUl.childNodes[i]);
                }
            }

       //或者也可以是
            var aLi=oUl.getElementsByTagName('li');
            for (var i=0;i<aLi.length;i++) {
                console.log(aLi[i]);
            }
        </script>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,837评论 18 139
  • HTML元素包括标签名和若干个键值对,这个键值对就称为“属性”(attribute)。 上面代码中,a元素包括两个...
    周花花啊阅读 402评论 0 0
  • 个人博客:https://yeaseonzhang.github.io 花了半个多月的时间,终于又把“JS红宝书”...
    Yeaseon阅读 11,567评论 9 52
  • 不说草木深,不说云舒卷 不说花凋零,不说荷初艳 不说夏薄衫,不说双飞燕 不说,不可说 不说柳色新,不说...
    小麦iii阅读 214评论 0 4
  • 文/沈长洪 一 关于写什么 经常会被问到一个问题:老师,我写什么呢?总觉得没什么可写。我建议初学者,先从自己身边...
    落雪小屋阅读 815评论 7 53