Добавление уникальных изображений в объекты javascript

В контексте использования в языках регулярные выражения действуют на строки, а не на строки. Таким образом, вы должны нормально использовать регулярное выражение, считая, что входная строка имеет несколько строк.

В этом случае заданное регулярное выражение будет соответствовать всей строке, так как «& lt; FooBar & gt;» настоящее. В зависимости от специфики реализации регулярного выражения значение $ 1 (полученное из «(. *)») Будет либо «fghij», либо «abcde\nfghij». Как говорили другие, некоторые реализации позволяют вам контролировать, является ли "." будет соответствовать новой строке, предоставив вам выбор.

Использование регулярных выражений на основе строк обычно используется для командной строки, например egrep.

-1
задан Sara Ree 3 March 2019 в 10:12
поделиться

2 ответа

Необходимо добавить изображение свойства для каждого профиля

profile1.img= "https://randomuser.me/api/portraits/men/12.jpg"

, а затем получить его для отображения для каждого профиля

img.src = entry.img;

JavaScript

// this is the array that will hold all the profile objects
let profiles = [];

let profile1 = {};
profile1.name = "Jim Bob";
profile1.points = 1500;
profile1.img= "https://randomuser.me/api/portraits/men/12.jpg"
profiles.push(profile1);

let profile2 = {};
profile2.name = "Jane Smith";
profile2.points = 1600;
profile2.img= "https://randomuser.me/api/portraits/women/22.jpg"
profiles.push(profile2);

let profile3 = {};
profile3.name = "Mike Jones";
profile3.points = 400;
profile3.img= "https://randomuser.me/api/portraits/men/22.jpg"
profiles.push(profile3);

let profile4 = {};
profile4.name = "Sally Peterson";
profile4.points = 1900;
profile4.img= "https://randomuser.me/api/portraits/women/24.jpg"
profiles.push(profile4);

// sort the array by points
// b - a will make highest first, swap them so a - b to make lowest first
profiles.sort(function(a, b) { 
return b.points-a.points;
})

let profilesDiv = document.getElementsByClassName('profiles')[0];

let count = 1;
profiles.forEach(function(entry) {
    let img = document.createElement('img');
  img.className = "profilePic";
  img.src = entry.img;
    let profile = document.createElement('div');
  profile.className = "profile";
  profile.innerHTML = "<div class='name'>"+ entry.name + "</div>";
  let points = document.createElement('span');
  points.className = "points";
  points.textContent = entry.points;
  profile.appendChild(points);
  profile.prepend(img);
  var span = document.createElement("span");
  span.textContent = count + '. ';
  span.className = "count";
  profile.prepend(span);
    profilesDiv.appendChild(profile);
  count++;

});
[118 ] CSS

.profile {
  border: 2px solid #555555;
  padding: 10px;
  margin: 5px;
  width: 30%;
  height: 50px;
  line-height: 50px;
}

.profile img, .profile .name {
  float: left;
  margin-right: 20px;
  width: 50px;
  height: 50px;
}

.profile .count {
  float: left;
  margin-right: 5px;
}

.profile img {
  border-radius: 50%;
  box-shadow: .6rem .5rem 1rem rgba(0, 0, 0, .5);
}

.points {
  float: right;
}

https://jsfiddle.net/ev0ncpy3/1/

0
ответ дан Franck 3 March 2019 в 10:12
поделиться

Эта строка:

img.src = "https://placeimg.com/50/50/people";

Устанавливает источник изображения для каждого игрока.

Если вы хотите, чтобы у каждого игрока была уникальная картинка профиля, вы должны добавить атрибут src к каждому профилю игрока.

let profile1 = {};
profile1.name = "Jim Bob";
profile1.points = 1500;
profile1.src = "Image source here";
profiles.push(profile1);

А потом в цикле forEach:

profiles.forEach(function(entry) {
  let img = document.createElement('img');
  img.className = "profilePic";
  img.src = entry.src;
  /....
 )}
0
ответ дан tomerpacific 3 March 2019 в 10:12
поделиться
Другие вопросы по тегам:

Похожие вопросы: