如何使用CSS一次显示和隐藏多个元素？

我发现this article，看起来像我想要的，但我似乎无法让它工作。由于它已经过了一年多了，我认为可能有些事情可能已经改变，或者现在可能有一种更简单的方法。如何使用CSS一次显示和隐藏多个元素？

也就是说，我无法得到我上面链接的方法工作。我完全复制并粘贴，并使用<body onLoad="javascript_needed()">，因为我不确定$(document).ready(function()...应该去哪里。不幸的是，我很不熟悉Javascript。

来源

2011-09-14 Jerry Rowe

你能发布你的html，所以我们可以看到发生了什么？ – WiseGuyEh

你在页面上包含jQuery库吗？ http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery#Setup –

使用类似这样的东西;

<script> 

    $(document).ready(function(){ 
    //Code goes in here. 
    }); 

</script>

不要忘记从http://jquery.com/

也同时加载jQuery库，你将要在选择阅读起来。使用$("#myElement")将选择id为“myElement”的元素。使用$(".myElement")将选择具有“myElement”类的元素。

所以;

<div class="hideMe">Content</div> 
<div class="hideMe">Content</div> 
<div class="hideMe">Content</div> 
<div class="doNotHideMe">Content</div> 

<input type="button" class="ClickMe" value="click me"/> 

<script> 

    $(function(){ 
    $(".ClickMe").click(function(){ 
     $(".hideMe").hide(250); 
    }); 
    }); 

</script>

编辑

如果你想在网上链接到jQuery库，然后使用;

<script src="http://code.jquery.com/jquery-1.6.1.min.js" type="text/javascript"></script>

如果您下载库并将js文件插入到您的项目中，请使用;

<script src="/yourPathToTheLibrary/jquery-1.6.1.min.js" type="text/javascript"></script>

来源

2011-09-14 23:56:59 griegs

我真的不熟悉java的所有东西。我如何确保我加载JQuery库？ –

请参阅我的编辑链接 – griegs

哦，并确保链接在您的母版页中（如果有），或者在JavaScript代码前的页面顶部。 – griegs

$语法是jQuery的所有部分。如果你想在你的代码的某个地方使用jQuery然后，使用一个脚本标记，在您的文章：

<script> 
    $(function() { 
     $('.selector').hide(250); 
    }); 
</script>

如果你想纯JavaScript，然后有一点点更多的开销。不包括文件准备好的东西（这可以是很多额外的代码来做正确的...参见示例：here）。

<script> 
    elements = document.querySelectorAll('.selector'); 

    for(int i=0,len=elements.length;i<len;++i) { 
     elements[i].style.display = 'none'; 
    } 
</script>

如果您愿意，可以将它放入函数中。要显示这些元素，请将display属性设置为''。

来源

2011-09-15 00:23:11 jyore

如何使用CSS一次显示和隐藏多个元素？

回答

相关问题