将参数传递给动态创建的 div 元素？答案

【问题标题】：Pass parameters to dynamically created div element?将参数传递给动态创建的 div 元素？
【发布时间】：2015-03-10 14:02:37
【问题描述】：

我有一个页面，我在父页面的 div 中动态创建了几个 div。

for (i = 0; i < pages.length; i++) {
        var e = document.createElement("div");
        var eid = "dynamicdiv-" + i;
        e.id = eid;
        e.style.cssText = 'position:absolute; left: ' + left + 'px; color: #0000bb;';
        maindiv.appendChild(e);
        $('#' + eid).load(pages[i]);
    }

我的 pages 变量是一个 url 字符串数组。它们都是html页面，并且有自己的参数。我遇到的问题是 jquery load()。它似乎没有传递我创建页面所需的参数。相反，它从我的父页面传递参数。这些页面上的 CSS 也没有加载。

我是 javascript 的新手，任何帮助将不胜感激。

示例网址： http://example.com/index.html?param1=value

有什么想法吗？谢谢！

【问题讨论】：

"它似乎没有传递我创建页面所需的参数" 你在说什么参数？网址参数？
是的，url参数。所以像这个 index.html?param1=value
性能小技巧：使用文档片段存储动态创建的 div。当循环完成时，将片段附加到您想要的任何元素。

标签： javascript jquery html css

【解决方案1】：

jQuery load 函数很好并且可以完美运行，您应该在 JavaScript 代码或创建 HTML 页面的服务器端寻找这个问题。所以一些指导方针如下

在该 jQuery 加载函数之前添加一个 consol.log(...) 并确保加载 URL 正是您想要的。
在浏览器的新选项卡中打开该 URL，并检查其 HTML 代码/内容是否正常。

另外请注意，如果动态加载的 HTML 代码有 CSS 样式表，您应该先预加载它们。

顺便说一句，我真的很想知道，当 Super Powerful jQuery 存在时，你为什么要使用 pure JavaScript 来创建/附加元素。

for (i = 0; i < pages.length; i++) {
    $('<div></div>')
        .attr('id', "dynamicdiv-" + i)
        .css({'position': 'absolute', 'left', left + 'px', 'color', '#0000bb'})
        .appendTo(e);

    $('#' + eid).load(pages[i]);
}

【讨论】：

加载 url 正是我想要的，如果我在它自己的页面中打开 url，它会完美地加载我期望和想要的方式。顺便说一句，动态加载的 HTML 也有需要执行的 javascript 是否重要？
@sc2bigjoe 不，每个脚本元素将在附加到页面后立即执行，因此您的JS代码将在附加相应元素时执行。
javascript 正在执行，但参数仍未被捕获。我应该如何访问子页面中的参数？目前我正在使用 window.location.href？
@sc2bigjoe 你想在哪里使用这些参数，客户端还是服务器端？
参数被客户端解析并用于与服务器端通信，这样它就知道要抓取哪些数据以显示在客户端。

【解决方案2】：

关于 CSS 问题：

您不应使用此功能加载整个页面。此功能旨在加载“部分页面”（没有或标签，只是内部正文）。

您的 css 应该包含在您的主页中，并且加载应该帮助您仅加载所需的 html（它将使用您的主页的 css）。

关于参数问题：

你能提供你的 URL 参数吗？使用 load() 传递 URL 参数应该可以工作。

【讨论】：

一个示例网址：“example.com/child_page.html?param1=value”。我正在创建一个仪表板，pages 变量在仪表板中保存了我想要的页面，但如果我不能保留 css，那么我可能会以错误的方式进行处理。
为什么说参数不传？您确定没有在请求的 URL 中收到它们吗？
我很肯定。 window.location.href 只给我来自父页面的参数，而不是传递给 jquery 加载函数的 url。我一直在将它们输出到控制台

【解决方案3】：

maindiv.appendChild(e);

而不是

maindiv.appendChild(element);

还是我错过了什么？

【讨论】：