码迷,mamicode.com
首页 > Web开发 > 详细

HTML DOM setAttribute()、与createAttribute()用法区别

时间:2018-01-30 16:45:45      阅读:351      评论:0      收藏:0      [点我收藏+]

标签:ext   elements   span   nodevalue   独立   语法   pre   end   col   

setAttribute()、与createAttribute() 都可以动态的为DOM 添加属性;但是用法却不一样;

 

1、setAttribute()

setAttribute() 直接在DOM节点上添加属性:

语法:

element.setAttribute(attributename,attributevalue)

例子:

<p >
    <span>1</span>,
    <span>2</span>
    <span>3</span>
    <span>4</span>
    <span>5</span>
</p>

在<p>节点上添加title属性:

var p=document.getElementsByTagName(‘p‘)[0];
p.setAttribute(‘title‘,‘one to five‘);

技术分享图片

2、createAttribute()用法相对复杂一点;

语法:

element.setAttributeNode(attributenode)
var ti=document.createAttribute(‘title‘);//创建独立的属性节点
ti.nodeValue=‘one to five‘;//设置属性节点值
var p=document.getElementsByTagName(‘p‘)[0];
p.setAttributeNode(ti)
//追加的设置属性节点

可以看出,createAttribute(),与setAttributeNode()是在一起使用的,与createTextNode(),createElement() 类似;先独立的创建文本节点、属性节点或元素节点。然后再追加到已有的文档节点后面;不同的是追加文本节点和元素节点使用appendChild()方法;追加属性节点使用setAttributeNode()方法。

直接使用setAttribute()要方便的多。

 

HTML DOM setAttribute()、与createAttribute()用法区别

标签:ext   elements   span   nodevalue   独立   语法   pre   end   col   

原文地址:https://www.cnblogs.com/engeng/p/8383890.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!