javascript 如何使用jquery将html加载到变量中

n6lpvg4x  于 2023-05-12  发布在  Java
关注(0)|答案(5)|浏览(169)

我知道我可以在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]);
                }
            }
        }
    }
};
fruv7luv

fruv7luv1#

$.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/

3wabscal

3wabscal2#

你也可以在内存中创建一个元素,并在其上使用load():

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

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

其优点是您可以通过使用选择器(#somediv)指定要加载index.php的哪一部分

nr9pn0ug

nr9pn0ug3#

虽然创建新元素是一种选择,但您也可以克隆任何元素。这将复制旧节点的所有属性和值,正如它所说的“精确克隆”。
如果你只想复制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,因为它是原生元素)。

von4xj4u

von4xj4u4#

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);
ezykj2lf

ezykj2lf5#

现今现代浏览器具有API,
它可以进行同步或异步风格的调用。
同步样式调用:

var resp = await fetch(the_url)
var text = await resp.text()

注意:await只在异步函数和模块的顶级体中有效
https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
https://developer.mozilla.org/en-US/docs/Web/API/Response/text
https://stackoverflow.com/a/41946517/4896468

相关问题