Get Ajax HTML element by using JavaScript bookmarklet

Question

I am new to bookmarklet, not sure how much can be done with this. I want to get some elements from webpage, but the content will not show up till i click some buttons. I was able to get something on static webpage with below very simple code, but will it possible to get deeper elements by creating a bookmarklet.

Is it possible to get the deep red circled part with javascript bookmarklet? I was able to do this with python simulate user action, but I want something quicker to get the element. Please share some directions i can look for, it seems bookmarklet can be created and get many things done quickly.

javascript: (function() {
    var v = document.getElementById("view_shade").value ;
    alert(v);
})();

The html when first enter page:

Added content after click some buttons, red part is the element i want to get

Answer 1

Sure, you can get any part of the HTML.

For example you can use querySelectorAll for that coupled with DOM attributes property.

javascript:(function(){
    var v = document
                    .getElementById('view_shade')
                    .querySelectorAll('[data-guid]')[0]
                    .attributes["data-guid"]
                    .value;
    alert(v);
})();

<table border="1">
    <thead></thead>
    <tbody></tbody>
        <tr id="view_shade">
            <td data-guid="BCC-RED">one</td>
            <td>two</td>
        </tr>
</table>

Based on the text of your current question I don't see you need AJAX for this particular issue.

But making AJAX via a bookmarklet is doable too upon some conditions, however, it might be a separate issue and might depend on the URL, some server issues (e.g. CORS etc) and so on.

Some basics of AJAX: How to make an AJAX call without jQuery?