JavaScript：觸發多個事件？
[英]JavaScript: Triggering Multiple Events?
問題描述
我想完成這個我在情人節那天為我媽媽做的項目。
我希望能夠點擊一個h2並讓它觸發多個事件，例如將背景顏色設為綠色，將h2的字體大小更改為 50px 之類的更大的大小，並將h1的字體大小更改為 50px
我從來沒有從一個 onclick 事件同時觸發多個事件。 我很樂意幫助讓媽媽開心。
body { background-color: lightblue; }
<html> <body> <h1 style="color:purple; text-align:center;" onclick="this.style.color='yellow'; this.style.fontSize='40px'; document.body.style.backgroundColor='green';"> Happy Valentines Day Mom! </h1> <img src="Source/me.jpg" alt="This is Me" width="300" height="300" align="middle"> <p align="center" style="color:white;" onmouseover="this.style.textDecoration='underline';" onmouseout="this.style.textDecoration='';"> Lots of love and wishes on this day. It is not possible to repay the love that you have given to me. I just can love you, dear mom. Take my lots of love on this Happy Valentine's Day. </p> <img src="source/mom.jpg" alt="Mom" width="200" height="200" align="middle"> <h1 style="color:blue; text-align:center;" onclick="this.innerHTML='Best Mother Ever!';"> I love you so much! - J </h1> <br> <h2 id="joke" align="center" style="color:white;" onmouseover="this.style.textDecoration='line-through';" onmouseout="this.style.textDecoration='';">PS I love you more!</h2> <button type="button" onclick='document.getElementById("joke").innerHTML = "PSS you are the best!"'>Click Me!</button> </body> </html>
1 個解決方案
解決方案1
1 2020-03-11 18:09:35
我認為最好使用 CSS 文件處理樣式。
創建一個 CSS 文件並設置一些類，例如：
h2.valentines {
background-color: green;
font-size: 50px;
color: white;
}
然后在onclick事件上，您可以傳遞一個函數將類添加到您想要的元素，就像這樣：
function addValentineClass() {
const element = document.getElementById('joke');
element.className = "valentines";
}
JavaScript觸發事件
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.