<style type="text/css">
.one{width: 300px;height: 300px;border: 1px solid red;padding :5px;}
</style>
<body>
<img src="images/2.jpg" alt="" id="pic">
<div id="box"></div>
</body>
<script>
var img=document.getElementById('pic')
var o=document.getElementById('box');
</script> //方法一 node.属性名=属性值
img.src='images/1.jpg';//属性设置
img.className='one'; //属性值获取
//取值 node.属性名
console.log(img.src);//绝对路径 //方法二 node.setAttribute('属性名',' 属性值')
img.setAttribute('src','images/1.jpg');
img.setAttribute('class','one');
img.setAttribute('alt','提示');
//取值 node.getAttribute('属性名');不需要转换
var cls=img.getAttribute('class');
var s=img。getAttribute('src');//相对路径
console.log(cls);
console.log(s); //方法三 node['属性']="值"
img['src']='images/1.jpg';
img['title']='我是图片';
img['className']='one';
//取值
console.log(img['src']);//绝对路径
console.log(img['title']);属性的设置：
node.属性名=属性值； 此方法特殊方法需要转换 class—–>className
node.setAttribute( ‘属性名’， 属性值)； 此方法特殊方法不需要转换 class—–>class
node[ ‘属性’ ]=属性值； 此方法特殊方法需要转换 class—–>className for
属性值得获取：
node.属性名；
node.getAttribute(属性名)；
node[‘属性名’]；
注意：属性的设置和获取方法建议：配对使用