如何在javascript中将fadeIn淡出效果添加到`div.style.display`？答案

【问题标题】：How add fadeIn fadeOut effects to `div.style.display` in javascript?如何在javascript中将fadeIn淡出效果添加到`div.style.display`？
【发布时间】：2015-12-11 08:13:10
【问题描述】：

我是 javascript 新手，我找到了这个示例代码：

HTML：

<div id="newpost">
  Test text
</div>

<button id='button'>Click</button>

JavaScript：

var button = document.getElementById('button');

button.onclick = function() {
var div = document.getElementById('newpost');
   if (div.style.display !== 'none') {
      div.style.display = 'none';
     }
   else {
    div.style.display = 'block';
        }
   };

演示：http://jsfiddle.net/andrewwhitaker/hefGK/

我的问题是：如何在这段代码中添加一些效果？

【问题讨论】：

真的，我不懂jquery，也不知道怎么用。因为我测试了一些 jquery 代码但它不起作用：/

标签： javascript html effects effect

【解决方案1】：

在您的 html 文件的头部，您可以像处理 js 文件一样获得 jquery。

<head>
<script src="jquery-1.11.3.min.js"></script>
<script src="myjs"></script>
</head>

JQuery 有一个非常简单的方法来淡入和淡出任何元素

$( "#newpost" ).fadeIn( "slow", function() {
    // Animation complete
});

【讨论】：

谢谢，我用Razor engine，我的观点是layout。我应该在哪里放置 jquery 代码？
你在哪里分配你自己的脚本？我知道 razor 引擎来自 asp.net，如果你正在使用它，JQuery 可能已经分配，你可以开始使用它。如果不是，你应该像我在模板头部显示的那样分配它，或者完全在你的页脚底部。但请确保在使用任何其他脚本之前分配 JQuery。否则这些脚本将无法使用 JQuery。
我检查了你所说的一切，我把你的代码放在你认为的任何地方，但它还没有工作。
您能展示一下您是如何添加自己的脚本的，还是自动完成的？你的脚本有什么错误吗？
是的，当然。这是我的一些代码jsfiddle.net/L9yfgL7x，抱歉耽误您的时间