0 added
0 removed
Original
2026-01-01
Modified
2026-03-09
1
<p>Finally, Muffin sent out an example of data load for one product. It’s not much, but it’s enough to complete working on the createCard function. After all, now all the data in it is static, that is, the same, and no matter how many times we call it, the cards will look like spitting images of each other.</p>
1
<p>Finally, Muffin sent out an example of data load for one product. It’s not much, but it’s enough to complete working on the createCard function. After all, now all the data in it is static, that is, the same, and no matter how many times we call it, the cards will look like spitting images of each other.</p>
2
<p>Information about the product is an object, each property of which describes the characteristic of the product. First, we’ll work with these properties:</p>
2
<p>Information about the product is an object, each property of which describes the characteristic of the product. First, we’ll work with these properties:</p>
3
<ul><li>imgUrl is an image address;</li>
3
<ul><li>imgUrl is an image address;</li>
4
<li>text is product name;</li>
4
<li>text is product name;</li>
5
<li>price is price.</li>
5
<li>price is price.</li>
6
</ul><p>In order for the function to return different data in the end, it must receive different input data. Therefore, we first add parameter product to the createCard function and will then transfer the received object with data to it (by the way, it is already inserted in the code, but it was commented out).</p>
6
</ul><p>In order for the function to return different data in the end, it must receive different input data. Therefore, we first add parameter product to the createCard function and will then transfer the received object with data to it (by the way, it is already inserted in the code, but it was commented out).</p>
7
<p>Then inside the function, we need to replace the fixed values with the properties of the input parameter. For example:</p>
7
<p>Then inside the function, we need to replace the fixed values with the properties of the input parameter. For example:</p>
8
// Before: var title = createElement('h2', 'product__title', 'Professional selfie stick'); picture.alt = 'Professional selfie stick'; // After: var title = createElement('h2', 'product__title', product.text); picture.alt = product.text;
8
// Before: var title = createElement('h2', 'product__title', 'Professional selfie stick'); picture.alt = 'Professional selfie stick'; // After: var title = createElement('h2', 'product__title', product.text); picture.alt = product.text;