jQuery .load 按元素 ID答案

【问题标题】：jQuery .load by element IDjQuery .load 按元素 ID
【发布时间】：2015-08-05 05:27:35
【问题描述】：

您好，我正在尝试通过 ID 从网页加载元素。

我的代码从标签的 'href' 属性中读取 url，然后加载页面。我正在剥离文档锚。

此脚本有效，但不会丢弃环绕元素并加载整个页面。

<script type="text/javascript">
$(function() {
    var a_href = $('#pycom').attr('href').split('#');
    $('div#pop-up').load(a_href[0] + '#synopsis');
});
</script>

<body>
    <a id="pycom" href="content/documentation/CommandsPython/ls.html#hFlags">ls</a>
</body>

http://help.autodesk.com/cloudhelp/2015/ENU/Maya-Tech-Docs/CommandsPython/ls.html

根据上面的“html”代码，上述链接本地存在于我的服务器 (XAMPP) 上。

下面是我要提取的元素。

<p id="synopsis">
    <code>
        xform([objects...], 
        [<a href="#flagabsolute">absolute</a>=<i>boolean</i>], 
        [<a href="#flagboundingBox">boundingBox</a>=<i>boolean</i>],
        .....
        .....

    </code>

谢谢

杰米

【问题讨论】：

它应该可以正常工作。控制台有什么错误吗？
你为什么要写 $('div#pop-up').load(a_href[0] + '#synopsis'); ?你只能写 $('div#pop-up').load(a_href[0]);加载页面。为什么需要在 load() 函数中添加“#synopsis”？
根据link，我可以传递元素ID来加载该片段

标签： javascript jquery html

【解决方案1】：

At first get your page, and then inside the 
content find your element with id named 'synopsis' as below:

 var a_href = $('#pycom').attr('href').split('#');
 $("div#pop-up").load(a_href[0] + " #synopsis" );

它应该可以工作，但在此之前请检查您的浏览器是否支持混合内容。如果您的网址在 https 中包含 http，则浏览器可能不支持，在这种情况下，您必须禁止在浏览器中检查。

谢谢。

【讨论】：

我在本地使用 xampp 托管我的网站，我想通过 jQuery 加载的页面也在本地存储。所以不存在安全问题。 jQuery 确实有效，但不会丢弃标签之外的所有内容。

【解决方案2】：

好的解决了。我正在使用 jQuery 2.4.1 显然有一个应该修复的错误..但似乎不是？看这里http://bugs.jquery.com/ticket/14773

我改为使用 jQuery 1.11.3

下面是我的最终代码：

<script type="text/javascript" src="content/scripts/jquery-1.11.3.js"></script>
<script type="text/javascript">
    $(function() {
        var moveLeft = -10;
        var moveDown = 10;

        $('a#pycom').hover(function(e) {
            var a_href = $(this).attr('href').split('#');
            $('#pop-up').load(a_href[0] + ' #synopsis');
            $('div#pop-up').show().css('top', e.pageY + moveDown).css('left', ((e.width/100)*1) + moveLeft);
        }, function() {
            $('div#pop-up').hide();
        });
    });
</script>

以下使用 .get 的方法的工作原理也完全相同，除了能够在回调中处理返回的字符串。在这种情况下，是请求的选定元素的尾随部分。 .. 非常好的东西。

$('a#pycom').hover(function(e) {
    var a_href = $(this).attr('href').split('#');
    $.get(a_href[0], function(response) {
        $('#pop-up').html($(response).filter('#synopsis').html().split('<br>')[0]);
        });    
    });

现在拥有像 BOSS 一样的 jQuery！

感谢所有提供帮助的人。

库尔！

【讨论】：

【解决方案3】：

您不应在 URL 中留出任何空格。 “#synopsis”之前有一个空格。

 $('div#pop-up').load(a_href[0] + '#synopsis');

【讨论】：

对.. 谢谢你...实际上到目前为止我读过的所有地方，所有的例子都坚持添加空格。但是，虽然现在加载了页面，但它不会丢弃周围的其余元素。
感谢您的帮助，但它仍然不会仅加载我真正想要解决的所需片段。