|
@@ -0,0 +1,76 @@
|
|
|
+<header>
|
|
|
+ <h1>Multiply table</h1>
|
|
|
+</header>
|
|
|
+<style>
|
|
|
+ td {
|
|
|
+ padding: 5px;
|
|
|
+ border: 1px solid #999;
|
|
|
+ border-top-color: rgb(153, 153, 153);
|
|
|
+ border-top-style: solid;
|
|
|
+ border-top-width: 1px;
|
|
|
+ border-right-color: rgb(153, 153, 153);
|
|
|
+ border-right-style: solid;
|
|
|
+ border-right-width: 1px;
|
|
|
+ border-bottom-color: rgb(153, 153, 153);
|
|
|
+ border-bottom-style: solid;
|
|
|
+ border-bottom-width: 1px;
|
|
|
+ border-left-color: rgb(153, 153, 153);
|
|
|
+ border-left-style: solid;
|
|
|
+ border-left-width: 1px;
|
|
|
+ border-image-source: initial;
|
|
|
+ border-image-slice: initial;
|
|
|
+ border-image-width: initial;
|
|
|
+ border-image-outset: initial;
|
|
|
+ border-image-repeat: initial;
|
|
|
+ display: table-cell;
|
|
|
+ vertical-align: inherit;
|
|
|
+ }
|
|
|
+
|
|
|
+ table {
|
|
|
+ border-collapse: collapse;
|
|
|
+ text-indent: initial;
|
|
|
+ border-spacing: 2px;
|
|
|
+ }
|
|
|
+</style>
|
|
|
+
|
|
|
+<body>
|
|
|
+
|
|
|
+
|
|
|
+ <script>
|
|
|
+ fetch(`https://open.er-api.com/v6/latest/USD`)
|
|
|
+ .then(response => response.json())
|
|
|
+ .then(data => {
|
|
|
+ const name=0;
|
|
|
+ const value=1;
|
|
|
+ let str = "<table>";
|
|
|
+ arr = Object.entries(data.rates);
|
|
|
+ str += "<tr><td></td>";
|
|
|
+ for (let i = 0; i < arr.length; i++) {
|
|
|
+ str += `<td>${arr[i][name]}</td>`;
|
|
|
+ }
|
|
|
+ str += "</tr>";
|
|
|
+ for (let i = 0; i < arr.length; i++) {
|
|
|
+ str += `<tr><td>${arr[i][name]}</td>`;
|
|
|
+ currRate1 = arr[i][value];
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ for (let j = 0; j < arr.length; j++) {
|
|
|
+ currRate2 = arr[j][value];
|
|
|
+ crossCurrRate = currRate2 / currRate1;
|
|
|
+ str += `<td>${crossCurrRate.toFixed(3)}</td>`;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ str += "</tr>";
|
|
|
+ }
|
|
|
+ str += "</table>";
|
|
|
+
|
|
|
+
|
|
|
+ document.write(str);
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ </script>
|
|
|
+
|
|
|
+</body>
|