上一篇文章為:→1.7.4獲取元素方法一
操作元素屬性
獲取的頁面元素糯耍,就可以對頁面元素的屬性進行操作扔字,屬性的操作包括屬性的讀和寫。
操作屬性的方法
1温技、“.” 操作
2革为、“[ ]”操作
屬性寫法
1、html的屬性和js里面屬性寫法一樣
2舵鳞、“class” 屬性寫成 “className”
3震檩、“style” 屬性里面的屬性,有橫杠的改成駝峰式蜓堕,比如:“font-size”抛虏,改成”style.fontSize”
通過“.”操作屬性:
<script type="text/javascript">
window.onload = function(){
var oInput = document.getElementById('input1');
var oA = document.getElementById('link1');
// 讀取屬性值
var val = oInput.value;
var typ = oInput.type;
var nam = oInput.name;
var links = oA.href;
// 寫(設(shè)置)屬性
oA.style.color = 'red';
oA.style.fontSize = val;
}
</script>
......
<input type="text" name="setsize" id="input1" value="20px">
<a id="link1">傳智播客</a>
通過“[ ]”操作屬性:
<script type="text/javascript">
window.onload = function(){
var oInput1 = document.getElementById('input1');
var oInput2 = document.getElementById('input2');
var oA = document.getElementById('link1');
// 讀取屬性
var val1 = oInput1.value;
var val2 = oInput2.value;
// 寫(設(shè)置)屬性
// oA.style.val1 = val2; 沒反應(yīng)
oA.style[val1] = val2;
}
</script>
......
<input type="text" name="setattr" id="input1" value="fontSize">
<input type="text" name="setnum" id="input2" value="30px">
<a id="link1">傳智播客</a>
innerHTML
innerHTML可以讀取或者寫入標簽包裹的內(nèi)容
<script type="text/javascript">
window.onload = function(){
var oDiv = document.getElementById('div1');
//讀取
var txt = oDiv.innerHTML;
alert(txt);
//寫入
oDiv.innerHTML = '<a ;
}
</script>
......
<div id="div1">這是一個div元素</div>