jquery-获取不同的页面元素

IT技术 javascript jquery
2021-02-22 08:24:59

我想获取属于其他 html 页面的元素属性值。

例如,如果我在文件a.html,并希望从中获取类似元素的属性值数据b.htmla.html

我正在尝试在 jquery 中做的所有事情。

请建议!

我阅读了帖子,但我想要以下内容-

类似的东西->
[a.html 的代码]

var result = get(b.html).getTag(img).getAttribute(src)//not getting exactly
$("#id").append(result)

知道我怎么能做到这一点吗?

4个回答

首先,您必须获取b.html,然后才能找到属性值,例如

//if you dont want to display the data make the div hidden
      ^
$("#someDivID").load("b.html",function(data){

var value=$(data).find("#elementID").attr("attributeName");
});

使用 jQuery,您只能加载远程页面的一部分。基本语法:

$('#result').load('ajax/test.html #container');

字符串的第二部分是一个基本的 jQuery 选择器。请参阅jQuery 文档

可能值得一提的是整个页面都被请求,元素选择过程发生在客户端。
2021-04-26 08:24:59

默认情况下,选择器在 DOM 中从文档根开始执行它们的搜索。
如果要传递备用上下文,可以将可选的第二个参数传递给 $() 函数。例如,

$('#name', window.parent.frames[0].document).attr();

请记住,您通常只能与$(..).load(当前所在域中的页面或没有 CORS 限制的域建立直接连接(如使用)。(绝大多数站点都有 CORS 限制)。如果您想从具有 CORS 限制的跨域页面加载内容,您必须通过您的服务器发出请求,并让您的服务器向其他站点发出请求,然后响应您的前端带有响应的脚本。

对于这个问题,如果你想在没有jQuery 的情况下实现这个结果,你可以在响应文本上使用 DOMParser,将其转换为文档,然后你可以在该文档上使用 DOM 方法来检索元素,将其解析为所需,并将其(或从中检索的数据)插入当前页面。例如:

fetch('b.html') // replace with the URL of the external page
  .then(res => res.text())
  .then((responseText) => {
    const doc = new DOMParser().parseFromString(responseText, 'text/html');
    const targetElementOnOtherPage = doc.querySelector('img');
    const src = targetElementOnOtherPage.src;
    document.querySelector('#id').insertAdjacentHTML('beforeend', `<img src="${src}">`);
  })
  .catch((err) => {
    // There was an error, handle it here
  });