{"id":16499,"date":"2024-01-08T15:57:10","date_gmt":"2024-01-08T06:57:10","guid":{"rendered":"http:\/\/www.tyosuke20xx.com\/blog\/?p=16499"},"modified":"2024-01-08T15:57:12","modified_gmt":"2024-01-08T06:57:12","slug":"javascript-%e3%83%87%e3%83%bc%e3%82%bf%e3%81%8b%e3%82%89%e8%a1%a8%e3%82%92%e4%bd%9c%e6%88%90","status":"publish","type":"post","link":"http:\/\/www.tyosuke20xx.com\/blog\/?p=16499","title":{"rendered":"Javascript \u30c7\u30fc\u30bf\u304b\u3089\u8868\u3092\u4f5c\u6210"},"content":{"rendered":"\n<div class=\"hcb_wrap\"><pre class=\"prism undefined-numbers lang-plain\"><code>&lt;!DOCTYPE html&gt;\n&lt;html lang=&quot;ja&quot;&gt;\n&lt;head&gt;\n  &lt;meta charset=&quot;utf-8&quot;&gt;\n  &lt;title&gt;My Playground&lt;\/title&gt;\n  &lt;style&gt;\n    table {\n      border-collapse: collapse;\n    }\n    th {\n      font-weight: normal;\n      background: #eee;\n    }\n    th,\n    td {\n      padding: 4px;\n      border: 1px solid;\n      text-align: center;\n    }\n    th:nth-child(1) {\n      width: 40px;\n    }\n    th:nth-child(2) {\n      width: 180px;\n    }\n  &lt;\/style&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n  &lt;table&gt;\n    &lt;thead&gt;\n      &lt;tr&gt;&lt;th&gt;#&lt;\/th&gt;&lt;th&gt;\u540d\u524d&lt;\/th&gt;&lt;\/tr&gt;\n    &lt;\/thead&gt;\n    &lt;tbody id=&quot;names&quot;&gt;\n    &lt;\/tbody&gt;\n  &lt;\/table&gt;\n  &lt;script&gt;\n    \/\/ \u540d\u524d\u306e\u914d\u5217\u3092\u5b9a\u7fa9\n    const names = [\n      &#39;\u4f50\u85e4&#39;,\n      &#39;\u9234\u6728&#39;,\n      &#39;\u9ad8\u6a4b&#39;,\n      &#39;\u7530\u4e2d&#39;,\n      &#39;\u4f0a\u85e4&#39;,\n      &#39;\u6e21\u8fba&#39;,\n      &#39;\u6728\u6751&#39;,\n      &#39;\u5409\u7530&#39;,\n      &#39;\u5c71\u672c&#39;,\n      &#39;\u4e2d\u6751&#39;,\n      &#39;\u5c0f\u6797&#39;,\n      &#39;\u52a0\u85e4&#39;\n    ];\n    \n    \/\/ \u914d\u5217\u306e\u3059\u3079\u3066\u306e\u8981\u7d20\u306b\u5bfe\u3057\u3066\u51e6\u7406\u3092\u5b9f\u884c\n    names.forEach((name, index) =&gt; {\n      \/\/ \u65b0\u3057\u3044tr\u8981\u7d20\u3092\u4f5c\u6210\n      const tr = document.createElement(&#39;tr&#39;);\n      \/\/ \u30a4\u30f3\u30c7\u30c3\u30af\u30b9\u7528\u306etd\u8981\u7d20\u3092\u4f5c\u6210\u3057\u3001\u30a4\u30f3\u30c7\u30c3\u30af\u30b9\u3092\u8a2d\u5b9a\n      const indexTd = document.createElement(&#39;td&#39;);\n      indexTd.textContent = index + 1;\n      \/\/ \u540d\u524d\u7528\u306etd\u8981\u7d20\u3092\u4f5c\u6210\u3057\u3001\u540d\u524d\u3092\u8a2d\u5b9a\n      const nameTd = document.createElement(&#39;td&#39;);\n      nameTd.textContent = name;\n      \/\/ \u30a4\u30f3\u30c7\u30c3\u30af\u30b9\u7528\u306etd\u8981\u7d20\u3092tr\u8981\u7d20\u306b\u8ffd\u52a0\n      tr.appendChild(indexTd);\n      \/\/ \u540d\u524d\u7528\u306etd\u8981\u7d20\u3092tr\u8981\u7d20\u306b\u8ffd\u52a0\n      tr.appendChild(nameTd);\n      \/\/ tr\u8981\u7d20\u3092\u30c6\u30fc\u30d6\u30eb\u306etbody\u8981\u7d20\u306b\u8ffd\u52a0\n      document.getElementById(&#39;names&#39;).appendChild(tr);\n    });\n  &lt;\/script&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre><\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_uf_show_specific_survey":0,"_uf_disable_surveys":false,"footnotes":""},"categories":[78,4],"tags":[41,3],"class_list":["post-16499","post","type-post","status-publish","format-standard","hentry","category-javascript","category-programming","tag-javascript","tag-programming"],"aioseo_notices":[],"jetpack_featured_media_url":"","_links":{"self":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/16499","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=16499"}],"version-history":[{"count":1,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/16499\/revisions"}],"predecessor-version":[{"id":16500,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/16499\/revisions\/16500"}],"wp:attachment":[{"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=16499"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=16499"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.tyosuke20xx.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=16499"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}