Question

我有一个名为array-variable的数组，具有10个值，而图像的数组数组具有10个值。

在调用rvalue()函数时，将3个值随机选择为array []，

我想存储tempimages []值，因为tempimage [0]应该是ArrayOfImages []中的array [0]值jpeg。

即，如果array [0]为3，则tempimages [0]应该为3.jpeg。

如何实现？

function rvalue() 
	{
  var array = [];
  var tempimages = [];
  var arrayVariable = ['1', '2', '3', '4', '5','6', '7', '8', '9', '10']
  
  var ArrayOfImages = ['1.jpg', '2.jpg', '3.jpg', '4.jpg' ,'5.jpg','6.jpg', '7.jpg', '8.jpg', '9.jpg' ,'10.jpg'];
  
  arrayLength = arrayVariable.length;

  ptags = document.getElementsByName("values");
  for (i = 0; i < ptags.length; i++) {
    ptags[i].textContent = arrayVariable[Math.floor(Math.random() * arrayLength)];
    
    array.push(ptags[i].textContent);
    
	tempimages.push(ptags[i].textContent);// 
  }
  console.log(array);
  console.log(tempimages);
}

p {
  font-size: 20px;
  color: #000000;
}

<body onload="rvalue()">

<div id="container">
            
                <p name="values"></p></div>
                <p name="values"></p></div>
                <p name="values"></p></div>
 </div>
</body>

Answer 1

看看，这能解决您的问题吗？

function rvalue() {
  const array = [];
  const tempimages = [];
  const arrayVariable = ['1', '2', '3', '4', '5','6', '7', '8', '9', '10']
  const ArrayOfImages = ['1.jpg', '2.jpg', '3.jpg', '4.jpg' ,'5.jpg','6.jpg', '7.jpg', '8.jpg', '9.jpg' ,'10.jpg'];
  
  arrayLength = arrayVariable.length;

  ptags = document.getElementsByName("values");
  for (i = 0; i < ptags.length; i++) {
    ptags[i].textContent = arrayVariable[Math.floor(Math.random() * arrayLength)];
    array.push(ptags[i].textContent);
	  tempimages.push(`${ptags[i].textContent}.jpeg`);
  }
  console.log(array);
  console.log(tempimages);
}

p {
  font-size: 20px;
  color: #000000;
}

<body onload="rvalue()">

<div id="container">  
    <p name="values"></p></div>
    <p name="values"></p></div>
    <p name="values"></p></div>
 </div>
</body>

Answer 2

尝试以下代码：

 for (i = 0; i < ptags.length; i++) {
  ptags[i].textContent = arrayVariable[Math.floor(Math.random() * arrayLength)]; 
  array.push(ptags[i].textContent);
  let tempArray = ArrayOfImages.slice();
  let temp =   tempArray.filter((val) => val.indexOf(ptags[i].textContent) > -1)
  tempimages.push(temp[0]);
}

Answer 3

所有这些都可以概括为两行：

function rvalue() {
  var ArrayOfImages = ['1.jpg', '2.jpg', '3.jpg', '4.jpg', '5.jpg', '6.jpg', '7.jpg', '8.jpg', '9.jpg', '10.jpg'];
  var tempimages = [...document.getElementsByName("values")].map((p) => {
    return p.textContent = ArrayOfImages
      .splice(Math.floor(Math.random() * ArrayOfImages.length), 1).pop();
  });
  
  console.log(tempimages);
}

p {
  font-size: 20px;
  color: #000000;
}

<body onload="rvalue()">
  <div id="container">
    <p name="values"></p>
    <p name="values"></p>
    <p name="values"></p>
  </div>
</body>

Answer 4

如果将标识符（{ "type" : "https://www.jhipster.tech/problem/problem-with-message", "title" : "Unauthorized", "status" : 401, "detail" : "Full authentication is required to access this resource", "path" : "/api/account", "message" : "error.http.401" }元素的内容）和相应图像（arrayVariable的内容）的组合存储在一个对象中，然后存储，将是更好的设计放在一个数组中，而不是两个。这使不同事物的关联变得轻而易举。

这是它的外观：

ArrayOfImages

function rvalue() {
    const images = [
        { id: 'BX', img: 'box.jpg' },
        { id: 'TB', img: 'table.jpg' },
        { id: 'LP', img: 'lamp.jpg' },
        { id: 'CP', img: 'cup.jpg' },
        { id: 'PN', img: 'pan.jpg' },
        { id: 'KT', img: 'kettle.jpg' },
        { id: 'CH', img: 'chair.jpg' },
        { id: 'SF', img: 'sofa.jpg' },
        { id: 'TV', img: 'tv.jpg' },
        { id: 'BK', img: 'book.jpg' }
    ];
    const picks = [];
    ptags = document.getElementsByName("values");
    for (let i = 0; i < ptags.length; i++) {
        const pick = images[Math.floor(Math.random() * images.length)];
        ptags[i].textContent = pick.id; // Get the property you want to display
        picks.push(pick); // Store the object(!) which has both properties
    }
    console.log(picks);
}

p {
  font-size: 20px;
  color: #000000;
}

从另一个数组中选择相同名称的项目

4 个答案: