1 <div id="box" style=‘height:100px;background: red;‘></div> 2 <script type="text/javascript"> 3 var box = document.getElementById(‘box‘); 4 /* 5 可读可写,可以修改行内样式和css样式,行内样式未定义也可修改 6 7 */ 8 //box.style.width = ‘200px‘; 9 // box.style.height = ‘200px‘; 10 //box.style.background = ‘red‘ 11 //box.style.backgroundColor = ‘red‘ 12 //box.style.float = ‘right‘ 13 //box.className = ‘wrap‘; 14 //box.style.cssText += ‘height:100px;backgroundColor:blue;‘ 15 16 17 </script>
自定义标签属性
1 <div id="box" ajing=‘帅哥‘></div> 2 <script type="text/javascript"> 3 var box = document.getElementById(‘box‘); 4 /* 5 标签的自定义属性/自定义标签属性 6 getAttribute 获取自定义标签属性 7 setAttribute 设置自定义标签属性 8 removeAttribute 移除自定义标签属性 9 10 11 js 12 是叫做自定义属性 13 */ 14 15 //var aa = box.getAttribute(‘ajing‘) 16 //box.setAttribute(‘fgyu‘ , ‘大帅哥‘) 17 //box.removeAttribute(‘ajing‘) 18 19 20 box.fengyu = ‘啊晶123‘ 21 22 console.log(box.fengyu)
作业:
案例qq空间左侧导航的实现:链接