Dom之标签属性
一、標簽默認屬性的查找與修改
查找
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>標簽操作</title>
</head>
<body>
<!--定義一個div標簽和一個a標簽-->
<!--div默認屬性:id,class,style,可以通過"."的方式找到，自定義屬性則不可以-->
<div id="container" class="c1" style="font-size: 12px;color: red" sb="'xx">
<div>武功秘籍</div>
<div>家常菜譜</div>
</div>
<a href="http://www.baidu.com">添加</a>
<script type="text/javascript">
var obj = document.getElementById('container');
console.log(obj.id);
// class屬性對應className值，font-size屬性對應fontSize值
console.log(obj.className);
console.log(obj.style.fontSize);
console.log(obj.sb);
</script>
</body>
</html>
結果：
container
c1
12px
undefined
修改
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>標簽操作</title> </head> <body><!--定義一個div標簽和一個a標簽--><!--div默認屬性:id,class,style,可以通過"."的方式找到，自定義屬性則不可以--><div id="container" class="c1" style="font-size: 12px;color: red" sb="'xx"><div>武功秘籍</div><div>家常菜譜</div></div><a href="http://www.baidu.com">添加</a><script type="text/javascript">var obj = document.getElementById('container'); // 對已列出的默認屬性可以修改其值，沒有列出的默認屬性或自定義屬性只能通過setAttribute設置obj.id='con';obj.className = 'cla_c1';obj.style.fontSize='20px';</script> </body> </html>
二、標簽屬性管理的萬能神器
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>標簽操作</title> </head> <body><!--定義一個div標簽和一個a標簽--><!--div默認屬性:id,class,style,可以通過"."的方式找到，自定義屬性則不可以--><div id='container' style="font-size: 12px;color: red" sb="'xx"><div>武功秘籍</div><div>家常菜譜</div></div><a href="http://www.baidu.com">添加</a><script type="text/javascript">var obj = document.getElementById('container'); // 對于標簽默認屬性或自定義屬性均可設置，且名稱定義可見即可得obj.setAttribute('class','container');obj.setAttribute('kong','kongzhagen');</script> </body> </html>效果圖
?
轉載于:https://www.cnblogs.com/kongzhagen/p/6160827.html
總結
- 上一篇： codewars-random（2）
- 下一篇： ADO