从display:none到display:block时,使用Javascript淡入元素

Question

我有一个脚本,当按下单选按钮时显示一个元素.我试图淡化元素的显示,所以它不是那么突然.

JS:

document.getElementById('next').style.display = 'block';
document.getElementById('next').fadeIn(1000);

除了动画淡入淡出之外,这种方法很好.我究竟做错了什么.我尝试将两个语句组合成一个语句,我也尝试在display:block之前设置淡入淡出,但它根本没有出现.对JS来说还是比较新的,所以我只想弄清楚什么是可能的.提前致谢

Answer 1

.fadeIn()DOM 元素上没有方法。

document.getElementById('ques_2').fadeIn(1000);

您可能会看到一些 jQuery 或其他库代码。该代码必须在包装 DOM 元素的 jQuery（或其他）对象上运行。

另一种适用于现代浏览器的方法是使用 CSS3 过渡。您可以让 JavaScript 应用一个新类，并让 CSS 负责视觉效果。

如果您确实想使用像 jQuery 这样的库，则需要将其导入到您的页面中。例如，将其放入head页面的：

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

然后按照API 规则获取 DOM 元素并调用方法。

您可以使用本机 DOM 方法来获取数据，也可以只使用 jQuery，如果您决定加载它，这很有意义。