Не удается получить доступ к элементу, который отображается в инструментах разработчика, но не отображается в исходном коде страницы

У меня та же проблема, что указана в ссылке ниже, но я ищу способ получить доступ к тем элементам (используя jquery), которые отсутствуют в исходном коде страницы, но видны в инструментах разработчика. Пожалуйста, предложите несколько идей.

Почему некоторые элементы вкладка "элементы" в инструментах разработчика Chrome не отображается в "просмотр исходного кода страницы"?

Вот настоящая проблема: я разместил «диаграмму Powerpivot» в «веб-части Excel» точки обмена. Всякий раз, когда пользователь нажимает на диаграмму (это тег img, отображаемый в инструментах разработчика), который встроен в веб-часть excel, я уменьшаю масштаб этого img .

В инструментах разработчика я вижу ниже код:

<div id="ctl00ctl00_sheetContentDiv" class="ewr-sheetcontainer ewr-grdblkcontainer ewa-scrollbars" role="presentation">
    <div class="ewafo" id="ctl00_ctl35_g_ec06c24e_5aac_4ae3_af75_93564d395086_ctl01_ctl00__0_1.11.0" style="top: 133px; left: 327px; width: 480px; height: 274px; z-index: 50;">
        <div class="ewa-fo-img-div" style="visibility: visible;">   
            <img src="http://mydummyserverlink" title="Excel chart or image" alt="Excel chart or image" onerror="_ewa_oile(this,'Failed to download chart or image');" style="width: 100%; height: 100%;        border: 0px; display: block;" usemap="#ctl00_ctl35_g_ec06c24e_5aac_4ae3_af75_93564d395086_ctl01_ctl00_imagemap_1.11.0_3"/>
        </div>
    </div>
</div>

В View Source я вижу только внешний div:

<div id="ctl00ctl00_sheetContentDiv" class="ewr-sheetcontainer ewr-grdblkcontainer ewa-scrollbars" role="presentation"></div>

На самом деле я пытаюсь получить доступ к div, используя его класс «ewr-sheetcontainer», например

$(".ewr-sheetcontainer")

Но он возвращает то, что имеет в виду источник.

Заранее спасибо, Мадху М.


person Maddy    schedule 18.02.2015    source источник
comment
А о каких элементах идет речь? Предоставьте соответствующий код в самом вопросе!   -  person A. Wolff    schedule 18.02.2015
comment
Разве эта ссылка не ответила на ваш вопрос?   -  person Arkantos    schedule 18.02.2015
comment
Если вы их видите, вы можете получить к ним доступ с помощью селекторов jQuery.   -  person Arkantos    schedule 18.02.2015
comment
Эта ссылка говорит о доступе к элементам с использованием DOM. var dom=$(.ewa-fo-img-div).get(0); оповещение ($ (дом). длина); но возвращает 0.   -  person Maddy    schedule 18.02.2015
comment
Не знаете, что это значит? Всякий раз, когда пользователь нажимает на диаграмму (это тег img, отображаемый в инструментах разработчика), который встроен в веб-часть Excel, я уменьшаю масштаб этого изображения.   -  person EnigmaRM    schedule 18.02.2015


Ответы (1)


Если элемент присутствует в devtools, то вы должны иметь доступ к ним стандартными методами.

С примером, приведенным в вашей ссылке, если у нас есть

<table id='mytable'>
    <td>cell1</td>
    <td>cell2</td>
</table>

<tbody> отсутствует в исходном коде. Однако он интерпретируется браузером как:

<table id="mytable">
    <tbody>
        <tr>
            <td>cell1</td>
            <td>cell2</td>
        </tr>
    </tbody>
</table>

Вы по-прежнему можете использовать селекторы CSS или JavaScript (jQuery) для доступа к <tbody>.

jquery

$('#mytable tbody')...

css

#mytable tbody { ... }

Если этот пример не относится к вам, опубликуйте свой соответствующий HTML-код, чтобы мы могли рассмотреть его более внимательно.


С вашим обновленным вопросом я предполагаю, что вы пытаетесь выбрать этот родительский контейнер до того, как в нем появятся дочерние элементы. Попробуйте обернуть свой селектор в document.ready или какую-нибудь другую функцию, которая бы удостоверилась, что содержимое уже загружено.

$(document).ready(function(){
    $('.ewr-sheetcontainer')
})
person EnigmaRM    schedule 18.02.2015
comment
Спасибо за ваш ответ, я обновил свой вопрос. Пожалуйста, предложите какую-нибудь идею. - person Maddy; 18.02.2015
comment
Извините за поздний ответ, я пробовал тот же подход, но не смог его прочитать. В этом asurkov.blogspot.com/2012/02/ ссылка, в которой говорится, что role=presentaion означает, что элемент будет удален из доступного дерева. Так что означает, что я не могу получить к нему доступ? есть ли альтернатива этому?? - person Maddy; 05.03.2015