javascript - JS 網頁換膚之問題
問題描述
<link href='http://www.4tl426be.cn/wenda/green.css' rel='stylesheet' type='text/css' />
window.onload = function (){ var oLink = document.getElementsByTagName('link')[0]; var oSkin = document.getElementById('skin').getElementsByTagName('li');for(var i = 0; i< oSkin.length; i++) {oSkin[i].onclick = function (){ for(var p in oSkin) oSkin[p].className = ''; this.className = 'current'; oLink[’href’] = this.id + '.css';}} };
<body><p id='outer'> <ul id='skin'><li >紅</li><li >綠</li><li >黑</li> </ul> <ul id='nav'><li><a href='javascript:;'>新聞</a></li><li><a href='javascript:;'>娛樂</a></li><li><a href='javascript:;'>體育</a></li><li><a href='javascript:;'>電影</a></li><li><a href='javascript:;'>音樂</a></li><li class='last'><a href='javascript:;'>旅游</a></li> </ul></p></body>
this.className = 'current'表示什么？ 是對應當前頁面是綠色狀態下的按鈕嗎
問題解答
回答1：this.className = 'current'; 將當前被點擊的那個<li> 的class 設為 current，達到動態更改標簽樣式的目的
回答2：.css 應該是一個樣式文件，通過id來載入指定的皮膚樣式。
link 是一個 html element，用來載入資源的。
回答3：一般來說，換膚的話會涉及到很多CSS。我一般都會把外聯的CSS換掉來做這個功能。假設我現在有一個HTML文件和兩個HTML皮膚（就是倆CSS文件，一紅一黃）。簡單的代碼如下<!DOCTYPE html><html><head>
<meta charset='utf-8'><title>test</title><link rel='stylesheet' href='http://www.4tl426be.cn/wenda/red.css'>
</head><body>
<button id='red'>red</button><button id='yellow'>yellow</button><script> var css = document.getElementById('css'); var red = document.getElementById('red'); var yellow = document.getElementById('yellow'); red.onclick = function () {css.href = 'http://www.4tl426be.cn/wenda/red.css'; }; yellow.onclick = function () {css.href = 'http://www.4tl426be.cn/wenda/yellow.css'; };</script>
</body></html>大概就是這個感覺
回答4：你這個代碼應該沒完，他這個代碼的意思估計是修改皮膚，動態加載css樣式。
相關文章：
1. angular.js - webpack build后的angularjs路由跳轉問題2. java - Activity中的成員變量被賦值之后，Activity被回收的時候內存才會被釋放嗎3. java - web項目中，用戶登陸信息存儲在session中好 還是cookie中好，取決于什么？4. php由5.3升級到5.6后，登錄網站，返回的是php代碼，不是登錄界面，各位大神有知道的嗎？5. 數組按鍵值封裝！6. 我寫的哪里有錯？請大神幫忙查看一下。7. tp5.0，param獲取全部參數8. 使用list和each配合，的作業，輸出一行后，如何換行9. 老師，flex-shrink: 1; 按視頻操作，不會自動縮放10. 為什么 必須在<ul> 下建立 <li> 在建<a>?
網公網安備