屬性、樣式操作
改變元素樣式的方式:外部樣式表、內部樣式表、行內樣式,
獲取元素的顯示樣式
獲取節點的方式:
通過id獲取:document.getElementById() 通過選擇器來獲取:document.querySelector(),document.querySelectorAll() 通過class名字獲取:document.getElementsByClassName() 通過標簽名獲取:document.getElementsByTagName() 通過name獲取:document.getElementsByName()用classList來操作類名
添加類名: .classList.add() 移除類名: .classList.remove() 切換類名(有則移除,沒有則添加): .classList.toggle()let oWrap = document.getElementById("wrap");
//不標準的寫法
// oWrap.style = "width: 300px";
//style 這個合法的標簽屬性很特殊
console.log( oWrap.style );
oWrap.style.width = "300px";
oWrap.style.height = "200px";
oWrap.style.backgroundColor = "red";
//樣式操作
let oWrap = document.getElementById("wrap");
oWrap.onclick = function(){
// oWrap.style.width = "500px";
//在事件函式里面,可以用 this來代替oWrap
this.style.width = "500px";
};
//變相操作樣式
let oWrap = document.getElementById("wrap");
oWrap.onclick = function(){
//添加名字,點擊時,更換名字生成樣式
this.className = "fly";
};
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/243197.html
標籤:JavaScript
下一篇:JavaScript(三)
