Javascript 在DOM完全加载之前隐藏父元素_Javascript_Jquery_Css_Wordpress_Owl Carousel

Javascript 在DOM完全加载之前隐藏父元素

javascript jquery css wordpress

Javascript 在DOM完全加载之前隐藏父元素,javascript,jquery,css,wordpress,owl-carousel,Javascript,Jquery,Css,Wordpress,Owl Carousel,嗨，我正试着做一个幻灯片来展示我的Wordpress主题。该主题使用了破损的owl carousel 2滑块，因此我选择将其替换为工作正常的滑块，只是在页面完全加载之前，滑块divs会大量显示在彼此上方我试图隐藏滑块，直到页面完全加载，但我的代码没有工作 CSS <style type="text/css"> #myslideri{ visibility:hidden;} </style> <script type="text/javascript"

嗨，我正试着做一个幻灯片来展示我的Wordpress主题。该主题使用了破损的owl carousel 2滑块，因此我选择将其替换为工作正常的滑块，只是在页面完全加载之前，滑块

div

s会大量显示在彼此上方

我试图隐藏滑块，直到页面完全加载，但我的代码没有工作

CSS

<style  type="text/css">
  #myslideri{ visibility:hidden;}
</style>

<script type="text/javascript"> 
function loadF() {
  document.getElementByID('myslideri').style.visibility='visible';     
} 
</script>

您应该使用

getElementById

而不是

getElementById

。这就是问题所在。

myslideri是元素的实际id吗？你能给我们看一下HTML吗？它的

getElementById

不是

getElementById

是的，我用的是getElementById，但我的脚本上没有输入她@Mariocach我将发布完整的HTML。谢谢，这就是问题所在。看起来我花了很长时间修复了上一张幻灯片，所以我忘记了基本属性语法。@SalemF您应该使用一个好的IDE，它允许代码完成，以避免此类问题。我个人使用Aptana Studio，看看这个：好吧，这就是JS的问题，它是区分大小写的，以一种奇怪的方式，我怎么能记住它只有

capital而没有

，这就是所谓的CamelCase符号。谷歌让它知道更多

<body <?php body_class(); ?> onload="loadF() ">
...
</body>

<script type='text/javascript' src='http://wp.example.com/wp-includes/js/jquery/jquery.js?ver=1.11.3'></script>
<script type='text/javascript' src='http://wp.example.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1'></script>
<link rel='https://api.w.org/' href='http://wp.example.com/wp-json/' />
.....
<script type='text/javascript' src='http://wp.example.com/wp-content/plugins/contact-form-7/includes/js/jquery.form.min.js?ver=3.51.0-2014.06.20'></script>
<script type='text/javascript' src='http://wp.example.com/wp-content/themes/new-theme/assets/js/app.js?ver=20141212'></script>
<script type='text/javascript' src='http://wp.example.com/wp-includes/js/wp-embed.min.js?ver=4.4'></script>
<script type='text/javascript' src='http://wp.example.com/wp-content/plugins/contact-form-7/includes/js/scripts.js?ver=4.3.1'></script>
<script type='text/javascript' src='http://wp.example.com/wp-content/plugins/bootstrap-for-contact-form-7/assets/scripts.min.js?ver=1.3.0'></script>
<script type='text/javascript' src='http://wp.example.com/wp-content/themes/new-theme/assets/libs/bootstrap/dist/js/bootstrap.js?ver=20141212'></script>
<script type='text/javascript' src='http://wp.example.com/wp-content/themes/new-theme/assets/libs/bootstrap-hover-dropdown/bootstrap-hover-dropdown.js?ver=20141212'></script>
<script type='text/javascript' src='http://wp.example.com/wp-content/themes/new-theme/assets/libs/owl.carousel/dist/owl.carousel.min.js?ver=20141212'></script>
<script type='text/javascript' src='http://wp.example.com/wp-content/themes/new-theme/assets/libs/FlexSlider/jquery.flexslider-min.js?ver=20141212'></script>
<script type='text/javascript' src='http://wp.example.com/wp-content/themes/new-theme/assets/libs/fancybox/jquery.fancybox.js?ver=20141212'></script>
<script type='text/javascript' src='http://wp.example.com/wp-content/themes/new-theme/assets/libs/mixitup/src/jquery.mixitup.js?ver=20141212'></script>
<script type='text/javascript' src='http://wp.example.com/wp-content/themes/new-theme/assets/libs/scrollreveal/dist/scrollReveal.js?ver=20141212'></script>