{"id":2025,"date":"2021-09-06T08:10:31","date_gmt":"2021-09-05T23:10:31","guid":{"rendered":"https:\/\/suzutukiblog.com\/?p=2025"},"modified":"2023-01-04T22:08:17","modified_gmt":"2023-01-04T13:08:17","slug":"javascript7","status":"publish","type":"post","link":"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/","title":{"rendered":"JavaScript7(\u30e2\u30d0\u30a4\u30eb\u30e1\u30cb\u30e5\u30fc)"},"content":{"rendered":"<h3>1:\u30b9\u30de\u30db\u753b\u9762\u7528\u306e\u30e1\u30cb\u30e5\u30fc\u3092\u4f5c\u308b(mixin\u306f\u3044\u3064\u3082\u3069\u304a\u308a\u306a\u306e\u3067\u7701\u7565)<\/h3>\n<h3>HTML\u306e\u8a18\u8ff0<\/h3>\n<div class=\"hcb_wrap\">\n<pre class=\"prism line-numbers lang-html\" data-lang=\"HTML\"><code>&lt;!DOCTYPE html&gt;\r\n&lt;html lang=\"en\"&gt;\r\n&lt;head&gt;\r\n  &lt;meta charset=\"UTF-8\" \/&gt;\r\n  &lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/&gt;\r\n  &lt;meta http-equiv=\"X-UA-Compatible\" content=\"ie=edge\" \/&gt;\r\n  &lt;title&gt;Document&lt;\/title&gt;\r\n&lt;link rel=\"stylesheet\" href=\"style.css\" \/&gt;\r\n&lt;\/head&gt;\r\n&lt;body&gt;\r\n&lt;!-- \u5168\u4f53\u3092\u56f2\u3080global-cotainer\u3092\u3055\u304f\u305b\u3044--&gt;\r\n  &lt;div id=\"global-container\"&gt;\r\n&lt;!-- --&gt;\r\n  &lt;div id=\"container\"&gt;\r\n  &lt;div class=\"mobile-menu__cover\"&gt;&lt;\/div&gt;\r\n&lt;header class=\"header\"&gt;\r\n  &lt;button class=\"mobile-menu__btn\"&gt;\r\n  &lt;span&gt;&lt;\/span&gt;\r\n  &lt;span&gt;&lt;\/span&gt;\r\n  &lt;span&gt;&lt;\/span&gt;\r\n  &lt;\/button&gt;\r\n&lt;\/header&gt;\r\n  &lt;\/div&gt;\r\n&lt;!-- __\uff12\u3064\u3042\u308b\u306e\u306fSCSS\u306b\u3066 --&gt;\r\n  &lt;nav class=\"mobile-menu\"&gt;\r\n    &lt;ul class=\"mobile-menu__main\"&gt;\r\n      &lt;li class=\"mobile-menu__item\"&gt;\r\n       &lt;a class=\"mobile-menu__link\" href=\"#\"&gt;\r\n        &lt;span class=\"main-title\"&gt;Our Service&lt;\/span&gt;\r\n        &lt;span class=\"sub-title\"&gt;\u30b5\u30fc\u30d3\u30b9\u306b\u3064\u3044\u3066&lt;\/span&gt;\r\n       &lt;\/a&gt;\r\n      &lt;\/li&gt;\r\n     &lt;li class=\"mobile-menu__item\"&gt;\r\n      &lt;a class=\"mobile-menu__link\" href=\"#\"&gt;\r\n        &lt;span class=\"main-title\"&gt;About us&lt;\/span&gt;\r\n        &lt;span class=\"sub-title\"&gt;\u79c1\u9054\u306b\u3064\u3044\u3066&lt;\/span&gt;\r\n      &lt;\/a&gt;\r\n     &lt;\/li&gt;\r\n     &lt;li class=\"mobile-menu__item\"&gt;\r\n      &lt;a class=\"mobile-menu__link\" href=\"#\"&gt;\r\n       &lt;span class=\"main-title\"&gt;Contact us&lt;\/span&gt;\r\n       &lt;span class=\"sub-title\"&gt;\u30b3\u30f3\u30bf\u30af\u30c8\u65b9\u6cd5&lt;\/span&gt;\r\n      &lt;\/a&gt;\r\n     &lt;\/li&gt;\r\n    &lt;\/ul&gt;\r\n   &lt;\/nav&gt;\r\n&lt;\/div&gt;\r\n&lt;script src=\"main.js\"&gt;&lt;\/script&gt;\r\n&lt;\/body&gt;\r\n&lt;\/html&gt;<\/code><\/pre>\n<\/div>\n<h3>main.js\u306e\u8a18\u8ff0<\/h3>\n<p><!--more--><\/p>\n<div class=\"hcb_wrap\">\n<pre class=\"prism line-numbers lang-js\" data-lang=\"JavaScript\"><code>class MobileMenu {\r\n\/\/ \u30b3\u30b9\u30c8\u30e9\u30af\u30bf\u95a2\u6570\u3092\u7528\u610f\u3059\u308b\r\n  constructor() {\r\n\/\/ \u30aa\u30d6\u30b8\u30a7\u30af\u30c8\u30ea\u30c6\u30e9\u30eb\u3067\u521d\u671f\u5316\r\n  this.DOM = {};\r\n\/\/ DOM\u3092\u6b21\u3005\u3068\u5909\u6570\u306b\u683c\u7d0d\r\n  this.DOM.btn = document.querySelector('.mobile-menu__btn');\r\n  this.DOM.cover = document.querySelector('.mobile-menu__cover');\r\n\/\/ this.DOM.container\u3067\u306a\u3044\u3068\u30a8\u30e9\u30fc\u306b\u306a\u308b\u3088\r\n  this.DOM.container = document.querySelector('#global-container');\r\n\/\/ this.eventType = this._getEventType();\r\n  this.__addEvent();\r\n}\r\n\/\/ \u30d7\u30e9\u30a4\u30d9\u30fc\u30c8\u30e1\u30bd\u30c3\u30c9\u306b\u3059\u308b\u4fee\u6b63\u3084\u4fdd\u5b88\u306e\u3057\u3084\u3059\u3055\u306e\u305f\u3081\r\n  _getEventType() {\r\n    return wondow.ontouchstart ? \"touchstart\" : \"click\";\r\n}\r\n\r\n  _toggle() {\r\n\/\/ global-container\u306b\u30af\u30ea\u30c3\u30af\u3059\u308b\u305f\u3073\u306bmenu-open\u3092\u4ed8\u52a0\u3001\u89e3\u9664\r\n  this.DOM.container.classList.toggle(\"menu-open\");\r\n}\r\n  __addEvent() {\r\n\/\/ \u30b9\u30de\u30db\u3068\u30c7\u30b9\u30af\u30c8\u30c3\u30d7\u5bfe\u5fdc\u3059\u308b\u305f\u3081\r\n    this.DOM.btn.addEventListener(\"click\", this._toggle.bind(this));\r\n\/\/ \u30ab\u30d0\u30fc\u3092\u30af\u30ea\u30c3\u30af\u3057\u305f\u3068\u304d\u306b\u767a\u706b\r\n    this.DOM.cover.addEventListener(\"click\", this._toggle.bind(this));\r\n }\r\n}\r\n\r\nnew MobileMenu();<\/code><\/pre>\n<\/div>\n<h3>SCSS\u306e\u8a18\u8ff0<\/h3>\n<div class=\"hcb_wrap\">\n<pre class=\"prism line-numbers lang-scss\" data-lang=\"SCSS\"><code>$cWhite: White;\r\n$cBlack: black;\r\n$cMenuClose: black;\r\n$cMenuOpen: black;\r\n$cSubTitle: #535353;\r\n\r\nbody {\r\n  margin: 0;\r\n}\r\n#container {\r\n  position: relative;\r\n  background-color: #614226;\r\n  height: 100vh;\r\n  z-index: 2;\r\n\/\/ \u52d5\u304d\u3092\u306a\u3081\u3089\u304b\u306b\u3059\u308b\r\n  transition: all 0.5s;\r\n  box-shadow: 0 8px 40px -10px rgba(0, 0, 0, 0.8);\r\n}\r\n\/\/ \u30d8\u30c3\u30c0\u30fc\u306e\u5b9a\u7fa9\r\n.header {\r\n  background-color: $cWhite;\r\n  height: 100px;\r\n  display: flex;\r\n\/\/ \u53f3\u5bc4\u305b\u3068\u4e2d\u592e\u63c3\u3048\r\n  justify-content: flex-end;\r\n  align-items: center;\r\n}\r\n\r\n.mobile-menu {\r\n  position: fixed;\r\n  right: 0;\r\n\/\/ \u4e0a\u304b\u308960px\r\n  top: 60px;\r\n  width: 300px;\r\n\/\/ BEM(Block Element Modifier)\r\n  &amp;__btn {\r\n    background-color: unset;\r\n    border: none;\r\n    outline: none !important;\r\n    cursor: pointer;\r\n\r\n    &amp; &gt; span {\r\n     background-color: $cMenuClose;\r\n     width: 35px;\r\n     height: 2px;\r\n     display: block;\r\n     margin-bottom: 9px;\r\n     transition: transform 0.7s;\r\n\r\n    &amp;:last-child {\r\n     margin-bottom: 0;\r\n  }\r\n }\r\n}\r\n    &amp;__cover {\r\n\/\/ \u9ed2\u3044\u819c\u3092\u3064\u3051\u308b\r\n     position: absolute;\r\n     top: 0;\r\n     left: 0;\r\n     width: 100%;\r\n     height: 100%;\r\n     background-color: rgba(0, 0, 0, 0.3);\r\n     opacity: 0;\r\n     visibility: hidden;\r\n     transition: opacity 1s;\r\n     cursor: pointer;\r\n}\r\n   &amp;__main {\r\n    padding: 0;\r\n\/\/ \uff13D\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3092\u3057\u305f\u3044\u3068\u304d\u89aa\u306e\u8981\u7d20\u306b\u3064\u3051\u308b\r\n    perspective: 2000px;\r\n    transform-style: preserve-3d;\r\n}\r\n   &amp;__item {\r\n\/\/ \u30fb\u3092\u3051\u3059\r\n     list-style: none;\r\n     display: block;\r\n     transform: translate3d(0, 0, -1000px);\r\n     padding: 0 40px;\r\n     transition: transform 0.3s, opacity 0.2s;\r\n     opacity: 0;\r\n}\r\n  &amp;__link {\r\n\/\/ \u5de6\u53f3\u3044\u3063\u3071\u3044\u306b\u5e83\u304c\u308b\u3088\u3046\u306b\u3059\u308b\r\n    display: block;\r\n    margin-top: 30px;\r\n    color: $cBlack;\r\n\/\/ \u4e0b\u7dda\u3092\u524a\u9664\r\n    text-decoration: none;\r\n}\r\n}\r\n\r\n.menu-open {\r\n  &amp; #container {\r\n\/\/ \u30af\u30ea\u30c3\u30af\u3057\u305f\u3068\u304d\u306b\u5de6\u4e0b\u306b\u305a\u308c\u308b\r\n    transform: translate(-300px, 60px);\r\n    box-shadow: 0 8px 40px -10px rgba(0, 0, 0, 0.8);\r\n}\r\n\/\/ \u30af\u30ea\u30c3\u30af\u3055\u308c\u305f\u3068\u304d\u306e\u8a18\u8ff0\u3092\u66f8\u304f\r\n  &amp; .mobile-menu {\r\n  &amp;__cover {\r\n    opacity: 1;\r\n    visibility: visible;\r\n}\r\n  &amp;__item {\r\n    transform: none;\r\n    opacity: 1;\r\n@for $i from 1 through 5 {\r\n  &amp;:nth-chils(#{$i}) {\r\n\/\/ \u8981\u7d20\u3092\u5c11\u3057\u305a\u3064\u9045\u5ef6\r\n    transition-delay: $i * 0.07s;\r\n}\r\n}\r\n}\r\n  &amp;__btn {\r\n  &amp; &gt; span {\r\n    background-color: $cMenuOpen;\r\n\r\n  &amp;:nth-child(1) {\r\n    transition-delay: 70ms;\r\n    transform: translateY(11px) rotate(135deg);\r\n}\r\n  &amp;:nth-child(2) {\r\n    transition-delay: 0s;\r\n    transform: translateX(-18px) scaleX(0);\r\n}\r\n  &amp;:nth-child(3) {\r\n    transition-delay: 140ms;\r\n    transform: translateY(-11px) rotate(-135deg);\r\n   }\r\n   }\r\n  }\r\n }\r\n}\r\n\r\n  .main-title {\r\n    font-weight: 600;\r\n    font-size: 25px;\r\n}\r\n  .sub-title {\r\n    display: block;\r\n    font-size: 14px;\r\n    color: $cSubTitle;\r\n}<\/code><\/pre>\n<\/div>\n<p><a href=\"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/07\/javascript7-5\/\">7.5\u306b\u7d9a\u304f<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>1:\u30b9\u30de\u30db\u753b\u9762\u7528\u306e\u30e1\u30cb\u30e5\u30fc\u3092\u4f5c\u308b(mixin\u306f\u3044\u3064\u3082\u3069\u304a\u308a\u306a\u306e\u3067\u7701\u7565) HTML\u306e\u8a18\u8ff0 &lt;!DOCTYPE html&gt; &lt;html lang=&#8221;en&#8221;&gt; &lt;head&gt; &lt;meta [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[17,27],"tags":[],"class_list":["post-2025","post","type-post","status-publish","format-standard","hentry","category-javascript","category-programming-note"],"aioseo_notices":[],"aioseo_head":"\n\t\t<!-- All in One SEO 4.9.8 - aioseo.com -->\n\t<meta name=\"description\" content=\"1:\u30b9\u30de\u30db\u753b\u9762\u7528\u306e\u30e1\u30cb\u30e5\u30fc\u3092\u4f5c\u308b(mixin\u306f\u3044\u3064\u3082\u3069\u304a\u308a\u306a\u306e\u3067\u7701\u7565) HTML\u306e\u8a18\u8ff0\" \/>\n\t<meta name=\"robots\" content=\"max-image-preview:large\" \/>\n\t<meta name=\"author\" content=\"\u30aa\u30aa\u30bf\"\/>\n\t<link rel=\"canonical\" href=\"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/\" \/>\n\t<meta name=\"generator\" content=\"All in One SEO (AIOSEO) 4.9.8\" \/>\n\t\t<meta property=\"og:locale\" content=\"ja_JP\" \/>\n\t\t<meta property=\"og:site_name\" content=\"\u3068\u3042\u308bIT\u30a8\u30f3\u30b8\u30cb\u30a2\u306e\u30d6\u30ed\u30b0 \u2014 \u6bce\u65e5\u5c11\u3057\u305a\u3064\u6210\u9577\u3059\u308b\" \/>\n\t\t<meta property=\"og:type\" content=\"article\" \/>\n\t\t<meta property=\"og:title\" content=\"JavaScript7(\u30e2\u30d0\u30a4\u30eb\u30e1\u30cb\u30e5\u30fc) \u2014 \u3068\u3042\u308bIT\u30a8\u30f3\u30b8\u30cb\u30a2\u306e\u30d6\u30ed\u30b0\" \/>\n\t\t<meta property=\"og:description\" content=\"1:\u30b9\u30de\u30db\u753b\u9762\u7528\u306e\u30e1\u30cb\u30e5\u30fc\u3092\u4f5c\u308b(mixin\u306f\u3044\u3064\u3082\u3069\u304a\u308a\u306a\u306e\u3067\u7701\u7565) HTML\u306e\u8a18\u8ff0\" \/>\n\t\t<meta property=\"og:url\" content=\"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/\" \/>\n\t\t<meta property=\"og:image\" content=\"https:\/\/suzutukiblog.com\/wp-content\/uploads\/2020\/03\/cropped-cropped-markus-spiske-s7nlaF3kefg-unsplash-1.jpg\" \/>\n\t\t<meta property=\"og:image:secure_url\" content=\"https:\/\/suzutukiblog.com\/wp-content\/uploads\/2020\/03\/cropped-cropped-markus-spiske-s7nlaF3kefg-unsplash-1.jpg\" \/>\n\t\t<meta property=\"og:image:width\" content=\"512\" \/>\n\t\t<meta property=\"og:image:height\" content=\"316\" \/>\n\t\t<meta property=\"article:published_time\" content=\"2021-09-05T23:10:31+00:00\" \/>\n\t\t<meta property=\"article:modified_time\" content=\"2023-01-04T13:08:17+00:00\" \/>\n\t\t<meta name=\"twitter:card\" content=\"summary\" \/>\n\t\t<meta name=\"twitter:title\" content=\"JavaScript7(\u30e2\u30d0\u30a4\u30eb\u30e1\u30cb\u30e5\u30fc) \u2014 \u3068\u3042\u308bIT\u30a8\u30f3\u30b8\u30cb\u30a2\u306e\u30d6\u30ed\u30b0\" \/>\n\t\t<meta name=\"twitter:description\" content=\"1:\u30b9\u30de\u30db\u753b\u9762\u7528\u306e\u30e1\u30cb\u30e5\u30fc\u3092\u4f5c\u308b(mixin\u306f\u3044\u3064\u3082\u3069\u304a\u308a\u306a\u306e\u3067\u7701\u7565) HTML\u306e\u8a18\u8ff0\" \/>\n\t\t<meta name=\"twitter:image\" content=\"https:\/\/suzutukiblog.com\/wp-content\/uploads\/2020\/03\/cropped-cropped-markus-spiske-s7nlaF3kefg-unsplash-1.jpg\" \/>\n\t\t<script type=\"application\/ld+json\" class=\"aioseo-schema\">\n\t\t\t{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"BlogPosting\",\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/2021\\\/09\\\/06\\\/javascript7\\\/#blogposting\",\"name\":\"JavaScript7(\\u30e2\\u30d0\\u30a4\\u30eb\\u30e1\\u30cb\\u30e5\\u30fc) \\u2014 \\u3068\\u3042\\u308bIT\\u30a8\\u30f3\\u30b8\\u30cb\\u30a2\\u306e\\u30d6\\u30ed\\u30b0\",\"headline\":\"JavaScript7(\\u30e2\\u30d0\\u30a4\\u30eb\\u30e1\\u30cb\\u30e5\\u30fc)\",\"author\":{\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/author\\\/reim\\\/#author\"},\"publisher\":{\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/#person\"},\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/2021\\\/09\\\/06\\\/javascript7\\\/#articleImage\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/a1120b253cda8359b20b212f47db49986c2aa710b6ba6ef5825e6871bdbb9c10?s=96&d=mm&r=g\",\"width\":96,\"height\":96,\"caption\":\"\\u30aa\\u30aa\\u30bf\"},\"datePublished\":\"2021-09-06T08:10:31+09:00\",\"dateModified\":\"2023-01-04T22:08:17+09:00\",\"inLanguage\":\"ja\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/2021\\\/09\\\/06\\\/javascript7\\\/#webpage\"},\"isPartOf\":{\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/2021\\\/09\\\/06\\\/javascript7\\\/#webpage\"},\"articleSection\":\"JavaScript, Programming note\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/2021\\\/09\\\/06\\\/javascript7\\\/#breadcrumblist\",\"itemListElement\":[{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/suzutukiblog.com#listItem\",\"position\":1,\"name\":\"\\u30db\\u30fc\\u30e0\",\"item\":\"https:\\\/\\\/suzutukiblog.com\",\"nextItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/category\\\/javascript\\\/#listItem\",\"name\":\"JavaScript\"}},{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/category\\\/javascript\\\/#listItem\",\"position\":2,\"name\":\"JavaScript\",\"item\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/category\\\/javascript\\\/\",\"nextItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/2021\\\/09\\\/06\\\/javascript7\\\/#listItem\",\"name\":\"JavaScript7(\\u30e2\\u30d0\\u30a4\\u30eb\\u30e1\\u30cb\\u30e5\\u30fc)\"},\"previousItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/suzutukiblog.com#listItem\",\"name\":\"\\u30db\\u30fc\\u30e0\"}},{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/2021\\\/09\\\/06\\\/javascript7\\\/#listItem\",\"position\":3,\"name\":\"JavaScript7(\\u30e2\\u30d0\\u30a4\\u30eb\\u30e1\\u30cb\\u30e5\\u30fc)\",\"previousItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/category\\\/javascript\\\/#listItem\",\"name\":\"JavaScript\"}}]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/#person\",\"name\":\"\\u30aa\\u30aa\\u30bf\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/2021\\\/09\\\/06\\\/javascript7\\\/#personImage\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/a1120b253cda8359b20b212f47db49986c2aa710b6ba6ef5825e6871bdbb9c10?s=96&d=mm&r=g\",\"width\":96,\"height\":96,\"caption\":\"\\u30aa\\u30aa\\u30bf\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/author\\\/reim\\\/#author\",\"url\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/author\\\/reim\\\/\",\"name\":\"\\u30aa\\u30aa\\u30bf\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/2021\\\/09\\\/06\\\/javascript7\\\/#authorImage\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/a1120b253cda8359b20b212f47db49986c2aa710b6ba6ef5825e6871bdbb9c10?s=96&d=mm&r=g\",\"width\":96,\"height\":96,\"caption\":\"\\u30aa\\u30aa\\u30bf\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/2021\\\/09\\\/06\\\/javascript7\\\/#webpage\",\"url\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/2021\\\/09\\\/06\\\/javascript7\\\/\",\"name\":\"JavaScript7(\\u30e2\\u30d0\\u30a4\\u30eb\\u30e1\\u30cb\\u30e5\\u30fc) \\u2014 \\u3068\\u3042\\u308bIT\\u30a8\\u30f3\\u30b8\\u30cb\\u30a2\\u306e\\u30d6\\u30ed\\u30b0\",\"description\":\"1:\\u30b9\\u30de\\u30db\\u753b\\u9762\\u7528\\u306e\\u30e1\\u30cb\\u30e5\\u30fc\\u3092\\u4f5c\\u308b(mixin\\u306f\\u3044\\u3064\\u3082\\u3069\\u304a\\u308a\\u306a\\u306e\\u3067\\u7701\\u7565) HTML\\u306e\\u8a18\\u8ff0\",\"inLanguage\":\"ja\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/#website\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/2021\\\/09\\\/06\\\/javascript7\\\/#breadcrumblist\"},\"author\":{\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/author\\\/reim\\\/#author\"},\"creator\":{\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/index.php\\\/author\\\/reim\\\/#author\"},\"datePublished\":\"2021-09-06T08:10:31+09:00\",\"dateModified\":\"2023-01-04T22:08:17+09:00\"},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/#website\",\"url\":\"https:\\\/\\\/suzutukiblog.com\\\/\",\"name\":\"\\u3068\\u3042\\u308bIT\\u30a8\\u30f3\\u30b8\\u30cb\\u30a2\\u5fd7\\u671b\\u306e\\u30d6\\u30ed\\u30b0\",\"description\":\"\\u6bce\\u65e5\\u5c11\\u3057\\u305a\\u3064\\u6210\\u9577\\u3059\\u308b\",\"inLanguage\":\"ja\",\"publisher\":{\"@id\":\"https:\\\/\\\/suzutukiblog.com\\\/#person\"}}]}\n\t\t<\/script>\n\t\t<!-- All in One SEO -->\n\n","aioseo_head_json":{"title":"JavaScript7(\u30e2\u30d0\u30a4\u30eb\u30e1\u30cb\u30e5\u30fc) \u2014 \u3068\u3042\u308bIT\u30a8\u30f3\u30b8\u30cb\u30a2\u306e\u30d6\u30ed\u30b0","description":"1:\u30b9\u30de\u30db\u753b\u9762\u7528\u306e\u30e1\u30cb\u30e5\u30fc\u3092\u4f5c\u308b(mixin\u306f\u3044\u3064\u3082\u3069\u304a\u308a\u306a\u306e\u3067\u7701\u7565) HTML\u306e\u8a18\u8ff0","canonical_url":"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"BlogPosting","@id":"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/#blogposting","name":"JavaScript7(\u30e2\u30d0\u30a4\u30eb\u30e1\u30cb\u30e5\u30fc) \u2014 \u3068\u3042\u308bIT\u30a8\u30f3\u30b8\u30cb\u30a2\u306e\u30d6\u30ed\u30b0","headline":"JavaScript7(\u30e2\u30d0\u30a4\u30eb\u30e1\u30cb\u30e5\u30fc)","author":{"@id":"https:\/\/suzutukiblog.com\/index.php\/author\/reim\/#author"},"publisher":{"@id":"https:\/\/suzutukiblog.com\/#person"},"image":{"@type":"ImageObject","@id":"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/#articleImage","url":"https:\/\/secure.gravatar.com\/avatar\/a1120b253cda8359b20b212f47db49986c2aa710b6ba6ef5825e6871bdbb9c10?s=96&d=mm&r=g","width":96,"height":96,"caption":"\u30aa\u30aa\u30bf"},"datePublished":"2021-09-06T08:10:31+09:00","dateModified":"2023-01-04T22:08:17+09:00","inLanguage":"ja","mainEntityOfPage":{"@id":"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/#webpage"},"isPartOf":{"@id":"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/#webpage"},"articleSection":"JavaScript, Programming note"},{"@type":"BreadcrumbList","@id":"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/#breadcrumblist","itemListElement":[{"@type":"ListItem","@id":"https:\/\/suzutukiblog.com#listItem","position":1,"name":"\u30db\u30fc\u30e0","item":"https:\/\/suzutukiblog.com","nextItem":{"@type":"ListItem","@id":"https:\/\/suzutukiblog.com\/index.php\/category\/javascript\/#listItem","name":"JavaScript"}},{"@type":"ListItem","@id":"https:\/\/suzutukiblog.com\/index.php\/category\/javascript\/#listItem","position":2,"name":"JavaScript","item":"https:\/\/suzutukiblog.com\/index.php\/category\/javascript\/","nextItem":{"@type":"ListItem","@id":"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/#listItem","name":"JavaScript7(\u30e2\u30d0\u30a4\u30eb\u30e1\u30cb\u30e5\u30fc)"},"previousItem":{"@type":"ListItem","@id":"https:\/\/suzutukiblog.com#listItem","name":"\u30db\u30fc\u30e0"}},{"@type":"ListItem","@id":"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/#listItem","position":3,"name":"JavaScript7(\u30e2\u30d0\u30a4\u30eb\u30e1\u30cb\u30e5\u30fc)","previousItem":{"@type":"ListItem","@id":"https:\/\/suzutukiblog.com\/index.php\/category\/javascript\/#listItem","name":"JavaScript"}}]},{"@type":"Person","@id":"https:\/\/suzutukiblog.com\/#person","name":"\u30aa\u30aa\u30bf","image":{"@type":"ImageObject","@id":"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/#personImage","url":"https:\/\/secure.gravatar.com\/avatar\/a1120b253cda8359b20b212f47db49986c2aa710b6ba6ef5825e6871bdbb9c10?s=96&d=mm&r=g","width":96,"height":96,"caption":"\u30aa\u30aa\u30bf"}},{"@type":"Person","@id":"https:\/\/suzutukiblog.com\/index.php\/author\/reim\/#author","url":"https:\/\/suzutukiblog.com\/index.php\/author\/reim\/","name":"\u30aa\u30aa\u30bf","image":{"@type":"ImageObject","@id":"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/#authorImage","url":"https:\/\/secure.gravatar.com\/avatar\/a1120b253cda8359b20b212f47db49986c2aa710b6ba6ef5825e6871bdbb9c10?s=96&d=mm&r=g","width":96,"height":96,"caption":"\u30aa\u30aa\u30bf"}},{"@type":"WebPage","@id":"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/#webpage","url":"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/","name":"JavaScript7(\u30e2\u30d0\u30a4\u30eb\u30e1\u30cb\u30e5\u30fc) \u2014 \u3068\u3042\u308bIT\u30a8\u30f3\u30b8\u30cb\u30a2\u306e\u30d6\u30ed\u30b0","description":"1:\u30b9\u30de\u30db\u753b\u9762\u7528\u306e\u30e1\u30cb\u30e5\u30fc\u3092\u4f5c\u308b(mixin\u306f\u3044\u3064\u3082\u3069\u304a\u308a\u306a\u306e\u3067\u7701\u7565) HTML\u306e\u8a18\u8ff0","inLanguage":"ja","isPartOf":{"@id":"https:\/\/suzutukiblog.com\/#website"},"breadcrumb":{"@id":"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/#breadcrumblist"},"author":{"@id":"https:\/\/suzutukiblog.com\/index.php\/author\/reim\/#author"},"creator":{"@id":"https:\/\/suzutukiblog.com\/index.php\/author\/reim\/#author"},"datePublished":"2021-09-06T08:10:31+09:00","dateModified":"2023-01-04T22:08:17+09:00"},{"@type":"WebSite","@id":"https:\/\/suzutukiblog.com\/#website","url":"https:\/\/suzutukiblog.com\/","name":"\u3068\u3042\u308bIT\u30a8\u30f3\u30b8\u30cb\u30a2\u5fd7\u671b\u306e\u30d6\u30ed\u30b0","description":"\u6bce\u65e5\u5c11\u3057\u305a\u3064\u6210\u9577\u3059\u308b","inLanguage":"ja","publisher":{"@id":"https:\/\/suzutukiblog.com\/#person"}}]},"og:locale":"ja_JP","og:site_name":"\u3068\u3042\u308bIT\u30a8\u30f3\u30b8\u30cb\u30a2\u306e\u30d6\u30ed\u30b0 \u2014 \u6bce\u65e5\u5c11\u3057\u305a\u3064\u6210\u9577\u3059\u308b","og:type":"article","og:title":"JavaScript7(\u30e2\u30d0\u30a4\u30eb\u30e1\u30cb\u30e5\u30fc) \u2014 \u3068\u3042\u308bIT\u30a8\u30f3\u30b8\u30cb\u30a2\u306e\u30d6\u30ed\u30b0","og:description":"1:\u30b9\u30de\u30db\u753b\u9762\u7528\u306e\u30e1\u30cb\u30e5\u30fc\u3092\u4f5c\u308b(mixin\u306f\u3044\u3064\u3082\u3069\u304a\u308a\u306a\u306e\u3067\u7701\u7565) HTML\u306e\u8a18\u8ff0","og:url":"https:\/\/suzutukiblog.com\/index.php\/2021\/09\/06\/javascript7\/","og:image":"https:\/\/suzutukiblog.com\/wp-content\/uploads\/2020\/03\/cropped-cropped-markus-spiske-s7nlaF3kefg-unsplash-1.jpg","og:image:secure_url":"https:\/\/suzutukiblog.com\/wp-content\/uploads\/2020\/03\/cropped-cropped-markus-spiske-s7nlaF3kefg-unsplash-1.jpg","og:image:width":512,"og:image:height":316,"article:published_time":"2021-09-05T23:10:31+00:00","article:modified_time":"2023-01-04T13:08:17+00:00","twitter:card":"summary","twitter:title":"JavaScript7(\u30e2\u30d0\u30a4\u30eb\u30e1\u30cb\u30e5\u30fc) \u2014 \u3068\u3042\u308bIT\u30a8\u30f3\u30b8\u30cb\u30a2\u306e\u30d6\u30ed\u30b0","twitter:description":"1:\u30b9\u30de\u30db\u753b\u9762\u7528\u306e\u30e1\u30cb\u30e5\u30fc\u3092\u4f5c\u308b(mixin\u306f\u3044\u3064\u3082\u3069\u304a\u308a\u306a\u306e\u3067\u7701\u7565) HTML\u306e\u8a18\u8ff0","twitter:image":"https:\/\/suzutukiblog.com\/wp-content\/uploads\/2020\/03\/cropped-cropped-markus-spiske-s7nlaF3kefg-unsplash-1.jpg"},"aioseo_meta_data":{"post_id":"2025","title":null,"description":null,"keywords":[],"keyphrases":{"focus":{"keyphrase":"","score":0,"analysis":{"keyphraseInTitle":{"score":0,"maxScore":9,"error":1}}},"additional":[]},"primary_term":null,"canonical_url":null,"og_title":null,"og_description":null,"og_object_type":"default","og_image_type":"default","og_image_url":null,"og_image_width":null,"og_image_height":null,"og_image_custom_url":null,"og_image_custom_fields":null,"og_video":"","og_custom_url":null,"og_article_section":null,"og_article_tags":[],"twitter_use_og":false,"twitter_card":"default","twitter_image_type":"default","twitter_image_url":null,"twitter_image_custom_url":null,"twitter_image_custom_fields":null,"twitter_title":null,"twitter_description":null,"schema":{"blockGraphs":[],"customGraphs":[],"default":{"data":{"Article":[],"Course":[],"Dataset":[],"FAQPage":[],"Movie":[],"Person":[],"Product":[],"ProductReview":[],"Car":[],"Recipe":[],"Service":[],"SoftwareApplication":[],"WebPage":[]},"graphName":"BlogPosting","isEnabled":true},"graphs":[]},"schema_type":"default","schema_type_options":"{\"article\":{\"articleType\":\"BlogPosting\"},\"course\":{\"name\":\"\",\"description\":\"\",\"provider\":\"\"},\"faq\":{\"pages\":[]},\"product\":{\"reviews\":[]},\"recipe\":{\"ingredients\":[],\"instructions\":[],\"keywords\":[]},\"software\":{\"reviews\":[],\"operatingSystems\":[]},\"webPage\":{\"webPageType\":\"WebPage\"}}","pillar_content":false,"robots_default":true,"robots_noindex":false,"robots_noarchive":false,"robots_nosnippet":false,"robots_nofollow":false,"robots_noimageindex":false,"robots_noodp":false,"robots_notranslate":false,"robots_max_snippet":"-1","robots_max_videopreview":"-1","robots_max_imagepreview":"large","priority":null,"frequency":"default","local_seo":null,"breadcrumb_settings":null,"limit_modified_date":false,"ai":null,"created":"2021-03-21 18:31:09","updated":"2025-06-04 14:41:00","seo_analyzer_scan_date":null},"_links":{"self":[{"href":"https:\/\/suzutukiblog.com\/index.php\/wp-json\/wp\/v2\/posts\/2025","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/suzutukiblog.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/suzutukiblog.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/suzutukiblog.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/suzutukiblog.com\/index.php\/wp-json\/wp\/v2\/comments?post=2025"}],"version-history":[{"count":18,"href":"https:\/\/suzutukiblog.com\/index.php\/wp-json\/wp\/v2\/posts\/2025\/revisions"}],"predecessor-version":[{"id":7229,"href":"https:\/\/suzutukiblog.com\/index.php\/wp-json\/wp\/v2\/posts\/2025\/revisions\/7229"}],"wp:attachment":[{"href":"https:\/\/suzutukiblog.com\/index.php\/wp-json\/wp\/v2\/media?parent=2025"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/suzutukiblog.com\/index.php\/wp-json\/wp\/v2\/categories?post=2025"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/suzutukiblog.com\/index.php\/wp-json\/wp\/v2\/tags?post=2025"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}