2023年5月25日 02:06:42go评论75阅读模式

英文:

iterate through nested array in string literal

问题

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>

<body>
  <div id='cont'>

  </div>
  <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js"
    integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
    crossorigin="anonymous"></script>
</body>

</html>

英文:

How can I add a new image p tag for each of the images in the nested array. Here is what I have thus far:

let arr = [{
    &quot;rebuttalid&quot;: &quot;1684773084111&quot;,
    &quot;attributes&quot;: {
      &quot;name&quot;: &quot;matt&quot;,
      &quot;phone&quot;: &quot;888-888-8888&quot;,
      &quot;response&quot;: &quot;afdadfasdfasdfasdfasdfasfdasdfasdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfsadfasdfasdfasdfa&quot;,
      &quot;creation&quot;: &quot;2023-05-22T16:31:25.079Z&quot;,
      &quot;images&quot;: [
        &quot;completed/1684773084111/responses/1684773084111 responseImage 1.pdf&quot;
      ]
    }
  },
  {
    &quot;rebuttalid&quot;: &quot;1684773183687&quot;,
    &quot;attributes&quot;: {
      &quot;name&quot;: &quot;chad&quot;,
      &quot;phone&quot;: &quot;888-888-8888&quot;,
      &quot;response&quot;: &quot;adfasdfasdfasdfasdfasfdasdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfadfasdfasdf&quot;,
      &quot;creation&quot;: &quot;2023-05-22T16:33:04.696Z&quot;,
      &quot;images&quot;: [
        &quot;completed/1684773183687/responses/1684773183687 responseImage 2.pdf&quot;,
        &quot;completed/1684773183687/responses/1684773183687 responseImage 3.pdf&quot;,
        &quot;completed/1684773183687/responses/1684773183687 responseImage 4.pdf&quot;
      ]
    }
  },
  {
    &quot;rebuttalid&quot;: &quot;1684845835720&quot;,
    &quot;attributes&quot;: {
      &quot;name&quot;: &quot;George&quot;,
      &quot;phone&quot;: &quot;888-888-8888&quot;,
      &quot;response&quot;: &quot;adfasdfasdfasdfasdfasdfasdfasdfasdfasdfASDAsdasfdasdfasfdasfdasfdasdfasfdasfdasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasfd&quot;,
      &quot;creation&quot;: &quot;2023-05-23T12:43:57.324Z&quot;,
      &quot;images&quot;: [
        &quot;completed/1684845835720/responses/1684845835720 responseImage 1.pdf&quot;,
        &quot;completed/1684845835720/responses/1684845835720 responseImage 2.pdf&quot;,
        &quot;completed/1684845835720/responses/1684845835720 responseImage 3.pdf&quot;
      ]
    }
  }
]

arr.forEach(element =&gt; {
  $(&#39;#cont&#39;).append(`
  &lt;p class=&quot;body-content&quot;&gt;&lt;strong&gt;Response Date:&lt;/strong&gt;${element.attributes.creation}&lt;/p&gt;
  &lt;p class=&quot;body-content&quot;&gt;&lt;strong&gt;Name:&lt;/strong&gt;${element.attributes.name}&lt;/p&gt;
  &lt;p class=&quot;body-content&quot;&gt;&lt;strong&gt;Response:&lt;/strong&gt;${element.attributes.response}&lt;/p&gt;
`)
})

&lt;!DOCTYPE html&gt;
&lt;html&gt;

&lt;head&gt;
  &lt;meta charset=&quot;utf-8&quot;&gt;
  &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width&quot;&gt;
  &lt;title&gt;JS Bin&lt;/title&gt;
&lt;/head&gt;

&lt;body&gt;
  &lt;div id=&#39;cont&#39;&gt;

  &lt;/div&gt;

&lt;/html&gt;

For an example, I'd like the output to look like this for the second object:

Name:chad

Response:adfasdfasdfasdfasdfasfdasdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasd

Response Date:2023-05-23T12:43:57.324Z

Image: completed/1684773183687/responses/1684773183687 responseImage 2.pdf

Image: completed/1684773183687/responses/1684773183687 responseImage 3.pdf

Image: completed/1684773183687/responses/1684773183687 responseImage 4.pdf

答案1

得分: 1

在element.attributes.images上添加一个嵌套循环。

英文:

Add a nested loop over element.attributes.images.

let arr = [{
    &quot;rebuttalid&quot;: &quot;1684773084111&quot;,
    &quot;attributes&quot;: {
      &quot;name&quot;: &quot;matt&quot;,
      &quot;phone&quot;: &quot;888-888-8888&quot;,
      &quot;response&quot;: &quot;afdadfasdfasdfasdfasdfasfdasdfasdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfsadfasdfasdfasdfa&quot;,
      &quot;creation&quot;: &quot;2023-05-22T16:31:25.079Z&quot;,
      &quot;images&quot;: [
        &quot;completed/1684773084111/responses/1684773084111 responseImage 1.pdf&quot;
      ]
    }
  },
  {
    &quot;rebuttalid&quot;: &quot;1684773183687&quot;,
    &quot;attributes&quot;: {
      &quot;name&quot;: &quot;chad&quot;,
      &quot;phone&quot;: &quot;888-888-8888&quot;,
      &quot;response&quot;: &quot;adfasdfasdfasdfasdfasfdasdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfadfasdfasdf&quot;,
      &quot;creation&quot;: &quot;2023-05-22T16:33:04.696Z&quot;,
      &quot;images&quot;: [
        &quot;completed/1684773183687/responses/1684773183687 responseImage 2.pdf&quot;,
        &quot;completed/1684773183687/responses/1684773183687 responseImage 3.pdf&quot;,
        &quot;completed/1684773183687/responses/1684773183687 responseImage 4.pdf&quot;
      ]
    }
  },
  {
    &quot;rebuttalid&quot;: &quot;1684845835720&quot;,
    &quot;attributes&quot;: {
      &quot;name&quot;: &quot;George&quot;,
      &quot;phone&quot;: &quot;888-888-8888&quot;,
      &quot;response&quot;: &quot;adfasdfasdfasdfasdfasdfasdfasdfasdfasdfASDAsdasfdasdfasfdasfdasfdasdfasfdasfdasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasfd&quot;,
      &quot;creation&quot;: &quot;2023-05-23T12:43:57.324Z&quot;,
      &quot;images&quot;: [
        &quot;completed/1684845835720/responses/1684845835720 responseImage 1.pdf&quot;,
        &quot;completed/1684845835720/responses/1684845835720 responseImage 2.pdf&quot;,
        &quot;completed/1684845835720/responses/1684845835720 responseImage 3.pdf&quot;
      ]
    }
  }
]

arr.forEach(element =&gt; {
  $(&#39;#cont&#39;).append(`
  &lt;p class=&quot;body-content&quot;&gt;&lt;strong&gt;Response Date:&lt;/strong&gt;${element.attributes.creation}&lt;/p&gt;
  &lt;p class=&quot;body-content&quot;&gt;&lt;strong&gt;Name:&lt;/strong&gt;${element.attributes.name}&lt;/p&gt;
  &lt;p class=&quot;body-content&quot;&gt;&lt;strong&gt;Response:&lt;/strong&gt;${element.attributes.response}&lt;/p&gt;
` + element.attributes.images.map(image =&gt; `&lt;p class=&quot;body-content&quot;&gt;&lt;strong&gt;Image: &lt;/strong&gt;${image}&lt;/p&gt;`).join(&#39;&#39;));
})

&lt;script src=&quot;https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js&quot;&gt;&lt;/script&gt;
&lt;!DOCTYPE html&gt;
&lt;html&gt;

&lt;head&gt;
  &lt;meta charset=&quot;utf-8&quot;&gt;
  &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width&quot;&gt;
  &lt;title&gt;JS Bin&lt;/title&gt;
&lt;/head&gt;

&lt;body&gt;
  &lt;div id=&#39;cont&#39;&gt;

  &lt;/div&gt;
&lt;/body&gt;

&lt;/html&gt;

通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。

遍历字符串字面量中的嵌套数组

问题

答案1

D3 – v5 更新多个文本元素的模式

在每个扇形上添加背景图像的jQuery饼图

关于逗号分隔的函数，查看 Chrome 扩展代码感到困惑。

使用JavaScript为切换按钮事件添加图标

What's the correct way to type hint an empty list as a literal in python?

如何在Highcharts Gantt中更改本地化的星期名称

如何在同一个流中使用多个过滤器和映射函数？

如何使用Map/Set来将代码优化到O(n)？

.NET MAUI Android在GitHub Actions上构建失败，错误代码为1。

如何在Playwright视觉比较中屏蔽多个定位器？

在C++中，可以使用可变模板参数来检索类型的内部类型。

selenium.common.exceptions.StaleElementReferenceException: Message: stale element reference: stale element not found

Creating and opening a URL to log in to Website via Basic Auth with Robot Framework/Selenium (Python)

AG Grid 在上下文菜单中以大文本形式打开

发表评论