logo标签列表

如何使用jQuery将HTML加载到变量中

javascriptjqueryhtml
56

我知道我可以使用以下代码将HTML加载到div中：

$("#my_div").load("http://www.mypage.com");

但我想要做的是将HTML加载到一个变量中，例如：

my_var = load("http://www.mypage.com");

非常感谢您的帮助。

我想要循环一些项，例如：

HLS.functions.LoadSideModules = function() {
    HLS.sideModuleContent = new Object();
    for(var i = 0; i < HLS.currentModuleConfig.POLICIES.POLICY.length; i++) {
        for(var y = 0; y < HLS.currentModuleConfig.POLICIES.POLICY[i].PAGES.PAGE.length; y++) {
            for(var POS in HLS.currentModuleConfig.POLICIES.POLICY[i].PAGES.PAGE[y]) {
                var item = HLS.currentModuleConfig.POLICIES.POLICY[i].PAGES.PAGE[y][POS];
                if(!HLS.sideModuleContent[item]) {
                    HLS.sideModuleContent[item] = j.get(HLS.config.K2GETMODULE + HLS.currentModuleConfig.POLICIES.POLICY[i].PAGES.PAGE[y][POS]);
                }
            }
        }
    }
};
5个回答
88
$.get("http://www.mypage.com", function( my_var ) {
    // my_var contains whatever that request returned
});

在下面，jQuery将启动一个ajax请求，该请求发送到给定的URL。它还会尝试智能地猜测即将接收到的数据（如果是有效的HTML，则无需指定）。如果您需要获取另一种数据类型，请将其作为最后一个参数传递，例如

$.get("http://www.mypage.com", function( my_var ) {
    // my_var contains whatever that request returned
}, 'html');  // or 'text', 'xml', 'more'

参考文献：http://api.jquery.com/jQuery.get/

它对我有效，但在加载后在控制台显示错误：“Uncaught SyntaxError：Unexpected token <”。有任何想法为什么？ - Dariux
@Darius.V，自你提出该问题以来已经有一段时间了，但对于其他可能遇到此问题的人来说-您可能在控制台中放置了<script>标签。将其删除即可解决问题。 - intersum
41

你还可以在内存中创建一个元素，然后使用load()方法：

var $div = $('<div>');

$div.load('index.php #somediv', function(){
    // now $(this) contains #somediv
});

优点在于您可以使用选择器(#somediv)来指定要加载的index.php的哪个部分。

2

创建新元素是一种选择，但您也可以克隆任何元素。这将复制旧节点的所有属性和值，正如它所说的“完全克隆”。

如果您只想复制HTML的特定部分，则还可以提供灵活性，以便从获取的页面中填充特定元素层次结构内的所有内容（即包括所有子元素）。

例如，如果层次结构是 -

<div id='mydiv'>
    <div>
        <span>
        ...</span>
    </div>
</div>

//...

var oldElement = document.getElementById('mydiv');
var newElement = oldElement.cloneNode(true);

/* #selector selects only that particular section & the '> *' enables to copy all of the child nodes under the parent #selector
Replace URL with the required value
function specification is optional... */

jQuery(newElement).load(URL+'#selector > *'[,function(response, status, xhr){}]);

//...

现在您可以以编程方式处理变量newElement，按照您的要求进行处理（可以使用本机JavaScript，因为它是本机元素）。
2
    function includeHTML_callBack(result){
        var my_var = result;
    }

    function includeHTML(link, callBack) {
            var xhttp = new XMLHttpRequest();
            xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                callBack(this.responseText);
            }
          }      
          xhttp.open("GET", link, true);
          xhttp.send();
          return;
    }

    includeHTML("http://www.mypage.com", includeHTML_callBack);
0
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接