javascript - 试图动态删除/添加隐藏类来操作 DOM
问题描述
我想要达到的目标：
我正在做一个项目，即尽可能地克隆一个电影网站。我有一组按钮，每个按钮都与列表元素相关联。当用户单击其中一个按钮时，我想删除我设置的cssdisplay: none类，该类是与单击的按钮相关的列表元素，同时将相同的CSS类应用于不相关的列表元素它。
问题：
我不确定我在这里做错了什么。没有帮助的是控制台没有显示任何类型的错误消息。发生的事情是所有列表元素都应用了css类，但我想要显示的列表元素没有显示。
请看下面我的代码
HTML：
<div class="container">
<section class="showtimes">
<ul class="screening-days">
<li class="selectday active" id="clickMon">Monday</li>
<li class="selectday" id="clickTue">Tuesday</li>
<li class="selectday" id="clickWed">Wednesday</li>
<li class="selectday" id="clickThur">Thursday</li>
<li class="selectday" id="clickFri">Friday</li>
<li class="selectday" id="clickSat">Saturday</li>
<li class="selectday" id="clickSun">Sunday</li>
<li>Coming Soon</li>
</ul>
<span class="filter">
<p>Filter Films</p>
</span>
</section>
</div>
<div class="movie-showtimes">
<ul class="movie-timing mon-listings">
<li class="daytimeshow mondaylisting">MONDAY<br>10:45</li>
<li class="daytimeshow mondaylisting">MONDAY<br>13:10</li>
<li class="daytimeshow mondaylisting">MONDAY<br>15:45</li>
<li class="daytimeshow mondaylisting">MONDAY<br>18:25</li>
<li class="daytimeshow mondaylisting">MONDAY<br>20:30</li>
<li class="daytimeshow mondaylisting">MONDAY<br>21:50</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>13:50</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>15:10</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>17:30</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>20:00</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:30</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:50</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>10:45</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>13:10</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>15:45</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>18:25</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:30</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:50</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>11:20</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>14:45</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:50</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>18:00</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:45</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:15</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>10:45</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>13:10</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>15:45</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>18:25</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:30</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:50</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>13:15</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:30</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>19:45</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:15</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:30</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>14:45</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:30</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>18:10</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>20:35</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>21:15</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:45</li>
</div>
</div>
<div class="classic-movie">
<div class="movie-summary">
<div class="movie-image">
<img src="images/movie-images/back-to-the-future.jpg" class="movie-thumbnail">
</div>
<div class="movie-name-plot">
<h1>Back to the Future (1985)</h1>
<p>Marty McFly, a typical American teenager of the Eighties, is accidentally sent back to 1955 in a plutonium-powered DeLorean 'time machine' invented by a slightly mad scientist. During his often hysterical, always amazing trip back in time, Marty must make certain his teenage parents-to-be meet and fall in love - so he can get back to the future.</p>
<p><span class="white-mini-header">Starring:</span> Michael J. Fox, Christopher Lloyd, Lea Thompson</p>
<p><span class="white-mini-header">Runtime:</span>116 min</p>
</div>
</div>
<div class="movie-showtimes">
<ul class="movie-timing mon-listings">
<li class="daytimeshow mondaylisting">MONDAY<br>11:20</li>
<li class="daytimeshow mondaylisting">MONDAY<br>14:45</li>
<li class="daytimeshow mondaylisting">MONDAY<br>16:50</li>
<li class="daytimeshow mondaylisting">MONDAY<br>18:00</li>
<li class="daytimeshow mondaylisting">MONDAY<br>19:45</li>
<li class="daytimeshow mondaylisting">MONDAY<br>22:15</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>14:45</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>16:30</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>18:10</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>20:35</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:15</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:45</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>10:45</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>13:10</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>15:45</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>18:25</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:30</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:50</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>11:20</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>14:45</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:50</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>18:00</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:45</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:15</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>10:45</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>13:10</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>15:45</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>18:25</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:30</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:50</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>13:15</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:30</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>19:45</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:15</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:30</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>14:45</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:30</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>18:10</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>20:35</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>21:15</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:45</li>
</ul>
</div>
</div>
<div class="classic-movie">
<div class="movie-summary">
<div class="movie-image">
<img src="images/movie-images/first-blood.jpg" class="movie-thumbnail">
</div>
<div class="movie-name-plot">
<h1>First Blood (1982)</h1>
<p>John Rambo is a disoriented Vietnam Vet. He is hitchhiking from town to town to see friends from the war. A sheriff tries to make him leave town and when he refuses, arrests him for vagrancy. While in jail, a deputy takes delight in abusing him. Rambo escapes showing his old Vietnam fighting skills and takes to the woods as the sheriff and deputies try and find him in his element. Things get out of hand as Colonel Trautman, Rambo's old commander, appears to shed light on the situation.</p>
<p><span class="white-mini-header">Starring:</span>Sylvester Stallone, Brian Dennehy, Richard Crenna</p>
<p><span class="white-mini-header">Runtime:</span>93 min</p>
</div>
</div>
<div class="movie-showtimes">
<ul class="movie-timing mon-listings">
<li class="daytimeshow mondaylisting">MONDAY<br>10:45</li>
<li class="daytimeshow mondaylisting">MONDAY<br>13:30</li>
<li class="daytimeshow mondaylisting">MONDAY<br>17:00</li>
<li class="daytimeshow mondaylisting">MONDAY<br>18:45</li>
<li class="daytimeshow mondaylisting">MONDAY<br>20:15</li>
<li class="daytimeshow mondaylisting">MONDAY<br>22:00</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>13:50</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>15:10</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>17:30</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>20:00</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:30</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:50</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>14:45</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>16:30</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>18:10</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:35</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:15</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>22:45</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>11:20</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>14:45</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:50</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>18:00</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:45</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:15</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>10:45</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>13:10</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>15:45</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>18:25</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:30</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:50</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>13:15</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:30</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>19:45</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:15</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:30</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>14:45</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:30</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>18:10</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>20:35</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>21:15</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:45</li>
</ul>
</div>
</div>
<div class="classic-movie">
<div class="movie-summary">
<div class="movie-image">
<img src="images/movie-images/breakfast-club.jpg" class="movie-thumbnail">
</div>
<div class="movie-name-plot">
<h1>The Breakfast Club (1985)</h1>
<p>They were five students with nothing in common, faced with spending a Saturday detention together in their high school library. At 7 a.m., they had nothing to say, but by 4 p.m., they had bared their souls to each other and become good friends. To the outside world they were simply a Brain, an Athlete, a Basket Case, a Princess, and a Criminal, but to each other, they would always be the Breakfast Club.</p>
<p><span class="white-mini-header">Starring:</span>Emilio Estevez, Judd Nelson, Molly Ringwald</p>
<p><span class="white-mini-header">Runtime:</span>97 min</p>
</div>
</div>
<div class="movie-showtimes">
<ul class="movie-timing mon-listings">
<li class="daytimeshow mondaylisting">MONDAY<br>13:15</li>
<li class="daytimeshow mondaylisting">MONDAY<br>14:30</li>
<li class="daytimeshow mondaylisting">MONDAY<br>18:10</li>
<li class="daytimeshow mondaylisting">MONDAY<br>19:45</li>
<li class="daytimeshow mondaylisting">MONDAY<br>20:15</li>
<li class="daytimeshow mondaylisting">MONDAY<br>22:30</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>13:50</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>15:10</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>17:30</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>20:00</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:30</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:50</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>10:45</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>13:10</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>15:45</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>18:25</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:30</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:50</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>11:20</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>14:45</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:50</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>18:00</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:45</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:15</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>10:45</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>13:10</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>15:45</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>18:25</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:30</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:50</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>13:15</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:30</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>19:45</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:15</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:30</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>14:45</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:30</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>18:10</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>20:35</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>21:15</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:45</li>
</ul>
</div>
</div>
<div class="classic-movie">
<div class="movie-summary">
<div class="movie-image">
<img src="images/movie-images/halloween.jpg" class="movie-thumbnail">
</div>
<div class="movie-name-plot">
<h1>Halloween (1979)</h1>
<p>The year is 1963, the night: Halloween. Police are called to 43 Lampkin Ln. only to discover that 15 year old Judith Myers has been stabbed to death, by her 6 year-old brother, Michael. After being institutionalized for 15 years, Myers breaks out on the night before Halloween. No one knows, nor wants to find out, what will happen on October 31st 1978 besides Myers' psychiatrist, Dr. Loomis. He knows Michael is coming back to Haddonfield, but by the time the town realizes it, it'll be too late for many people.</p>
<p><span class="white-mini-header">Starring:</span>Donald Pleasence, Jamie Lee Curtis, Tony Moran</p>
<p><span class="white-mini-header">Runtime:</span>91 min</p>
</div>
</div>
<div class="movie-showtimes">
<ul class="movie-timing mon-listings">
<li class="daytimeshow mondaylisting">MONDAY<br>14:45</li>
<li class="daytimeshow mondaylisting">MONDAY<br>16:30</li>
<li class="daytimeshow mondaylisting">MONDAY<br>18:10</li>
<li class="daytimeshow mondaylisting">MONDAY<br>20:35</li>
<li class="daytimeshow mondaylisting">MONDAY<br>21:15</li>
<li class="daytimeshow mondaylisting">MONDAY<br>22:45</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>13:30</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>15:00</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>18:00</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>18:15</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:30</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:15</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>16:30</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>17:00</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>19:45</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:00</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:45</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>22:30</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>12:30</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>13:30</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>15:15</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:15</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:00</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:30</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>16:30</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>17:00</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>19:45</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:00</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:45</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>22:30</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:45</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>16:30</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:35</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>21:15</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:45</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>12:30</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>13:30</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>15:15</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:15</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>19:00</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:30</li>
</ul>
</div>
</div>
<div class="classic-movie">
<div class="movie-summary">
<div class="movie-image">
<img src="images/movie-images/goodfellas.jpg" class="movie-thumbnail">
</div>
<div class="movie-name-plot">
<h1>Goodfellas (1990)</h1>
<p>Henry Hill might be a small time gangster, who may have taken part in a robbery with Jimmy Conway and Tommy De Vito, two other gangsters who might have set their sights a bit higher. His two partners could kill off everyone else involved in the robbery, and slowly start to think about climbing up through the hierarchy of the Mob. Henry, however, might be badly affected by his partners' success, but will he consider stooping low enough to bring about the downfall of Jimmy and Tommy?</p>
<p><span class="white-mini-header">Starring:</span>Robert De Niro, Ray Liotta, Joe Pesci</p>
<p><span class="white-mini-header">Runtime:</span>146 min</p>
</div>
</div>
<div class="movie-showtimes">
<ul class="movie-timing mon-listings show">
<li class="daytimeshow mondaylisting">MONDAY<br>12:25</li>
<li class="daytimeshow mondaylisting">MONDAY<br>13:30</li>
<li class="daytimeshow mondaylisting">MONDAY<br>14:50</li>
<li class="daytimeshow mondaylisting">MONDAY<br>17:35</li>
<li class="daytimeshow mondaylisting">MONDAY<br>20:15</li>
<li class="daytimeshow mondaylisting">MONDAY<br>22:30</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>13:50</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>15:10</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>17:30</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>20:00</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:30</li>
<li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:50</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>10:45</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>13:10</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>15:45</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>18:25</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:30</li>
<li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:50</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>11:20</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>14:45</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:50</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>18:00</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:45</li>
<li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:15</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>10:45</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>13:10</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>15:45</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>18:25</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:30</li>
<li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:50</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>13:15</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:30</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>19:45</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:15</li>
<li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:30</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>14:45</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:30</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>18:10</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>20:35</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>21:15</li>
<li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:45</li>
</ul>
</div>
</div>
</div>
JavaScript：
$(document).ready(function() {
var daytimeshow = document.querySelectorAll(".selectday");
var showtimeListings = document.querySelectorAll(".daytimeshow");
var mondayShowings = document.querySelectorAll(".mondaylisting");
var tuesdayShowings = document.querySelectorAll(".tuesdaylisting");
var wednesdayShowings = document.querySelectorAll(".wednesdaylisting");
var thursdayShowings = document.querySelectorAll(".thursdaylisting");
var fridayShowings = document.querySelectorAll(".fridaylisting");
var saturdayShowings = document.querySelectorAll(".saturdaylisting");
for (var i = 0; i < daytimeshow.length; i++){
daytimeshow[i].addEventListener("click", function(){
if (this.id === "clickTue"){
for (var i = 0; i < showtimeListings.length; i++){
if (showtimeListings[i].classList === "tuesdaylisting"){
showtimeListings[i].classList.remove("hideElement");
} else {
showtimeListings[i].classList.add("hideElement");
}
}
}
})
}
});
解决方案
由于每个元素上有多个类名，因此您应该使用contains()而不是===比较类名：
if (showtimeListings[i].classList.contains("tuesdaylisting"))
推荐阅读
- html - 物化；模态显示来自正文的按钮
- java - 如何在 Intellij 2019.1 中删除光标后面的行注释？
- python - MySQL查询返回旧结果
- download - 使用 Web API Core 和 Angular 7 下载文件
- office365 - 如何使用 Microsoft Graph API 获取 O365 应用程序？
- javascript - Tic-Tac-Toe 游戏——Regex 想要比 3x3 棋盘更多的字符？
- ruby-on-rails - 在 date_select 中，当“年”中放入 0 时，“日”中添加 2
- java - 为什么 MANIFEST.MF 和类文件中的 JDK 版本不同
- google-apps-script - Session.getActiveUser().getEmail() 不适用于移动设备
- java - 为什么在 DBCP2 中使用 Statement 时后续创建临时表会引发错误？