Скрыть идентификатор DIV, используя скрипт

новый пользователь, долгое время исследователь.Скрыть идентификатор DIV, используя скрипт

Мой район использует Moodle, и я настраиваю свою страницу. Однако Moodle не нравится все коды HTML, CSS или JAVA. Поэтому мне нужно собрать его вместе. По умолчанию Moodle имеет DIV ID = "inst4"

<div id="inst4" class="block_navigation block" role="navigation" data-block="navigation" data-instanceid="4" aria-labelledby="instance-4-header" data-dockable="1"> 
    <div class="header" id="yui_3_17_2_1_1471893404838_261"><div class="title" id="yui_3_17_2_1_1471893404838_177"> 
     <div class="block_action"> 
      <img class="block-hider-hide" alt="Hide Navigation block" src="http://moodle.tcu2905.us/theme/image.php/clean/core/1470413034/t/switch_minus" tabindex="0" title="Hide Navigation block"> 
      <img class="block-hider-show" alt="Show Navigation block" src="http://moodle.tcu2905.us/theme/image.php/clean/core/1470413034/t/switch_plus" tabindex="0" title="Show Navigation block"> 
      <input type="image" class="moveto customcommand requiresjs" alt="Move this to the dock" title="Dock Navigation block" src="http://moodle.tcu2905.us/theme/image.php/clean/core/1470413034/t/block_to_dock"> 
     </div> 
     <h2 id="instance-4-header">Navigation</h2></div> 
    </div> 
    <div class="content" id="yui_3_17_2_1_1471893404838_249"> 
     <ul class="block_tree list" role="tree" data-ajax-loader="block_navigation/nav_loader" id="yui_3_17_2_1_1471893404838_248"> 
      <li class="type_unknown depth_1 contains_branch current_branch" aria-labelledby="label_1_1" tabindex="-1" id="yui_3_17_2_1_1471893404838_247"> 
      <p class="tree_item branch active_tree_node canexpand navigation_node" role="treeitem" aria-expanded="true" aria-owns="random57bb4f9c947b61_group" data-collapsible="false" tabindex="0" aria-selected="true" id="yui_3_17_2_1_1471893404838_255"> 
      <a tabindex="-1" id="label_1_1" href="http://moodle.tcu2905.us/my/">Dashboard</a></p> 
      <ul id="random57bb4f9c947b61_group" role="group" tabindex="-1"> 
       <li class="type_setting depth_2 item_with_icon" aria-labelledby="label_2_2" tabindex="-1"> 
        <p class="tree_item hasicon" role="treeitem" tabindex="-1" aria-selected="false"> 
         <a tabindex="-1" id="label_2_2" href="http://moodle.tcu2905.us/?redirect=0"> 
         <img class="smallicon navicon" alt="" src="http://moodle.tcu2905.us/theme/image.php/clean/core/1470413034/i/navigationitem" tabindex="-1"> 
         <span class="item-content-wrap" tabindex="-1">Site home</span> 
         </a> 
        </p> 
       </li> 
       <li class="type_course depth_2 contains_branch" aria-labelledby="label_2_3" tabindex="-1"> 
        <p class="tree_item branch" role="treeitem" aria-expanded="false" aria-owns="random57bb4f9c947b63_group" tabindex="-1" aria-selected="false"> 
         <span tabindex="-1" id="label_2_3" title="Tri-City United Moodle Site">Site pages</span> 
        </p> 
        <ul id="random57bb4f9c947b63_group" role="group" aria-hidden="true" tabindex="-1"> 
         <li class="type_unknown depth_3 item_with_icon" aria-labelledby="label_3_5" tabindex="-1"> 
          <p class="tree_item hasicon" role="treeitem" tabindex="-1" aria-selected="false"> 
           <a tabindex="-1" id="label_3_5" href="http://moodle.tcu2905.us/blog/index.php"> 
           <img class="smallicon navicon" alt="" src="http://moodle.tcu2905.us/theme/image.php/clean/core/1470413034/i/navigationitem" tabindex="-1"> 
           <span class="item-content-wrap" tabindex="-1">Site blogs</span> 
           </a> 
          </p> 
         </li> 
         <li class="type_custom depth_3 item_with_icon" aria-labelledby="label_3_6" tabindex="-1"> 
          <p class="tree_item hasicon" role="treeitem" tabindex="-1" aria-selected="false"> 
           <a tabindex="-1" id="label_3_6" href="http://moodle.tcu2905.us/badges/view.php?type=1"> 
            <img class="smallicon navicon" alt="" src="http://moodle.tcu2905.us/theme/image.php/clean/core/1470413034/i/navigationitem" tabindex="-1"> 
            <span class="item-content-wrap" tabindex="-1">Site badges</span> 
           </a> 
          </p> 
         </li> 
         <li class="type_setting depth_3 item_with_icon" aria-labelledby="label_3_7" tabindex="-1"> 
          <p class="tree_item hasicon" role="treeitem" tabindex="-1" aria-selected="false"> 
           <a tabindex="-1" id="label_3_7" href="http://moodle.tcu2905.us/tag/search.php"> 
            <img class="smallicon navicon" alt="" src="http://moodle.tcu2905.us/theme/image.php/clean/core/1470413034/i/navigationitem" tabindex="-1"> 
            <span class="item-content-wrap" tabindex="-1">Tags</span> 
           </a> 
          </p> 
         </li> 
         <li class="type_custom depth_3 item_with_icon" aria-labelledby="label_3_8" tabindex="-1"> 
          <p class="tree_item hasicon" role="treeitem" tabindex="-1" aria-selected="false"> 
           <a tabindex="-1" id="label_3_8" href="http://moodle.tcu2905.us/calendar/view.php?view=month"> 
            <img class="smallicon navicon" alt="" src="http://moodle.tcu2905.us/theme/image.php/clean/core/1470413034/i/navigationitem" tabindex="-1"> 
            <span class="item-content-wrap" tabindex="-1">Calendar</span> 
           </a> 
          </p> 
         </li> 
         <li class="type_activity depth_3 item_with_icon" aria-labelledby="label_3_9" tabindex="-1"> 
          <p class="tree_item hasicon" role="treeitem" tabindex="-1" aria-selected="false"> 
           <a tabindex="-1" id="label_3_9" title="Forum" href="http://moodle.tcu2905.us/mod/forum/view.php?id=1"> 
            <img class="smallicon navicon" alt="Forum" title="Forum" src="http://moodle.tcu2905.us/theme/image.php/clean/forum/1470413034/icon" tabindex="-1"> 
            <span class="item-content-wrap" tabindex="-1">Site news</span> 
           </a> 
           </p> 
         </li> 
        </ul> 
       </li> 

       <li class="type_system depth_2 contains_branch" aria-labelledby="label_2_10" tabindex="-1" id="yui_3_17_2_1_1471893404838_246"> 

        <p class="tree_item branch" role="treeitem" id="expandable_branch_0_courses" aria-expanded="false" data-requires-ajax="true" data-loaded="false" data-node-id="expandable_branch_0_courses" data-node-key="courses" data-node-type="0" tabindex="-1" aria-selected="false"> 
         <a tabindex="-1" id="label_2_10" href="http://moodle.tcu2905.us/course/index.php">Courses</a> 
        </p> 
       </li> 
      </ul> 
     </li> 
    </ul> 
</div>

Мой вопрос, как я могу скрыть DIV ID = "inst4" с помощью < «сценарий>?

Я попытался следующие за другой пост переполнением стека:

document.getElementById("inst4").style.visibility = "hidden";

Однако, это не удаление DIV ID = «inst4» с веб-сайта. Мне интересно, возможно ли это или нет, зная, что у меня нет контроля над DIV ID = "inst4".

< Я знаю, что «сценарий> работает, так как я был в состоянии получить фоновую загрузку с помощью:

<script>document.body.style.backgroundImage = "url('http://wallpaper.zone/img/149826.jpg')";

Есть мысли?

источник

2016-08-22 Joey

Какая ошибка в Консоли разработчика JavaScript.? Я предполагаю, что вы ссылаетесь на элемент перед его визуализацией. – epascarello

Возможный дубликат [Show/hide 'div' с использованием JavaScript] (http://stackoverflow.com/questions/21070101/show-hide-div-using-javascript) –

Попробуйте добавить этот скрипт в нижний колонтитул своей страницы. вероятно, вы пытаетесь получить доступ, если элемент отсутствует на странице. Вы также можете проверить это, проверив длину элемента. Более того, использование видимости скрыто или отображение ни одного не приведет к тому, что элемент невидим и не удалит его со страницы. – Vatsal

Существует несколько способов обработки вашего скрипта, требующего доступа к элементам на странице, которая еще не загружена.

Как один из предложенных комментариев, вы можете переместить свой скрипт в нижней части веб-страницы непосредственно перед закрывающим тегом. Это, вероятно, не проблема в вашем случае, но может привести к элементам, которые будут изменены сценарием, потенциально временно видимым при загрузке страницы. Сценарий также должен быть включен в код кода html, и лучше всего сохранить его отдельно.
Вы можете использовать событие DOMContentLoaded. Он запускается в документе, когда страница готова (иерархия DOM построена). DOMContentLoaded будет ожидать внешних скриптов и будет запускаться после выполнения всех встроенных скриптов. После этого события вы сможете получить доступ и скрыть идентификатор div.
window.onload будет выполняться, когда все файлы и ресурсы, такие как изображения, будут загружены. Это, вероятно, нет необходимости ждать этого события в вашем случае, поскольку DOM дерево будет иметь законченную загрузку после события DOMContentLoaded

источник

2016-08-23 01:10:31 Jinw

Я попытался добавить скрипт внизу, он ничего не изменил. Я использовал [javascript.info] (http://javascript.info/tutorial/onload-ondomcontentloaded#the-alternative-to-domcontentloaded) в качестве ссылки на DOMContentLoaded и window.onload, так как я никогда не использовал их раньше и получаю следующие ошибки: 'index.php: 107 Uncaught ReferenceError: готовый не defined' ' index.php: 107 неперехваченного TypeError: Невозможно установить свойство 'OnLoad' из undefined' Я интересно, если из-за "inst4" нагрузка по умолчанию, Я не могу удалить его. – Joey

Я узнал сегодня, что Moodle не функционирует так же, как стандартный веб-сайт (первый раз с использованием Это). Поэтому я не могу добиться того, что я хотел сделать. Спасибо всем за ваш вклад!

источник

2016-08-23 21:29:06 Joey

Скрыть идентификатор DIV, используя скрипт

ответ

Смежные вопросы