我可以定位其他页面上的标签内容ID吗？

Question

Can I target this tab content form another page?

<div class="container">
    <ul class="nav nav-pills nav-stacked" role="tablist" id="navbar4">
        <li role="presentation"> <a role="tab" data-toggle="tab" href="#id1">home</a></li>
        <li role="presentation">  <a role="tab" data-toggle="tab" href="#id2">profile</a></li>
        <li role="presentation">  <a role="tab" data-toggle="tab" href="#id3">about</a></li>
    </ul>

</div>


<div class="tab-content">
    <div role="tabpanel"
         class="tab-pane active" id="id1">
    </div>


    <div role="tabpanel"
         class="tab-pane" id="id2">
    </div>


    <div role="tabpanel"
         class="tab-pane" id="id3">
    </div>
</div>

Answer 1

In the old days, this was possible, but it is not possible now (there are exceptions).

Browsers in days of old let us do anything with javascript, even read and write files, but that became problematic. Some programers used this to take advantage of unsuspecting web users, and browser developers tightened up security.

Now, each tab runs as a completely separate environment, and the other tabs and the users computer are protected. Even pages with frames now are separated, so the code executed within the frame cannot be interfered with by code outside the frame. (A frame is like a browser window within a web page) The frame and the parent page can exchange messages, but DOM manipulation and other parts of the page are not accessible.

I mentioned that there are exceptions. All browsers allow the coding of extensions or plugins. These extensions and plugins DO have permission to manipulate tabs, access the camera, or other computer services like the file system. Like an App on your phone, the user gives these permissions to the extension by installing it. The idea is that the user is requesting that behavior, so the behavior becomes acceptable.

If you need to manipulate tabs on the browser, look into coding a plugin or extension for the browser rather than a web page.

If you need to manipulate bootstrap-tabs on a page, you are restricted to the web page that you are currently using.

Here is another exception that applies to a bootstrap tab (as opposed to a browser tab):

If you own the website that is being served on both browser tabs, you CAN control the page by using server-client communication.

1. Design your page to check the server for updates regularly.
2. Pass commands from page1 to the server that are read by page2.
3. Have page2 update automatically when it sees the command from page1.

Again, this requires that you have design control on both pages being served.