我在哪里錯了-JAVASCRIPT
[英]Where Am I Going Wrong Here - JAVASCRIPT
問題描述
我最近參加了一個微不足道的在線編碼挑戰賽，並且由於我是一個完整的新手，因此非常感謝您使用以下代碼對此問題提供一些指導。
從本質上講，HTML結尾的腳本應該在鼠標懸停並再次移開時更改“標題”和“頁腳”的顏色，但是由於我不知道的某些原因，這僅適用於“標題”而不適用於“頁腳”。
我喜歡麻煩解決，發現幾個小時的搜索通常可以找到所需的答案，但是我根本無法在這里找出錯誤。
我將永遠感激任何能為我指出正確方向的編碼人員。
非常感謝
湯米·沃爾什（Tommy Walsh）
更新：我了解在提出這個問題之前，我似乎沒有進行足夠的研究，但是相信我，我花了數小時來查看代碼。 我第一次使用getElementById，但仍然沒有借口可能會浪費這么多瑣碎的時間。
我會在進一步詢問之前進一步研究，
謝謝所有受訪者
header, aside, article, footer{ color: black; float:left; padding-left: 15px; padding-right: 15px; } #container { font-family: helvetica; background-color: #ffffff; width: 960px; height: 500px; margin: 0 auto; } header { background-color: green; width: calc(100% - 30px); } aside { background-color: yellow; clear:left; width: calc(20% - 30px); } article { background-color:blue; width: calc(80% - 30px); height: 400px; } footer{ background-color:red; width: 100%; width: calc(100% - 30px); }
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>Day 5 JavaScript</title> <link href="index.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="container"> <header id="title"> <h1>My Page Title</h1> </header> <aside> <p>Migas shabby chic bitters keytar occupy kinfolk. Pug gochujang heirloom cornhole sustainable single-origin coffee crucifix organic fashion axe, tumeric polaroid trust fund vegan tattooed. </p> </aside> <article> <h2>My Article Header</h2> <p> Pop-up fashion axe iPhone, tumblr put a bird on it lumberjack sartorial. Keytar coloring book plaid, marfa unicorn gluten-free affogato gastropub synth. Quinoa before they sold out sustainable, kinfolk bicycle rights XOXO yuccie craft beer cred asymmetrical hell of synth. Portland messenger bag aesthetic, kinfolk kogi try-hard cardigan. Raclette venmo forage disrupt cred bitters. Mustache sustainable XOXO, williamsburg meditation wayfarers distillery thundercats unicorn truffaut occupy twee four dollar toast irony. Green juice tumeric la croix thundercats scenester af </p> </article> <footer> <p> Footer content in here</p> </footer> </div> <script> document.getElementById('title').onmouseenter = function() { this.style.backgroundColor = 'purple'; }; document.getElementById('title').onmouseleave = function() { this.style.backgroundColor = 'green'; }; </script> <script> document.getElementById('footer').onmouseenter = function() { this.style.backgroundColor = 'purple'; }; document.getElementById('footer').onmouseleave = function() { this.style.backgroundColor = 'green'; }; </script> </body> </html>
4 個解決方案
解決方案1
3 已采納 2017-08-23 22:32:21
這是因為您的html中沒有footer ID。 將<footer>更改為<footer id="footer"> ，即可解決問題。
另外-您應該查看:hover的css偽類-這使此操作變得容易得多！
解決方案2
2 2017-08-23 22:32:09
通過ID獲取元素。 您的頁腳沒有ID。
解決方案3
1 2017-08-23 22:33:44
嘗試選擇頁腳的方式存在缺陷，因為您使用的是getElementById方法，但是頁腳沒有id 。 您有2個選擇：
- 在頁腳標記中添加一個
id，例如id="footer"-考慮到您已經完成的操作，這是最簡單的方法。 - 更改Javascript以使用
getElementsByTagName方法。 請記住，這將返回一個Node列表，這意味着您必須在該節點列表中選擇第一個元素（索引0），如下所示：document.getElementsByTagName('footer')[0]
解決方案4
0 2017-08-24 00:36:00
document.querySelector()將返回與給定選擇器匹配的第一個元素。
如果您使用document.querySelector()代替document.getElementById()像這樣：
document.querySelector('footer').onmouseenter = function() {...}
您將無需修改HTML。
HTML 文檔中的 Javascript 函數，我哪里出錯了？
[英]Javascript function inside HTML document, where am I going wrong?
我在這里的數學哪里出了問題，試圖從日期時間中提取正確的時間？
[英]Where am I going wrong with my math here to try and extract the correct hours from a date time?
我要改變顏色 <div> 在mouseOver函數上的javascript中。我在哪里出錯？
[英]I'm to change color of <div> in javascript on mouseOver function.Where am i going wrong?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.