diff options
Diffstat (limited to 'files/ja')
226 files changed, 2357 insertions, 2724 deletions
diff --git a/files/ja/_redirects.txt b/files/ja/_redirects.txt index e08fe6bda3..35c4e4acda 100644 --- a/files/ja/_redirects.txt +++ b/files/ja/_redirects.txt @@ -574,7 +574,7 @@ /ja/docs/Core_JavaScript_1.5_Guide/About /ja/docs/Web/JavaScript/Guide/Introduction /ja/docs/Core_JavaScript_1.5_Guide/About/Core_Language_Features /ja/docs/orphaned/Web/JavaScript/Guide/Core_Language_Features /ja/docs/Core_JavaScript_1.5_Guide/Block_Statement /ja/docs/Web/JavaScript/Guide/Control_flow_and_error_handling -/ja/docs/Core_JavaScript_1.5_Guide/Class-Based_vs._Prototype-Based_Languages /ja/docs/orphaned/Web/JavaScript/Guide/Class-Based_vs._Prototype-Based_Languages +/ja/docs/Core_JavaScript_1.5_Guide/Class-Based_vs._Prototype-Based_Languages /ja/docs/Web/JavaScript/Guide/Details_of_the_Object_Model /ja/docs/Core_JavaScript_1.5_Guide/Core_Language_Features /ja/docs/orphaned/Web/JavaScript/Guide/Core_Language_Features /ja/docs/Core_JavaScript_1.5_Guide/Creating_New_Objects /ja/docs/Web/JavaScript/Guide/Working_with_Objects#creating_new_objects /ja/docs/Core_JavaScript_1.5_Guide/Creating_New_Objects/Defining_Getters_and_Setters /ja/docs/Web/JavaScript/Guide/Working_with_Objects#defining_getters_and_setters @@ -619,7 +619,7 @@ /ja/docs/Core_JavaScript_1.5_Guide:About /ja/docs/Web/JavaScript/Guide/Introduction /ja/docs/Core_JavaScript_1.5_Guide:About:Core_Language_Features /ja/docs/orphaned/Web/JavaScript/Guide/Core_Language_Features /ja/docs/Core_JavaScript_1.5_Guide:Block_Statement /ja/docs/Web/JavaScript/Guide/Control_flow_and_error_handling -/ja/docs/Core_JavaScript_1.5_Guide:Class-Based_vs._Prototype-Based_Languages /ja/docs/orphaned/Web/JavaScript/Guide/Class-Based_vs._Prototype-Based_Languages +/ja/docs/Core_JavaScript_1.5_Guide:Class-Based_vs._Prototype-Based_Languages /ja/docs/Web/JavaScript/Guide/Details_of_the_Object_Model /ja/docs/Core_JavaScript_1.5_Guide:Core_Language_Features /ja/docs/orphaned/Web/JavaScript/Guide/Core_Language_Features /ja/docs/Core_JavaScript_1.5_Guide:Creating_New_Objects /ja/docs/Web/JavaScript/Guide/Working_with_Objects#creating_new_objects /ja/docs/Core_JavaScript_1.5_Guide:Creating_New_Objects:Defining_Getters_and_Setters /ja/docs/Web/JavaScript/Guide/Working_with_Objects#defining_getters_and_setters @@ -1499,10 +1499,10 @@ /ja/docs/DOM/window.mozInnerScreenY /ja/docs/Web/API/Window/mozInnerScreenY /ja/docs/DOM/window.name /ja/docs/Web/API/Window/name /ja/docs/DOM/window.navigator /ja/docs/Web/API/Window/navigator -/ja/docs/DOM/window.navigator.appCodeName /ja/docs/orphaned/Web/API/NavigatorID/appCodeName -/ja/docs/DOM/window.navigator.appCodeName-redirect-1 /ja/docs/orphaned/Web/API/NavigatorID/appCodeName -/ja/docs/DOM/window.navigator.appName /ja/docs/orphaned/Web/API/NavigatorID/appName -/ja/docs/DOM/window.navigator.appVersion /ja/docs/orphaned/Web/API/NavigatorID/appVersion +/ja/docs/DOM/window.navigator.appCodeName /ja/docs/Web/API/Navigator/appCodeName +/ja/docs/DOM/window.navigator.appCodeName-redirect-1 /ja/docs/Web/API/Navigator/appCodeName +/ja/docs/DOM/window.navigator.appName /ja/docs/Web/API/Navigator/appName +/ja/docs/DOM/window.navigator.appVersion /ja/docs/Web/API/Navigator/appVersion /ja/docs/DOM/window.navigator.battery /ja/docs/Web/API/Navigator/battery /ja/docs/DOM/window.navigator.buildID /ja/docs/Web/API/Navigator/buildID /ja/docs/DOM/window.navigator.cookieEnabled /ja/docs/Web/API/Navigator/cookieEnabled @@ -1511,12 +1511,12 @@ /ja/docs/DOM/window.navigator.mozIsLocallyAvailable /ja/docs/Web/API/Navigator/mozIsLocallyAvailable /ja/docs/DOM/window.navigator.onLine /ja/docs/Web/API/Navigator/onLine /ja/docs/DOM/window.navigator.oscpu /ja/docs/Web/API/Navigator/oscpu -/ja/docs/DOM/window.navigator.platform /ja/docs/orphaned/Web/API/NavigatorID/platform -/ja/docs/DOM/window.navigator.product /ja/docs/orphaned/Web/API/NavigatorID/product +/ja/docs/DOM/window.navigator.platform /ja/docs/Web/API/Navigator/platform +/ja/docs/DOM/window.navigator.product /ja/docs/Web/API/Navigator/product /ja/docs/DOM/window.navigator.productSub /ja/docs/Web/API/Navigator/productSub /ja/docs/DOM/window.navigator.registerContentHandler /ja/docs/orphaned/Web/API/Navigator/registerContentHandler /ja/docs/DOM/window.navigator.registerProtocolHandler /ja/docs/Web/API/Navigator/registerProtocolHandler -/ja/docs/DOM/window.navigator.userAgent /ja/docs/orphaned/Web/API/NavigatorID/userAgent +/ja/docs/DOM/window.navigator.userAgent /ja/docs/Web/API/Navigator/userAgent /ja/docs/DOM/window.navigator.vendor /ja/docs/Web/API/Navigator/vendor /ja/docs/DOM/window.navigator.vendor-redirect-1 /ja/docs/Web/API/Navigator/vendor /ja/docs/DOM/window.navigator.vendorSub /ja/docs/Web/API/Navigator/vendorSub @@ -1723,9 +1723,9 @@ /ja/docs/DOM:window.moveTo /ja/docs/Web/API/Window/moveTo /ja/docs/DOM:window.name /ja/docs/Web/API/Window/name /ja/docs/DOM:window.navigator /ja/docs/Web/API/Window/navigator -/ja/docs/DOM:window.navigator.appCodeName /ja/docs/orphaned/Web/API/NavigatorID/appCodeName -/ja/docs/DOM:window.navigator.appName /ja/docs/orphaned/Web/API/NavigatorID/appName -/ja/docs/DOM:window.navigator.appVersion /ja/docs/orphaned/Web/API/NavigatorID/appVersion +/ja/docs/DOM:window.navigator.appCodeName /ja/docs/Web/API/Navigator/appCodeName +/ja/docs/DOM:window.navigator.appName /ja/docs/Web/API/Navigator/appName +/ja/docs/DOM:window.navigator.appVersion /ja/docs/Web/API/Navigator/appVersion /ja/docs/DOM:window.navigator.buildID /ja/docs/Web/API/Navigator/buildID /ja/docs/DOM:window.navigator.cookieEnabled /ja/docs/Web/API/Navigator/cookieEnabled /ja/docs/DOM:window.navigator.isLocallyAvailable /ja/docs/Web/API/Navigator/mozIsLocallyAvailable @@ -1733,12 +1733,12 @@ /ja/docs/DOM:window.navigator.mozIsLocallyAvailable /ja/docs/Web/API/Navigator/mozIsLocallyAvailable /ja/docs/DOM:window.navigator.onLine /ja/docs/Web/API/Navigator/onLine /ja/docs/DOM:window.navigator.oscpu /ja/docs/Web/API/Navigator/oscpu -/ja/docs/DOM:window.navigator.platform /ja/docs/orphaned/Web/API/NavigatorID/platform -/ja/docs/DOM:window.navigator.product /ja/docs/orphaned/Web/API/NavigatorID/product +/ja/docs/DOM:window.navigator.platform /ja/docs/Web/API/Navigator/platform +/ja/docs/DOM:window.navigator.product /ja/docs/Web/API/Navigator/product /ja/docs/DOM:window.navigator.productSub /ja/docs/Web/API/Navigator/productSub /ja/docs/DOM:window.navigator.registerContentHandler /ja/docs/orphaned/Web/API/Navigator/registerContentHandler /ja/docs/DOM:window.navigator.registerProtocolHandler /ja/docs/Web/API/Navigator/registerProtocolHandler -/ja/docs/DOM:window.navigator.userAgent /ja/docs/orphaned/Web/API/NavigatorID/userAgent +/ja/docs/DOM:window.navigator.userAgent /ja/docs/Web/API/Navigator/userAgent /ja/docs/DOM:window.navigator.vendor /ja/docs/Web/API/Navigator/vendor /ja/docs/DOM:window.navigator.vendorSub /ja/docs/Web/API/Navigator/vendorSub /ja/docs/DOM:window.onabort /ja/docs/Web/API/GlobalEventHandlers/onabort @@ -2129,7 +2129,7 @@ /ja/docs/JavaScript/Guide/About-redirect-1 /ja/docs/Web/JavaScript/Guide/Introduction /ja/docs/JavaScript/Guide/Block_Statement /ja/docs/Web/JavaScript/Guide/Control_flow_and_error_handling /ja/docs/JavaScript/Guide/Block_Statement-redirect-1 /ja/docs/Web/JavaScript/Guide/Control_flow_and_error_handling -/ja/docs/JavaScript/Guide/Class-Based_vs._Prototype-Based_Languages /ja/docs/orphaned/Web/JavaScript/Guide/Class-Based_vs._Prototype-Based_Languages +/ja/docs/JavaScript/Guide/Class-Based_vs._Prototype-Based_Languages /ja/docs/Web/JavaScript/Guide/Details_of_the_Object_Model /ja/docs/JavaScript/Guide/Closures /ja/docs/Web/JavaScript/Closures /ja/docs/JavaScript/Guide/Core_Language_Features /ja/docs/orphaned/Web/JavaScript/Guide/Core_Language_Features /ja/docs/JavaScript/Guide/Creating_New_Objects /ja/docs/Web/JavaScript/Guide/Working_with_Objects#creating_new_objects @@ -2801,7 +2801,6 @@ /ja/docs/Mozilla/Add-ons/WebExtensions/前提条件 /ja/docs/Mozilla/Add-ons/WebExtensions/Prerequisites /ja/docs/Mozilla/Firefox/Releases/Firefox_47_for_developers /ja/docs/Mozilla/Firefox/Releases/47 /ja/docs/Mozilla_Addons_FAQ_(external) https://addons.mozilla.org/faq.php -/ja/docs/Mozmill /ja/docs/orphaned/Mozmill /ja/docs/NPAPI/Constants /ja/docs/Plugins/Guide/Constants /ja/docs/NPAPI:Constants /ja/docs/Plugins/Guide/Constants /ja/docs/Namespace /ja/docs/Glossary/Namespace @@ -3169,20 +3168,18 @@ /ja/docs/Web/API/IDBFactory.cmp /ja/docs/Web/API/IDBFactory/cmp /ja/docs/Web/API/IDBFactory.deleteDatabase /ja/docs/Web/API/IDBFactory/deleteDatabase /ja/docs/Web/API/IDBFactory.open /ja/docs/Web/API/IDBFactory/open -/ja/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB /ja/docs/orphaned/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB +/ja/docs/Web/API/Index /ja/docs/conflicting/Web/API_49b9a84475f11fffb8fc271a7df3c49a +/ja/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB /ja/docs/Web/API/IndexedDB_API/Basic_Terminology /ja/docs/Web/API/MediaRecorder_API /ja/docs/Web/API/MediaStream_Recording_API /ja/docs/Web/API/Navigator.getUserMedia /ja/docs/Web/API/Navigator/getUserMedia /ja/docs/Web/API/Navigator/registerContentHandler /ja/docs/orphaned/Web/API/Navigator/registerContentHandler -/ja/docs/Web/API/Navigator/userAgent /ja/docs/orphaned/Web/API/NavigatorID/userAgent -/ja/docs/Web/API/NavigatorConcurrentHardware /ja/docs/orphaned/Web/API/NavigatorConcurrentHardware -/ja/docs/Web/API/NavigatorConcurrentHardware/hardwareConcurrency /ja/docs/orphaned/Web/API/NavigatorConcurrentHardware/hardwareConcurrency -/ja/docs/Web/API/NavigatorID /ja/docs/orphaned/Web/API/NavigatorID -/ja/docs/Web/API/NavigatorID/appCodeName /ja/docs/orphaned/Web/API/NavigatorID/appCodeName -/ja/docs/Web/API/NavigatorID/appName /ja/docs/orphaned/Web/API/NavigatorID/appName -/ja/docs/Web/API/NavigatorID/appVersion /ja/docs/orphaned/Web/API/NavigatorID/appVersion -/ja/docs/Web/API/NavigatorID/platform /ja/docs/orphaned/Web/API/NavigatorID/platform -/ja/docs/Web/API/NavigatorID/product /ja/docs/orphaned/Web/API/NavigatorID/product -/ja/docs/Web/API/NavigatorID/userAgent /ja/docs/orphaned/Web/API/NavigatorID/userAgent +/ja/docs/Web/API/NavigatorID /ja/docs/Web/API/Navigator +/ja/docs/Web/API/NavigatorID/appCodeName /ja/docs/Web/API/Navigator/appCodeName +/ja/docs/Web/API/NavigatorID/appName /ja/docs/Web/API/Navigator/appName +/ja/docs/Web/API/NavigatorID/appVersion /ja/docs/Web/API/Navigator/appVersion +/ja/docs/Web/API/NavigatorID/platform /ja/docs/Web/API/Navigator/platform +/ja/docs/Web/API/NavigatorID/product /ja/docs/Web/API/Navigator/product +/ja/docs/Web/API/NavigatorID/userAgent /ja/docs/Web/API/Navigator/userAgent /ja/docs/Web/API/NavigatorLanguage /ja/docs/Web/API/Navigator /ja/docs/Web/API/NavigatorLanguage.languages /ja/docs/Web/API/Navigator/languages /ja/docs/Web/API/NavigatorLanguage/language /ja/docs/Web/API/Navigator/language @@ -3224,9 +3221,7 @@ /ja/docs/Web/API/Node.replaceChild /ja/docs/Web/API/Node/replaceChild /ja/docs/Web/API/Node.textContent /ja/docs/Web/API/Node/textContent /ja/docs/Web/API/Node/baseURIObject /ja/docs/Web/API/Node -/ja/docs/Web/API/Node/cloneNode-old /ja/docs/orphaned/Web/API/Node/getUserData /ja/docs/Web/API/Node/firstChild-temp /ja/docs/Web/API/Node/firstChild -/ja/docs/Web/API/Node/getUserData /ja/docs/orphaned/Web/API/Node/getUserData /ja/docs/Web/API/Node/innerText /ja/docs/Web/API/HTMLElement/innerText /ja/docs/Web/API/Node/localName /ja/docs/Web/API/Element/localName /ja/docs/Web/API/Node/namespaceURI /ja/docs/Web/API/Element/namespaceURI @@ -3234,12 +3229,6 @@ /ja/docs/Web/API/Node/prefix /ja/docs/Web/API/Element/prefix /ja/docs/Web/API/NodeList.item /ja/docs/Web/API/NodeList/item /ja/docs/Web/API/NonDocumentTypeChildNode /ja/docs/Web/API/Element -/ja/docs/Web/API/ParentNode /ja/docs/orphaned/Web/API/ParentNode -/ja/docs/Web/API/ParentNode/append /ja/docs/orphaned/Web/API/ParentNode/append -/ja/docs/Web/API/ParentNode/childElementCount /ja/docs/Web/API/Element/childElementCount -/ja/docs/Web/API/ParentNode/children /ja/docs/orphaned/Web/API/ParentNode/children -/ja/docs/Web/API/ParentNode/prepend /ja/docs/orphaned/Web/API/ParentNode/prepend -/ja/docs/Web/API/ParentNode/querySelectorAll /ja/docs/orphaned/Web/API/ParentNode/querySelectorAll /ja/docs/Web/API/Position /ja/docs/Web/API/GeolocationPosition /ja/docs/Web/API/PositionError /ja/docs/Web/API/GeolocationPositionError /ja/docs/Web/API/Push_API/Using_the_Push_API /ja/docs/Web/API/Push_API @@ -3496,17 +3485,17 @@ /ja/docs/Web/API/window.mozRequestAnimationFrame /ja/docs/Web/API/Window/requestAnimationFrame /ja/docs/Web/API/window.name /ja/docs/Web/API/Window/name /ja/docs/Web/API/window.navigator /ja/docs/Web/API/Window/navigator -/ja/docs/Web/API/window.navigator.appCodeName /ja/docs/orphaned/Web/API/NavigatorID/appCodeName -/ja/docs/Web/API/window.navigator.appName /ja/docs/orphaned/Web/API/NavigatorID/appName +/ja/docs/Web/API/window.navigator.appCodeName /ja/docs/Web/API/Navigator/appCodeName +/ja/docs/Web/API/window.navigator.appName /ja/docs/Web/API/Navigator/appName /ja/docs/Web/API/window.navigator.battery /ja/docs/Web/API/Navigator/battery /ja/docs/Web/API/window.navigator.language /ja/docs/Web/API/Navigator/language /ja/docs/Web/API/window.navigator.onLine /ja/docs/Web/API/Navigator/onLine /ja/docs/Web/API/window.navigator.oscpu /ja/docs/Web/API/Navigator/oscpu -/ja/docs/Web/API/window.navigator.platform /ja/docs/orphaned/Web/API/NavigatorID/platform -/ja/docs/Web/API/window.navigator.product /ja/docs/orphaned/Web/API/NavigatorID/product +/ja/docs/Web/API/window.navigator.platform /ja/docs/Web/API/Navigator/platform +/ja/docs/Web/API/window.navigator.product /ja/docs/Web/API/Navigator/product /ja/docs/Web/API/window.navigator.productSub /ja/docs/Web/API/Navigator/productSub /ja/docs/Web/API/window.navigator.registerContentHandler /ja/docs/orphaned/Web/API/Navigator/registerContentHandler -/ja/docs/Web/API/window.navigator.userAgent /ja/docs/orphaned/Web/API/NavigatorID/userAgent +/ja/docs/Web/API/window.navigator.userAgent /ja/docs/Web/API/Navigator/userAgent /ja/docs/Web/API/window.navigator.vendor /ja/docs/Web/API/Navigator/vendor /ja/docs/Web/API/window.navigator.vendorSub /ja/docs/Web/API/Navigator/vendorSub /ja/docs/Web/API/window.onabort /ja/docs/Web/API/GlobalEventHandlers/onabort @@ -4082,7 +4071,7 @@ /ja/docs/Web/JavaScript/Getting_Started /ja/docs/Learn/Getting_started_with_the_web/JavaScript_basics /ja/docs/Web/JavaScript/Guide/About /ja/docs/Web/JavaScript/Guide/Introduction /ja/docs/Web/JavaScript/Guide/Block_Statement /ja/docs/Web/JavaScript/Guide/Control_flow_and_error_handling -/ja/docs/Web/JavaScript/Guide/Class-Based_vs._Prototype-Based_Languages /ja/docs/orphaned/Web/JavaScript/Guide/Class-Based_vs._Prototype-Based_Languages +/ja/docs/Web/JavaScript/Guide/Class-Based_vs._Prototype-Based_Languages /ja/docs/Web/JavaScript/Guide/Details_of_the_Object_Model /ja/docs/Web/JavaScript/Guide/Closures /ja/docs/Web/JavaScript/Closures /ja/docs/Web/JavaScript/Guide/Core_Language_Features /ja/docs/orphaned/Web/JavaScript/Guide/Core_Language_Features /ja/docs/Web/JavaScript/Guide/Creating_New_Objects /ja/docs/Web/JavaScript/Guide/Working_with_Objects#creating_new_objects @@ -4366,7 +4355,6 @@ /ja/docs/Web/Reference/Events/vrdisplayconnected /ja/docs/Web/API/Window/vrdisplayconnect_event /ja/docs/Web/Reference/Events/vrdisplaydisconnected /ja/docs/Web/API/Window/vrdisplaydisconnect_event /ja/docs/Web/Reference/Events/vrdisplaypresentchange /ja/docs/Web/API/Window/vrdisplaypresentchange_event -/ja/docs/Web/SVG/Element/solidColor /ja/docs/orphaned/Web/SVG/Element/solidColor /ja/docs/Web/Security/CSP /ja/docs/Web/HTTP/CSP /ja/docs/Web/Security/CSP/CSP_policy_directives /ja/docs/Web/HTTP/Headers/Content-Security-Policy /ja/docs/Web/Security/CSP/Default_CSP_restrictions /ja/docs/Web/HTTP/Headers/Content-Security-Policy diff --git a/files/ja/_wikihistory.json b/files/ja/_wikihistory.json index cc8248c8af..243b94cab0 100644 --- a/files/ja/_wikihistory.json +++ b/files/ja/_wikihistory.json @@ -13592,6 +13592,14 @@ "hashedhyphen" ] }, + "Web/API/Element/append": { + "modified": "2020-10-15T22:19:11.886Z", + "contributors": [ + "mfuji09", + "dskymd", + "isdh" + ] + }, "Web/API/Element/attachShadow": { "modified": "2020-10-15T22:09:56.110Z", "contributors": [ @@ -13635,6 +13643,13 @@ "Marsf" ] }, + "Web/API/Element/children": { + "modified": "2020-11-23T04:45:58.549Z", + "contributors": [ + "segayuu", + "sii" + ] + }, "Web/API/Element/classList": { "modified": "2020-10-15T21:14:13.067Z", "contributors": [ @@ -14095,6 +14110,13 @@ "sii" ] }, + "Web/API/Element/prepend": { + "modified": "2020-10-15T22:22:02.876Z", + "contributors": [ + "mfuji09", + "silverskyvicto" + ] + }, "Web/API/Element/querySelector": { "modified": "2019-03-23T23:02:48.166Z", "contributors": [ @@ -17794,13 +17816,6 @@ "ethertank" ] }, - "Web/API/Index": { - "modified": "2019-01-16T21:57:23.880Z", - "contributors": [ - "mfuji09", - "Marsf" - ] - }, "Web/API/IndexedDB_API": { "modified": "2019-11-01T12:27:47.658Z", "contributors": [ @@ -17815,6 +17830,17 @@ "Potappo" ] }, + "Web/API/IndexedDB_API/Basic_Terminology": { + "modified": "2020-03-25T11:26:36.526Z", + "contributors": [ + "Uemmra3", + "Wind1808", + "wbamberg", + "SphinxKnight", + "mandel59", + "yyss" + ] + }, "Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria": { "modified": "2019-05-23T13:25:35.305Z", "contributors": [ @@ -18820,6 +18846,33 @@ "rootx" ] }, + "Web/API/Navigator/appCodeName": { + "modified": "2019-03-23T23:49:17.312Z", + "contributors": [ + "fscholz", + "jsx", + "ethertank", + "Potappo" + ] + }, + "Web/API/Navigator/appName": { + "modified": "2019-03-23T23:49:11.201Z", + "contributors": [ + "fscholz", + "khalid32", + "ethertank", + "Potappo" + ] + }, + "Web/API/Navigator/appVersion": { + "modified": "2019-03-23T23:49:20.671Z", + "contributors": [ + "fscholz", + "khalid32", + "ethertank", + "Potappo" + ] + }, "Web/API/Navigator/battery": { "modified": "2020-10-15T21:22:04.664Z", "contributors": [ @@ -18925,6 +18978,12 @@ "rootx" ] }, + "Web/API/Navigator/hardwareConcurrency": { + "modified": "2020-10-15T22:16:03.921Z", + "contributors": [ + "shisama" + ] + }, "Web/API/Navigator/keyboard": { "modified": "2020-10-15T22:09:25.704Z", "contributors": [ @@ -19017,12 +19076,31 @@ "Wind1808" ] }, + "Web/API/Navigator/platform": { + "modified": "2020-10-15T21:16:44.396Z", + "contributors": [ + "yyss", + "fscholz", + "arunpandianp", + "ethertank", + "Potappo" + ] + }, "Web/API/Navigator/presentation": { "modified": "2020-11-03T12:01:37.262Z", "contributors": [ "mfuji09" ] }, + "Web/API/Navigator/product": { + "modified": "2019-03-23T23:49:28.986Z", + "contributors": [ + "fscholz", + "khalid32", + "ethertank", + "Potappo" + ] + }, "Web/API/Navigator/productSub": { "modified": "2020-10-15T21:16:44.835Z", "contributors": [ @@ -19081,6 +19159,18 @@ "yuta0801" ] }, + "Web/API/Navigator/userAgent": { + "modified": "2020-10-15T21:16:43.171Z", + "contributors": [ + "mfuji09", + "pcw", + "kenmori", + "fscholz", + "khalid32", + "ethertank", + "Potappo" + ] + }, "Web/API/Navigator/vendor": { "modified": "2020-10-15T21:16:44.842Z", "contributors": [ @@ -48531,6 +48621,13 @@ "Wind1808" ] }, + "conflicting/Web/API_49b9a84475f11fffb8fc271a7df3c49a": { + "modified": "2019-01-16T21:57:23.880Z", + "contributors": [ + "mfuji09", + "Marsf" + ] + }, "conflicting/Web/API_dd04ca1265cb79b990b8120e5f5070d3": { "modified": "2019-03-23T23:32:13.721Z", "contributors": [ @@ -48915,12 +49012,6 @@ "Mgjbot" ] }, - "orphaned/Mozmill": { - "modified": "2019-03-24T00:11:57.214Z", - "contributors": [ - "Marsf" - ] - }, "orphaned/New_in_JavaScript_1.8": { "modified": "2019-03-24T00:06:00.366Z", "contributors": [ @@ -49207,23 +49298,6 @@ "mikamikuh" ] }, - "orphaned/Web/API/HTMLOrForeignElement": { - "modified": "2020-10-15T22:28:17.699Z", - "contributors": [ - "mfuji09" - ] - }, - "orphaned/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB": { - "modified": "2020-03-25T11:26:36.526Z", - "contributors": [ - "Uemmra3", - "Wind1808", - "wbamberg", - "SphinxKnight", - "mandel59", - "yyss" - ] - }, "orphaned/Web/API/Navigator/registerContentHandler": { "modified": "2020-10-15T21:15:53.115Z", "contributors": [ @@ -49240,76 +49314,6 @@ "fscholz" ] }, - "orphaned/Web/API/NavigatorConcurrentHardware/hardwareConcurrency": { - "modified": "2020-10-15T22:16:03.921Z", - "contributors": [ - "shisama" - ] - }, - "orphaned/Web/API/NavigatorID": { - "modified": "2019-03-23T23:01:19.867Z", - "contributors": [ - "fscholz" - ] - }, - "orphaned/Web/API/NavigatorID/appCodeName": { - "modified": "2019-03-23T23:49:17.312Z", - "contributors": [ - "fscholz", - "jsx", - "ethertank", - "Potappo" - ] - }, - "orphaned/Web/API/NavigatorID/appName": { - "modified": "2019-03-23T23:49:11.201Z", - "contributors": [ - "fscholz", - "khalid32", - "ethertank", - "Potappo" - ] - }, - "orphaned/Web/API/NavigatorID/appVersion": { - "modified": "2019-03-23T23:49:20.671Z", - "contributors": [ - "fscholz", - "khalid32", - "ethertank", - "Potappo" - ] - }, - "orphaned/Web/API/NavigatorID/platform": { - "modified": "2020-10-15T21:16:44.396Z", - "contributors": [ - "yyss", - "fscholz", - "arunpandianp", - "ethertank", - "Potappo" - ] - }, - "orphaned/Web/API/NavigatorID/product": { - "modified": "2019-03-23T23:49:28.986Z", - "contributors": [ - "fscholz", - "khalid32", - "ethertank", - "Potappo" - ] - }, - "orphaned/Web/API/NavigatorID/userAgent": { - "modified": "2020-10-15T21:16:43.171Z", - "contributors": [ - "mfuji09", - "pcw", - "kenmori", - "fscholz", - "khalid32", - "ethertank", - "Potappo" - ] - }, "orphaned/Web/API/NavigatorPlugins": { "modified": "2019-03-23T23:01:18.262Z", "contributors": [ @@ -49355,56 +49359,6 @@ "Wind1808" ] }, - "orphaned/Web/API/Node/getUserData": { - "modified": "2020-10-15T21:14:35.305Z", - "contributors": [ - "mfuji09", - "AshfaqHossain", - "teoli", - "ethertank", - "dextra", - "Potappo", - "Mgjbot", - "Shoot" - ] - }, - "orphaned/Web/API/ParentNode": { - "modified": "2020-11-23T03:46:53.867Z", - "contributors": [ - "segayuu", - "yyss", - "Marsf", - "YuichiNukiyama" - ] - }, - "orphaned/Web/API/ParentNode/append": { - "modified": "2020-10-15T22:19:11.886Z", - "contributors": [ - "mfuji09", - "dskymd", - "isdh" - ] - }, - "orphaned/Web/API/ParentNode/children": { - "modified": "2020-11-23T04:45:58.549Z", - "contributors": [ - "segayuu", - "sii" - ] - }, - "orphaned/Web/API/ParentNode/prepend": { - "modified": "2020-10-15T22:22:02.876Z", - "contributors": [ - "mfuji09", - "silverskyvicto" - ] - }, - "orphaned/Web/API/ParentNode/querySelectorAll": { - "modified": "2020-10-15T22:26:50.502Z", - "contributors": [ - "mfuji09" - ] - }, "orphaned/Web/API/RTCIdentityErrorEvent": { "modified": "2019-03-23T22:51:24.405Z", "contributors": [ @@ -49846,16 +49800,6 @@ "mfuji09" ] }, - "orphaned/Web/JavaScript/Guide/Class-Based_vs._Prototype-Based_Languages": { - "modified": "2019-01-16T14:43:33.903Z", - "contributors": [ - "ethertank", - "happysadman", - "Mgjbot", - "electrolysis", - "Kozawa" - ] - }, "orphaned/Web/JavaScript/Guide/Core_Language_Features": { "modified": "2019-03-23T23:42:43.617Z", "contributors": [ @@ -50137,12 +50081,6 @@ "mfuji09" ] }, - "orphaned/Web/SVG/Element/solidColor": { - "modified": "2020-12-06T03:41:32.485Z", - "contributors": [ - "mfuji09" - ] - }, "orphaned/Web/Security/Information_Security_Basics": { "modified": "2020-03-15T03:29:26.429Z", "contributors": [ diff --git a/files/ja/web/api/index/index.html b/files/ja/conflicting/web/api_49b9a84475f11fffb8fc271a7df3c49a/index.html index e37c8080c2..cdd2b4c27d 100644 --- a/files/ja/web/api/index/index.html +++ b/files/ja/conflicting/web/api_49b9a84475f11fffb8fc271a7df3c49a/index.html @@ -1,10 +1,11 @@ --- title: 索引 -slug: Web/API/Index +slug: conflicting/Web/API_49b9a84475f11fffb8fc271a7df3c49a tags: - API - Index - Landing translation_of: Web/API/Index +original_slug: Web/API/Index --- <p>{{Index("/ja/docs/Web/API")}}</p> diff --git a/files/ja/glossary/accessibility_tree/index.html b/files/ja/glossary/accessibility_tree/index.html index 44f43dad41..e5fea12351 100644 --- a/files/ja/glossary/accessibility_tree/index.html +++ b/files/ja/glossary/accessibility_tree/index.html @@ -30,7 +30,7 @@ translation_of: Glossary/Accessibility_tree <p>加えて、アクセシビリティツリーは要素によって何が行われるのかについての情報を持つことがよくあります。リンクは <em>followed</em>、テキスト入力は <em>typed into</em>、などです。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">用語集</a> diff --git a/files/ja/glossary/adobe_flash/index.html b/files/ja/glossary/adobe_flash/index.html index 94d75e0453..308303c964 100644 --- a/files/ja/glossary/adobe_flash/index.html +++ b/files/ja/glossary/adobe_flash/index.html @@ -11,7 +11,7 @@ translation_of: Glossary/Adobe_Flash --- <p id="Summary">Flash は Adobe によって開発された廃れつつある技術で、表現力のあるウェブアプリ、マルチメディアコンテンツ、ストリーミングメディアを表示します。 Adobe Flash は対応している{{Glossary("Browser","ウェブブラウザー")}}でプラグインを用いて実行することができます。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="https://www.adobe.com/products/flashruntimes.html">公式ウェブサイト</a></li> <li><a href="https://mozilla.github.io/shumway/">Shumway: Mozilla によるフリーな実装</a></li> diff --git a/files/ja/glossary/ajax/index.html b/files/ja/glossary/ajax/index.html index 9112beff79..df4a7a3e76 100644 --- a/files/ja/glossary/ajax/index.html +++ b/files/ja/glossary/ajax/index.html @@ -16,7 +16,7 @@ translation_of: Glossary/AJAX <p>対話型のウェブサイトや最新のウェブ標準では、 AJAX は徐々に JavaScript フレームワーク内の関数や公式の {{domxref("Fetch API")}} 標準に置き換えられています。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a>: diff --git a/files/ja/glossary/blink/index.html b/files/ja/glossary/blink/index.html index e5a9f6922e..8be8ea6116 100644 --- a/files/ja/glossary/blink/index.html +++ b/files/ja/glossary/blink/index.html @@ -14,7 +14,7 @@ translation_of: Glossary/Blink --- <p>Blink は、 Google によって Chromium の一部 (それゆえ {{glossary("Chrome", "Google Chrome")}} の一部でもある) として開発されたオープンソースのブラウザー用レイアウトエンジンです。特に、 Blink はレイアウト、レンダリング、 {{glossary("DOM")}} の処理を扱う {{glossary("WebKit")}} 内の WebCore ライブラリのフォークとして始まりましたが、現在は独立した{{glossary("rendering engine", "レンダリングエンジン")}}として成立しています。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>一般知識 <ol> diff --git a/files/ja/glossary/bootstrap/index.html b/files/ja/glossary/bootstrap/index.html index f1cceee502..775161a6d5 100644 --- a/files/ja/glossary/bootstrap/index.html +++ b/files/ja/glossary/bootstrap/index.html @@ -14,7 +14,7 @@ translation_of: Glossary/Bootstrap <p>Bootstrap は当初 Twitter Blueprint と呼ばれ、 <a href="https://twitter.com/">Twitter</a> の従業員のチームで開発されました。レスポンシブデザインをサポートし、そのまま使用、あるいは自身のコードで必要に応じてカスタマイズできる、定義済みのデザインテンプレートがあります。 Bootstrap はすべての最新のブラウザーと {{glossary("Microsoft Internet Explorer", "Internet Explorer")}} の最近のバージョンと互換性があるので、他のブラウザーとの互換性について心配する必要はありません。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>Wikipedia 上の記事 {{interwiki("wikipedia", "Bootstrap", "Bootstrap")}}</li> <li><a href="https://getbootstrap.com/">Bootstrap をダウンロード</a></li> diff --git a/files/ja/glossary/brotli_compression/index.html b/files/ja/glossary/brotli_compression/index.html index e03602d8b3..ba7bf74147 100644 --- a/files/ja/glossary/brotli_compression/index.html +++ b/files/ja/glossary/brotli_compression/index.html @@ -22,7 +22,7 @@ translation_of: Glossary/brotli_compression <li><a href="https://caniuse.com/#feat=brotli">Brotli on Caniuse</a></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li> <details open><summary></summary> {{ListSubpages("/en-US/docs/Glossary")}}</details> diff --git a/files/ja/glossary/browser/index.html b/files/ja/glossary/browser/index.html index 50690ba09b..5fa78604a9 100644 --- a/files/ja/glossary/browser/index.html +++ b/files/ja/glossary/browser/index.html @@ -20,7 +20,7 @@ translation_of: Glossary/Browser <li><a href="https://www.opera.com/" rel="external">Opera ブラウザー</a></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> diff --git a/files/ja/glossary/cacheable/index.html b/files/ja/glossary/cacheable/index.html index da0c62fbbc..6703108ad2 100644 --- a/files/ja/glossary/cacheable/index.html +++ b/files/ja/glossary/cacheable/index.html @@ -44,7 +44,7 @@ translation_of: Glossary/cacheable Cache-Control: no-cache (…)</pre> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>一般知識 <ol> diff --git a/files/ja/glossary/call_stack/index.html b/files/ja/glossary/call_stack/index.html index cc188a1e09..cfb4875250 100644 --- a/files/ja/glossary/call_stack/index.html +++ b/files/ja/glossary/call_stack/index.html @@ -81,7 +81,7 @@ greeting(); <li>ウィキペディアの{{Interwiki("wikipedia", "コールスタック")}}</li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> diff --git a/files/ja/glossary/character_set/index.html b/files/ja/glossary/character_set/index.html index ad352b9d4f..b61119f7c3 100644 --- a/files/ja/glossary/character_set/index.html +++ b/files/ja/glossary/character_set/index.html @@ -13,7 +13,7 @@ translation_of: Glossary/character_set <p>文字コードが誤って使用すると (例えば、Big5 でエンコードされた記事に Unicode を使用すると)、壊れた文字ばかりが表示されることがあり、これは{{Interwiki("wikipedia", "文字化け")}}と呼ばれます。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>Wikipedia の記事 <ol> diff --git a/files/ja/glossary/cipher/index.html b/files/ja/glossary/cipher/index.html index b7c490fb22..d0da8882df 100644 --- a/files/ja/glossary/cipher/index.html +++ b/files/ja/glossary/cipher/index.html @@ -25,7 +25,7 @@ translation_of: Glossary/Cipher <li>{{Interwiki("wikipedia", "公開鍵暗号")}}は、暗号化と復号に異なる鍵を使用します。</li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>一般知識 <ol> diff --git a/files/ja/glossary/cors-safelisted_response_header/index.html b/files/ja/glossary/cors-safelisted_response_header/index.html index f4167ef9cb..610851f1ea 100644 --- a/files/ja/glossary/cors-safelisted_response_header/index.html +++ b/files/ja/glossary/cors-safelisted_response_header/index.html @@ -28,7 +28,7 @@ translation_of: Glossary/CORS-safelisted_response_header <pre>Access-Control-Expose-Headers: X-Custom-Header, Content-Length</pre> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>関連情報 <ol> diff --git a/files/ja/glossary/crawler/index.html b/files/ja/glossary/crawler/index.html index 27b2a48e77..cbca2a132d 100644 --- a/files/ja/glossary/crawler/index.html +++ b/files/ja/glossary/crawler/index.html @@ -20,7 +20,7 @@ translation_of: Glossary/Crawler <li>Wikipedia の {{Interwiki("wikipedia", "クローラ")}}</li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> <ol> diff --git a/files/ja/glossary/cross_axis/index.html b/files/ja/glossary/cross_axis/index.html index 71ea43b706..54f812182a 100644 --- a/files/ja/glossary/cross_axis/index.html +++ b/files/ja/glossary/cross_axis/index.html @@ -44,7 +44,7 @@ translation_of: Glossary/Cross_Axis <li>CSS フレックスボックスガイド: <em><a href="/ja/docs/Web/CSS/CSS_Flexible_Box_Layout/Mastering_Wrapping_of_Flex_Items">フレックスアイテムの折り返しのマスター</a></em></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> diff --git a/files/ja/glossary/cryptographic_hash_function/index.html b/files/ja/glossary/cryptographic_hash_function/index.html index 6325537826..3adf8f4578 100644 --- a/files/ja/glossary/cryptographic_hash_function/index.html +++ b/files/ja/glossary/cryptographic_hash_function/index.html @@ -20,7 +20,7 @@ translation_of: Glossary/Cryptographic_hash_function <p>MD5 や SHA-1 などの暗号化ハッシュ関数は、衝突耐性を大幅に低下させる攻撃が見つかったため、破損しているとみなされています。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li>Wikipedia 上の {{Interwiki("wikipedia", "暗号学的ハッシュ関数")}}</li> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> diff --git a/files/ja/glossary/cryptography/index.html b/files/ja/glossary/cryptography/index.html index 3c3b66574a..d69cb85abc 100644 --- a/files/ja/glossary/cryptography/index.html +++ b/files/ja/glossary/cryptography/index.html @@ -12,7 +12,7 @@ translation_of: Glossary/Cryptography --- <p><span class="seoSummary"><strong>暗号学</strong>（Cryptography、cryptology）は、メッセージを安全に符号化して送信する方法を研究する科学です。暗号学は、安全でない環境でメッセージを符号化および復号するために使用されるアルゴリズムの設計および研究と、それらの応用です。</span><strong> データの機密性</strong>だけではなく、暗号学はまた、<strong>識別</strong>、<strong>認証</strong>、<strong>否認防止</strong>、および<strong>データの完全性</strong>にも取り組んでいます。したがって、<strong>暗号システム</strong>、つまり文脈における暗号方式の使い方も研究します。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>一般知識 <ol> diff --git a/files/ja/glossary/css_preprocessor/index.html b/files/ja/glossary/css_preprocessor/index.html index 0b49383a52..477555d4a8 100644 --- a/files/ja/glossary/css_preprocessor/index.html +++ b/files/ja/glossary/css_preprocessor/index.html @@ -11,7 +11,7 @@ translation_of: Glossary/CSS_preprocessor <p>CSS プリプロセッサーを使うためには、 CSS コンパイラーをウェブ{{Glossary("server", "サーバー")}}にインストールするか、 CSS プリプロセッサーを使用して開発環境でコンパイルしてから、コンパイル済みの CSS ファイルをウェブサーバーにアップロードする必要があります。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>有名な CSS プリプロセッサーの例 <ol> diff --git a/files/ja/glossary/css_selector/index.html b/files/ja/glossary/css_selector/index.html index 3f492fd842..3ce618a2dd 100644 --- a/files/ja/glossary/css_selector/index.html +++ b/files/ja/glossary/css_selector/index.html @@ -55,7 +55,7 @@ div.warning { <p>{{EmbedLiveSample("glossary-selector-details", 640, 210)}}</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>CSS 入門内の <a href="/ja/docs/Learn/CSS/Introduction_to_CSS/Selectors">CSS セレクターについての詳細</a></li> <li>基本的なセレクター diff --git a/files/ja/glossary/database/index.html b/files/ja/glossary/database/index.html index 325a9fd9cb..04780b6718 100644 --- a/files/ja/glossary/database/index.html +++ b/files/ja/glossary/database/index.html @@ -15,7 +15,7 @@ translation_of: Glossary/Database <p>ブラウザー上で動く {{glossary("IndexedDB")}} と呼ばれる独自データベースシステムもあります。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>{{Interwiki("wikipedia", "データベース")}} (Wikipedia) <ol> diff --git a/files/ja/glossary/document_directive/index.html b/files/ja/glossary/document_directive/index.html index 62ab3c4f65..1bd12aec9b 100644 --- a/files/ja/glossary/document_directive/index.html +++ b/files/ja/glossary/document_directive/index.html @@ -20,7 +20,7 @@ translation_of: Glossary/Document_directive <p>完全な一覧は<a href="/ja/docs/Web/HTTP/Headers/Content-Security-Policy#Document_directives">文書ディレクティブ</a>を参照してください。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">用語集</a> diff --git a/files/ja/glossary/dom/index.html b/files/ja/glossary/dom/index.html index ca4f417603..b3596d1125 100644 --- a/files/ja/glossary/dom/index.html +++ b/files/ja/glossary/dom/index.html @@ -14,7 +14,7 @@ translation_of: Glossary/DOM <p>DOM は当初、仕様書がありませんでしたが、ブラウザが{{Glossary("JavaScript")}} の実装を始めた頃に追加されました。このレガシーな DOM は DOM0 と呼ばれることもあります。今日、 WHATWG が DOM Living Standard を保守しています。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>Wikipedia 上の記事「{{interwiki("wikipedia", "Document_Object_Model", "The Document Object Model")}}」</li> <li>MDN 上の記事「<a href="/ja/docs/DOM">DOM ドキュメント</a>」</li> diff --git a/files/ja/glossary/endianness/index.html b/files/ja/glossary/endianness/index.html index 81e6499b26..c95e78710d 100644 --- a/files/ja/glossary/endianness/index.html +++ b/files/ja/glossary/endianness/index.html @@ -22,7 +22,7 @@ translation_of: Glossary/Endianness <li><em>ミックスドエンディアン</em> (古く非常に稀): <code>0x34 0x12 0x78 0x56</code></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>関連情報 <ol> diff --git a/files/ja/glossary/favicon/index.html b/files/ja/glossary/favicon/index.html index 56888a703d..8e64aa7598 100644 --- a/files/ja/glossary/favicon/index.html +++ b/files/ja/glossary/favicon/index.html @@ -16,7 +16,7 @@ translation_of: Glossary/Favicon <p>ファビコンはユーザエクスペリエンスを向上させ、ブランドの一貫性を保つために使用されます。例えば使い慣れたアイコンがブラウザのアドレスバーに表示されるのを見ることで、ユーザは自分が適切な場所 (<em>訳注:WEBページなど</em>) にいることを理解します。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>Wikipedia 上の {{interwiki("wikipedia", "Favicon", "Favicon")}}</li> <li>ツール diff --git a/files/ja/glossary/fetch_directive/index.html b/files/ja/glossary/fetch_directive/index.html index d67ab580cb..dc26da2516 100644 --- a/files/ja/glossary/fetch_directive/index.html +++ b/files/ja/glossary/fetch_directive/index.html @@ -14,7 +14,7 @@ translation_of: Glossary/Fetch_directive <p>完全な一覧については<a href="/ja/docs/Web/HTTP/Headers/Content-Security-Policy#Fetch_directives">フェッチディレクティブ</a>を参照してください。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">用語集</a> diff --git a/files/ja/glossary/first-class_function/index.html b/files/ja/glossary/first-class_function/index.html index 65c47009f7..b1efc7acb3 100644 --- a/files/ja/glossary/first-class_function/index.html +++ b/files/ja/glossary/first-class_function/index.html @@ -94,7 +94,7 @@ sayHello()(); <p><em>二重括弧 <code>()()</code> を使用して、返された関数を呼び出しています。</em></p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><em>Wikipedia の {{Interwiki("wikipedia", "First-class functions", "First-class functions")}}</em></li> <li><em><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> </em> diff --git a/files/ja/glossary/flexbox/index.html b/files/ja/glossary/flexbox/index.html index d07dc40a1d..ba18dce238 100644 --- a/files/ja/glossary/flexbox/index.html +++ b/files/ja/glossary/flexbox/index.html @@ -47,7 +47,7 @@ translation_of: Glossary/Flexbox <li>CSS Flexbox ガイド: <em><a href="/ja/docs/Web/CSS/CSS_Flexible_Box_Layout/Typical_Use_Cases_of_Flexbox">Flexbox の典型的な使用例</a></em></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> diff --git a/files/ja/glossary/forbidden_header_name/index.html b/files/ja/glossary/forbidden_header_name/index.html index 0574d9ae23..b69c1ce340 100644 --- a/files/ja/glossary/forbidden_header_name/index.html +++ b/files/ja/glossary/forbidden_header_name/index.html @@ -46,7 +46,7 @@ translation_of: Glossary/Forbidden_header_name <p><strong>注</strong>: <code>User-Agent</code> ヘッダーは<a href="https://fetch.spec.whatwg.org/#terminology-headers">仕様としては</a>禁止ではなくなりました (Firefox 43 で実装された forbidden header name list を参照)。 Fetch の <a href="/ja/docs/Web/API/Headers">Headers</a> オブジェクトや、XHR の <a href="/ja/docs/Web/API/XMLHttpRequest#setRequestHeader%28%29">setRequestHeader()</a> などでこのヘッダーを設定することが可能です。ただし、 Chrome は Fetch リクエストからこのヘッダーを暗黙的に削除します（<a href="https://bugs.chromium.org/p/chromium/issues/detail?id=571722">Chromium バグ 571722</a> を参照）。</p> </div> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> diff --git a/files/ja/glossary/fork/index.html b/files/ja/glossary/fork/index.html index f903f8c91e..7420671a57 100644 --- a/files/ja/glossary/fork/index.html +++ b/files/ja/glossary/fork/index.html @@ -25,7 +25,7 @@ translation_of: Glossary/Fork <li><a href="https://www.libreoffice.org/about-us/who-are-we/">LibreOffice (OpenOffice からのフォーク)</a></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>General Knowledge <ol> diff --git a/files/ja/glossary/fps/index.html b/files/ja/glossary/fps/index.html index 0b7e8483e3..553be80946 100644 --- a/files/ja/glossary/fps/index.html +++ b/files/ja/glossary/fps/index.html @@ -12,7 +12,7 @@ translation_of: Glossary/FPS <p>映画では一般に、フレームレートは 24fps です。フレームレートが低くても大丈夫なのは、被写体ぶれで錯覚が発生するためです。コンピューターの画面上を動く場合は被写体ぶれはありません (被写体ぶれのある画像<a href="/ja/docs/Web/CSS/CSS_Images/Implementing_image_sprites_in_CSS">スプライト</a>を動かしている場合を除いて)。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">Glossary</a> diff --git a/files/ja/glossary/global_object/index.html b/files/ja/glossary/global_object/index.html index b855e3940f..628dd47dc0 100644 --- a/files/ja/glossary/global_object/index.html +++ b/files/ja/glossary/global_object/index.html @@ -55,7 +55,7 @@ window.greeting(); // ふつうに greeting(); を呼び出すのと同じ console.log("Hi!"); }</pre> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Glossary">MDN 用語集</a> diff --git a/files/ja/glossary/graceful_degradation/index.html b/files/ja/glossary/graceful_degradation/index.html index 8889a1f2ee..8aea866d62 100644 --- a/files/ja/glossary/graceful_degradation/index.html +++ b/files/ja/glossary/graceful_degradation/index.html @@ -14,7 +14,7 @@ translation_of: Glossary/Graceful_degradation <p>これは、ウェブサイトが複数の未知のユーザーエージェントからアクセスされるという状況下で、ウェブ開発者が最良の可能性を持ったウェブサイトを開発することに集中できるようにするために有用なテクニックです。{{Glossary("Progressive enhancement","プログレッシブエンハンスメント")}}は関連していますが、異なります。これはよくグレースフルデグラデーションとはがy句の方向に進むように見えます。実際には、両方のアプローチが有効であり、互いに補完することができます。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>Wikipedia 上の {{Interwiki("wikipedia", "en:Graceful degradation")}} (英語)</li> <li><a href="/ja/docs/Learn/Tools_and_testing/Cross_browser_testing/HTML_and_CSS">一般的な HTML と CSS の問題への対処</a></li> diff --git a/files/ja/glossary/grid/index.html b/files/ja/glossary/grid/index.html index 602be55cf9..cc152f0623 100644 --- a/files/ja/glossary/grid/index.html +++ b/files/ja/glossary/grid/index.html @@ -59,7 +59,7 @@ translation_of: Glossary/Grid <p>{{ EmbedLiveSample('example', '500', '330') }}</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>CSS グリッドレイアウトガイド:<br> <em><a href="/ja/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout">グリッドレイアウトの基本コンセプト</a></em></li> diff --git a/files/ja/glossary/grid_tracks/index.html b/files/ja/glossary/grid_tracks/index.html index d5984585a5..f184db7037 100644 --- a/files/ja/glossary/grid_tracks/index.html +++ b/files/ja/glossary/grid_tracks/index.html @@ -58,7 +58,7 @@ translation_of: Glossary/Grid_Tracks <p>暗黙的グリッドにおけるトラックは、既定では自動的に大きさが決定されますが、 {{cssxref("grid-auto-rows")}} および {{cssxref("grid-auto-columns")}} プロパティでこれらのトラックの大きさを定義することもできます。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>CSS グリッドレイアウトガイド:<br> <em><a href="/ja/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout">グリッドレイアウトの基本概念</a></em></li> diff --git a/files/ja/glossary/gzip_compression/index.html b/files/ja/glossary/gzip_compression/index.html index 2be218311e..438bb68818 100644 --- a/files/ja/glossary/gzip_compression/index.html +++ b/files/ja/glossary/gzip_compression/index.html @@ -17,7 +17,7 @@ translation_of: Glossary/GZip_compression <li>ウィキペディアの「<a href="https://ja.wikipedia.org/wiki/Gzip">Gzip</a>」の記事</li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li> <details><summary><a href="/ja/docs/Glossary">MDN 用語集</a></summary> {{ListSubpages("/ja/docs/Glossary/")}}</details> diff --git a/files/ja/glossary/hotlink/index.html b/files/ja/glossary/hotlink/index.html index 7342ea9432..c74cabf899 100644 --- a/files/ja/glossary/hotlink/index.html +++ b/files/ja/glossary/hotlink/index.html @@ -10,7 +10,7 @@ translation_of: Glossary/Hotlink <p>この行為は、リンク先のオブジェクトをホストしているウェブサイトの帯域幅を勝手に利用することになるため、多くの場合はひんしゅくを買う行為であり、また著作権上の懸念 — 許可なく行われた場合は窃盗とみなされます — を引き起こす可能性もあるためです。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>一般知識 <ol> diff --git a/files/ja/glossary/http_2/index.html b/files/ja/glossary/http_2/index.html index 92c8b4eee3..5637de57a3 100644 --- a/files/ja/glossary/http_2/index.html +++ b/files/ja/glossary/http_2/index.html @@ -15,7 +15,7 @@ translation_of: Glossary/HTTP_2 <p>HTTP/2 は HTTP のアプリケーション的な意味を何も変更していません。 HTTP 1.1 にあった主要な概念、たとえば HTTP メソッド、ステータスコード、 URI、ヘッダーフィールドなどはすべてそのまま残っています。その代わり、 HTTP/2 はデータを書式化 (フレーム化) するしてクライアントとサーバー間で転送する方法を、プロセス全体の管理と、新しいフレーム化レイヤーの中の複雑さをアプリケーションから隠蔽することの両面で変更しました。結果として、既存のすべてのアプリケーションが変更なしに配信することができます。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>一般知識 <ol> diff --git a/files/ja/glossary/http_3/index.html b/files/ja/glossary/http_3/index.html index 3ab4b18867..a6ff8f0ab1 100644 --- a/files/ja/glossary/http_3/index.html +++ b/files/ja/glossary/http_3/index.html @@ -9,7 +9,7 @@ translation_of: Glossary/HTTP_3 --- <p><span class="seoSummary"><strong>HTTP/3</strong> は {{glossary("HTTP 2", "HTTP/2")}} に続く <a href="/ja/docs/Web/HTTP/Basics_of_HTTP">HTTP ネットワークプロトコル</a> の今後のメジャーリビジョンです。</span> HTTP/3 の主なポイントは {{glossary("TCP")}} の代わりに QUIC という新しい {{glossary("UDP")}} プロトコルを使用することです。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>一般知識 <ol> diff --git a/files/ja/glossary/http_header/index.html b/files/ja/glossary/http_header/index.html index b660077dc9..b14fc35fb4 100644 --- a/files/ja/glossary/http_header/index.html +++ b/files/ja/glossary/http_header/index.html @@ -47,7 +47,7 @@ X-Cache: Hit from cloudfront X-Cache-Info: cached </pre> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>仕様書 <ol> diff --git a/files/ja/glossary/https/index.html b/files/ja/glossary/https/index.html index f8dec3774e..e7a1222d58 100644 --- a/files/ja/glossary/https/index.html +++ b/files/ja/glossary/https/index.html @@ -11,9 +11,9 @@ tags: - 用語集 translation_of: Glossary/https --- -<p><strong>HTTPS</strong> は {{Glossary("HTTP")}} プロトコルを暗号化したバージョンです。 HTTPS は通常、 {{Glossary("SSL")}} または {{Glossary("TLS")}} を用いてクライアントとサーバー間のすべての通信を暗号化します。この安全な接続により、クライアントは機密データをサーバーと安全に交換できます (例えば、銀行取引やオンラインショッピングなどで)。</p> +<p><strong>HTTPS</strong> (<strong><em>HyperText Transfer Protocol Secure</em></strong>) は {{Glossary("HTTP")}} プロトコルを暗号化したバージョンです。 HTTPS は通常、 {{Glossary("SSL")}} または {{Glossary("TLS")}} を用いてクライアントとサーバー間のすべての通信を暗号化します。この安全な接続により、クライアントは機密データをサーバーと安全に交換できます (例えば、銀行取引やオンラインショッピングなどで)。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>一般知識 <ol> diff --git a/files/ja/glossary/identifier/index.html b/files/ja/glossary/identifier/index.html index e22d1551e4..1be1ea7bd6 100644 --- a/files/ja/glossary/identifier/index.html +++ b/files/ja/glossary/identifier/index.html @@ -22,7 +22,7 @@ translation_of: Glossary/Identifier <li>ウィキペディアの{{interwiki("wikipedia", "識別子#プログラミング言語における識別子", "識別子")}}の記事</li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">用語集</a> diff --git a/files/ja/glossary/iife/index.html b/files/ja/glossary/iife/index.html index afc9e02e2d..2a4cdd8363 100644 --- a/files/ja/glossary/iife/index.html +++ b/files/ja/glossary/iife/index.html @@ -45,7 +45,7 @@ aName // "Uncaught ReferenceError: aName is not defined" が発生します // Immediately creates the output: result; // "Barry"</pre> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>学習記事 <ol> diff --git a/files/ja/glossary/index.html b/files/ja/glossary/index.html index 89c12fb984..d51376af2a 100644 --- a/files/ja/glossary/index.html +++ b/files/ja/glossary/index.html @@ -46,7 +46,7 @@ translation_of: Glossary <div class="hidden"> <h2 id="Subnav">Subnav</h2> -<section id="Quick_Links"> +<section id="Quick_links"> <ol> <li><strong><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a></strong>{{ListSubpagesForSidebar("/en-us/docs/Glossary", 1)}}</li> </ol> diff --git a/files/ja/glossary/input_method_editor/index.html b/files/ja/glossary/input_method_editor/index.html index 23e219fdc5..e1fb0a7083 100644 --- a/files/ja/glossary/input_method_editor/index.html +++ b/files/ja/glossary/input_method_editor/index.html @@ -13,7 +13,7 @@ translation_of: Glossary/Input_method_editor <li>手書き文字認識を使用したタッチ画面のテキスト入力</li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>Wikipedia の記事 <ol> diff --git a/files/ja/glossary/internationalization_and_localization/index.html b/files/ja/glossary/internationalization_and_localization/index.html index c4d2c7a8f0..eec68b6b94 100644 --- a/files/ja/glossary/internationalization_and_localization/index.html +++ b/files/ja/glossary/internationalization_and_localization/index.html @@ -19,7 +19,7 @@ translation_of: Glossary/Internationalization_and_localization <li><a href="/ja/docs/Learn/CSS/CSS_layout/Flexbox">フレックスボックス</a> および <a href="/ja/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout">グリッドレイアウト</a></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li> <details open><summary></summary> {{ListSubpages("/ja/docs/Glossary")}}</details> diff --git a/files/ja/glossary/key/index.html b/files/ja/glossary/key/index.html index df0a7de825..a08dee7426 100644 --- a/files/ja/glossary/key/index.html +++ b/files/ja/glossary/key/index.html @@ -13,7 +13,7 @@ translation_of: Glossary/Key <p>{{Glossary("symmetric-key cryptography", "共通鍵暗号")}}においては、同じ鍵が暗号化と復号の両方に使用されます。{{Glossary("public-key cryptography", "公開鍵暗号")}}においては、<em>公開鍵</em>と<em>秘密鍵</em>と呼ばれる、一対の関連した鍵が存在します。公開鍵は自由に使用できますが、一方、秘密鍵は秘密に保たれます。公開鍵は、メッセージを対応する秘密鍵だけで復号できるように暗号化できます。逆もまた同様です。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>一般知識 <ol> diff --git a/files/ja/glossary/latency/index.html b/files/ja/glossary/latency/index.html index d84963a318..18025d1cb5 100644 --- a/files/ja/glossary/latency/index.html +++ b/files/ja/glossary/latency/index.html @@ -22,4 +22,4 @@ translation_of: Glossary/Latency <li><a href="/ja/docs/Web/Performance/Understanding_latency">レイテンシーを理解する</a></li> </ul> -<section class="Quick_links" id="Quick_Links"></section> +<section id="Quick_links"></section> diff --git a/files/ja/glossary/ligature/index.html b/files/ja/glossary/ligature/index.html index 10d86f4457..9add721662 100644 --- a/files/ja/glossary/ligature/index.html +++ b/files/ja/glossary/ligature/index.html @@ -12,7 +12,7 @@ translation_of: Glossary/Ligature <p>{{cssxref("font-variant-ligatures")}} を使用してウェブページで合字を実装できます。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>Wikipedia 上の {{Interwiki("wikipedia", "合字")}}</li> </ol> diff --git a/files/ja/glossary/local_variable/index.html b/files/ja/glossary/local_variable/index.html index 2ebec4cb7a..c08ceb49c8 100644 --- a/files/ja/glossary/local_variable/index.html +++ b/files/ja/glossary/local_variable/index.html @@ -19,7 +19,7 @@ function fun(){ } </pre> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>一般知識 <ol> diff --git a/files/ja/glossary/loop/index.html b/files/ja/glossary/loop/index.html index b578c13eec..87a3ad1569 100644 --- a/files/ja/glossary/loop/index.html +++ b/files/ja/glossary/loop/index.html @@ -74,7 +74,7 @@ while(i < 5){ <li>コードブロックは変数 (i) が5未満である限り、実行が継続します。</li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>General Knowledge <ol> diff --git a/files/ja/glossary/lossless_compression/index.html b/files/ja/glossary/lossless_compression/index.html index 02d357c941..4d19c7fb92 100644 --- a/files/ja/glossary/lossless_compression/index.html +++ b/files/ja/glossary/lossless_compression/index.html @@ -18,7 +18,7 @@ translation_of: Glossary/Lossless_compression <p>一方、{{glossary("Lossy compression", "非可逆圧縮")}}は元のファイルから一部のデータを犠牲にすることで厳密ではない近似値を使用しており、元に戻すことができない圧縮方法です。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">用語集</a> diff --git a/files/ja/glossary/ltr/index.html b/files/ja/glossary/ltr/index.html index 397daf4258..7d217b681a 100644 --- a/files/ja/glossary/ltr/index.html +++ b/files/ja/glossary/ltr/index.html @@ -18,7 +18,7 @@ translation_of: Glossary/ltr <li><a href="/ja/docs/Web/Localization">ローカリゼーションと国際化</a></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> <ul> diff --git a/files/ja/glossary/main_thread/index.html b/files/ja/glossary/main_thread/index.html index 9d00165a98..e938019977 100644 --- a/files/ja/glossary/main_thread/index.html +++ b/files/ja/glossary/main_thread/index.html @@ -11,7 +11,7 @@ translation_of: Glossary/Main_thread <p>意識的に <a href="/ja/docs/Web/API/Service_Worker_API/Using_Service_Workers">Service worker</a> などの <a href="/ja/docs/Web/API/Web_Workers_API/Using_web_workers">Web worker</a> を使用しない限り、 JavaScript はメインスレッド上で実行されるので、イベント処理や描画の中で簡単にスクリプトが遅延を発生させます。メインスレッドで動作させる必要がある処理が少ないほど、メインスレッドがユーザーのイベントに応答したり、描画したりすることが増え、ユーザーへの反応が全般的に良くなります。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>関連情報 <ol> diff --git a/files/ja/glossary/markup/index.html b/files/ja/glossary/markup/index.html index 87720bac15..55a3f47d0b 100644 --- a/files/ja/glossary/markup/index.html +++ b/files/ja/glossary/markup/index.html @@ -25,7 +25,7 @@ translation_of: Glossary/markup <dd>文書の区間をプログラムがどのように扱うべきかでラベル付けします。例えば、 HTML の {{HTMLElement("td")}} は HTML の表でセルを定義します。</dd> </dl> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> diff --git a/files/ja/glossary/mathml/index.html b/files/ja/glossary/mathml/index.html index b62d92e8eb..8b12fe6cf9 100644 --- a/files/ja/glossary/mathml/index.html +++ b/files/ja/glossary/mathml/index.html @@ -11,7 +11,7 @@ translation_of: Glossary/MathML --- <p id="Summary"><strong>MathML</strong> ({{glossary("XML")}} のアプリケーション) は、ウェブページにおいて数式を表現するためのオープンスタンダードです。 1998年に、 W3C は{{glossary("browser","ブラウザー")}}で数式を表現するための MathML の最初の勧告を行いました。 MathML には科学コンテンツや音声合成などの他のアプリケーションもあります。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>一般知識 <ol> diff --git a/files/ja/glossary/method/index.html b/files/ja/glossary/method/index.html index 87ebec0b02..71cdb78a93 100644 --- a/files/ja/glossary/method/index.html +++ b/files/ja/glossary/method/index.html @@ -30,7 +30,7 @@ translation_of: Glossary/Method <li><a href="/ja/docs/Web/JavaScript/Reference/Methods_Index">JavaScript 内蔵メソッド一覧</a></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> diff --git a/files/ja/glossary/microsoft_edge/index.html b/files/ja/glossary/microsoft_edge/index.html index 3ea638fa04..4c4d18d6a9 100644 --- a/files/ja/glossary/microsoft_edge/index.html +++ b/files/ja/glossary/microsoft_edge/index.html @@ -9,7 +9,7 @@ translation_of: Glossary/Microsoft_Edge --- <p><strong>Microsoft Edge</strong> は、グラフィカルな無料の{{glossary("World Wide Web", "ウェブ")}}{{Glossary("browser", "ブラウザー")}}で、 Microsoft Windows に付属しており、マイクロソフトが 2014年から開発しています。 Edge は、最初は Spartan として知られ、長い間使われた {{glossary("Microsoft Internet Explorer","Internet Explorer")}} を置き換えました。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>関連情報 <ol> diff --git a/files/ja/glossary/navigation_directive/index.html b/files/ja/glossary/navigation_directive/index.html index dee9fa9d4c..12f4755214 100644 --- a/files/ja/glossary/navigation_directive/index.html +++ b/files/ja/glossary/navigation_directive/index.html @@ -35,7 +35,7 @@ translation_of: Glossary/Navigation_directive </ul> </div> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">用語集</a> <ol> diff --git a/files/ja/glossary/null/index.html b/files/ja/glossary/null/index.html index b30a109f76..947770c90b 100644 --- a/files/ja/glossary/null/index.html +++ b/files/ja/glossary/null/index.html @@ -14,7 +14,7 @@ translation_of: Glossary/Null <pre class="brush: js notranslate">typeof null === 'object' // true</pre> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li><strong><a href="/ja/docs/Glossary">用語集</a></strong> diff --git a/files/ja/glossary/number/index.html b/files/ja/glossary/number/index.html index b8a0f46148..c05c75d94c 100644 --- a/files/ja/glossary/number/index.html +++ b/files/ja/glossary/number/index.html @@ -27,7 +27,7 @@ translation_of: Glossary/Number <li>JavaScript のグローバルオブジェクト {{jsxref("Number")}}</li> </ul> -<section id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Glossary">MDN 用語集</a> diff --git a/files/ja/glossary/php/index.html b/files/ja/glossary/php/index.html index fca5f317c4..e63281bdb2 100644 --- a/files/ja/glossary/php/index.html +++ b/files/ja/glossary/php/index.html @@ -46,7 +46,7 @@ translation_of: Glossary/PHP echo $email; ?></pre> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="http://php.net/">公式ウェブサイト</a></li> <li>Wikipedia 上の {{Interwiki("wikipedia", "PHP")}}</li> diff --git a/files/ja/glossary/pop/index.html b/files/ja/glossary/pop/index.html index dbc645592e..9e22ae74e1 100644 --- a/files/ja/glossary/pop/index.html +++ b/files/ja/glossary/pop/index.html @@ -12,7 +12,7 @@ translation_of: Glossary/POP <p>メールクライアントは通常、サーバーからすべてのメッセージを受信し、すべてのメッセージを削除します。 しかし、POP3 はサーバーにメッセージのコピーを残すことができます。現在、ほぼすべてのメールサーバーとクライアントは POP3 に対応しています。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li>ウィキペディア上の {{Interwiki("wikipedia", "Post Office Protocol", "POP")}}</li> <li><a href="https://tools.ietf.org/html/rfc1734">RFC 1734</a> (POP3 認証機構の仕様)</li> diff --git a/files/ja/glossary/primitive/index.html b/files/ja/glossary/primitive/index.html index 9d5601efb7..8984a59342 100644 --- a/files/ja/glossary/primitive/index.html +++ b/files/ja/glossary/primitive/index.html @@ -106,7 +106,7 @@ console.log(foo); // 5 <li>Wikipedia の {{Interwiki("wikipedia", "プリミティブ型")}} の記事</li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">用語集</a> diff --git a/files/ja/glossary/public-key_cryptography/index.html b/files/ja/glossary/public-key_cryptography/index.html index c07fd6eff7..6f56845f36 100644 --- a/files/ja/glossary/public-key_cryptography/index.html +++ b/files/ja/glossary/public-key_cryptography/index.html @@ -21,7 +21,7 @@ translation_of: Glossary/Public-key_cryptography <p>よく使われる公開鍵暗号システムには、 RSA (署名と暗号化の両方), DSA (署名用) Diffie-Hellman (キーの承認用) などがあります。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Glossary">MDN 用語集</a> diff --git a/files/ja/glossary/python/index.html b/files/ja/glossary/python/index.html index 463f70a1e0..e4f1c2705c 100644 --- a/files/ja/glossary/python/index.html +++ b/files/ja/glossary/python/index.html @@ -16,7 +16,7 @@ translation_of: Glossary/Python <p>Python は OSI に承認されたオープンソースライセンスのもとで開発され、商用を含めて無料で利用や配布をすることができます。 Phython のライセンスは <a href="https://www.python.org/psf">Python Software Foundation</a> が管理しています。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>Learn more <ol> diff --git a/files/ja/glossary/reporting_directive/index.html b/files/ja/glossary/reporting_directive/index.html index 53016c2dc2..b99c3f66d7 100644 --- a/files/ja/glossary/reporting_directive/index.html +++ b/files/ja/glossary/reporting_directive/index.html @@ -14,7 +14,7 @@ translation_of: Glossary/Reporting_directive <p>完全な一覧については<a href="/ja/docs/Web/HTTP/Headers/Content-Security-Policy#Reporting_directives">報告ディレクティブ</a>を参照してください。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">用語集</a> diff --git a/files/ja/glossary/response_header/index.html b/files/ja/glossary/response_header/index.html index ea7ab0a5e9..9ebbff20d8 100644 --- a/files/ja/glossary/response_header/index.html +++ b/files/ja/glossary/response_header/index.html @@ -30,7 +30,7 @@ X-Cache-Info: not cacheable; meta data too large X-kuma-revision: 1085259 x-frame-options: DENY</pre> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>Learn more <ol> diff --git a/files/ja/glossary/rng/index.html b/files/ja/glossary/rng/index.html index 7e9ab60041..b76c3aa1a5 100644 --- a/files/ja/glossary/rng/index.html +++ b/files/ja/glossary/rng/index.html @@ -29,7 +29,7 @@ translation_of: Glossary/RNG <li>{{domxref("Crypto.getRandomValues()")}}: 暗号学的に安全な数値を提供するためのものです。</li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li>{{domxref("RandomSource")}}</li> <li>{{jsxref("Math.random()")}}</li> diff --git a/files/ja/glossary/rtl/index.html b/files/ja/glossary/rtl/index.html index 984c7c1b02..9a56edad73 100644 --- a/files/ja/glossary/rtl/index.html +++ b/files/ja/glossary/rtl/index.html @@ -11,7 +11,7 @@ translation_of: Glossary/rtl <p>RTL とは対照的に、LTR (Left To Right, 左書き) は、英語 (<code>en</code>, <code>en-US</code>, <code>en-GB</code>, など)、スペイン語 (<code>es</code>)、フランス語 (<code>fr</code>) などの他の言語で使用されます。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> diff --git a/files/ja/glossary/rtsp/index.html b/files/ja/glossary/rtsp/index.html index 5602756b37..34fb63db06 100644 --- a/files/ja/glossary/rtsp/index.html +++ b/files/ja/glossary/rtsp/index.html @@ -20,7 +20,7 @@ translation_of: Glossary/RTSP <li><a href="https://tools.ietf.org/html/rfc7826">RFC 7826</a> (このプロトコルの動作を詳細に定義した文書の一つ)</li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> diff --git a/files/ja/glossary/same-origin_policy/index.html b/files/ja/glossary/same-origin_policy/index.html index b32de8dbfd..fc1990bcc6 100644 --- a/files/ja/glossary/same-origin_policy/index.html +++ b/files/ja/glossary/same-origin_policy/index.html @@ -10,7 +10,7 @@ translation_of: Glossary/Same-origin_policy --- <p><span class="seoSummary"><strong>同一オリジンポリシー</strong>は重要なセキュリティの仕組みであり、ある{{Glossary("origin", "オリジン")}}から読み込まれた文書やスクリプトが、どのように他のオリジンからのリソースと対話することができるかを制限するものです。</span>悪意ある行動を起こしかねないリソースを分離し、攻撃の可能性を縮小するのに役立ちます。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a>: diff --git a/files/ja/glossary/scroll_container/index.html b/files/ja/glossary/scroll_container/index.html index 0a14dc52dd..a7cf59a79f 100644 --- a/files/ja/glossary/scroll_container/index.html +++ b/files/ja/glossary/scroll_container/index.html @@ -10,7 +10,7 @@ translation_of: Glossary/Scroll_container <p>スクロールコンテナーによって、ユーザーは領域をあふれて表示から切り取られ非表示になる部分をスクロールさせることができます。スクロールコンテナーの見える部分は、{{glossary("Scrollport", "スクロールポート")}}と呼ばれます。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a>: diff --git a/files/ja/glossary/scrollport/index.html b/files/ja/glossary/scrollport/index.html index 5312164657..f7b81d7c7c 100644 --- a/files/ja/glossary/scrollport/index.html +++ b/files/ja/glossary/scrollport/index.html @@ -10,7 +10,7 @@ translation_of: Glossary/Scrollport --- <p><ruby><strong>スクロールポート</strong><rp> (</rp><rt>scrollport</rt><rp>) </rp></ruby>は、文書の{{glossary("Scroll container", "スクロールコンテナー")}}の視覚的なビューポートです。スクロールコンテナーはコンテナーに <code>overflow: scroll</code> を適用するか、 <code>overflow: auto</code> であふれるほどの量のコンテンツがあるときに生成されます。スクロールポートはコンテナーのパディングボックスと一致し、ボックスとして見ることができるコンテンツがスクロールすることを表します。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a>: <ul> diff --git a/files/ja/glossary/semantics/index.html b/files/ja/glossary/semantics/index.html index 70231ee848..6c37d8cc9a 100644 --- a/files/ja/glossary/semantics/index.html +++ b/files/ja/glossary/semantics/index.html @@ -77,7 +77,7 @@ translation_of: Glossary/Semantics <li>Wikipedia 上の {{interwiki("wikipedia", "意味論#コンピュータ科学", "コンピュータ科学におけるセマンティクスの意味")}}</li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Glossary">MDN 用語集</a> diff --git a/files/ja/glossary/simd/index.html b/files/ja/glossary/simd/index.html index 927f59a073..58c01d9fdb 100644 --- a/files/ja/glossary/simd/index.html +++ b/files/ja/glossary/simd/index.html @@ -12,7 +12,7 @@ translation_of: Glossary/SIMD <p>処理やデータ集合に並列処理を使わない逐次的アーキテクチャの {{Glossary("SISD")}} についても参照ください。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>一般知識 <ol> diff --git a/files/ja/glossary/sld/index.html b/files/ja/glossary/sld/index.html index 65fb5eace4..b2c008bed4 100644 --- a/files/ja/glossary/sld/index.html +++ b/files/ja/glossary/sld/index.html @@ -16,7 +16,7 @@ translation_of: Glossary/SLD <p>もう一つの例として、 <code>developer.mozilla.org</code> では、 <code>developer</code> サブドメインが、 Mozilla ウェブサイトの開発者向け (developer) の章を含むサブドメインを指定するのに使われています。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>Wikipedia articles <ol> diff --git a/files/ja/glossary/smtp/index.html b/files/ja/glossary/smtp/index.html index 07e25051e1..e7ce6f0d37 100644 --- a/files/ja/glossary/smtp/index.html +++ b/files/ja/glossary/smtp/index.html @@ -13,7 +13,7 @@ translation_of: Glossary/SMTP <p>このプロトコルは比較的単純です。最も複雑な部分は、様々な認証のメカニズム (<a class="external" href="http://en.wikipedia.org/wiki/Generic_Security_Services_Application_Program_Interface"><abbr title="Generic Security Services Application Program Interface">GSSAPI</abbr></a>、<a class="external" href="http://en.wikipedia.org/wiki/CRAM-MD5"><abbr title="challenge-response authentication mechanism">CRAM-MD5</abbr></a>、<a class="external" href="http://ja.wikipedia.org/wiki/NTLM"><abbr title="NT LAN Manager">NTLM</abbr></a>、MSN、AUTH LOGIN、AUTH PLAIN、他) をサポートすること、エラーレスポンスを取り扱うこと、そして認証メカニズムが失敗した時 (例、サーバーがあるメカニズムのサポートを要求するが、実際にはサポートしていない) にフォールバックを行うことです。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">用語集</a> diff --git a/files/ja/glossary/spa/index.html b/files/ja/glossary/spa/index.html index 8104b00051..5606ba8dc0 100644 --- a/files/ja/glossary/spa/index.html +++ b/files/ja/glossary/spa/index.html @@ -25,7 +25,7 @@ translation_of: Glossary/SPA <li><a href="https://vuejs.org/">Vue.JS</a></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>Wikipedia の記事 <ol> diff --git a/files/ja/glossary/ssl/index.html b/files/ja/glossary/ssl/index.html index cce9581963..9b80b31eba 100644 --- a/files/ja/glossary/ssl/index.html +++ b/files/ja/glossary/ssl/index.html @@ -15,7 +15,7 @@ original_slug: Glossary/SSL_Glossary --- <p class="seoSummary">SSL (Secure Sockets Layer) は古いセキュリティ標準技術で、サーバーとクライアントの間に暗号化されたネットワークリンクを作成し、そこを通過するデータが非公開で安全であることを保証するためのものでした。SSL の現在のバージョンは 3.0 で、1999年に Netscape 社がリリースしたものですが、{{Glossary("TLS", "TLS (Transport Layer Security)")}} プロトコルに置き換えられました。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>関連情報 <ol> diff --git a/files/ja/glossary/static_method/index.html b/files/ja/glossary/static_method/index.html index a2fb2df971..b5f0dc4213 100644 --- a/files/ja/glossary/static_method/index.html +++ b/files/ja/glossary/static_method/index.html @@ -32,7 +32,7 @@ translation_of: Glossary/Static_method myNotification.close();</pre> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>一般知識 <ol> diff --git a/files/ja/glossary/strict_mode/index.html b/files/ja/glossary/strict_mode/index.html index 1c42c36f72..507089d112 100644 --- a/files/ja/glossary/strict_mode/index.html +++ b/files/ja/glossary/strict_mode/index.html @@ -11,7 +11,7 @@ translation_of: Glossary/strict_mode <p>スクリプト全体を厳格モードにする場合は、他の文の前に <code>"use strict";</code> 文を含めることで呼び出すことができます。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/JavaScript/Reference/Strict_mode">厳格モード</a></li> <li><a href="/ja/docs/Web/JavaScript/Reference/Strict_mode/Transitioning_to_strict_mode">厳格モードへの移行</a></li> diff --git a/files/ja/glossary/symbol/index.html b/files/ja/glossary/symbol/index.html index 2f124346a1..3e79791c59 100644 --- a/files/ja/glossary/symbol/index.html +++ b/files/ja/glossary/symbol/index.html @@ -94,7 +94,7 @@ alert(_Sym.description); // Sym</pre> <li>{{jsxref("Object.getOwnPropertySymbols()")}}</li> </ul> -<section id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Glossary">MDN 用語集</a> diff --git a/files/ja/glossary/symmetric-key_cryptography/index.html b/files/ja/glossary/symmetric-key_cryptography/index.html index cf1c615d08..d940480562 100644 --- a/files/ja/glossary/symmetric-key_cryptography/index.html +++ b/files/ja/glossary/symmetric-key_cryptography/index.html @@ -20,7 +20,7 @@ translation_of: Glossary/Symmetric-key_cryptography <p>現在使用されている共通鍵暗号アルゴリズムの多くはブロック暗号です。すなわち、データをブロック単位で暗号化します。それぞれのブロック長は固定長であり、アルゴリズムによって決まります。例えば、 {{Glossary("AES")}} は16バイトのブロックを使用します。ブロック暗号は常に<em>{{Glossary("Block cipher mode of operation", "モード")}}</em>とともに使用され、ブロック長よりも長いメッセージを安全に暗号化する方法を指定しています。例えば、 AES は cipher であるのに対し、 CTR, CBC, GCM はすべてのモードで使用されます。適切ではないモードを使用したり、モードを誤って使用したりした場合は、基礎となる暗号化によって提供されるセキュリティが完全に損なわれることがあります。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> diff --git a/files/ja/glossary/tcp/index.html b/files/ja/glossary/tcp/index.html index 794087a55b..f56a9624f3 100644 --- a/files/ja/glossary/tcp/index.html +++ b/files/ja/glossary/tcp/index.html @@ -15,7 +15,7 @@ translation_of: Glossary/TCP <p>TCP の役割は、パケットがエラーなく信頼性高く配信されることを保証することです。 TCP には輻輳制御があり、初期要件が小さいものから、コンピューター、サーバー、ネットワークが対応している帯域の水準まで大きさが拡大します。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">用語集</a> <ol> diff --git a/files/ja/glossary/thread/index.html b/files/ja/glossary/thread/index.html index 0f00e80ab5..8d847273aa 100644 --- a/files/ja/glossary/thread/index.html +++ b/files/ja/glossary/thread/index.html @@ -18,7 +18,7 @@ translation_of: Glossary/Thread <p>全体的に見て、オペレーティングシステム内のこれらのスレッドは非常に有用であることがわかります。これらのスレッドは、コンテキストの切り替え時間を最小限に抑え、より効率的な通信を可能にし、マルチプロセッサアーキテクチャのさらなる利用を可能にします。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>関連情報 <ol> diff --git a/files/ja/glossary/tls/index.html b/files/ja/glossary/tls/index.html index a1691b3135..4a0bc4c55f 100644 --- a/files/ja/glossary/tls/index.html +++ b/files/ja/glossary/tls/index.html @@ -17,7 +17,7 @@ translation_of: Glossary/TLS <p><strong>注</strong>: TLS 1.0 と 1.1 への対応は、2020年の初頭にすべての主要なブラウザーから削除される予定です。今後はウェブサーバーが TLS 1.2 や 1.3 に対応していることを確認する必要があります。 Firefox はバージョン74時点で、古いバージョンの TLS を使用しているサーバーに接続する場合に <a href="https://support.mozilla.org/en-US/kb/secure-connection-failed-firefox-did-not-connect">Secure Connection Failed</a> エラーを返すようになる予定です ({{bug(1606734)}})。</p> </div> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>仕様書 <ol> diff --git a/files/ja/glossary/type/index.html b/files/ja/glossary/type/index.html index 82708c1ad5..bded089712 100644 --- a/files/ja/glossary/type/index.html +++ b/files/ja/glossary/type/index.html @@ -13,7 +13,7 @@ translation_of: Glossary/Type <p>値のデータ型は、その値に対してどの操作が有効であるかにも影響します。例えば、整数には整数を乗算することができますが、文字列には乗算できません。これはデータ型間の比較にも役立つ知識です。また、同じ構造体であっても、<a href="/ja/docs/Web/JavaScript/Inheritance_and_the_prototype_chain">プロトタイプチェーン</a>の中には構造体を継承したものがあるかもしれないので、構造体間の比較は「簡単におこなえる」話題ではありません。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">用語集</a> diff --git a/files/ja/glossary/type_coercion/index.html b/files/ja/glossary/type_coercion/index.html index 43d3788a49..bacbc44aaf 100644 --- a/files/ja/glossary/type_coercion/index.html +++ b/files/ja/glossary/type_coercion/index.html @@ -25,7 +25,7 @@ console.log(sum);</pre> <pre class="brush: js">sum = Number(value1) + value2;</pre> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">用語集</a> diff --git a/files/ja/glossary/type_conversion/index.html b/files/ja/glossary/type_conversion/index.html index e43a936f9d..8116cba723 100644 --- a/files/ja/glossary/type_conversion/index.html +++ b/files/ja/glossary/type_conversion/index.html @@ -13,7 +13,7 @@ translation_of: Glossary/Type_Conversion --- <p><ruby>型変換<rp> (</rp><rt>Type conversion</rt><rp>)</rp></ruby> (または<ruby>型キャスト<rp> (</rp><rt>typecasting</rt><rp>) </rp></ruby>) は、データをあるデータ型から別なデータ型に変換することを意味します。<em>暗黙の型変換</em>は、コンパイラーが自動的にデータ型を割り当てるものの、その場でソースコードで<em>明示的に</em>型変換が必要な場合もあります。例えば、 <code>5+2.0</code> という命令が与えられた場合、浮動小数点の <code>2.0</code> は暗黙的に整数に型キャストされますが、 <code>Number("0x11")</code> という命令が与えられた場合、 "0x11" の文字列は明示的に数値の17として型キャストされます。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">用語集</a> <ol> diff --git a/files/ja/glossary/user_agent/index.html b/files/ja/glossary/user_agent/index.html index 944694e0a4..74ecbff310 100644 --- a/files/ja/glossary/user_agent/index.html +++ b/files/ja/glossary/user_agent/index.html @@ -39,7 +39,7 @@ translation_of: Glossary/User_agent <li>{{RFC(2616, "14.43")}}: The <code>User-Agent</code> header</li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> diff --git a/files/ja/glossary/web_performance/index.html b/files/ja/glossary/web_performance/index.html index bed6c986b2..08fcbf6fd6 100644 --- a/files/ja/glossary/web_performance/index.html +++ b/files/ja/glossary/web_performance/index.html @@ -20,7 +20,7 @@ translation_of: Glossary/Web_performance <li><a href="/ja/docs/Glossary/Perceived_performance">知覚パフォーマンス</a></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li> <details open><summary></summary> {{ListSubpages("/ja/docs/Glossary")}}</details> diff --git a/files/ja/glossary/web_server/index.html b/files/ja/glossary/web_server/index.html index bc9269cfcd..699b5c7300 100644 --- a/files/ja/glossary/web_server/index.html +++ b/files/ja/glossary/web_server/index.html @@ -8,7 +8,7 @@ translation_of: Glossary/Web_server --- <p>ウェブサーバーは、ユーザーにサービスを提供するハードウェアサーバー上で動作するソフトウェアのことで、通常はクライアントから参照されます。一方、サーバーは、一般的にデータセンターと呼ばれるコンピューターであふれた部屋にあるハードウェアの一部です。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ul> <li><a href="/ja/docs/Learn/Common_questions/What_is_a_web_server">サーバーの紹介</a></li> <li>Wikipedia の {{interwiki("wikipedia", "サーバ")}}</li> diff --git a/files/ja/glossary/webassembly/index.html b/files/ja/glossary/webassembly/index.html index 0ab345779e..f53eb382ea 100644 --- a/files/ja/glossary/webassembly/index.html +++ b/files/ja/glossary/webassembly/index.html @@ -8,7 +8,7 @@ translation_of: Glossary/WebAssembly --- <p><strong>WebAssembly</strong> (<em>Wasm</em>) は、オープン{{Glossary("binary", "バイナリ")}}プログラミング言語です。モダンウェブ{{Glossary("Browser", "ブラウザ")}}で動作します。パフォーマンスを高め、かつ/もしくは、ウェブページのための新しい機能を提供します。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>詳細 <ol> diff --git a/files/ja/glossary/whitespace/index.html b/files/ja/glossary/whitespace/index.html index b3400336fa..7b3baf85b9 100644 --- a/files/ja/glossary/whitespace/index.html +++ b/files/ja/glossary/whitespace/index.html @@ -19,7 +19,7 @@ translation_of: Glossary/Whitespace <p><a href="https://www.ecma-international.org/ecma-262/6.0/#sec-white-space">ECMAScript® 2015 言語仕様書</a>では、いくつかの Unicode コードポイントをホワイトスペースとして定めています。 U+0009 CHARACTER TABULATION <TAB>, U+000B LINE TABULATION <VT>, U+000C FORM FEED <FF>, U+0020 SPACE <SP>, U+00A0 NO-BREAK SPACE <NBSP>, U+FEFF ZERO WIDTH NO-BREAK SPACE <ZWNBSP> および その他のカテゴリ “Zs” Unicode の他の “Separator, space” コードポイント <USP> に属するすべての文字です。これらの文字はふつう、コードの機能性には不要なものです。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li>仕様書 <ol> diff --git a/files/ja/glossary/wrapper/index.html b/files/ja/glossary/wrapper/index.html index 3b7ab758af..13e1374c0a 100644 --- a/files/ja/glossary/wrapper/index.html +++ b/files/ja/glossary/wrapper/index.html @@ -18,7 +18,7 @@ translation_of: Glossary/Wrapper <p>Wikipedia の {{Interwiki("wikipedia", "Wrapper function")}}</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Glossary">MDN Web Docs 用語集</a> diff --git a/files/ja/learn/forms/form_validation/index.html b/files/ja/learn/forms/form_validation/index.html index 156709f76a..c167a03576 100644 --- a/files/ja/learn/forms/form_validation/index.html +++ b/files/ja/learn/forms/form_validation/index.html @@ -428,7 +428,7 @@ input:focus:invalid { <li> メッセージはブラウザーのロケールに依存しており、ある言語のページでエラーメッセージが別の言語で表示されることがあり、これは下記の Firefox スクリーンショットで見ることができます。</li> </ul> -<p><img alt="Example of an error message with Firefox in French on an English page" src="https://wiki.developer.mozilla.org/files/4329/error-firefox-win7.png" style="height: 97px; width: 228px;"></p> +<p><img alt="Example of an error message with Firefox in French on an English page" src="/files/4329/error-firefox-win7.png" style="height: 97px; width: 228px;"></p> <p>これらのメッセージの外見やテキストを変更するには、<a href="/ja/docs/Web/API/Constraint_validation" rel="external">制約検証 API</a> の最も一般的なユースケースです。この使用法を例で詳しく見てみましょう。</p> diff --git a/files/ja/mdn/contribute/howto/create_and_edit_pages/index.html b/files/ja/mdn/contribute/howto/create_and_edit_pages/index.html index a338b31625..7a0cf12f4c 100644 --- a/files/ja/mdn/contribute/howto/create_and_edit_pages/index.html +++ b/files/ja/mdn/contribute/howto/create_and_edit_pages/index.html @@ -111,7 +111,7 @@ translation_of: MDN/Contribute/Howto/Create_and_edit_pages <p><em>別のページからリンクせずに新しいページを作成するには</em>、ブラウザの URL フィールドに一意のページ名を入力します。たとえば、次のように入力します。</p> -<pre class="language-html notranslate">https://wiki.developer.mozilla.org/en-US/docs/FooBar</pre> +<pre class="language-html notranslate">https://developer.mozilla.org/en-US/docs/FooBar</pre> <p>MDN は "FooBar" というタイトルの新しいページを作成し、エディターを開いて新しいページにコンテンツを追加することができます。エディターモードの使用方法については、この記事の「<a href="#Editing_an_existing_page">既存のページを編集する</a>」セクションを参照してください。</p> @@ -122,7 +122,7 @@ translation_of: MDN/Contribute/Howto/Create_and_edit_pages <li>ブラウザーの URL 欄に下記のように入力する</li> </ol> -<pre class="language-html notranslate">https://wiki.developer.mozilla.org/en-US/docs/new</pre> +<pre class="language-html notranslate">https://developer.mozilla.org/en-US/docs/new</pre> <p>MDN は新しいページを作成し、エディターを開いて新しいページにコンテンツを追加することができます。エディターモードの使用方法については、この記事の「<a href="#Editing_an_existing_page">既存のページを編集する</a>」セクションを参照してください。</p> diff --git a/files/ja/mdn/contribute/howto/tag/index.html b/files/ja/mdn/contribute/howto/tag/index.html index 2f8c6d0811..14c6353ddc 100644 --- a/files/ja/mdn/contribute/howto/tag/index.html +++ b/files/ja/mdn/contribute/howto/tag/index.html @@ -211,7 +211,7 @@ translation_of: MDN/Contribute/Howto/Tag <h2 id="Tagging_and_search_filters" name="Tagging_and_search_filters">タグ付けと検索フィルター</h2> -<p>検索フィルターは、 MDN のページを正しくタグ付けしないと正しく動作しません。検索フィルターと検索するタグの一覧表は以下の通りです。(検索フィルターは <a href="https://wiki.developer.mozilla.org">wiki</a> (編集) サイトでのみ使用されます。読み込み専用サイトではフィルターなしの別の検索システムを使用しています。)</p> +<p>検索フィルターは、 MDN のページを正しくタグ付けしないと正しく動作しません。検索フィルターと検索するタグの一覧表は以下の通りです。(検索フィルターは <a href="https://developer.mozilla.org">wiki</a> (編集) サイトでのみ使用されます。読み込み専用サイトではフィルターなしの別の検索システムを使用しています。)</p> <div class="blockIndicator note"> <p><strong>注:</strong> もし「タグ名」のところに複数のタグがあった場合は、それらのタグのうち1つ以上が一致すれば検索されるという意味です。</p> diff --git a/files/ja/mdn/contribute/localize/index.html b/files/ja/mdn/contribute/localize/index.html index b62fbf6f67..6d17044446 100644 --- a/files/ja/mdn/contribute/localize/index.html +++ b/files/ja/mdn/contribute/localize/index.html @@ -30,7 +30,7 @@ translation_of: MDN/Contribute/Localize <ul> <li>ディスカッション: <a href="https://chat.mozilla.org/#/room/#l10n-fr:mozilla.org">Matrix (#l10n-fr channel)</a></li> - <li>現在の貢献者: <a href="https://github.com/SphinxKnight">SphinxKnight</a>, <a href="https://github.com/tristantheb">tristantheb</a>, <a href="https://github.com/JNa0">JNa0</a>, <a href="https://github.com/nicolas-goudry">nicolas-goudry</a>, <a href="https://github.com/LEMIBANDDEXARI">LEMIBANDDEXARI</a></li> + <li>現在の貢献者: <a href="https://github.com/SphinxKnight">SphinxKnight</a>, <a href="https://github.com/tristantheb">tristantheb</a>, <a href="https://github.com/audrasjb">Jb Audras</a></li> </ul> <h3 id="Japanese_ja">日本語 (ja)</h3> diff --git a/files/ja/mdn/contribute/markdown_in_mdn/index.html b/files/ja/mdn/contribute/markdown_in_mdn/index.html new file mode 100644 index 0000000000..21658cef2b --- /dev/null +++ b/files/ja/mdn/contribute/markdown_in_mdn/index.html @@ -0,0 +1,417 @@ +--- +title: MDN の Markdown +slug: MDN/Contribute/Markdown_in_MDN +tags: + - MDN +--- +<div>{{MDNSidebar}}</div> + +<div class="notecard warning"> + +<h4>警告</h4> + +<p>現在、 MDN のすべてのコンテンツを HTML から Markdown に変換しているところです。現在、 HTML または Markdown でページを書くことができますが、私たちは一つの章の中で書式を混在させたくありません。</p> + +<p>現時点では、 (訳注: 英語版の) JavaScript のドキュメント (<a href="/en-US/docs/Web/JavaScript">https://developer.mozilla.org/en-US/docs/Web/JavaScript</a> 以下のページ) のみが Markdown になっていますので、このページはサイトのその部分にのみ適用されます。サイトの他の部分については、 HTML でドキュメントを書いてください。</p> + +</div> + +<p>このページでは、 Markdown を使用してどのように MDN のドキュメントを書くかを説明します。ベースラインとして GitHub-Flavored Markdown (GFM) を選択し、 GFM では容易にサポートされていない MDN で行う必要のあるいくつかのことに対応するために、いくつかの拡張機能を追加しました。</p> + +<h2>ベースライン: GitHub-Flavored Markdown</h2> + +<p>MDN Markdown のベースラインは GitHub-Flavored Markdown (GFM、 <a href="https://github.github.com/gfm/">https://github.github.com/gfm/</a>) です。このページで特に明記されていないものについては、 GFM の仕様を参照してください。また、 GFM は CommonMark (<a href="https://spec.commonmark.org/">http://spec.commonmark.org/</a>) の上位互換です。</p> + +<h2>コードブロックの例</h2> + +<p>GFM や CommonMark では、「コードフェンス」を使用して <code><pre></code> ブロックを区切ることができます。冒頭のコードフェンスの後には、「情報文字列」と呼ばれるテキストが続くことがあります。仕様書によると、次の通りです。</p> + +<blockquote> + <p>情報文字列の最初の単語は、通常、コードサンプルの言語を指定するために使用され、コードタグの class 属性に表示されます。</p> +</blockquote> + +<p>情報文字列には、次のように複数の単語を含めることができます。</p> + +<pre> +```fee fi fo fum +// some example code +``` +</pre> + +MDN では、書き手はコードブロックのサンプルにコードフェンスを使用します。ライターは情報文字列の最初の単語を使用してコードサンプルの言語を指定する必要があり、これはブロックの構文強調表示を提供するために使用されます。以下の単語に対応しています。 + +<ul> + <li><code>bash</code></li> + <li><code>cpp</code> (for C/C++)</li> + <li><code>css</code></li> + <li><code>html</code></li> + <li><code>java</code></li> + <li><code>js</code> (JavaScript 向け)</li> + <li><code>json</code></li> + <li><code>php</code></li> + <li><code>python</code></li> + <li><code>sql</code></li> + <li><code>xml</code></li> + <li><code>wasm</code> (WebAssembly テキスト書式向け)</li> +</ul> + +例えば、次のようにします。 + +<pre> +```js +const greeting = "I will get syntax highlighting"; +``` +</pre> + +<p>書き手は以下の追加の単語のいずれかを使用することができますが、これらの単語は言語の単語の後に置く必要があります。</p> + +<ul> + <li><code>example-good</code>: この例を良い例 (採用すべきもの) としてスタイル付けする</li> + <li><code>example-bad</code>: この例を悪い例 (避けるべきもの) としてスタイル付けする</li> + <li><code>hidden</code>: このコードブロックをページに表示しません。これはライブサンプルで使用するためのものです。</li> +</ul> + +例: + +<pre> +```js example-good +const greeting = "I'm a good example"; +``` +</pre> + +<h3>議論リファレンス</h3> + +<p>この課題は <a href="https://github.com/mdn/content/issues/3512">https://github.com/mdn/content/issues/3512</a> で解決しました。</p> + +<h2>メモ、警告、コールアウト</h2> + +<p>コンテンツの一部に特別な注意を喚起したい場合があります。そのためには、特別な最初の段落を持つ GFM ブロック引用を使用します。 GFM ブロック引用には、「メモ」「警告」「コールアウト」の 3 種類があります。</p> + +<ul> + <li>メモを追加するには、 GFM ブロック引用の最初の段落を <code>**Note:**</code> で始めてください。</li> + <li>警告を追加するには、 GFM ブロック引用の最初の段落を <code>**Warning:**</code> で始めてください。</li> + <li>コールアウトを追加するには、 GFM ブロック引用の最初の段落を <code>**Callout:**</code> で始めてください。</li> +</ul> + +<p>メモと警告は、出力に <strong>Note:</strong> または <strong>Warning:</strong> というテキストが表示されますが、コールアウトは表示されません。このため、コールアウトは、独自のタイトルを提供したい場合に適しています。</p> + +<p>マークアップの処理は、指定された正確な文字ではなく、生成された AST に基づいて行われます。つまり、 <code><strong>Note:</strong></code> もメモを生成します。ただし、スタイルの問題として Markdown の構文が必要です。</p> + +<p>複数行は、通常の段落と同じように、空のブロック引用行によって生成されます。さらに、スペースのない複数の行は通常の Markdown の行と同様に扱われ、連結されます。</p> + +<p>ブロック引用には、コードブロックやその他のブロック要素を含めることができます。</p> + +<p>"Note:" や "Warning:" というテキストは、レンダリングされた出力にも表示されるため、翻訳に配慮する必要があります。実際には、 MDN で対応しているすべてのロケールがこれらの文字列の独自の翻訳を提供しなければならず、プラットフォームは構成が特別な処理を必要とすることを示すものとして認識しなければならないことを意味します。</p> + +<h4>例</h4> + +<h5>注</h5> + +<pre> +> **Note:** これがメモの書き方です。 +> +> 複数行を入れることもできます。 +</pre> + +<p>これで次のような HTML が生成されます。</p> + +<pre class="brush: html"> +<div class="notecard note"> + <p><strong>Note:</strong> これがメモの書き方です。</p> + <p>複数行を入れることもできます。</p> +</div> +</pre> + +<p>この HTML は次のように、強調ボックスとして描画されます。</p> + +<div class="notecard note"> + <p><strong>Note:</strong> これがメモの書き方です。</p> + <p>複数行を入れることもできます。</p> +</div> + +<h5>警告</h5> + +<pre> +> **Warning:** これが警告の書き方です。 +> +> 複数の段落を入れることもできます。 +</pre> + +<p>これで次のような HTML が生成されます。</p> + +<pre class="brush: html"> +<div class="notecard warning"> + <p><strong>Warning:</strong> これが警告の書き方です。</p> + <p>複数の段落を入れることもできます。</p> +</div> +</pre> + +<p>この HTML は次のように、強調ボックスとして描画されます。</p> + +<div class="notecard warning"> + <p><strong>Warning:</strong> これが警告の書き方です。</p> + <p>複数の段落を入れることもできます。</p> +</div> + +<h5>コールアウト</h5> + +<pre> +> **Callout:** **これがコールアウトの書き方です。** +> +> 複数の段落を入れることもできます。 +</pre> + +<p>これで次のような HTML が生成されます。</p> + +<pre class="brush: html"> +<div class="callout"> + <p><strong>これがコールアウトの書き方です。</strong></p> + <p>複数の段落を入れることもできます。</p> +</div> +</pre> + +<p>この HTML は次のように、強調ボックスとして描画されます。</p> + +<div class="callout"> + <p><strong>これがコールアウトの書き方です。</strong></p> + <p>複数の段落を入れることもできます。</p> +</div> + +<h5>翻訳された警告</h5> + +<p>(訳注: 現時点では日本語の見出しには対応していません。)</p> + +<p>例えば、ドイツ語で "Warning" を "Warnung" としたい場合、ドイツ語のページで次のように書きます。</p> + +<pre> +> Warnung: So schreibt man eine Warnung. +</pre> + +<p>これは次のように表示されます。</p> + +<pre class="brush: html"> +<div class="notecard warning"> + <p><strong>Warnung:</strong> So schreibt man eine Warnung.</p> +</div> +</pre> + +<h5>コードブロックを含むメモ</h5> + +<p>この例はコードブロックを含んでいます。</p> + +<pre> +> **Note:** これがメモの書き方です。 +> +> コードブロックを含むことができます。 +> +> ```js +> const s = "コードブロックの中です"; +> ``` +> こんな感じです。 +</pre> + +<p>これで次のような HTML が生成されます。</p> + +<pre class="brush: html"> +<div class="notecard note"> + <p><strong>Note:</strong> これがメモの書き方です。</p> + <p>コードブロックを含むことができます。</p> + <pre class="brush: js">const s = "コードブロックの中です";</pre> + <p>こんな感じです。</p> +</div> +</pre> + +<p>この HTML は次のようにコードブロックと一緒に描画されます。</p> + +<div class="notecard note"> + <p><strong>Note:</strong> これがメモの書き方です。</p> + <p>コードブロックを含むことができます。.</p> + <pre class="brush: js">const s = "コードブロックの中です";</pre> + <p>こんな感じです。</p> +</div> + +<h3>議論リファレンス</h3> + +<p>この課題は <a href="https://github.com/mdn/content/issues/3483">https://github.com/mdn/content/issues/3483</a> で解決されました。</p> + +<h2>定義リスト</h2> + +<p>MDN で定義リストを作成するためには、 GFM 順序なしリスト ({{HTMLElement("ul")}}) を変更した書き方をします。</p> + +<ul> + <li>GFM <code><ul></code> は任意の数の最上位の GFM <code><li></code> 要素を含みます。</li> + <li>最上位の GFM <code><li></code> 要素は、最後の要素として GFM <code><ul></code> 要素を含みます。</li> + <li>最終的に含まれる <code><ul></code> は、単一の GFM <code><li></code> 要素を含み、この中身は <code>: </code> (コロンに続いて空白) で始まるテキストでなければなりません。この要素はブロック要素、例えば段落、コードブロック、埋め込みリスト、メモなどを含むことができます。</li> +</ul> + +<p>最上位の GFM <code><li></code> 要素は、次のように + <code><dt></code>/<code><dd></code> の組に変換されます。</p> + +<ul> + <li>最上位の GFM <code><li></code> 要素は、GFM <code><li></code> 要素として解析され、その内部コンテンツは、 <code><dt></code> の内容を構成しますが、最後に入れ子になった <code><ul></code> については例外で、 <code><dt></code> には含まれません。 + <li>最後に入れ子になった <code><ul></code> の中の <code><li></code> 要素は、GFM <code><li></code> 要素として解析され、その内容は <code><dd></code> の内容を構成しますが、先頭の <code>: </code> は捨てられます。</li> +</ul> + +例えば、これは <code><dl></code> です。 + +<pre> +* term1 + * : My description of term1 + +* `term2` + * : My description of term2 + + It can have multiple paragraphs, and code blocks too: + + ```js + const thing = 1; + ``` +</pre> + +GFM/CommonMark では、これは次の HTML を生成します。 + +<pre class="brush: html"> +<ul> + <li> + <p>term1</p> + <ul> + <li>: My description of term1</li> + </ul> + </li> + <li> + <p><code>term2</code></p> + <ul> + <li> + <p>: My description of term2</p> + <p>It can have multiple paragraphs, and code blocks too:</p> + <pre> + <code class="brush: js">const thing = 1;</code> + </pre> + </li> + </ul> + </li> +</ul> +</pre> + +MDN では、これは次の HTML を生成します。 + +<pre class="brush: html"> +<dl> + <dt> + <p>term1</p> + </dt> + <dd>My description of term1</dd> + <dt> + <p><code>term2</code></p> + </dt> + <dd> + <p>My description of term2</p> + <p>It can have multiple paragraphs, and code blocks too:</p> + <pre> + <code class="brush: js">const thing = 1;</code> + </pre> + </dd> +</dl> +</pre> + +<p>この構文で書かれた定義リストは、 <code><dt></code>/<code><dd></code> 要素のペアで構成されます。この構文では、 2 つ以上の連続した <code><dt></code> 要素、または 2 つ以上の連続した <code><dd></code> 要素を持つリストを書くことはできません。パーサーはこれをエラーとして扱います。 MDN 上のほとんどすべての定義リストがこの制限で動作することを期待しており、動作しないものについては、生の HTML に戻ることができます。</p> + +<p>複数の <code><dt></code> 項目を 1 つの <code><dd></code> に関連付ける必要がある場合の回避策として、以下のように複数の用語をカンマで区切って 1 つの <code><dt></code> として提供することを検討してください。<p> + +<pre> +* `param1`, `param2`, `param3` + * : My description of params 1, 2, and 3 +</pre> + +<p>ここで説明する構文の根拠は、 CommonMark を期待するツール (Prettier や GitHub のプレビューなど) で十分に機能すると同時に、記述と解析が適度に簡単であることです。</p> + +<h3>議論リファレンス</h3> + +<p>この課題は <a href="https://github.com/mdn/content/issues/4367">https://github.com/mdn/content/issues/4367</a> で解決されました。</p> + +<h2>表</h2> + +<p>GFM では (ただし CommonMark を除く)、表の構文として <a href="https://github.github.com/gfm/#tables-extension-">https://github.github.com/gfm/#tables-extension-</a> があります。これを利用していますが、 GFM の構文は HTML で利用可能な機能の一部しか対応していません。</p> + +<p>ですから、ここでの一般的な原則は、可能な限り GFM Markdown の構文を使用し、必要に応じて生の HTML に戻る必要があるということです。</p> + +<p>GFM の表の構文は、主に以下のような制限があります。</p> + +<ul> + <li>GFM の表ではヘッダー行が必要です。</li> + <li>GFM の表ではヘッダー列を設定することができません。</li> + <li>GFM は表のセル内にある GFM ブロック要素を解析しません。例えば、表のセル内にリストを入れることはできません。</li> + <li>GFM は <code><table></code>, <code><tr></code>, <code><th></code>, <code><td></code> 以外の表要素に対応していません。</li> + <li>GFM は <code>colspan</code>, <code>rowspan</code>, <code>scope</code> のような表要素の属性に対応していません。</li> +</ul> + +<p>これらのみ対応の機能を使用する必要がある場合は、表を HTML で記述する必要があります。</p> + +<p>また、 <code><caption></code> 要素を表に使用することはお勧めしません。これも GFM の構文の規則外になるからです。</p> + +<p>GFM の表の構文では、行の最初と最後のパイプ記号を省略することができます。 MDN の編集者は、読みやすさのためにこれらのパイプ記号を記入する必要があります。</p> + +<p>つまり、 MDN の編集者はこのスタイルを使用する必要があります。</p> + +<pre> +| Heading 1 | Heading 2 | Heading 3 | +|-----------|-----------|-----------| +| cell 1 | cell 2 | cell 3 | +| cell 4 | cell 5 | cell 6 | +</pre> + +<p>このスタイルではありません。</p> + +<pre> +Heading 1 | Heading 2 | Heading 3 + --- | --- | --- +cell 1 | cell 2 | cell 3 +cell 4 | cell 5 | cell 6 +</pre> + +<h3>議論リファレンス</h3> + +<p>この課題は <a href="https://github.com/mdn/content/issues/4325">https://github.com/mdn/content/issues/4325</a> で解決しました。</p> + +<h2>上付き・下付き文字</h2> + +<p>HTML の {{HTMLElement("sup")}} および {{HTMLElement("sub")}} 要素を必要に応じて使用することができますが、可能な限り代替策を採ってください。具体的には次のようにします。</p> + +<ul> + <li>べき乗については、 <code>2^53</code> のようにキャレットを使用してください。</li> + <li>1<sup>st</sup> のような序数表現では、 "first" のように言葉を使用してください。</li> + <li>脚注については、脚注参照を <code><sup>[1]</sup></code> のようにマークアップする必要はありません。不必要なものです。</li> +</ul> + +<h3>議論リファレンス</h3> + +<p>この課題は <a href="https://github.com/mdn/content/issues/4578">https://github.com/mdn/content/issues/4578</a> で解決しました。</p> + +<h2>ページ概要</h2> + +<p><em>ページ概要</em>はページの最初の「コンテンツ」の段落、すなわち、ページのフロントマター、<a href="#kumascript">サイドバー、ページバナーのマクロ</a>の後に表示される最初のテキストです。</p> + +<p>この概要は検索エンジン最適化 (SEO) のために使用され、また、マクロによってはページリストに自動的に含まれます。 + したがって、最初の段落は、簡潔で説明的なものでなければなりません。</p> + +<h3>議論リファレンス</h3> + +<p>この課題は <a href="https://github.com/mdn/content/issues/3923">https://github.com/mdn/content/issues/3923</a> で解決しました。</p> + +<h2>KumaScript</h2> + +<p>文章のコンテンツに、 KumaScript のマクロ呼び出しを含めることができます。</p> + +<pre> + +The **`margin`** [CSS](https://developer.mozilla.org/en-US/docs/Web/CSS) property +sets the margin area on all four sides of an element. It is a shorthand for +\{{cssxref("margin-top")}}, \{{cssxref("margin-right")}}, \{{cssxref("margin-bottom")}}, +and \{{cssxref("margin-left")}}. + +\{{EmbedInteractiveExample("pages/css/margin.html")}} + +The top and bottom margins have no effect on replaced inline elements, such as +\{{HTMLElement("span")}} or \{{HTMLElement("code")}}. + +</pre> diff --git a/files/ja/mdn/guidelines/css_style_guide/index.html b/files/ja/mdn/guidelines/css_style_guide/index.html index 46c2646719..7501925e4a 100644 --- a/files/ja/mdn/guidelines/css_style_guide/index.html +++ b/files/ja/mdn/guidelines/css_style_guide/index.html @@ -20,7 +20,7 @@ translation_of: MDN/Guidelines/CSS_style_guide <p>これらのスタイルは、記事内容のスタイリング中に発生する最も一般的な状況をカバーするように開発されているので、可能な限り使用可能なクラスを使用するようにしてください。標準的なコンテンツのルックアンドフィールからの分岐が多すぎると、一貫性や可読性を損ないます。あなたのページが絶対に特別なカスタムスタイリングを必要としていると感じたら、まず <a href="https://discourse.mozilla.org/c/mdn">MDN Discourse フォーラム</a>でその話題を切り出す必要があります。</p> <div class="blockIndicator note"> -<p><strong>注</strong>: 特定のクラスが MDN で使用されている場所を検索する場合は、<code>https://developer.mozilla.org/ja/search?locale=en-US&css_classnames=<var>desired-css-class</var></code> という形式の URL を使用して検索できます。たとえば、 Google のカードグリッドレイアウトを使用するページを見つけるには、URL <a href="/ja/search?locale=*&css_classnames=card-grid">https://wiki.developer.mozilla.org/ja/search?locale=*&css_classnames=card-grid</a> を試してください。</p> +<p><strong>注</strong>: 特定のクラスが MDN で使用されている場所を検索する場合は、<code>https://developer.mozilla.org/ja/search?locale=en-US&css_classnames=<var>desired-css-class</var></code> という形式の URL を使用して検索できます。たとえば、 Google のカードグリッドレイアウトを使用するページを見つけるには、URL <a href="/ja/search?locale=*&css_classnames=card-grid">https://developer.mozilla.org/ja/search?locale=*&css_classnames=card-grid</a> を試してください。</p> </div> <div class="blockIndicator warning"> diff --git a/files/ja/mozilla/firefox/releases/1.5/using_firefox_1.5_caching/index.html b/files/ja/mozilla/firefox/releases/1.5/using_firefox_1.5_caching/index.html index defff78437..4f00d1637e 100644 --- a/files/ja/mozilla/firefox/releases/1.5/using_firefox_1.5_caching/index.html +++ b/files/ja/mozilla/firefox/releases/1.5/using_firefox_1.5_caching/index.html @@ -15,7 +15,7 @@ original_slug: Using_Firefox_1.5_caching <h2 id=".E3.81.AF.E3.81.98.E3.82.81.E3.81.AB" name=".E3.81.AF.E3.81.98.E3.82.81.E3.81.AB">はじめに</h2> -<p><a href="/ja/Firefox_1.5_for_developers" title="ja/Firefox_1.5_for_developers">Firefox 1.5</a> ではウェブページ全体をその JavaScript の状態も含めてメモリ内にキャッシュし、1 つのブラウザセッションとして使用します。訪問したページ間の戻る、進むという動作にページのロードが不要になり、JavaScript の状態も保存されます。この機能によってページナビゲーションが非常に高速化します。この機能は <strong>bfcache</strong>（"Back-Forward Cache" のこと）と呼ばれることもあります。このキャッシュ状態はユーザがブラウザを閉じるまで保存されます。</p> +<p><a href="/ja/Firefox_1.5_for_developers">Firefox 1.5</a> ではウェブページ全体をその JavaScript の状態も含めてメモリ内にキャッシュし、1 つのブラウザセッションとして使用します。訪問したページ間の戻る、進むという動作にページのロードが不要になり、JavaScript の状態も保存されます。この機能によってページナビゲーションが非常に高速化します。この機能は <strong>bfcache</strong>（"Back-Forward Cache" のこと）と呼ばれることもあります。このキャッシュ状態はユーザがブラウザを閉じるまで保存されます。</p> <p>Firefox がページをキャッシュしない場合があります。ページがキャッシュされないプログラム的な理由でよくあるものをいくつか以下に示します。</p> @@ -187,6 +187,6 @@ function loadOnlyFirst() { <h2 id="Firefox_.E7.94.A8.E6.8B.A1.E5.BC.B5.E6.A9.9F.E8.83.BD.E3.81.AE.E9.96.8B.E7.99.BA" name="Firefox_.E7.94.A8.E6.8B.A1.E5.BC.B5.E6.A9.9F.E8.83.BD.E3.81.AE.E9.96.8B.E7.99.BA">Firefox 用拡張機能の開発</h2> -<p>Firefox 1.5 の <a href="/ja/Building_an_Extension" title="ja/Building_an_Extension">拡張機能</a> はこのキャッシュ機能を許容するものである必要があります。1.5 とそれより前のバージョンの両方と互換性を持つ Firefox の拡張機能を開発したいのであれば、キャッシュされるようにするトリガについては <code>load</code> イベントをリスンし、キャッシュされないようにするトリガについては <code>pageshow</code> イベントをリスンしてください。</p> +<p>Firefox 1.5 の <a href="/ja/Building_an_Extension">拡張機能</a> はこのキャッシュ機能を許容するものである必要があります。1.5 とそれより前のバージョンの両方と互換性を持つ Firefox の拡張機能を開発したいのであれば、キャッシュされるようにするトリガについては <code>load</code> イベントをリスンし、キャッシュされないようにするトリガについては <code>pageshow</code> イベントをリスンしてください。</p> <p>例えば Firefox 用 Google ツールバーは、1.5 とそれより前のバージョンの両方と互換性を持たせるためには、autolink 関数については <code>load</code> イベントをリスンすべきであり、PageRank 関数については <code>pageshow</code> イベントをリスンすべきです。</p> diff --git a/files/ja/mozilla/firefox/releases/13/index.html b/files/ja/mozilla/firefox/releases/13/index.html index 1be4add1b3..3b59a7e858 100644 --- a/files/ja/mozilla/firefox/releases/13/index.html +++ b/files/ja/mozilla/firefox/releases/13/index.html @@ -39,7 +39,7 @@ translation_of: Mozilla/Firefox/Releases/13 <li>{{ domxref("window.setTimeout()") }} および {{ domxref("window.setInterval()") }} メソッドは、付加的な引数である "遅延" をコールバックルーチンに渡さないようになりました。</li> <li>{{ domxref("Blob","Blob.mozSlice()") }} メソッドの接頭辞を削除しました。</li> <li>{{ domxref("Blob") }} コンストラクタをサポートしました。</li> - <li><a href="/ja/DOM/Storage#globalStorage" title="ja/DOM/Storage#globalStorage"><code>globalStorage</code></a> のサポートを削除しました。</li> + <li><a href="/ja/DOM/Storage#globalStorage"><code>globalStorage</code></a> のサポートを削除しました。</li> <li>バックグラウンドの処理の状態や結果を報告するために用いる {{ domxref("DOMRequest") }} インタフェースを新たに追加しました。</li> <li>{{ domxref("HTMLOptionElement", "HTMLOptionElement.index()") }} メソッドは、{{ HTMLElement("option") }} が {{ HTMLElement("datalist") }} HTML 要素の内部にあるときに誤った値 <code>-1</code> ではなく <code>0</code> を返すようになりました。</li> <li>{{ domxref("DOMException") }} のうち DOM Level 4 で定義された部分を実装しました。</li> @@ -65,7 +65,7 @@ translation_of: Mozilla/Firefox/Releases/13 <h3 id="WebGL">WebGL</h3> <ul> - <li><a href="/ja/WebGL/Using_Extensions#EXT_texture_filter_anisotropic" title="ja/WebGL/Using_Extensions#EXT_texture_filter_anisotropic"><code>EXT_texture_filter_anisotropic</code></a> 拡張のサポートを追加しました。異方性テクスチャフィルタリングは、テクスチャが貼り付けられた斜めのプリミティブを表示する際のミップマップテクスチャのアクセスの品質を向上させます。</li> + <li><a href="/ja/WebGL/Using_Extensions#EXT_texture_filter_anisotropic"><code>EXT_texture_filter_anisotropic</code></a> 拡張のサポートを追加しました。異方性テクスチャフィルタリングは、テクスチャが貼り付けられた斜めのプリミティブを表示する際のミップマップテクスチャのアクセスの品質を向上させます。</li> </ul> <h3 id="MathML">MathML</h3> diff --git a/files/ja/mozilla/firefox/releases/14/index.html b/files/ja/mozilla/firefox/releases/14/index.html index 4e2ebb8a22..be3496df2a 100644 --- a/files/ja/mozilla/firefox/releases/14/index.html +++ b/files/ja/mozilla/firefox/releases/14/index.html @@ -24,14 +24,14 @@ translation_of: Mozilla/Firefox/Releases/14 <h3 id="DOM">DOM</h3> <ul> - <li><a href="/ja/DOM/DOM_event_reference/input" title="ja/DOM/DOM_event_reference/input">input</a> イベントが <a href="/en/DOM/Element.contentEditable" title="en/DOM/Element.contentEditable">contenteditable</a> エディタをホストしている要素および <a href="/en/DOM/document.designMode" title="document.designMode">designMode</a> エディタのルート要素上での編集でも発生するようになりました。</li> + <li><a href="/ja/DOM/DOM_event_reference/input">input</a> イベントが <a href="/en/DOM/Element.contentEditable" title="en/DOM/Element.contentEditable">contenteditable</a> エディタをホストしている要素および <a href="/en/DOM/document.designMode" title="document.designMode">designMode</a> エディタのルート要素上での編集でも発生するようになりました。</li> <li>{{ domxref("DOMException", "DOMException.code") }} は最新の DOM Level 4 仕様に従って非推奨になりました。</li> <li>{{ domxref("Range.insertNode()") }} が 折り畳まれた (collapsed) 範囲上で用いられたときに正しく動作するようになりました。</li> <li>{{ domxref("BlobBuilder", "MozBlobBuilder") }} インタフェースが {{ domxref("Blob") }} コンストラクタの利用を促すために非推奨になりました。<code>MozBlobBuilder</code> を利用した場合、Web コンソールに警告が表示されます。</li> <li>{{ domxref("DOM_Mutation_Observers","MutationObserver") }} のサポートが導入されました。これは、パフォーマンスに関する多くの問題がある DOM3 の Mutation Events の置き換えとして設計されました。</li> <li>{{ domxref("HTMLImageElement") }} インタフェースの <code>x</code> <code><code>プロパティおよび </code>y</code> プロパティは Gecko 7.0 で削除されましたが、互換性の理由でこのリリースから復活しました。</li> <li>{{ domxref("Document") }} のメソッドである <code>execCommandShowHelp()<code><code> と<code><code> </code></code></code></code></code><code>queryCommandText() は、今まで何もしませんでしたが、削除されました。</code></li> - <li><code>GeoPositionAddress</code> インタフェースは、<a href="/Ja/Using_geolocation" title="Ja/Using_geolocation">Geolocation</a> API で廃止された仕様の一部であり、削除されました。</li> + <li><code>GeoPositionAddress</code> インタフェースは、<a href="/Ja/Using_geolocation">Geolocation</a> API で廃止された仕様の一部であり、削除されました。</li> <li>{{ domxref("Storage", "localStorage/sessionStorage") }} がプロパティアクセスを通した宣言されていないキーに対して <code>null</code> ではなく<code> undefined</code> を正しく返すようになりました。</li> </ul> diff --git a/files/ja/mozilla/firefox/releases/19/index.html b/files/ja/mozilla/firefox/releases/19/index.html index d61dcc05d8..3dae46cb2e 100644 --- a/files/ja/mozilla/firefox/releases/19/index.html +++ b/files/ja/mozilla/firefox/releases/19/index.html @@ -57,7 +57,7 @@ translation_of: Mozilla/Firefox/Releases/19 <ul> <li><code>getBrowserSelection()</code> が、テキスト入力フィールドで選択されているテキストを返すようになりました。このため、ユーザがパスワードフィールドではないテキスト入力フィールドでテキストを選択したときに、<code>gContextMenu.isTextSelected</code> が <code>true</code> になります ({{bug("565717")}})。</li> - <li><a href="/ja/docs/Mozilla/JavaScript_code_modules/Dict.jsm" title="ja/docs/Mozilla/JavaScript_code_modules/Dict.jsm">Dict.jsm</a>: <a href="/ja/docs/Mozilla/JavaScript_code_modules/Dict.jsm#Creating_a_dictionary" title="ja/docs/Mozilla/JavaScript_code_modules/Dict.jsm#Creating_a_dictionary"><code>Dict()</code></a> が JSON 文字列を受け入れるようになりました。<a href="/ja/docs/Mozilla/JavaScript_code_modules/Dict.jsm#toJSON()" title="ja/docs/Mozilla/JavaScript_code_modules/Dict.jsm#toJSON()"><code>Dict.toJSON()</code></a> メソッドが追加され、これは JSON 文字列を返します ({{bug("727967")}})。</li> + <li><a href="/ja/docs/Mozilla/JavaScript_code_modules/Dict.jsm">Dict.jsm</a>: <a href="/ja/docs/Mozilla/JavaScript_code_modules/Dict.jsm#Creating_a_dictionary"><code>Dict()</code></a> が JSON 文字列を受け入れるようになりました。<a href="/ja/docs/Mozilla/JavaScript_code_modules/Dict.jsm#toJSON()"><code>Dict.toJSON()</code></a> メソッドが追加され、これは JSON 文字列を返します ({{bug("727967")}})。</li> </ul> <h3 id="Interface_changes" name="Interface_changes">インタフェースの変更点</h3> diff --git a/files/ja/mozilla/firefox/releases/3.5/updating_extensions/index.html b/files/ja/mozilla/firefox/releases/3.5/updating_extensions/index.html index ea919ee652..c9e52ddc98 100644 --- a/files/ja/mozilla/firefox/releases/3.5/updating_extensions/index.html +++ b/files/ja/mozilla/firefox/releases/3.5/updating_extensions/index.html @@ -26,9 +26,9 @@ firefox -createProfile testBeta2 <p>テストが完了したら、今度は常用のプロファイルを使って、再度その拡張機能を使ってみます。 この作業は、保存されている既存のデータとの互換性を確認するのに役立ちます。</p> <h3 id="addons.mozilla.org_に登録されている拡張機能の更新">addons.mozilla.org に登録されている拡張機能の更新</h3> <p>ついに、更新した拡張機能を公開するときが来ました。 もし自分の拡張機能に一切コードの変更が必要ない場合は、AMO のダッシュボードにログインして、互換性のあるバージョンを更新するだけで済みます。 何らかの変更を加えた場合は、新しいバージョンを AMO にアップロードする必要があります。</p> -<p>詳しくは <a class="internal" href="/ja/Submitting_an_add-on_to_AMO" title="ja/Submitting an add-on to AMO">AMO へのアドオンの登録</a> を参照してください。</p> +<p>詳しくは <a class="internal" href="/ja/Submitting_an_add-on_to_AMO">AMO へのアドオンの登録</a> を参照してください。</p> <h2 id="Places_データベースへのアクセス">Places データベースへのアクセス</h2> -<p>Firefox 3.1 以前は、<a class="internal" href="/ja/Storage" title="ja/Storage">Storage API</a> を使って Places データベースへ直接アクセスする場合、以下のように少々工夫が必要でした。</p> +<p>Firefox 3.1 以前は、<a class="internal" href="/ja/Storage">Storage API</a> を使って Places データベースへ直接アクセスする場合、以下のように少々工夫が必要でした。</p> <pre class="brush: js">var places = Components.classes["@mozilla.org/file/directory_service;1"]. getService(Components.interfaces.nsIProperties). get("ProfD", Components.interfaces.nsIFile); @@ -42,7 +42,7 @@ var db = Components.classes["@mozilla.org/storage/service;1"]. getService(Components.interfaces.nsPIPlacesDatabase).DBConnection; </pre> <h2 id="テキストボックスの検索">テキストボックスの検索</h2> -<p><a class="internal" href="/ja/XUL/textbox" title="ja/XUL/Textbox"><code>textbox</code></a> の種類のひとつ、<code>timed</code> は廃止予定となりました。代わりに <code>search</code> を使ってください。</p> +<p><a class="internal" href="/ja/XUL/textbox"><code>textbox</code></a> の種類のひとつ、<code>timed</code> は廃止予定となりました。代わりに <code>search</code> を使ってください。</p> <p>Firefox 3 では、以下のようなコードが使われていたはずです。</p> <pre><textbox type="timed" timeout="1000" oncommand="alert(this.value);"/> </pre> @@ -50,7 +50,7 @@ var db = Components.classes["@mozilla.org/storage/service;1"]. <pre><textbox type="search" timeout="1000" oncommand="alert(this.value);"/> </pre> <h2 id="JSON">JSON</h2> -<p>JSON.jsm JavaScript モジュールは Firefox 3.1 では削除され、ネイティブの JSON オブジェクトサポートに置き換えられました。 詳しくは、<a class="internal" href="/ja/Using_JSON_in_Firefox" title="/ja/Using JSON in Firefox">Firefox で JSON を使用する</a> をご覧ください。JSON のより一般的な概要と、各種バージョンの Firefox で JSON を使う方法については、<a class="internal" href="/ja/JSON" title="ja/JSON">JSON</a> のページからリンクされている記事を参照してください。</p> +<p>JSON.jsm JavaScript モジュールは Firefox 3.1 では削除され、ネイティブの JSON オブジェクトサポートに置き換えられました。 詳しくは、<a class="internal" href="/ja/Using_JSON_in_Firefox" title="/ja/Using JSON in Firefox">Firefox で JSON を使用する</a> をご覧ください。JSON のより一般的な概要と、各種バージョンの Firefox で JSON を使う方法については、<a class="internal" href="/ja/JSON">JSON</a> のページからリンクされている記事を参照してください。</p> <p>Firefox 3 と Firefox 3.1 の両方について互換性を確保するには、以下のように記述します。</p> <pre class="brush: js">if (typeof(JSON) == "undefined") { Components.utils.import("resource://gre/modules/JSON.jsm"); @@ -67,7 +67,7 @@ var db = Components.classes["@mozilla.org/storage/service;1"]. <p>Firefox 3.1 では、カスタマイズ可能なツールバーの挙動が次のように変更されました。<xul:toolbar/> バインディングは、関連付けられた <xul:toolbarpalette/> からツールバー削除、もしくはツールバーへ追加するようになりました。これまでは、項目を複製してツールバーへコピーしていました。 つまり、パレットには、ツールバー上に存在しないアイテムしか含めることができません。これまでの挙動では、ツールバー上に表示されているかどうかに関わらず、カスタマイズ可能なすべての要素が含まれていました。 これは、<xul:toolbarpalette/> からカスタマイズ可能なすべてのツールバー項目を取得できることに依存した処理を行っていたり、ツールバーのカスタマイズ中に動的にパレットへ項目を挿入し、それらを利用可能にしようとしているアドオンで問題となる可能性があります。 詳しくは、{{ Bug(407725) }} と {{ Bug(467045) }} をご覧ください。</p> <h2 id="興味深い新機能">興味深い新機能</h2> <h3 id="すべてのタブのイベントを監視する">すべてのタブのイベントを監視する</h3> -<p>Firefox 3.1 では、すべてのタブを監視するプログレスリスナーを追加、削除できるようになりました。 詳しくは、<a class="internal" href="/ja/Listening_to_events_on_all_tabs" title="ja/Listening to events on all tabs">すべてのタブのイベントを監視する</a> をご覧ください。</p> +<p>Firefox 3.1 では、すべてのタブを監視するプログレスリスナーを追加、削除できるようになりました。 詳しくは、<a class="internal" href="/ja/Listening_to_events_on_all_tabs">すべてのタブのイベントを監視する</a> をご覧ください。</p> <h2 id="テーマ開発者の方へ">テーマ開発者の方へ</h2> -<ul> <li><a class="internal" href="/ja/Theme_changes_in_Firefox_3.1" title="ja/Theme changes in Firefox 3.1">Firefox 3.1 でのテーマ関連の変更</a> を確認してください。</li> <li>Mozillazine フォーラムの <a class="topictitle external" href="http://forums.mozillazine.org/viewtopic.php?f=18&t=665138" title="http://forums.mozillazine.org/viewtopic.php?f=18&t=665138">Theme changes for FF3.1</a> を参照して、3.0 から 3.1 の間に行われた、テーマ開発者に影響するすべての変更の概要、一覧を確認してください。 このスレッドでは、CSS の新機能 (nth-child、-moz-box-shadow など)、既存の UI 部品への変更、UI 全体の改善、Firefox 3.1 の新機能 (audio/video のサポート、プライベートブラウジング、セッション復元機能の拡張、ボックス・ウィンドウ・テキストシャドウ) が議論されています。</li> +<ul> <li><a class="internal" href="/ja/Theme_changes_in_Firefox_3.1">Firefox 3.1 でのテーマ関連の変更</a> を確認してください。</li> <li>Mozillazine フォーラムの <a class="topictitle external" href="http://forums.mozillazine.org/viewtopic.php?f=18&t=665138" title="http://forums.mozillazine.org/viewtopic.php?f=18&t=665138">Theme changes for FF3.1</a> を参照して、3.0 から 3.1 の間に行われた、テーマ開発者に影響するすべての変更の概要、一覧を確認してください。 このスレッドでは、CSS の新機能 (nth-child、-moz-box-shadow など)、既存の UI 部品への変更、UI 全体の改善、Firefox 3.1 の新機能 (audio/video のサポート、プライベートブラウジング、セッション復元機能の拡張、ボックス・ウィンドウ・テキストシャドウ) が議論されています。</li> </ul> diff --git a/files/ja/mozilla/firefox/releases/3/updating_extensions/index.html b/files/ja/mozilla/firefox/releases/3/updating_extensions/index.html index 910891d3dd..8a7859aa32 100644 --- a/files/ja/mozilla/firefox/releases/3/updating_extensions/index.html +++ b/files/ja/mozilla/firefox/releases/3/updating_extensions/index.html @@ -12,7 +12,7 @@ original_slug: Updating_extensions_for_Firefox_3 <h3 id="Step_1_.E3.82.A4.E3.83.B3.E3.82.B9.E3.83.88.E3.83.BC.E3.83.AB.E5.AE.9A.E7.BE.A9.E3.83.95.E3.82.A1.E3.82.A4.E3.83.AB.E3.82.92.E6.9B.B4.E6.96.B0.E3.81.99.E3.82.8B" name="Step_1:_.E3.82.A4.E3.83.B3.E3.82.B9.E3.83.88.E3.83.BC.E3.83.AB.E5.AE.9A.E7.BE.A9.E3.83.95.E3.82.A1.E3.82.A4.E3.83.AB.E3.82.92.E6.9B.B4.E6.96.B0.E3.81.99.E3.82.8B">Step 1: インストール定義ファイルを更新する</h3> -<p>最初のステップ、そして、ほとんどの拡張機能にとって必要となるたったひとつのステップは、Firefox 3 との互換性を示すために <a href="/ja/Install_Manifests" title="ja/Install_Manifests">インストール定義ファイル</a> (<code>install.rdf</code>) を更新する作業です。</p> +<p>最初のステップ、そして、ほとんどの拡張機能にとって必要となるたったひとつのステップは、Firefox 3 との互換性を示すために <a href="/ja/Install_Manifests">インストール定義ファイル</a> (<code>install.rdf</code>) を更新する作業です。</p> <p>ファイルを開いて、互換性がある Firefox の最高バージョンを示す行を見つけます。Firefox 2 向けの拡張機能であれば、以下のように書かれているはずです。</p> @@ -34,11 +34,11 @@ original_slug: Updating_extensions_for_Firefox_3 <h4 id=".E3.82.A4.E3.83.B3.E3.82.B9.E3.83.88.E3.83.BC.E3.83.AB.E5.AE.9A.E7.BE.A9.E3.83.95.E3.82.A1.E3.82.A4.E3.83.AB.E3.81.AB.E7.BF.BB.E8.A8.B3.E3.82.92.E8.BF.BD.E5.8A.A0.E3.81.99.E3.82.8B" name=".E3.82.A4.E3.83.B3.E3.82.B9.E3.83.88.E3.83.BC.E3.83.AB.E5.AE.9A.E7.BE.A9.E3.83.95.E3.82.A1.E3.82.A4.E3.83.AB.E3.81.AB.E7.BF.BB.E8.A8.B3.E3.82.92.E8.BF.BD.E5.8A.A0.E3.81.99.E3.82.8B">インストール定義ファイルに翻訳を追加する</h4> -<p>Firefox 3 は、翻訳された説明文を指定するための新しいプロパティを、インストール定義ファイル内でサポートしています。今までの方法も引き続き動作しますが、この新しい方法を利用すれば、アドオンが無効化されていたりインストールが保留されている場合も、各言語で説明文を表示できるようになります。詳しくは <a href="/ja/Localizing_extension_descriptions" title="ja/Localizing_extension_descriptions">拡張機能の説明の翻訳</a> をご覧ください。</p> +<p>Firefox 3 は、翻訳された説明文を指定するための新しいプロパティを、インストール定義ファイル内でサポートしています。今までの方法も引き続き動作しますが、この新しい方法を利用すれば、アドオンが無効化されていたりインストールが保留されている場合も、各言語で説明文を表示できるようになります。詳しくは <a href="/ja/Localizing_extension_descriptions">拡張機能の説明の翻訳</a> をご覧ください。</p> <h3 id="Step_2_.E5.AE.89.E5.85.A8.E3.81.AA.E6.9B.B4.E6.96.B0.E3.82.92.E6.8F.90.E4.BE.9B.E3.81.97.E3.81.A6.E3.81.84.E3.82.8B.E3.81.8B.E7.A2.BA.E8.AA.8D.E3.81.99.E3.82.8B" name="Step_2:_.E5.AE.89.E5.85.A8.E3.81.AA.E6.9B.B4.E6.96.B0.E3.82.92.E6.8F.90.E4.BE.9B.E3.81.97.E3.81.A6.E3.81.84.E3.82.8B.E3.81.8B.E7.A2.BA.E8.AA.8D.E3.81.99.E3.82.8B">Step 2: 安全な更新を提供しているか確認する</h3> -<p>あなたが独自にアドオンを配布していて、<a class="link-https" href="https://addons.mozilla.org">addons.mozilla.org</a> のような安全なアドオン提供サービスを利用していない場合、アドオンの更新に安全な方法を用いる必要があります。つまり、SSL を利用した Web サイト上で更新を提供するか、暗号鍵を使って更新情報に署名する必要があります。詳しくは <a href="/ja/Extension_Versioning,_Update_and_Compatibility#Securing_Updates" title="ja/Extension_Versioning,_Update_and_Compatibility#Securing_Updates">安全な更新</a> をご覧ください。</p> +<p>あなたが独自にアドオンを配布していて、<a class="link-https" href="https://addons.mozilla.org">addons.mozilla.org</a> のような安全なアドオン提供サービスを利用していない場合、アドオンの更新に安全な方法を用いる必要があります。つまり、SSL を利用した Web サイト上で更新を提供するか、暗号鍵を使って更新情報に署名する必要があります。詳しくは <a href="/ja/Extension_Versioning,_Update_and_Compatibility#Securing_Updates">安全な更新</a> をご覧ください。</p> <h3 id="Step_3_.E5.A4.89.E6.9B.B4.E3.81.95.E3.82.8C.E3.81.9F_API_.E3.81.AB.E5.AF.BE.E5.BF.9C.E3.81.99.E3.82.8B" name="Step_3:_.E5.A4.89.E6.9B.B4.E3.81.95.E3.82.8C.E3.81.9F_API_.E3.81.AB.E5.AF.BE.E5.BF.9C.E3.81.99.E3.82.8B">Step 3: 変更された API に対応する</h3> @@ -55,31 +55,31 @@ original_slug: Updating_extensions_for_Firefox_3 <h4 id=".E3.83.96.E3.83.83.E3.82.AF.E3.83.9E.E3.83.BC.E3.82.AF.E3.81.A8.E5.B1.A5.E6.AD.B4" name=".E3.83.96.E3.83.83.E3.82.AF.E3.83.9E.E3.83.BC.E3.82.AF.E3.81.A8.E5.B1.A5.E6.AD.B4">ブックマークと履歴</h4> -<p>あなたの拡張機能から何らかの方法でブックマークや履歴のデータにアクセスしている場合、Firefox 3 と互換性を持たせるには多くの作業が必要です。これらの情報にアクセスするための古い API は、<a href="/ja/Places" title="ja/Places">Places</a> という新しいアーキテクチャに置き換えられました。既存の拡張機能を Places API に対応させる方法については、<a href="/ja/Places_migration_guide" title="ja/Places_migration_guide">Places への移行ガイド</a> で詳しく解説しています。</p> +<p>あなたの拡張機能から何らかの方法でブックマークや履歴のデータにアクセスしている場合、Firefox 3 と互換性を持たせるには多くの作業が必要です。これらの情報にアクセスするための古い API は、<a href="/ja/Places">Places</a> という新しいアーキテクチャに置き換えられました。既存の拡張機能を Places API に対応させる方法については、<a href="/ja/Places_migration_guide">Places への移行ガイド</a> で詳しく解説しています。</p> <h4 id=".E3.83.80.E3.82.A6.E3.83.B3.E3.83.AD.E3.83.BC.E3.83.89.E3.83.9E.E3.83.8D.E3.83.BC.E3.82.B8.E3.83.A3" name=".E3.83.80.E3.82.A6.E3.83.B3.E3.83.AD.E3.83.BC.E3.83.89.E3.83.9E.E3.83.8D.E3.83.BC.E3.82.B8.E3.83.A3">ダウンロードマネージャ</h4> -<p>RDF データ形式から <a href="/ja/Storage" title="ja/Storage">Storage</a> API への移行にあたって、ダウンロードマネージャの API にも若干変更が加えられました。これに関する移行作業は非常に簡単なはずです。また、複数のダウンロードマネージャリスナーをサポートするため、ダウンロードの進捗状況を監視する API にも変更がありました。詳しくは <code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIDownloadManager" title="">nsIDownloadManager</a></code>、<code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIDownloadProgressListener" title="">nsIDownloadProgressListener</a></code>、<a href="/ja/Monitoring_downloads" title="ja/Monitoring_downloads">ダウンロードの監視</a> を参照してください。</p> +<p>RDF データ形式から <a href="/ja/Storage">Storage</a> API への移行にあたって、ダウンロードマネージャの API にも若干変更が加えられました。これに関する移行作業は非常に簡単なはずです。また、複数のダウンロードマネージャリスナーをサポートするため、ダウンロードの進捗状況を監視する API にも変更がありました。詳しくは <code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIDownloadManager" title="">nsIDownloadManager</a></code>、<code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIDownloadProgressListener" title="">nsIDownloadProgressListener</a></code>、<a href="/ja/Monitoring_downloads">ダウンロードの監視</a> を参照してください。</p> <h4 id=".E3.83.91.E3.82.B9.E3.83.AF.E3.83.BC.E3.83.89.E3.83.9E.E3.83.8D.E3.83.BC.E3.82.B8.E3.83.A3" name=".E3.83.91.E3.82.B9.E3.83.AF.E3.83.BC.E3.83.89.E3.83.9E.E3.83.8D.E3.83.BC.E3.82.B8.E3.83.A3">パスワードマネージャ</h4> <p>あなたの拡張機能からパスワードマネージャを利用してユーザのログイン情報にアクセスしている場合、新しいログインマネージャ API を利用するように更新する必要があります。</p> <ul> - <li><a href="/ja/Using_nsILoginManager" title="ja/Using_nsILoginManager">nsILoginManager の使い方</a> という記事には、パスワードマネージャとログインマネージャの両方を用いることで、Firefox 3 とそれ以前のバージョンの両方で機能拡張を動作させるデモなど、コードサンプルが載っています。</li> - <li><code><a href="/ja/nsILoginInfo" title="ja/nsILoginInfo">nsILoginInfo</a></code></li> - <li><code><a href="/ja/nsILoginManager" title="ja/nsILoginManager">nsILoginManager</a></code></li> + <li><a href="/ja/Using_nsILoginManager">nsILoginManager の使い方</a> という記事には、パスワードマネージャとログインマネージャの両方を用いることで、Firefox 3 とそれ以前のバージョンの両方で機能拡張を動作させるデモなど、コードサンプルが載っています。</li> + <li><code><a href="/ja/nsILoginInfo">nsILoginInfo</a></code></li> + <li><code><a href="/ja/nsILoginManager">nsILoginManager</a></code></li> </ul> -<p>あなたが拡張機能の中で独自のパスワードストレージを提供したい場合は、組み込みのパスワードマネージャストレージを上書きすることもできます。詳しくは <a href="/ja/Creating_a_Login_Manager_storage_module" title="ja/Creating_a_Login_Manager_storage_module">ログインマネージャ用ストレージモジュールの作成</a> をご覧ください。</p> +<p>あなたが拡張機能の中で独自のパスワードストレージを提供したい場合は、組み込みのパスワードマネージャストレージを上書きすることもできます。詳しくは <a href="/ja/Creating_a_Login_Manager_storage_module">ログインマネージャ用ストレージモジュールの作成</a> をご覧ください。</p> <h4 id=".E3.83.9D.E3.83.83.E3.83.97.E3.82.A2.E3.83.83.E3.83.97_.28.E3.83.A1.E3.83.8B.E3.83.A5.E3.83.BC.E3.80.81.E3.82.B3.E3.83.B3.E3.83.86.E3.82.AD.E3.82.B9.E3.83.88.E3.83.A1.E3.83.8B.E3.83.A5.E3.83.BC.E3.80.81.E3.83.84.E3.83.BC.E3.83.AB.E3.83.81.E3.83.83.E3.83.97.E3.80.81.E3.83.91.E3.83.8D.E3.83.AB.29" name=".E3.83.9D.E3.83.83.E3.83.97.E3.82.A2.E3.83.83.E3.83.97_.28.E3.83.A1.E3.83.8B.E3.83.A5.E3.83.BC.E3.80.81.E3.82.B3.E3.83.B3.E3.83.86.E3.82.AD.E3.82.B9.E3.83.88.E3.83.A1.E3.83.8B.E3.83.A5.E3.83.BC.E3.80.81.E3.83.84.E3.83.BC.E3.83.AB.E3.83.81.E3.83.83.E3.83.97.E3.80.81.E3.83.91.E3.83.8D.E3.83.AB.29">ポップアップ (メニュー、コンテキストメニュー、ツールチップ、パネル)</h4> -<p>XUL のポップアップシステムは Firefox 3 で大幅に変更されました。ポップアップシステムには、メインメニュー、コンテキストメニュー、ポップアップパネルが含まれます。新しいシステムの仕組みについては <a href="/ja/XUL/PopupGuide" title="ja/XUL/PopupGuide">ポップアップの使用</a> ガイドをご覧ください。特筆すべき点は、<code>popup.<span id="m-showPopup"><code><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Method/showPopup">showPopup</a></code></span></code> が非推奨となり、新しい <code>popup.<span id="m-openPopup"><code><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Method/openPopup">openPopup</a></code></span></code> と <code>popup.<span id="m-openPopupAtScreen"><code><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Method/openPopupAtScreen">openPopupAtScreen</a></code></span></code> に置き換えられたことです。</p> +<p>XUL のポップアップシステムは Firefox 3 で大幅に変更されました。ポップアップシステムには、メインメニュー、コンテキストメニュー、ポップアップパネルが含まれます。新しいシステムの仕組みについては <a href="/ja/XUL/PopupGuide">ポップアップの使用</a> ガイドをご覧ください。特筆すべき点は、<code>popup.<span id="m-showPopup"><code><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Method/showPopup">showPopup</a></code></span></code> が非推奨となり、新しい <code>popup.<span id="m-openPopup"><code><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Method/openPopup">openPopup</a></code></span></code> と <code>popup.<span id="m-openPopupAtScreen"><code><a href="https://developer.mozilla.org/ja/docs/Mozilla/Tech/XUL/Method/openPopupAtScreen">openPopupAtScreen</a></code></span></code> に置き換えられたことです。</p> <h4 id=".E8.87.AA.E5.8B.95.E8.A3.9C.E5.AE.8C" name=".E8.87.AA.E5.8B.95.E8.A3.9C.E5.AE.8C">自動補完</h4> -<p><code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIAutoCompleteController" title="">nsIAutoCompleteController</a></code> インタフェースの <code><a href="/ja/NsIAutoCompleteController#handleEnter.28.29" title="ja/NsIAutoCompleteController#handleEnter.28.29">handleEnter()</a></code> メソッドは、テキストが自動補完ポップアップから選択されたか、ユーザが自分で入力した後 Enter キーを押したかを示す引数を受け付けるよう変更が行われました。</p> +<p><code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIAutoCompleteController" title="">nsIAutoCompleteController</a></code> インタフェースの <code><a href="/ja/NsIAutoCompleteController#handleEnter.28.29">handleEnter()</a></code> メソッドは、テキストが自動補完ポップアップから選択されたか、ユーザが自分で入力した後 Enter キーを押したかを示す引数を受け付けるよう変更が行われました。</p> <h4 id="DOMParser" name="DOMParser">DOMParser</h4> @@ -133,16 +133,16 @@ original_slug: Updating_extensions_for_Firefox_3 <li><code><a class="external" rel="freelink">chrome://browser/base/utilityOverlay.js</a></code> は、セキュリティ上の理由からサポートされなくなりました。これまでこのスクリプトを利用していた場合は、<code><a class="external" rel="freelink">chrome://browser/content/utilityOverlay.js</a></code> へ切り替えてください。</li> <li><code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIAboutModule" title="">nsIAboutModule</a></code> の実装には、<code>getURIFlags</code> メソッドのサポートが必要になりました。詳しくは <a href="https://dxr.mozilla.org/mozilla-central/source/netwerk/protocol/about/public/nsIAboutModule.idl" rel="custom">nsIAboutModule.idl</a> を参照してください。これは新しい <code>about:</code> URI を提供する拡張機能に影響します (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=337746" title='FIXED: [FIX]Move "safe about" hardcoding out of security manager'>バグ 337746</a>)。</li> <li><code><a href="/ja/docs/Mozilla/Tech/XUL/tabbrowser" title="tabbrowser">tabbrowser</a></code> 要素は「ツールキット」の一部ではなくなりました (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=339964" title="FIXED: move tabbrowser.xml out of mozilla/toolkit and into mozilla/browser">バグ 339964</a>)。このため、この要素は今後 XUL アプリケーションや拡張機能の中では利用できません。ただし、Firefox のメインウィンドウ (browser.xul) では今後も使われます。</li> - <li><a href="/ja/nsISupports_proxies" title="ja/nsISupports_proxies">nsISupports プロキシ</a> の変更と、おそらくスレッド関連インタフェースへの変更については、ドキュメントを用意する必要があります。</li> + <li><a href="/ja/nsISupports_proxies">nsISupports プロキシ</a> の変更と、おそらくスレッド関連インタフェースへの変更については、ドキュメントを用意する必要があります。</li> <li>XUL ファイル内で <code><?xml-stylesheet ?></code> などの XML 処理命令を用いている場合、<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=319654" title="FIXED: Processing instructions in XUL are not added to the content model">バグ 319654</a> で行われた以下の変更に注意してください。 <ol> <li>XML PI が XUL ドキュメントの DOM に追加されました。これは、<a href="/ja/docs/Web/API/Document/firstChild" title="この項目についての文書はまだ書かれていません。書いてみませんか？"><code>document.firstChild</code></a> が必ずしもルート要素を返すとは限らない、ということを意味します。スクリプト内でルートドキュメントを得るには、代わりに <a href="/ja/docs/Web/API/Document/documentElement" title="Document.documentElement は、その document のルート要素 (例えば、 HTML 文書の場合は <html> 要素) である Element を返します。"><code>document.documentElement</code></a> を用いてください。</li> <li><code><?xml-stylesheet ?></code> と <code><?xul-overlay ?></code> 処理命令は、ドキュメントの前文以外の場所に書かれた場合、動作しなくなりました。</li> </ol> </li> - <li><code>window.addEventListener("load", myFunc, true)</code> が、Web コンテンツが読み込まれた際 (ブラウザのページ読み込み時) に呼び出されなくなりました。これは、inner ウィンドウと outer ウィンドウの関係が変わったことによります (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=296639" title="FIXED: Split windows into an inner and outer object">バグ 296639</a>)。簡単な修正方法は、<a href="/ja/Code_snippets/Tabbed_browser#Detecting_page_load" title="ja/Code_snippets/Tabbed_browser#Detecting_page_load">ここ</a> に書かれているように <code>gBrowser.addEventListener("load", myFunc, true)</code> を使うことです。この方法は Firefox 2 でも有効です。</li> + <li><code>window.addEventListener("load", myFunc, true)</code> が、Web コンテンツが読み込まれた際 (ブラウザのページ読み込み時) に呼び出されなくなりました。これは、inner ウィンドウと outer ウィンドウの関係が変わったことによります (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=296639" title="FIXED: Split windows into an inner and outer object">バグ 296639</a>)。簡単な修正方法は、<a href="/ja/Code_snippets/Tabbed_browser#Detecting_page_load">ここ</a> に書かれているように <code>gBrowser.addEventListener("load", myFunc, true)</code> を使うことです。この方法は Firefox 2 でも有効です。</li> <li><code>content.window.getSelection()</code> は、文字列を返す、非推奨となった <code>content.document.getSelection()</code> とは異なり、オブジェクトを返します (<code>toString()</code> を使えば文字列に変換できます)。</li> - <li><code>event.preventBubble()</code> は Firefox 3 で非推奨となり、Firefox 3 で削除されました。Firefox 2 でも動作する <a href="/ja/DOM/event.stopPropagation" title="ja/DOM/event.stopPropagation"><code>event.stopPropagation()</code></a> を使ってください。</li> + <li><code>event.preventBubble()</code> は Firefox 3 で非推奨となり、Firefox 3 で削除されました。Firefox 2 でも動作する <a href="/ja/DOM/event.stopPropagation"><code>event.stopPropagation()</code></a> を使ってください。</li> <li><code>setTimeout()</code> を使って開始されるタイマーは、<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=52209" title="FIXED: JS timers can fire while a modal dialog is open">バグ 52209</a> のために行われた修正によって、モーダル形式のウィンドウではブロックされるようになりました。代わりに <code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsITimer" title="">nsITimer</a></code> を使ってください。</li> <li>信頼できないソース（例：Web サイト）が拡張のクロームにアクセスできるようにする必要がある場合は、新しい <a href="../../../../ja/Chrome_Registration#contentaccessible" rel="internal"><code>contentaccessible</code> フラグ</a> を使わなければなりません。</li> </ul> diff --git a/files/ja/orphaned/developing_add-ons/index.html b/files/ja/orphaned/developing_add-ons/index.html index 7cdb848269..2223fbf2a2 100644 --- a/files/ja/orphaned/developing_add-ons/index.html +++ b/files/ja/orphaned/developing_add-ons/index.html @@ -4,6 +4,6 @@ slug: orphaned/Developing_add-ons original_slug: Developing_add-ons --- <p>Mozilla ベースのソフトウェアはたいていアドオンを通して拡張可能です。アドオンには、拡張機能、プラグイン、テーマの 3 つの主なタイプがあります。このページはFirefox、Thunderbird、あるいは、Mozilla プラットフォームをベースにしたその他のソフトウェア向けのアドオンを作成するために必要となる情報、および、作成したアドオンを配布する方法のガイドを提供します。</p> -<table class="mainpage-table"> <tbody> <tr> <td colspan="2"> <h2 id="アドオンに関するトピックス">アドオンに関するトピックス</h2> </td> </tr> <tr> <td> <dl> <dt><a class="internal" href="/ja/Submitting_an_add-on_to_AMO" title="ja/Submitting an add-on to AMO">アドオンを AMO に提出する</a></dt> <dd>アドオン開発者がアドオンを正しくパッケージし配布するために助けとなる情報を提供します。このページには Mozilla のアドオン配布 Web サイトである addons.mozilla.org についての情報が含まれています。</dd> <dt><a class="internal" href="/ja/Extensions" title="ja/Extensions">拡張機能</a></dt> <dd>拡張機能は Firefox や SeaMonkey、Thunderbird のような Mozilla アプリケーションに新しい機能を追加します。ツールバーボタンから完全に新しい形態のものまであらゆるものを追加できます。</dd> <dt><a class="internal" href="/ja/Plugins" title="ja/Plugins">プラグイン</a></dt> <dd>Mozilla ベースのソフトウェアにネイティブでは扱えないコンテンツを表示させることを可能にさせるバイナリコンポーネントである、プラグインの作成方法についての情報。</dd> <dt><a class="internal" href="/ja/Jetpack" title="ja/Jetpack">Jetpack</a></dt> <dd>あらゆる人のためのブラウザ拡張開発システムです。Jetpack 開発者はモダンな web のツールである HTML と CSS、JavaScript を知っているだけで良いのです。</dd> </dl> </td> <td> <dl> <dt><a class="internal" href="/ja/Themes" title="ja/Themes">テーマ</a></dt> <dd>テーマはユーザに Mozilla ベースのアプリケーションによって提供されているユーザインターフェースの見た目をカスタマイズさせることを可能にします。</dd> <dt><a class="internal" href="/ja/Creating_OpenSearch_plugins_for_Firefox" title="ja/Creating OpenSearch plugins for Firefox">検索エンジンプラグイン</a></dt> <dd>Firefox は検索ボックスで異なる検索エンジンをサポートすることを可能にする検索エンジンプラグインをサポートしています。</dd> <dt><a class="internal" href="/ja/addons.mozilla.org_(AMO)_API_Developers'_Guide" title="ja/addons.mozilla.org (AMO) API Developers' Guide">addons.mozilla.org (AMO) API Developers' Guide</a></dt> <dd>AMO Developers' Guide は addons.mozilla.org からアドオンにつての情報を入手するための AMO API の利用方法を説明します。</dd> <dt><a href="/ja/The_Mozilla_platform" title="ja/The Mozilla platform">Mozilla プラットフォーム</a></dt> <dd>API および技術のすべて、また、それらをあなた自身のプロジェクトで利用する方法を含む、Mozilla プラットフォームについての情報。</dd> </dl> </td> </tr> </tbody> +<table class="mainpage-table"> <tbody> <tr> <td colspan="2"> <h2 id="アドオンに関するトピックス">アドオンに関するトピックス</h2> </td> </tr> <tr> <td> <dl> <dt><a class="internal" href="/ja/Submitting_an_add-on_to_AMO">アドオンを AMO に提出する</a></dt> <dd>アドオン開発者がアドオンを正しくパッケージし配布するために助けとなる情報を提供します。このページには Mozilla のアドオン配布 Web サイトである addons.mozilla.org についての情報が含まれています。</dd> <dt><a class="internal" href="/ja/Extensions">拡張機能</a></dt> <dd>拡張機能は Firefox や SeaMonkey、Thunderbird のような Mozilla アプリケーションに新しい機能を追加します。ツールバーボタンから完全に新しい形態のものまであらゆるものを追加できます。</dd> <dt><a class="internal" href="/ja/Plugins">プラグイン</a></dt> <dd>Mozilla ベースのソフトウェアにネイティブでは扱えないコンテンツを表示させることを可能にさせるバイナリコンポーネントである、プラグインの作成方法についての情報。</dd> <dt><a class="internal" href="/ja/Jetpack">Jetpack</a></dt> <dd>あらゆる人のためのブラウザ拡張開発システムです。Jetpack 開発者はモダンな web のツールである HTML と CSS、JavaScript を知っているだけで良いのです。</dd> </dl> </td> <td> <dl> <dt><a class="internal" href="/ja/Themes">テーマ</a></dt> <dd>テーマはユーザに Mozilla ベースのアプリケーションによって提供されているユーザインターフェースの見た目をカスタマイズさせることを可能にします。</dd> <dt><a class="internal" href="/ja/Creating_OpenSearch_plugins_for_Firefox">検索エンジンプラグイン</a></dt> <dd>Firefox は検索ボックスで異なる検索エンジンをサポートすることを可能にする検索エンジンプラグインをサポートしています。</dd> <dt><a class="internal" href="/ja/addons.mozilla.org_(AMO)_API_Developers'_Guide">addons.mozilla.org (AMO) API Developers' Guide</a></dt> <dd>AMO Developers' Guide は addons.mozilla.org からアドオンにつての情報を入手するための AMO API の利用方法を説明します。</dd> <dt><a href="/ja/The_Mozilla_platform">Mozilla プラットフォーム</a></dt> <dd>API および技術のすべて、また、それらをあなた自身のプロジェクトで利用する方法を含む、Mozilla プラットフォームについての情報。</dd> </dl> </td> </tr> </tbody> </table> <p>{{ languages( { "en": "en/Developing_add-ons", "zh-cn": "cn/Developing_add-ons"} ) }}</p> diff --git a/files/ja/orphaned/installing_extensions/index.html b/files/ja/orphaned/installing_extensions/index.html index 2451f21b18..bd870d9056 100644 --- a/files/ja/orphaned/installing_extensions/index.html +++ b/files/ja/orphaned/installing_extensions/index.html @@ -7,7 +7,7 @@ tags: original_slug: Installing_extensions --- <p>{{ Gecko_minversion_header(1.9) }}</p> -<p>toolkit ベースのアプリケーション（Firefox やその他の <a href="/ja/XULRunner" title="ja/XULRunner">XULRunner</a> を使用したアプリケーション）向けの拡張機能をインストールする機能をインストーラに持たせたい場合について、Gecko 1.9（Firefox 3）は Windows、Mac OS X、Linux 上でそれを簡単に行えるようにするための機能を提供します。Windows ユーザについては、当面の所は<a href="/ja/Adding_Extensions_using_the_Windows_Registry" title="ja/Adding_Extensions_using_the_Windows_Registry">レジストリを使って拡張機能をインストールする方法</a>も利用できます。</p> +<p>toolkit ベースのアプリケーション（Firefox やその他の <a href="/ja/XULRunner">XULRunner</a> を使用したアプリケーション）向けの拡張機能をインストールする機能をインストーラに持たせたい場合について、Gecko 1.9（Firefox 3）は Windows、Mac OS X、Linux 上でそれを簡単に行えるようにするための機能を提供します。Windows ユーザについては、当面の所は<a href="/ja/Adding_Extensions_using_the_Windows_Registry">レジストリを使って拡張機能をインストールする方法</a>も利用できます。</p> <p>現在、Mac OS X および Linux においては、ユーザのコンピュータ内のあらかじめ決められた位置のディレクトリに拡張機能をコピーするだけでよいです。</p> <p>この方法を通じてインストールされた拡張機能については、新しく作成された物・既に存在していた物を問わず、そのアプリケーションのすべてのプロファイルに対してインストールされる事に注意してください。</p> <h3 id="Windows" name="Windows">Windows</h3> diff --git a/files/ja/orphaned/localizing_extension_descriptions/index.html b/files/ja/orphaned/localizing_extension_descriptions/index.html index 184c1756de..06eaa77384 100644 --- a/files/ja/orphaned/localizing_extension_descriptions/index.html +++ b/files/ja/orphaned/localizing_extension_descriptions/index.html @@ -9,7 +9,7 @@ tags: original_slug: Localizing_extension_descriptions --- <h3 id="Gecko_1.9_.E3.81.AB.E3.81.8A.E3.81.91.E3.82.8B.E3.83.AD.E3.83.BC.E3.82.AB.E3.83.A9.E3.82.A4.E3.82.BA" name="Gecko_1.9_.E3.81.AB.E3.81.8A.E3.81.91.E3.82.8B.E3.83.AD.E3.83.BC.E3.82.AB.E3.83.A9.E3.82.A4.E3.82.BA">Gecko 1.9 におけるローカライズ</h3> -<p>Gecko 1.9 には、アドオンの説明や他のメタデータのローカライズに関して、新しく、より強力な方法が盛り込まれています。各言語の説明はすべて、<code>em:localized</code> プロパティを使って <a href="/ja/Install_Manifests" title="ja/Install_Manifests">install.rdf</a> ファイルに書かれます。<code>em:localized</code> それぞれが、情報が使われるべきロケールを示す <code>em:locale</code> プロパティを少なくとも 1 つと、そのロケールの様々な文字列を持ちます。以下の例はこのデモです (ほとんどの一般的なマニフェストプロパティは簡潔にするため削除してあります)。</p> +<p>Gecko 1.9 には、アドオンの説明や他のメタデータのローカライズに関して、新しく、より強力な方法が盛り込まれています。各言語の説明はすべて、<code>em:localized</code> プロパティを使って <a href="/ja/Install_Manifests">install.rdf</a> ファイルに書かれます。<code>em:localized</code> それぞれが、情報が使われるべきロケールを示す <code>em:locale</code> プロパティを少なくとも 1 つと、そのロケールの様々な文字列を持ちます。以下の例はこのデモです (ほとんどの一般的なマニフェストプロパティは簡潔にするため削除してあります)。</p> <pre><?xml version="1.0"?> <RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#" @@ -54,14 +54,14 @@ original_slug: Localizing_extension_descriptions <h3 id="Gecko_1.9_.E4.BB.A5.E5.89.8D.E3.81.AE.E3.83.AD.E3.83.BC.E3.82.AB.E3.83.A9.E3.82.A4.E3.82.BA" name="Gecko_1.9_.E4.BB.A5.E5.89.8D.E3.81.AE.E3.83.AD.E3.83.BC.E3.82.AB.E3.83.A9.E3.82.A4.E3.82.BA">Gecko 1.9 以前のローカライズ</h3> <p>Gecko 1.9 以前では、アドオン開発者は、Firefox や Thunderbird のようなツールキットベースのアプリケーションを対象とする拡張機能にローカライズされた説明を定義するためには以下のような特別な手順が必要でした。</p> <ul> - <li>もしあなたが <a href="/ja/Localizing_an_extension#Localizing_strings_in_JavaScript_code" title="ja/Localizing_an_extension#Localizing_strings_in_JavaScript_code">ローカライズしたプロパティファイル</a> を作っていないのであれば、それを作ってください。他言語が正しく表示されるように、(BOM なしの)UTF-8 エンコードを使うことを忘れないでください。</li> - <li>次の 1 行を、各言語のローカライズしたプロパティファイルに加えてください (EXTENSION_ID はあなたの拡張機能の ID (<a href="/ja/Install_Manifests" title="ja/Install_Manifests">install.rdf</a> の <code><em:id></code> にあります) に合わせてください。また、<var>LOCALIZED_DESCRIPTION</var> にはその言語での拡張機能の説明を入れてください)。 + <li>もしあなたが <a href="/ja/Localizing_an_extension#Localizing_strings_in_JavaScript_code">ローカライズしたプロパティファイル</a> を作っていないのであれば、それを作ってください。他言語が正しく表示されるように、(BOM なしの)UTF-8 エンコードを使うことを忘れないでください。</li> + <li>次の 1 行を、各言語のローカライズしたプロパティファイルに加えてください (EXTENSION_ID はあなたの拡張機能の ID (<a href="/ja/Install_Manifests">install.rdf</a> の <code><em:id></code> にあります) に合わせてください。また、<var>LOCALIZED_DESCRIPTION</var> にはその言語での拡張機能の説明を入れてください)。 <pre>extensions.EXTENSION_ID.description=LOCALIZED_DESCRIPTION</pre> </li> </ul> <ul> - <li>もしあなたが <a href="/ja/Building_an_Extension#Defaults_Files" title="ja/Building_an_Extension#Defaults_Files">デフォルト設定ファイル</a> を作っていないのであれば、それを作ってください。</li> - <li>次の 1 行を、デフォルト設定ファイルに加えてください (<var>EXTENSION_ID</var> は拡張機能の ID (<a href="/ja/Install_Manifests" title="ja/Install_Manifests">install.rdf</a> から)、<var>PATH_TO_LOCALIZATION_FILE</var> は上であなたが加えた、ローカライズしたプロパティファイルへの chrome パスです)。 + <li>もしあなたが <a href="/ja/Building_an_Extension#Defaults_Files">デフォルト設定ファイル</a> を作っていないのであれば、それを作ってください。</li> + <li>次の 1 行を、デフォルト設定ファイルに加えてください (<var>EXTENSION_ID</var> は拡張機能の ID (<a href="/ja/Install_Manifests">install.rdf</a> から)、<var>PATH_TO_LOCALIZATION_FILE</var> は上であなたが加えた、ローカライズしたプロパティファイルへの chrome パスです)。 <pre>pref("extensions.EXTENSION_ID.description", "PATH_TO_LOCALIZATION_FILE");</pre> </li> </ul> diff --git a/files/ja/orphaned/mcd/index.html b/files/ja/orphaned/mcd/index.html index b992797d81..7283dca2de 100644 --- a/files/ja/orphaned/mcd/index.html +++ b/files/ja/orphaned/mcd/index.html @@ -20,8 +20,8 @@ original_slug: MCD ガイド</dt> </dl> <ul> - <li><a href="/ja/MCD/Getting_Started" title="ja/MCD/Getting_Started">Getting Started with MCD</a></li> - <li><a href="/ja/MCD,_Mission_Control_Desktop_AKA_AutoConfig" title="ja/MCD,_Mission_Control_Desktop_AKA_AutoConfig">MCD, Mission Control Desktop AKA AutoConfig</a></li> + <li><a href="/ja/MCD/Getting_Started">Getting Started with MCD</a></li> + <li><a href="/ja/MCD,_Mission_Control_Desktop_AKA_AutoConfig">MCD, Mission Control Desktop AKA AutoConfig</a></li> </ul> </td> <td> diff --git a/files/ja/orphaned/monitoring_http_activity/index.html b/files/ja/orphaned/monitoring_http_activity/index.html index 9af1d8ca31..0a407cc847 100644 --- a/files/ja/orphaned/monitoring_http_activity/index.html +++ b/files/ja/orphaned/monitoring_http_activity/index.html @@ -34,7 +34,7 @@ activityDistributor.addObserver(httpObserver); <h2 id="アクティビティを観察する">アクティビティを観察する</h2> <p>観察可能なクラスは2つあります： ソケットレベルで発生するものと、HTTPトランザクションレベルで発生するものです。</p> <h3 id="観察可能なソケットのアクティビティ">観察可能なソケットのアクティビティ</h3> -<p>{{ interface("nsIHttpActivityDistributor") }} メソッドに報告され<code>た </code>アクティビティが <code>ACTIVITY_TYPE_SOCKET_TRANSPORT</code> の場合、発生したアクティビティの詳細な型を示すアクティビティサブタイプは <a href="/ja/XPCOM_Interface_Reference/nsISocketTransport#nsITransportEventSink.0a_status_codes" title="ja/XPCOM Interface Reference/nsISocketTransport#nsITransportEventSink.0a status codes">socket transport status code</a> となります。</p> +<p>{{ interface("nsIHttpActivityDistributor") }} メソッドに報告され<code>た </code>アクティビティが <code>ACTIVITY_TYPE_SOCKET_TRANSPORT</code> の場合、発生したアクティビティの詳細な型を示すアクティビティサブタイプは <a href="/ja/XPCOM_Interface_Reference/nsISocketTransport#nsITransportEventSink.0a_status_codes">socket transport status code</a> となります。</p> <h3 id="観察可能な_HTTP_のアクティビティ">観察可能な HTTP のアクティビティ</h3> <p>アクティビティタイプ が <code>ACTIVITY_TYPE_HTTP_TRANSACTION の場合</code>、アクティビティサブタイプは <a href="/en/nsIHttpActivityObserver#Activity_subtype_constants" title="en/nsIHttpActivityObserver#Activity subtype constants">activity subtype 定数</a> のうちの1つとなります。これらは送信されるHTTPリクエストヘッダやボディ、受信するHTTPヘッダなどを含むHTTPトランザクション全体を観察するための機能も含みます。</p> <h2 id="参照">参照</h2> diff --git a/files/ja/orphaned/monitoring_wifi_access_points/index.html b/files/ja/orphaned/monitoring_wifi_access_points/index.html index 2a07703194..41e2b09236 100644 --- a/files/ja/orphaned/monitoring_wifi_access_points/index.html +++ b/files/ja/orphaned/monitoring_wifi_access_points/index.html @@ -4,7 +4,7 @@ slug: orphaned/Monitoring_WiFi_access_points original_slug: Monitoring_WiFi_access_points --- <p>{{ gecko_minversion_header("1.9.1") }}</p> -<p>UniversalXPConnect 特権を用いたコードを利用することで、周囲の WiFi アクセスポイントの SSID 、 MAC アドレス、信号強度の一覧を取得することができます。この機能は、主に WiFi 情報に基づいた <a class="internal" href="/Ja/Using_geolocation" title="Ja/Using geolocation">geolocation</a> サービスのために導入されました。</p> +<p>UniversalXPConnect 特権を用いたコードを利用することで、周囲の WiFi アクセスポイントの SSID 、 MAC アドレス、信号強度の一覧を取得することができます。この機能は、主に WiFi 情報に基づいた <a class="internal" href="/Ja/Using_geolocation">geolocation</a> サービスのために導入されました。</p> <h2 id="例">例</h2> <p>この例では、利用可能なアクセスポイントの一覧を出力します。</p> <div class="note"><strong>注意:</strong> wiki の仕様上、 21 行目の表示がおかしくなることがあります。最初の "dd" は単純に "d" ですが、どういうわけか余分な1文字が付いてしまうようです。</div> diff --git a/files/ja/orphaned/mozmill/index.html b/files/ja/orphaned/mozmill/index.html deleted file mode 100644 index 59dadee8ad..0000000000 --- a/files/ja/orphaned/mozmill/index.html +++ /dev/null @@ -1,48 +0,0 @@ ---- -title: Mozmill -slug: orphaned/Mozmill -tags: - - MozMill -original_slug: Mozmill ---- -<p>MozMill はテストツールであり、Gecko ベースのアプリケーション (Firefox, Thunderbird, Songbird 等) の自動テストを書くためのフレームワークです。これは、<a class="link-https" href="https://addons.mozilla.org/ja/firefox/addon/9018">拡張機能</a> としてビルドされており、IDE (integrated development environment) も含まれています。また、<a class="external" href="http://pypi.python.org/pypi?%3Aaction=search&term=mozmill&submit=search" title="http://pypi.python.org/pypi?:action=search&term=mozmill&submit=search">コマンドライン版のクライアント</a>もあり、テストを書いたり実行したり、テストのデバッグの助けにもなります。MozMill には、ユーザとの対話をシミュレートする機能的なテストを書く助けとなる、大規模な API が用意されています。同様に、完全な <a class="internal" href="/ja/Mozmill/Mozmill_Unit_Test_Framework" title="ja/Mozmill Tests/Mozmill Unit Test Framework">ユニットテスト API</a> もあります。</p> -<p><a class="link-https" href="https://wiki.mozilla.org/QA/Mozmill_Test_Automation">Mozmill テスト自動化プロジェクト</a> は、2009 年 1 月に開始され、Firefox のための自動テスト作業をカバーしています。<a class="link-https" href="https://wiki.mozilla.org/QA/Mozmill_Test_Automation">プロジェクトのページ</a>をご覧になるか、<a href="/ja/Mozmill_Tests" title="ja/Mozmill Tests">Mozmill Tests</a> のドキュメントを見て、テスト書きへの貢献や MozMill テストの実行についてのイメージをつかんでください。既存のテストは、新しい Firefox のリリースのための <a href="/ja/Mozmill/Release_Testing" title="ja/Mozmill/Release Testing">リリーステスト</a>のサイクルで実行されます。</p> -<p>また、Mozilla Messaging チームには、<a href="/ja/Thunderbird/Thunderbird_MozMill_Testing" title="ja/Thunderbird/Thunderbird MozMill Testing">MozMill による Thunderbird のテスト</a>を扱うアクティブなプロジェクトがあります。</p> -<h2 id="インストール">インストール</h2> -<p>Mozmill は、2 通りの異なる方法でインストールできます。多くの場合は、add-ons.mozilla.org からダウンロードできる <a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/9018" title="https://addons.mozilla.org/en-US/firefox/addon/9018">Mozmill Extension</a> をお勧めします。この拡張機能には統合された開発環境といくつかのオーサリングツール、テストを実行するためのグラフィカルなインタフェースが含まれています。<a href="/ja/Mozmill_Tests#Run_Mozmill_restart_tests" title="https://developer.mozilla.org/ja/Mozmill_Tests#Run_Mozmill_restart_tests">再起動テスト</a>とオペレーティングシステムの対話に興味のある上級ユーザには、python <a class="external" href="http://pypi.python.org/pypi/pip">pip</a> (or <a class="external" href="http://pypi.python.org/pypi/setuptools">setuptools</a>) パッケージインストーラを使用した <a class="external" href="http://pypi.python.org/pypi?%3Aaction=search&term=mozmill&submit=search" title="http://pypi.python.org/pypi?:action=search&term=mozmill&submit=search">コマンドライン版のクライアント</a> のインストールをお勧めします。</p> -<h3 id="拡張機能版">拡張機能版</h3> -<p>拡張機能版をインストールするには、アドオンマネージャの "アドオンを入手" タブを開いて Mozmill を検索し、インストールするだけです。<a class="link-https" href="https://addons.mozilla.org/ja/firefox/addon/9018">addons.mozilla.org</a> の Web サイトから直接インストールすることもできます。アプリケーションを再起動してインストールを完了してください。</p> -<h3 id="コマンドライン版のクライアント">コマンドライン版のクライアント</h3> -<p>コマンドライン版の MozMill をインストールするには、さらにいくつかの手順が必要になります。この手順はオペレーティングシステムにより多少異なります。</p> -<h4 id="Windows">Windows</h4> -<p>MozMill の前に、MozillaBuildSetup パッケージをシステムにインストールしてください。このパッケージの <a class="external" href="http://ftp.mozilla.org/pub/mozilla.org/mozilla/libraries/win32/MozillaBuildSetup-Latest.exe">最新ビルド</a>を入手し、手動でインストールしてください。l10n.bat ファイルを実行した後、MozMill コマンドライン版のクライアントをインストールしてください。</p> -<pre><code>$ easy_install pip -$ pip install mozmill -$ pip install mercurial (Visual Studio がインストールされていない環境では、この <a href="http://hg.mozilla.org/qa/mozmill-automation/raw-file/tip/setup/py25.reg">レジストリファイル</a> をダウンロードして適用し、<a href="http://people.mozilla.com/~hskupin/mozmill-crowd/mozmill-windows.zip">MozMill のバイナリパッケージ</a> を手動でインストール (setup ファイルまたは setup.cmd をコマンドプロンプトで実行) してください。) -</code></pre> -<h4 id="Mac_OS_X">Mac OS X</h4> -<p>Mac OS X 10.4 の環境の場合は、先に <a class="external" href="http://python.org/download/">python.org</a> から Python 2.5 以降のバージョンをダウンロードしてインストールする必要があります。その後、MozMill を setuptools でインストールしてください。</p> -<pre><code>$ curl -O http://peak.telecommunity.com/dist/ez_setup.py</code> -<code>$ sudo python ez_setup.py -$ sudo easy_install pip</code> -$ sudo pip install mozmill mercurial -</pre> -<h4 id="Ubuntu">Ubuntu</h4> -<p>MozMill を Ubuntu にインストールするには、ターミナルで次の 2 つのコマンドを実行するだけです:</p> -<pre>$ sudo apt-get install python-pip python-dev -$ sudo pip install mozmill mercurial</pre> -<h2 id="MozMill_の更新">MozMill の更新</h2> -<p>MozMill を拡張機能としてインストールした場合は、新しいバージョンがリリースされた時に、アプリケーションから自動的に通知されます。コマンドライン版のクライアントを更新するには、次のコマンドを実行してください (sudo は Windows 環境では不要です):</p> -<pre>$ sudo pip install --upgrade mozmill -</pre> -<h2 id="さらに読むべきもの">さらに読むべきもの</h2> -<p>他にも、いくつかの MozMill の概要を説明するページがあります。後で参照するため、これらのページをブックマークに追加しておくと良いでしょう。</p> -<ul> <li><a href="/ja/Mozmill/First_Steps/Tutorial:_Introduction_to_Mozmill" title="ja/Mozmill Tests/Tutorial: Introduction to Mozmill">Introduction to Mozmill</a> - 必要な MozMill の各 API オブジェクトの詳細なチュートリアル</li> <li><a href="/ja/Mozmill_Tests" title="https://developer.mozilla.org/ja/Mozmill_Tests">Mozmill tests</a> - コマンドラインから MozMill を実行する方法</li> -</ul> -<h4 id="リファレンスデスク">リファレンスデスク</h4> -<ul> <li><a href="/ja/Mozmill/Mozmill_Controller_Object" title="ja/Mozmill/Mozmill Controller Object">controller object reference</a></li> <li><a href="/ja/Mozmill/Mozmill_Elements_Library_Object" title="ja/Mozmill/Mozmill Elements Library Object">elementslib object reference</a> (Mozmill 2.0 で非推奨 - <a href="/ja/Mozmill/Finding_Mozmill_Elements" title="Finding_Mozmill_Elements">finding mozmill elements</a> 参照)</li> <li><a href="/ja/Mozmill/Mozmill_Element_Object" title="element object reference">element object reference</a> (Mozmill 2.0+)</li> <li><a href="/ja/Mozmill/Finding_Mozmill_Elements" title="Finding Mozmill Elements">finding mozmill elements</a> (Mozmill 2.0+)</li> <li><a href="/ja/Mozmill/Mozmill_Base_Object_Interfaces" title="ja/Mozmill Tests/Mozmill Base Object Interfaces">mozmill object reference</a></li> <li><a href="/ja/Mozmill/Mozmill_Unit_Test_Framework" title="ja/Mozmill Tests/Mozmill Unit Test Framework">unit test API reference</a></li> <li><a href="/ja/Mozmill/Mozmill_Element_Object/Extending_the_MozMill_element_hierarchy" title="https://developer.mozilla.org/ja/Mozmill/Mozmill_Element_Object/Extending_Element_Hierarchy">extending the element hierarchy</a></li> -</ul> -<h2 id="バグ">バグ</h2> -<p>Mozmill は、Mozilla プロジェクト内の多くのテストシステムと同様に、開発段階にあります。バグを見つけたときは、<a class="link-https" href="https://bugzilla.mozilla.org/buglist.cgi?query_format=advanced&bug_status=UNCONFIRMED&bug_status=NEW&bug_status=ASSIGNED&bug_status=REOPENED&component=JSBridge&component=Mozmill&component=MozRunner&product=Testing" title="https://bugzilla.mozilla.org/buglist.cgi?query_format=advanced&bug_status=UNCONFIRMED&bug_status=NEW&bug_status=ASSIGNED&bug_status=REOPENED&component=JSBridge&component=Mozmill&component=MozRunner&product=Testing">既知のバグ</a> のリストですでに報告されていないか確認してください。まだ報告されていない場合は、"<code>Testing</code>" の製品カテゴリの "<code>Mozmill</code>" コンポーネント下に <a class="link-https" href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Testing">新たなバグとして報告</a>してください。バグ報告の際は、バグを再現するためのできるだけ詳細な情報と MozMill のテストを添付してください。よろしくお願いします！</p> -<div class="noinclude"> <p>{{ languages( { "en": "en/Mozmill" } ) }}</p> -</div> diff --git a/files/ja/orphaned/nsidomhtmlmediaelement/index.html b/files/ja/orphaned/nsidomhtmlmediaelement/index.html index 133e28a8aa..bebce9d830 100644 --- a/files/ja/orphaned/nsidomhtmlmediaelement/index.html +++ b/files/ja/orphaned/nsidomhtmlmediaelement/index.html @@ -5,7 +5,7 @@ original_slug: NsIDOMHTMLMediaElement --- <p></p> -<p><code>nsIDOMHTMLMediaElement</code> インターフェースは HTML 5 における <a class="internal" href="/Ja/HTML/Element/Audio" title="Ja/HTML/Element/Audio"><code>audio</code></a> および <a class="internal" href="/Ja/HTML/Element/Video" title="Ja/HTML/Element/Video"><code>video</code></a> 要素の実装に用いられています。</p> +<p><code>nsIDOMHTMLMediaElement</code> インターフェースは HTML 5 における <a class="internal" href="/Ja/HTML/Element/Audio"><code>audio</code></a> および <a class="internal" href="/Ja/HTML/Element/Video"><code>video</code></a> 要素の実装に用いられています。</p> <div class="note"><strong>注意:</strong> <code> cue ranges</code> 機能の仕様は現在流動的な状況にあり、 HTML 5 標準においては大幅に改訂が加えられるか、置き換えられてしまう可能性があります。そのため、現時点では Firefox ではこの機能に対応していません。</div> @@ -28,22 +28,22 @@ original_slug: NsIDOMHTMLMediaElement <table class="standard-table"> <tbody> <tr> - <td><code>void <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#addCueRange()" title="Ja/NsIDOMHTMLMediaElement#addCueRange()">addCueRange</a>(in DOMString className, in float start, in float end, in boolean pauseOnExit, in nsIDOMHTMLVoidCallback enterCallback, in nsIDOMHTMLVoidCallback exitCallback);</code></td> + <td><code>void <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#addCueRange()">addCueRange</a>(in DOMString className, in float start, in float end, in boolean pauseOnExit, in nsIDOMHTMLVoidCallback enterCallback, in nsIDOMHTMLVoidCallback exitCallback);</code></td> </tr> <tr> - <td><code>DOMString <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#canPlayType()" title="Ja/NsIDOMHTMLMediaElement#canPlayType()">canPlayType</a>(in DOMString type);</code></td> + <td><code>DOMString <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#canPlayType()">canPlayType</a>(in DOMString type);</code></td> </tr> <tr> - <td><code>void <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#load()" title="Ja/NsIDOMHTMLMediaElement#load()">load</a>();</code></td> + <td><code>void <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#load()">load</a>();</code></td> </tr> <tr> - <td><code>void <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#pause()" title="Ja/NsIDOMHTMLMediaElement#pause()">pause</a>();</code></td> + <td><code>void <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#pause()">pause</a>();</code></td> </tr> <tr> - <td><code>void <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#play()" title="Ja/NsIDOMHTMLMediaElement#play()">play</a>();</code></td> + <td><code>void <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#play()">play</a>();</code></td> </tr> <tr> - <td><code>void <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#removeCueRanges()" title="Ja/NsIDOMHTMLMediaElement#removeCueRanges()">removeCueRanges</a>(in DOMString className);</code></td> + <td><code>void <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#removeCueRanges()">removeCueRanges</a>(in DOMString className);</code></td> </tr> </tbody> </table> @@ -339,8 +339,8 @@ original_slug: NsIDOMHTMLMediaElement <h2 id="See_also" name="See_also">参考資料</h2> <ul> - <li><code><a class="internal" href="/Ja/HTML/Element/Video" title="Ja/HTML/Element/Video">video</a></code></li> - <li><a class="internal" href="/Ja/HTML/Element/Audio" title="Ja/HTML/Element/Audio"><code>audio</code></a></li> - <li><a class="internal" href="/Ja/HTML/Element/Source" title="Ja/HTML/Element/Source"><code>source</code></a></li> - <li><a class="internal" href="/Ja/Using_audio_and_video_in_Firefox" title="Ja/Using audio and video in Firefox">Using audio and video in Firefox</a></li> + <li><code><a class="internal" href="/Ja/HTML/Element/Video">video</a></code></li> + <li><a class="internal" href="/Ja/HTML/Element/Audio"><code>audio</code></a></li> + <li><a class="internal" href="/Ja/HTML/Element/Source"><code>source</code></a></li> + <li><a class="internal" href="/Ja/Using_audio_and_video_in_Firefox">Using audio and video in Firefox</a></li> </ul> diff --git a/files/ja/orphaned/nsidynamiccontainer/index.html b/files/ja/orphaned/nsidynamiccontainer/index.html index cd637a460a..f88bfabae7 100644 --- a/files/ja/orphaned/nsidynamiccontainer/index.html +++ b/files/ja/orphaned/nsidynamiccontainer/index.html @@ -27,10 +27,10 @@ original_slug: nsIDynamicContainer <p>継承元: <a href="/en/nsISupports" title="en/nsISupports">nsISupports</a></p> <h2 id="メソッドの概要"><br> メソッドの概要</h2> -<p><code>void <a href="/ja/nsIDynamicContainer" title="ja/nsIDynamicContainer">onContainerNodeOpening</a>(in <a href="/en/nsINavHistoryContainerResultNode" title="en/nsINavHistoryContainerResultNode">nsINavHistoryContainerResultNode</a> aContainer, in <a href="/en/nsINavHistoryQueryOptions" title="en/nsINavHistoryQueryOptions">nsINavHistoryQueryOptions</a> aOptions);</code><br> - <code>void <a href="/ja/nsIDynamicContainer" title="ja/nsIDynamicContainer">onContainerNodeClosed</a>(in <a href="/en/nsINavHistoryContainerResultNode" title="en/nsINavHistoryContainerResultNode">nsINavHistoryContainerResultNode</a> aContainer);<br> - void <a href="/ja/nsIDynamicContainer" title="ja/nsIDynamicContainer">onContainerRemoving</a>(in long long aItemId);<br> - void <a href="/ja/nsIDynamicContainer" title="ja/nsIDynamicContainer">onContainerMoved</a>(in long long aItemId, in long long aNewParent, in long aNewIndex);</code></p> +<p><code>void <a href="/ja/nsIDynamicContainer">onContainerNodeOpening</a>(in <a href="/en/nsINavHistoryContainerResultNode" title="en/nsINavHistoryContainerResultNode">nsINavHistoryContainerResultNode</a> aContainer, in <a href="/en/nsINavHistoryQueryOptions" title="en/nsINavHistoryQueryOptions">nsINavHistoryQueryOptions</a> aOptions);</code><br> + <code>void <a href="/ja/nsIDynamicContainer">onContainerNodeClosed</a>(in <a href="/en/nsINavHistoryContainerResultNode" title="en/nsINavHistoryContainerResultNode">nsINavHistoryContainerResultNode</a> aContainer);<br> + void <a href="/ja/nsIDynamicContainer">onContainerRemoving</a>(in long long aItemId);<br> + void <a href="/ja/nsIDynamicContainer">onContainerMoved</a>(in long long aItemId, in long long aNewParent, in long aNewIndex);</code></p> <h2 id="メソッド">メソッド</h2> <h3 id="onContainerNodeOpening()">onContainerNodeOpening()</h3> <p>与えられたコンテナノードが新たにノードが作成されようとするときに呼ばれます。<br> @@ -82,7 +82,7 @@ original_slug: nsIDynamicContainer <p>与えられたコンテナが丁度移動されようとしているときに呼ばれます。bookkeepingを行う処理に備えて存在します。このメソッドはコンテナが移動された<strong>後に</strong>呼ばれます。</p> <h3 id="関連記事">関連記事</h3> <ul> - <li><a href="/ja/Places" title="ja/Places">Places</a></li> + <li><a href="/ja/Places">Places</a></li> <li><a href="/en/nsINavHistoryContainerResultNode" title="en/nsINavHistoryContainerResultNode">nsINavHistoryContainerResultNode</a></li> <li><a href="/en/nsINavHistoryQueryOptions" title="en/nsINavHistoryQueryOptions">nsINavHistoryQueryOptions</a></li> </ul> diff --git a/files/ja/orphaned/participating_in_the_mozilla_project/index.html b/files/ja/orphaned/participating_in_the_mozilla_project/index.html index fa46754515..7f2722c81b 100644 --- a/files/ja/orphaned/participating_in_the_mozilla_project/index.html +++ b/files/ja/orphaned/participating_in_the_mozilla_project/index.html @@ -5,9 +5,9 @@ original_slug: Participating_in_the_Mozilla_project --- <p>もしあなたが Mozilla プラットフォームに関連するコードでのバグの修正やその他の仕事を手伝うことに興味があるのなら、あなたに適切な方向を指し示すであろう文書がここで見つけられます。</p> <table class="mainpage-table"> <tbody> <tr> <td> <h2 id="ドキュメンテーショントピックス">ドキュメンテーショントピックス</h2> -<dl> <dt><a class="internal" href="/ja/Developer_Guide" title="ja/Mozilla developer guide">Mozilla 開発者ガイド</a><br> </dt> <dd>Mozilla のコードベースに貢献するための開発 Tips とガイド。</dd> <dt><a class="internal" href="/ja/Developer_Guide/Source_Code" title="Ja/Mozilla source code">Mozilla ソースコード</a><br> </dt> <dd>ダウンロードもしくはバージョン管理システムを通してMozilla のコードを手に入れる方法とあなたのコードをツリーに入れる方法についての情報。<br> </dd> <dt><a class="internal" href="/ja/Developer_Guide/Build_Instructions" title="Ja/Build Documentation">ビルドに関するドキュメンテーション</a><br> </dt> <dd>Firefox と Thunderbird を含む、Mozilla プロジェクトのビルド方法についての情報。<em>このページは内容の整理を必要としています。</em><br> </dd> <dt><a class="internal" href="/Ja/The_Mozilla_platform" title="Ja/The Mozilla platform">Mozilla プラットフォーム</a><br> </dt> <dd>Mozilla プラットフォームについての情報。その API 群と技術のすべて、そして、あなた自身のプロジェクトでそれらを利用する方法など。</dd> <dt><a class="internal" href="/Project:ja/How_to_Help" title="Project:ja/How to Help">Mozilla を文書化する</a> <br> </dt> <dd> Mozilla のためおよび開かれた Web のために私たちのドキュメンテーションの作成と改善に協力してください。</dd> <dt><a class="internal" href="/Ja/Debugging" title="Ja/Debugging">デバッグ</a><br> </dt> <dd>Mozilla のコードをデバッグするときに従うべき、役に立つTips とガイドライン。</dd> <dt><a class="internal" href="/ja/QA" title="Ja/QA">品質保証（QA)</a><br> </dt> <dd>テストおよびバグトラッキングについての情報。</dd> <dt><a class="internal" href="/ja/Localization" title="ja/Localization">ローカライゼーション</a><br> </dt> <dd>Mozilla プロジェクトやドキュメンテーションなどを複数の言語に翻訳することに関する情報。</dd> +<dl> <dt><a class="internal" href="/ja/Developer_Guide">Mozilla 開発者ガイド</a><br> </dt> <dd>Mozilla のコードベースに貢献するための開発 Tips とガイド。</dd> <dt><a class="internal" href="/ja/Developer_Guide/Source_Code">Mozilla ソースコード</a><br> </dt> <dd>ダウンロードもしくはバージョン管理システムを通してMozilla のコードを手に入れる方法とあなたのコードをツリーに入れる方法についての情報。<br> </dd> <dt><a class="internal" href="/ja/Developer_Guide/Build_Instructions">ビルドに関するドキュメンテーション</a><br> </dt> <dd>Firefox と Thunderbird を含む、Mozilla プロジェクトのビルド方法についての情報。<em>このページは内容の整理を必要としています。</em><br> </dd> <dt><a class="internal" href="/Ja/The_Mozilla_platform">Mozilla プラットフォーム</a><br> </dt> <dd>Mozilla プラットフォームについての情報。その API 群と技術のすべて、そして、あなた自身のプロジェクトでそれらを利用する方法など。</dd> <dt><a class="internal" href="/Project:ja/How_to_Help" title="Project:ja/How to Help">Mozilla を文書化する</a> <br> </dt> <dd> Mozilla のためおよび開かれた Web のために私たちのドキュメンテーションの作成と改善に協力してください。</dd> <dt><a class="internal" href="/Ja/Debugging">デバッグ</a><br> </dt> <dd>Mozilla のコードをデバッグするときに従うべき、役に立つTips とガイドライン。</dd> <dt><a class="internal" href="/ja/QA">品質保証（QA)</a><br> </dt> <dd>テストおよびバグトラッキングについての情報。</dd> <dt><a class="internal" href="/ja/Localization">ローカライゼーション</a><br> </dt> <dd>Mozilla プロジェクトやドキュメンテーションなどを複数の言語に翻訳することに関する情報。</dd> </dl></td> <td> <h2 id="ツール">ツール</h2> -<dl> <dt><a class="link-https" href="https://bugzilla.mozilla.org/" title="https://bugzilla.mozilla.org/">Bugzilla</a><br> </dt> <dd>Mozilla プロジェクトのための問題を追跡するために使われている <a class="internal" href="/ja/Bugzilla" title="ja/Bugzilla">Bugzilla</a> データベース。<br> </dd> <dt><a class="external" href="http://mxr.mozilla.org/" title="http://mxr.mozilla.org/">MXR</a><br> </dt> <dd>Web 上で Mozilla のソースコードレポジトリをブラウズ、検索できます。<br> </dd> <dt><a class="external" href="http://bonsai.mozilla.org/cvsqueryform.cgi" title="http://bonsai.mozilla.org/cvsqueryform.cgi">Bonsai</a><br> </dt> <dd><a class="internal" href="/ja/Bonsai" title="ja/Bonsai">Bonsai</a> ツールを使えば、レポジトリ上のどのファイルを誰が変更し、そして、いつそれがなされたのかを見つけられます。 <br> </dd> <dt><a class="external" href="http://tinderbox.mozilla.org/showbuilds.cgi" title="http://tinderbox.mozilla.org/showbuilds.cgi">Tinderbox</a><br> </dt> <dd><a class="internal" href="/ja/Tinderbox" title="ja/Tinderbox">Tinderbox</a> はツリーのステータス（現在ビルドが成功しているかどうか）を示します。作業ツリーでの作業を確実にするために、チェックインとチェックアウトの前にチェックしてください。</dd> <dt><a class="internal" href="/ja/Crash_reporting" title="Ja/Crash reporting">クラッシュトラッキング</a><br> </dt> <dd><a class="link-https" href="https://crash-reports.mozilla.com/reports" title="https://crash-reports.mozilla.com/reports">Socorro</a> および <a class="external" href="http://talkback-public.mozilla.org/search/start.jsp" title="http://talkback-public.mozilla.org/search/start.jsp">Talkback</a> クラッシュ報告システムについての情報。</dd> <dt><a class="external" href="http://graphs.mozilla.org/">パフォーマンストラッキング</a><br> </dt> <dd>Mozilla プロジェクトのパフォーマンス情報が見られます。</dd> <dt><a class="external" href="http://www.mozilla.org/community/developer-forums.html">開発者フォーラム</a><br> </dt> <dd>Mozilla の開発上の問題について話すことができるディスカッションフォーラムのトピック別リスト。<br> </dd> +<dl> <dt><a class="link-https" href="https://bugzilla.mozilla.org/" title="https://bugzilla.mozilla.org/">Bugzilla</a><br> </dt> <dd>Mozilla プロジェクトのための問題を追跡するために使われている <a class="internal" href="/ja/Bugzilla">Bugzilla</a> データベース。<br> </dd> <dt><a class="external" href="http://mxr.mozilla.org/" title="http://mxr.mozilla.org/">MXR</a><br> </dt> <dd>Web 上で Mozilla のソースコードレポジトリをブラウズ、検索できます。<br> </dd> <dt><a class="external" href="http://bonsai.mozilla.org/cvsqueryform.cgi" title="http://bonsai.mozilla.org/cvsqueryform.cgi">Bonsai</a><br> </dt> <dd><a class="internal" href="/ja/Bonsai">Bonsai</a> ツールを使えば、レポジトリ上のどのファイルを誰が変更し、そして、いつそれがなされたのかを見つけられます。 <br> </dd> <dt><a class="external" href="http://tinderbox.mozilla.org/showbuilds.cgi" title="http://tinderbox.mozilla.org/showbuilds.cgi">Tinderbox</a><br> </dt> <dd><a class="internal" href="/ja/Tinderbox">Tinderbox</a> はツリーのステータス（現在ビルドが成功しているかどうか）を示します。作業ツリーでの作業を確実にするために、チェックインとチェックアウトの前にチェックしてください。</dd> <dt><a class="internal" href="/ja/Crash_reporting">クラッシュトラッキング</a><br> </dt> <dd><a class="link-https" href="https://crash-reports.mozilla.com/reports" title="https://crash-reports.mozilla.com/reports">Socorro</a> および <a class="external" href="http://talkback-public.mozilla.org/search/start.jsp" title="http://talkback-public.mozilla.org/search/start.jsp">Talkback</a> クラッシュ報告システムについての情報。</dd> <dt><a class="external" href="http://graphs.mozilla.org/">パフォーマンストラッキング</a><br> </dt> <dd>Mozilla プロジェクトのパフォーマンス情報が見られます。</dd> <dt><a class="external" href="http://www.mozilla.org/community/developer-forums.html">開発者フォーラム</a><br> </dt> <dd>Mozilla の開発上の問題について話すことができるディスカッションフォーラムのトピック別リスト。<br> </dd> </dl></td> </tr> </tbody> </table> <p> {{ languages( { "en": "en/Participating_in_the_Mozilla_project"} ) }}</p> diff --git a/files/ja/orphaned/tools/add-ons/dom_inspector/index.html b/files/ja/orphaned/tools/add-ons/dom_inspector/index.html index 1d7222b299..cf4b6916f1 100644 --- a/files/ja/orphaned/tools/add-ons/dom_inspector/index.html +++ b/files/ja/orphaned/tools/add-ons/dom_inspector/index.html @@ -26,12 +26,12 @@ original_slug: DOM_Inspector <h2 id="Documentation" name="Documentation">ドキュメンテーション</h2> <dl> - <dt><a href="/ja/DOM_Inspector/Introduction_to_DOM_Inspector" title="ja/DOM_Inspector/Introduction_to_DOM_Inspector">DOM Inspector 入門</a></dt> + <dt><a href="/ja/DOM_Inspector/Introduction_to_DOM_Inspector">DOM Inspector 入門</a></dt> <dd>DOM Inspector を始めるのに役立つガイド付きのチュートリアルです。</dd> </dl> <dl> - <dt><a href="/ja/DOM_Inspector/DOM_Inspector_FAQ" title="ja/DOM_Inspector/DOM_Inspector_FAQ">DOM Inspector FAQ</a></dt> + <dt><a href="/ja/DOM_Inspector/DOM_Inspector_FAQ">DOM Inspector FAQ</a></dt> <dd><small>DOM Inspector に関するよくある質問への解答です。</small></dd> </dl> diff --git a/files/ja/orphaned/web/api/htmlorforeignelement/index.html b/files/ja/orphaned/web/api/htmlorforeignelement/index.html deleted file mode 100644 index 99197278cb..0000000000 --- a/files/ja/orphaned/web/api/htmlorforeignelement/index.html +++ /dev/null @@ -1,57 +0,0 @@ ---- -title: HTMLOrForeignElement -slug: orphaned/Web/API/HTMLOrForeignElement -tags: - - API - - HTML - - HTMLElement - - HTMLOrForeignElement - - Interface - - MathML - - MathMLElement - - Mixin - - Reference - - SVG - - SVGElement - - ミックスイン -translation_of: Web/API/HTMLOrForeignElement -original_slug: Web/API/HTMLOrForeignElement ---- -<div>{{APIRef("HTML DOM")}}{{Draft}}</div> - -<p><span class="seoSummary"><strong><code>HTMLOrForeignElement</code></strong> ミックスインは、 {{DOMxRef("HTMLElement")}}, {{DOMxRef("SVGElement")}}, {{DOMxRef("MathMLElement")}} の各インターフェイスで共通のいくつかの機能を説明します。</span>これらのインターフェイスは、もちろん、以下の列挙したものに加えたものに加えてもっと機能があります。</p> - -<div class="blockIndicator note"> -<p><strong>メモ</strong>: <code>HTMLOrForeignElement</code> はミックスインであり、インターフェイスではありません。実際に <code>HTMLOrForeignElement</code> 型のオブジェクトを生成することはできません。</p> -</div> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName("HTML WHATWG", "dom.html#htmlorsvgelement", '<code>HTMLOrForeignElement</code>')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("api.HTMLOrForeignElement")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{DOMxRef("HTMLElement")}}</li> - <li>{{DOMxRef("SVGElement")}}</li> - <li>{{DOMxRef("MathMLElement")}}</li> -</ul> diff --git a/files/ja/orphaned/web/api/indexeddb_api/basic_concepts_behind_indexeddb/index.html b/files/ja/orphaned/web/api/indexeddb_api/basic_concepts_behind_indexeddb/index.html deleted file mode 100644 index 5a65babc30..0000000000 --- a/files/ja/orphaned/web/api/indexeddb_api/basic_concepts_behind_indexeddb/index.html +++ /dev/null @@ -1,218 +0,0 @@ ---- -title: 基本的な概念 -slug: orphaned/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB -tags: - - Advanced - - IndexedDB - - concepts -translation_of: Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB -original_slug: Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB ---- -<p>{{DefaultAPISidebar("IndexedDB")}}</p> - -<div class="summary"> -<p><strong>IndexedDB</strong> は、ユーザーのブラウザー内にデータを永続的に保存する手段です。ネットワークの状態にかかわらず高度な問い合わせ機能を持つ ウェブアプリケーションを作成できますので、オンラインとオフラインの両方で動作するアプリケーションになります。IndexedDB は大量のデータを保存するアプリケーション (例えばレンタル店の DVD カタログ) や、動作するために持続的なインターネット接続が不要なアプリケーション (例えばメールクライアント、To-Do リスト、メモ帳) で役に立ちます。</p> -</div> - -<h2 id="About_this_document" name="About_this_document">このドキュメントについて</h2> - -<p>この概論では、IndexedDB の本質的な概念や用語について論じます。これにより全体像を示すとともに、重要な概念を説明します。</p> - -<p>以下の役に立つ項目があります:</p> - -<ul> - <li>IndexedDB の設計と構造の概観については、<a href="#concepts">重要な概念</a>を見てください。</li> - <li>IndexedDB の用語について詳しく学ぶには、<a href="#definitions">定義</a>の章をご覧ください。</li> - <li>API の使用方法に関する詳しいチュートリアルについては、<a href="/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB" title="IndexedDB/IndexedDB primer">IndexedDB を使用する</a>をご覧ください。</li> - <li>IndexedDB API のリファレンスドキュメントについては、メインページ <a href="/ja/docs/Web/API/IndexedDB_API">IndexedDB API</a> のサブページをご覧ください。IndexedDB で使用するオブジェクト型について記載しています。</li> - <li>ブラウザーがバックグラウンドでデータの保存を扱う方法について詳しくは、<a href="/ja/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria">ブラウザーのストレージ制限と削除基準</a>をご覧ください。</li> -</ul> - -<h2 id="Overview_of_IndexedDB" name="Overview_of_IndexedDB">IndexedDB の概要</h2> - -<p>IndexedDB では、"キー" でインデックス付けされたオブジェクトを保存および取り出すことができます。データベースに対して施したすべての変更は、トランザクションで発生します。たいていの Web ストレージ技術と同様に、IndexedDB も<a href="http://www.w3.org/Security/wiki/Same_Origin_Policy">同一生成元ポリシー</a>に従います。よって、保存済みデータは同一ドメイン内からアクセスできますが、異なるドメインにまたがってデータへアクセスすることはできません。</p> - -<p>IndexedDB は、<a href="/ja/docs/Web/API/Web_Workers_API/Using_web_workers" title="https://developer.mozilla.org/En/Using_web_workers">Web Workers</a> を含むほとんどの状況で使用できる<a href="/ja/docs/Web/API/IndexedDB_API#Asynchronous_API" title="IndexedDB#Asynchronous_API">非同期</a> API です。以前は Web Workers で使用するための<a href="/ja/docs/Web/API/IndexedDB_API#Synchronous_API" title="IndexedDB#Synchronous_API">同期</a> API も含まれていましたが、Web コミュニティが無関心であったために仕様から削除されました。</p> - -<p>IndexedDB と競合する仕様である WebSQL データベースがありましたが、W3C は 2010 年 11 月 18 日に非推奨にしました。IndexedDB も WebSQL もデータ保存の技術ですが、提供する機能が異なります。WebSQL データベースはリレーショナルデータベースシステムであるのに対して、IndexedDB はインデックス付きのテーブルシステムです。</p> - -<h2 id="concepts" name="concepts">重要な概念</h2> - -<p>ほかのタイプのデータベースを扱った経験から想定していることがあるなら、IndexedDB を扱うときにはそれを捨てましょう。そして、以下の重要な概念を覚えておいてください:</p> - -<ul> - <li> - <p><strong>IndexedDB データベースはキーと値のペアを保存します。</strong>値は複雑な構造のオブジェクトにすることができます。また、キーはそれらのオブジェクトのプロパティにすることができます。分類された一覧表だけでなく、高速検索のためにオブジェクトの任意のプロパティを使用するインデックスを作成することができます。</p> - </li> - <li> - <p><strong>IndexedDB はトランザクショナルデータベースモデルに基づいて構築されます。</strong>IndexedDB で行うことはすべて、<a href="#gloss_transaction">トランザクション</a>環境で発生します。IndexedDB API はインデックス、テーブル、カーソルなどを表す多くのオブジェクトを提供していますが、それらは個々のトランザクションに結びつけられています。よって、トランザクションの外部でコマンドを実行したりカーソルを開くことはできません。トランザクションには明確な存続期間がありますので、完了後にトランザクションを使おうとすると例外が発生します。また、トランザクションは自動コミットであり、手動コミットはできません。</p> - - <p>このトランザクションモデルは、ユーザーが同時に 2 つの異なるタブを使用して ウェブ アプリのインスタンスを 2 つ開いた場合に何が起きるかを考慮すると、とても役に立ちます。トランザクショナルな操作がなければ、2 つのインスタンスでお互いの変更点が干渉するでしょう。データベースのトランザクションについて詳しくない場合は、<a class="link-https" href="https://en.wikipedia.org/wiki/Database_transaction">Wikipedia の Database transaction の記事</a> (<a class="link-https" href="https://ja.wikipedia.org/wiki/%E3%83%88%E3%83%A9%E3%83%B3%E3%82%B6%E3%82%AF%E3%82%B7%E3%83%A7%E3%83%B3" title="トランザクション">日本語版</a>) をご覧ください。また、定義の章の<a href="#gloss_transaction">トランザクション</a>もご覧ください。</p> - </li> - <li> - <p><strong>IndexedDB API はほぼ非同期です。</strong>API はデータを戻り値として返しません。代わりに、コールバック関数を渡さなければなりません。同期的な方法でデータベースに値を "保存" したり、データベースから値を "取り出す" ことはありません。代わりに、データベースで実行する操作を "要求" します。操作が完了すると DOM イベントによって通知され、イベントの種類によって操作が成功したか失敗したかを知ることができます。これは、始めは若干複雑に聞こえますが、健全化対策が組み込まれています。また、<a href="/ja/docs/DOM/XMLHttpRequest" title="https://developer.mozilla.org/en/xmlhttprequest">XMLHttpRequest</a> が動作する方法と同様です。</p> - </li> - <li> - <p><strong>IndexedDB は多くのリクエストを使用します。</strong>リクエストは前述のとおり、成功または失敗の DOM イベントを受け取るオブジェクトです。これらは <code>onsuccess</code> および <code>onerror</code> プロパティを持っています。また、<code>addEventListener()</code> および <code>removeEventListener()</code> を呼び出すことができます。さらに、リクエストの状態を示すプロパティである <code>readyState</code>、<code>result</code>、<code>errorCode</code> を持っています。<code>result</code> プロパティはとりわけ魔法のようであり、リクエストを生成した方法に応じてさまざまなもの (例えば <code>IDBCursor</code> インスタンス、あるいはデータベースに挿入した値に対するキー) になります。</p> - </li> - <li> - <p><strong>IndexedDB は結果が使用可能であることを通知するために、DOM イベントを使用します。</strong>DOM イベントは必ず <code>type</code> プロパティを持っています (IndexedDB では、一般的に <code>"success"</code> または <code>"error"</code> が設定されます)。また、DOM イベントは <code>target</code> プロパティも持っており、イベントがどこで生じたかを示します。ほとんどの場合、イベントの <code>target</code> は、何らかのデータベース操作の実行結果として生成された <code>IDBRequest</code> オブジェクトです。成功イベントは伝播せず、またキャンセルできません。一方、エラーイベントは伝播しますし、キャンセルも可能です。エラーイベントはキャンセルしない限り、実行中のあらゆるトランザクションを中止させますので、とても重要です。</p> - </li> - <li> - <p><strong>IndexedDB はオブジェクト指向です。</strong>IndexedDB は、行と列の集合で表されるテーブルによるリレーショナルデータベースではありません。この重要かつ根本的な違いが、アプリケーションの設計や構築の方法に影響を与えます。</p> - - <p>伝統的なリレーショナルデータストアでは、データを示す行と、名前付きでデータの型を示す列の集合を保存するテーブルを持ちます。一方、IndexedDB はデータの型と、単に持続的な JavaScript オブジェクトを保存するためのオブジェクトストアを作成しなければなりません。それぞれのオブジェクトストアは問い合わせや反復処理を効率的に行うためのインデックスの集合を持つことができます。オブジェクト指向データベース管理システムについて詳しくない場合は、<a href="https://en.wikipedia.org/wiki/Object_database">Wikipedia の Object database の記事</a> (<a href="https://ja.wikipedia.org/wiki/%E3%82%AA%E3%83%96%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88%E3%83%87%E3%83%BC%E3%82%BF%E3%83%99%E3%83%BC%E3%82%B9" title="オブジェクトデータベース">日本語版</a>) をご覧ください。</p> - </li> - <li> - <p><strong>IndexedDB は Structured Query Language (<abbr>SQL</abbr>) を使用しません。</strong>IndexedDB はカーソルを生成するインデックスでクエリーを使用しており、結果セットで反復処理を行うために使用します。NoSQL システムについて詳しくない場合は、<a href="https://en.wikipedia.org/wiki/NoSQL">Wikipedia の NoSQL の記事</a> (<a href="https://ja.wikipedia.org/wiki/NoSQL" title="NoSQL">日本語版</a>) をご覧ください。</p> - </li> - <li> - <p><a name="origin"><strong>IndexedDB は同一生成元ポリシーに従います。</strong></a>生成元は、スクリプトを実行したドメイン、アプリケーション層プロトコル、ドキュメントの URL のポートです。それぞれの生成元が、自身に関連付けられたデータベースセットを持ちます。すべてのデータベースが、どの生成元に所属するかを識別する名称を持ちます。</p> - - <p>IndexedDB に与えられたセキュリティ境界は、アプリケーションが別の生成元のデータにアクセスできないようにします。例えば <a href="http://www.example.com/app/" rel="freelink">http://www.example.com/app/</a> のアプリやページは、同一生成元である <a href="http://www.example.com/dir/" rel="freelink">http://www.example.com/dir/</a> からデータを取り出すことができます。しかし、生成元が異なる <a href="http://www.example.com:8080/dir/" rel="freelink">http://www.example.com:8080/dir/</a> (ポートが異なる) や <a class="link-https" href="https://www.example.com/dir/" rel="freelink">https://www.example.com/dir/</a> (プロトコルが異なる) からデータを取り出すことはできません。</p> - - <div class="note"><strong>注記</strong>: サードパーティの window コンテンツ (例えば {{htmlelement("iframe")}} コンテンツ) は、ブラウザーで<a href="https://support.mozilla.org/kb/disable-third-party-cookies">サードパーティ Cookie を常に拒否する</a>ように設定していない限り、自身が組み込まれた生成元の IndexedDB ストアにアクセスできます ({{bug("1147821")}} をご覧ください)。</div> - </li> -</ul> - -<h2 id="definitions" name="definitions">定義</h2> - -<p>この章では、IndexedDB API で使用する用語について定義および説明します。</p> - -<h3 id="database" name="database">データベース</h3> - -<dl> - <dt><a name="gloss_database">データベース (database)</a></dt> - <dd>主に 1 個以上の<a href="#gloss_object_store" title="#gloss_object_store"><em>オブジェクトストア</em></a>で構成される、情報のリポジトリです。それぞれのデータベースが以下のものを持ちます: - <ul> - <li>名称。これは特定の生成元に所属するデータベースを識別しており、データベースの存続期間を通じて不変です。名称は任意の文字列値です (空文字列を含む)。</li> - <li> - <p>現在の<a href="#gloss_version"><em>バージョン</em></a>。始めにデータベースを生成したとき、バージョンは特に指定しない限り整数の 1 になります。それぞれのデータベースは、任意の時点でバージョンを 1 つだけ持ちます。</p> - </li> - </ul> - </dd> - <dt><a name="durable">永続性 (durable)</a></dt> - <dd> - <p>以前の Firefox では、IndexedDB に<strong>永続性</strong>がありました。つまり、読み書きトランザクションにおいて、{{domxref("IDBTransaction.oncomplete")}} が発生するのは、すべてのデータがディスク上に実際に書き込まれている（フラッシュされている）ことが保証されたときに限ります。</p> - - <p>Firefox 40 以降、IndexedDB トランザクションはパフォーマンスを向上させるために、永続性の保証を緩和しました ({{Bug("1112702")}} を参照)。これは IndexedDB をサポートする他のブラウザーと同じ動作です。この場合、{{Event("complete")}} イベントは OS がデータの書き込みを指示した時点で発生しますが、実際にはデータがディスク上に反映されていない可能性があります。これによりイベントをより早く発生させられますが、データをディスク上に反映する前に OS のクラッシュや電源断が発生するとトランザクション全体を失う危険性が若干あります。このような破壊的な事象はまれですので、ほとんどの利用者は心配する必要がないでしょう。</p> - - <div class="note"> - <p><strong>注記</strong>: Firefox では、何らかの理由 (例えば、後で再計算できない重要なデータを保存する) で永続性を保証したい場合は、実験的 (非標準) な <code>readwriteflush</code> モード ({{domxref("IDBDatabase.transaction")}} を参照) を使用してトランザクションを生成すると、<code>complete</code> イベントを発生させる前にディスクへの反映を強制させることができます。これは現在実験的な扱いであり、<code>about:config</code> で <code>dom.indexedDB.experimental</code> を <code>true</code> に設定した場合に限り使用できます。</p> - </div> - </dd> - <dt><a name="gloss_object_store">オブジェクトストア (object store)</a></dt> - <dd> - <p>データベースにデータを保存する仕組みです。オブジェクトストアはレコードを持続的に保持しており、これはキーと値のペアです。オブジェクトストア内のレコードは、<em><a href="#gloss_key">キー</a></em>によって昇順に整列して保存されています。</p> - - <p>すべてのオブジェクトストアは、データベース内で一意な名称を持たなければなりません。オブジェクトストアは、任意で<em><a href="#gloss_keygenerator">キージェネレーター</a></em>や<em><a href="#gloss_keypath">キーパス</a></em>を持つことができます。オブジェクトストアがキーパスを持つ場合は、<em><a href="#gloss_inline_key">インラインキー</a></em>を使用します。それ以外の場合は、<em><a href="#gloss_outofline_key">アウトオブラインキー</a></em>を使用します。</p> - - <p>オブジェクトストアのリファレンスドキュメントとして、{{domxref("IDBObjectStore")}} をご覧ください。</p> - </dd> - <dt><a name="gloss_version">バージョン (version)</a></dt> - <dd>始めにデータベースを生成したとき、バージョンは整数の 1 になります。それぞれのデータベースは、一度に 1 つのバージョンを持ちます。一度に複数のバージョンを持つことはできません。バージョンを変更する唯一の方法は、現在のバージョンより大きなバージョンでデータベースを開くことです。これは <a href="/ja/docs/Web/API/IDBVersionChangeRequest"><code>versionchange</code></a> <em>トランザクション</em>を開始して、<a href="/ja/docs/Web/Reference/Events/upgradeneeded_indexedDB"><code>upgradeneeded</code></a> イベントが発生します。データベースのスキーマを更新できる唯一の場所が、このイベントのハンドラ内です。</dd> - <dd>注記: この定義は<a href="http://dvcs.w3.org/hg/IndexedDB/raw-file/tip/Overview.html">直近の仕様書</a>で説明されており、最新のブラウザーのみ実装しています。古いブラウザーは非推奨かつ削除済みの <a href="/ja/docs/Web/API/IDBDatabase#setVersion()" title="IndexedDB/IDBDatabase#setVersion()"><code>IDBDatabase.setVersion()</code></a> メソッドを実装しています。</dd> - <dt><a name="gloss_database_connection">データベース接続 (database connection)</a></dt> - <dd><em><a href="#gloss_database">データベース</a></em>を開くことで生成される操作です。データベースは同時に複数の接続を持つことができます。</dd> - <dt><a name="gloss_transaction">トランザクション (transaction)</a></dt> - <dd> - <p>特定のデータベースで行う、原子性を持つデータアクセスやデータ変更の操作のセットです。これは、データベース内のデータと対話する手段です。実際は、データベース内のデータの読み取りや変更はトランザクション内で実施しなければなりません。</p> - - <p>書き込みトランザクションの<a href="#scope"><em>スコープ</em></a>が重ならない限り、ひとつのデータベース接続で同時に複数のアクティブなトランザクションが存在できます。トランザクションのスコープは生成時に定義され、トランザクションがどのオブジェクトストアと対話できるかや、トランザクションの持続期間にわたって保持し続けるかを示します。よって例えば、データベース接続で <code>flyingMonkey</code> オブジェクトストアのみ対象とするスコープを持つ書き込みトランザクションがすでに存在するとき、<code>unicornCentaur</code> オブジェクトストアや <code>unicornPegasus</code> オブジェクトストアをスコープで持つ別のトランザクションを開始できます。読み取りトランザクションは、スコープが重なっていても複数実行できます。</p> - - <p>トランザクションは持続期間が短いものを除き、長時間のトランザクションがストレージ資源をロックする状況から解放するために、ブラウザーが終了させることができます。トランザクションは中止させることができ、トランザクションによるデータベースの変更箇所はロールバックされます。また、開始するトランザクションや中止するトランザクションを待つ必要はありません。</p> - - <p>トランザクションには <code>readwrite</code>、<code>readonly</code>、<code>versionchange</code> の 3 つのモードがあります。オブジェクトストアやインデックスの生成および削除は、<a href="/ja/docs/Web/Reference/Events/versionchange_indexedDB"><code>versionchange</code></a> トランザクションを使用する場合に限り実行できます。トランザクションのタイプについて詳しくは、<a href="/ja/docs/Web/API/IndexedDB_API" title="https://developer.mozilla.org/en/IndexedDB">IndexedDB</a> のリファレンスをご覧ください。</p> - - <p>すべての操作はトランザクション内で発生しますので、トランザクションは IndexedDB の重要な概念です。トランザクションについて、特にバージョニングとの関係については、{{domxref("IDBTransaction")}} および関連ドキュメントをご覧ください。ここにリファレンスドキュメントもあります。</p> - </dd> - <dt><a name="gloss_request">リクエスト (request)</a></dt> - <dd>データベースの読み書きを実施する操作です。すべてのリクエストは、ひとつの読み取りまたは書き込みの操作を表します。</dd> - <dt><a name="gloss_index">インデックス (index)</a></dt> - <dd> - <p>インデックスは<em>参照先オブジェクトストア (referenced object store)</em>から呼び出されて、別のオブジェクトストアのレコードを検索するための特別なオブジェクトストアです。インデックスは持続的なキーと値のストレージであり、インデックスのレコードの値は、参照先オブジェクトストアのレコードのキーです。インデックス内のレコードは、参照先オブジェクトストアでレコードが挿入、更新、削除されるたびに、自動的に収集されます。インデックス内の各レコードは参照先オブジェクトストア内のレコードをひとつだけ示すことができますが、複数のインデックスが同一のオブジェクトストアを参照することもできます。オブジェクトストアが変更されると、そのオブジェクトストアを参照するすべてのインデックスが自動的に更新されます。</p> - - <p>代わりに、<a href="#gloss_key">キー</a>を使用してオブジェクトストア内のレコードを検索することもできます。</p> - - <p>インデックスの使用法について詳しくは、<a href="/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB#Using_an_index" title="IndexedDB/Using_IndexedDB#Using_an_index">IndexedDB を使用する</a>をご覧ください。インデックスのリファレンスドキュメントとして、<a href="/ja/docs/Web/API/IDBKeyRange" rel="internal">IDBKeyRange</a> をご覧ください。</p> - </dd> -</dl> - -<h3 id="key" name="key">キーと</h3> - -<dl> - <dt><a name="gloss_key">キー (key)</a></dt> - <dd> - <p>オブジェクトストアに保存された値は、このデータ値によって編成および取り出しされます。オブジェクトストアは<em><a href="#gloss_keygenerator">キージェネレーター</a></em>、<em><a href="#gloss_keypath">キーパス</a></em>、明示的に指定した値の、3 種類の生成源のいずれかからキーを得られます。キーは、自身の前にあるものより大きな数値を持つデータ型であることが必要です。オブジェクトストア内の各レコードはオブジェクトストア内で一意のキーを持たなければならず、オブジェクトストア内で複数のレコードが同じキーを持つことはできません。</p> - - <p>キーは <a href="/ja/docs/JavaScript/Reference/Global_Objects/String" title="JavaScript/Reference/Global_Objects/String">文字列</a>、<a href="/ja/docs/JavaScript/Reference/Global_Objects/Date" title="JavaScript/Reference/Global Objects/Date">date</a>、浮動小数点数値、<a href="/ja/docs/JavaScript/Reference/Global_Objects/Array" title="JavaScript/Reference/Global Objects/Array">配列</a>のいずれかの型を使用できます。配列では、キーは空の値から無限大までの範囲を使用できます。また、配列の中に配列を含めることができます。文字列または整数値のキーしか使用できないという条件はありません。</p> - - <p>代わりに、<em><a href="#gloss_index">インデックス</a>を使用してオブジェクトストア内のレコードを検索することもできます。</em></p> - </dd> - <dt><a name="gloss_keygenerator">キージェネレーター (key generator)</a></dt> - <dd>指定した順序で新たなキーを生成する仕組みです。オブジェクトストアがキージェネレーターを持たない場合は、保存するレコードのキーをアプリケーションが提供しなければなりません。ジェネレーターはストア間で共有しません。これはむしろブラウザーの実装の細部であり、Web 開発において実際にはキージェネレーターの生成やアクセスは行いません。</dd> - <dt><a name="gloss_inline_key">インラインキー (in-line key)</a></dt> - <dd>保存される値の一部として保存されるキーです。これは<em>キーパス</em>を使用して見つけます。インラインキーは、ジェネレーターを使用して生成できます。キーが生成されると、キーパスを使用してキーを値の中に保存したり、キーとして使用したりすることができます。</dd> - <dt><a name="gloss_outofline_key">アウトオブラインキー (out-of-line key)</a></dt> - <dd>保存する値とは別に保存されるキーです。</dd> - <dt><a name="gloss_keypath">キーパス (key path)</a></dt> - <dd>オブジェクトストアやインデックスのどこからブラウザーがキーを取り出すべきかを定義します。有効なキーパスは空文字列、JavaScript の識別子、ピリオドで区切られた複数の JavaScript の識別子、あるいはそれらを収めた配列のいずれかを含むことができます。空白を含むことはできません。</dd> - <dt><a name="gloss_value">値 (value)</a></dt> - <dd> - <p>それぞれのレコードは値を持っており、<a href="/ja/docs/JavaScript/Reference/Global_Objects/Boolean" rel="internal" title="JavaScript/Reference/Global_Objects/Boolean">論理値</a>、<a href="/ja/docs/JavaScript/Reference/Global_Objects/Number" rel="internal" title="JavaScript/Reference/Global_Objects/Number">数値</a>、<a href="/ja/docs/JavaScript/Reference/Global_Objects/String" title="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String">文字列</a>、<a href="/ja/docs/JavaScript/Reference/Global_Objects/Date" title="JavaScript/Reference/Global Objects/Date">date</a>、<a href="/ja/docs/JavaScript/Reference/Global_Objects/Object" title="JavaScript/Reference/Global Objects/Object">オブジェクト</a>、<a href="/ja/docs/JavaScript/Reference/Global_Objects/Array" rel="internal" title="JavaScript/Reference/Global_Objects/Array">配列</a>、<a href="/ja/docs/JavaScript/Reference/Global_Objects/RegExp" rel="internal" title="JavaScript/Reference/Global_Objects/RegExp">正規表現</a>、<a href="/ja/docs/JavaScript/Reference/Global_Objects/undefined" title="JavaScript/Reference/Global_Objects/undefined">undefined</a>、null を含む、JavaScript で表現可能なものをどれでも含むことができます。</p> - - <p>オブジェクトまたは配列を保存する場合は、それらのプロパティや値もまた、有効な値をどれでも持つことができます。</p> - - <p>また、<a href="/ja/docs/DOM/Blob" title="DOM/Blob">Blob</a> やファイルも保存可能です。<a href="http://dvcs.w3.org/hg/IndexedDB/raw-file/tip/Overview.html">仕様書</a> をご覧ください。</p> - </dd> -</dl> - -<h3 id="range" name="range">レンジとスコープ</h3> - -<dl> - <dt id="scope"><a id="gloss_scope" name="gloss_scope">スコープ (scope)</a></dt> - <dd>トランザクションの適用先であるオブジェクトストアやインデックスのセットです。読み取りのみのトランザクションのスコープは、同時に重ね合ったり実行することができます。一方、書き込みトランザクションのスコープは重ね合うことができません。同時に同一のスコープで複数のトランザクションを開始することはできますが、それらはキューに収められ、順番に実行されます。</dd> - <dt id="cursor"><a id="gloss_cursor" name="gloss_cursor">カーソル (cursor)</a></dt> - <dd><em>キーレンジ</em>に属する複数のレコードにわたって反復処理を行うための仕組みです。カーソルは、反復処理を行うインデックスやオブジェクトストアがどれかを示す source を持ちます。またレンジ内の位置や、レコードキーの順序について増加方向に移動しているか減少方向に移動しているかの情報も持ちます。カーソルのリファレンスドキュメントとして、<a href="/ja/docs/Web/API/IDBCursor">IDBCursor</a> や <a href="/ja/docs/Web/API/IDBCursorSync">IDBCursorSync</a> をご覧ください。</dd> - <dt id="key_range"><a id="gloss_keyrange" name="gloss_keyrange">キーレンジ (key range)</a></dt> - <dd> - <p>キーとして使用する、何らかのデータ型の連続的な区間です。キーまたはキーレンジを使用して、オブジェクトストアやインデックスからレコードを取り出すことができます。下限または上限を使用して、レンジを制限またはフィルターリングできます。例えばキーが x から y の間であるすべての値に対して、反復処理を行うことができます。</p> - - <p>キーレンジのリファレンスドキュメントとして、{{domxref("IDBKeyRange")}} をご覧ください。</p> - </dd> -</dl> - -<h2 id="limitations" name="limitations">制限</h2> - -<p>IndexedDB は、クライアントサイドのストレージが必要なほとんどのケースに対応します。しかし、以下のような一部のケースに対して設計されてはいません:</p> - -<ul> - <li>国際化対応の整列。あらゆる言語について、同じ方法で文字列を整列することはできないため、国際化対応の整列はサポートされていません。特定の国際化順序でデータをデータベースに保存することはできませんが、データベースから読み出したデータを自身で整列することはできます。ただし Firefox 43 より、実験的なフラグをを有効化することで<a href="/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB#Locale-aware_sorting">ロケール対応のソート</a>が可能になりました (現在は Firefox 限定)。</li> - <li>同期処理。API は、サーバーサイドのデータベースとの同期を考慮して設計されていません。クライアントサイドの IndexedDB とサーバーサードのデータベースで同期するように、コードを記述しなければなりません。</li> - <li>全文検索。API に、SQL の <code>LIKE</code> に相当するものは存在しません。</li> -</ul> - -<p>加えて、以下のような状況でブラウザーがデータベースを削除する場合があることを意識してください:</p> - -<ul> - <li>ユーザーが削除を要求した場合。Cookie、ブックマーク、保存されたパスワード、IndexedDB のデータを含む、Web サイト用に保存されたすべてのデータをユーザーが削除できる設定が多くのブラウザーに存在します。</li> - <li>ブラウザーがプライベートブラウジングモードである場合。"プライベートブラウジング" (Firefox) や "シークレット" (Chrome) といったモードを持つブラウザーがあります。セッションの終了時に、ブラウザーはすべてのデータベースを削除します。</li> - <li>ディスクまたはクォータの容量制限に達した場合。</li> - <li>データが破損した場合。</li> - <li>機能に対して互換性のない変更が施された場合。</li> -</ul> - -<p>正確な状況やブラウザーの機能は時間とともに変化しますが、ブラウザーベンダーの一般的な考え方は、可能な限りデータを維持するよう最大限に努力することです。</p> - -<h2 id="next" name="next">次のステップ</h2> - -<p>主要な概念を習得したら、より具体的なことを学べるようになります。API の使用方法に関するチュートリアルである、<a href="/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB" title="IndexedDB/IndexedDB primer">IndexedDB を使用する</a>をご覧ください。</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li><a href="http://www.w3.org/TR/IndexedDB/"><span style="direction: ltr;">Indexed Database API 仕様</span></a></li> - <li><a href="/ja/docs/Web/API/IndexedDB_API" title="IndexedDB">IndexedDB API リファレンス</a></li> - <li><a href="/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB" title="IndexedDB/Using IndexedDB">IndexedDB を使用する</a></li> - <li><a href="http://msdn.microsoft.com/scriptjunkie/gg679063.aspx">IndexedDB — The Store in Your Browser</a></li> -</ul> diff --git a/files/ja/orphaned/web/api/navigatorconcurrenthardware/hardwareconcurrency/index.html b/files/ja/orphaned/web/api/navigatorconcurrenthardware/hardwareconcurrency/index.html deleted file mode 100644 index e325f3ee41..0000000000 --- a/files/ja/orphaned/web/api/navigatorconcurrenthardware/hardwareconcurrency/index.html +++ /dev/null @@ -1,70 +0,0 @@ ---- -title: navigator.hardwareConcurrency -slug: orphaned/Web/API/NavigatorConcurrentHardware/hardwareConcurrency -translation_of: Web/API/NavigatorConcurrentHardware/hardwareConcurrency -original_slug: Web/API/NavigatorConcurrentHardware/hardwareConcurrency ---- -<p>{{APIRef("HTML DOM")}}</p> - -<p>{{AvailableInWorkers}}</p> - -<p><code><strong>navigator.hardwareConcurrency</strong></code> はユーザーのコンピューター上でスレッドを実行するために使用可能な論理プロセッサ数を返す読み取り専用のプロパティです。</p> - -<h2 id="構文">構文</h2> - -<pre class="syntaxbox"><em>logicalProcessors</em> = window.navigator.hardwareConcurrency -</pre> - -<h2 id="値">値</h2> - -<p>論理プロセッサのコア数を示す{{jsxref("Number")}}です。</p> - -<p>現代のコンピューターはCPUに複数の物理プロセッサのコアを持っています（通常は2コアか4コア）。しかし、通常それぞれの物理コアは高度なスケジューリング技術を用いて一度に複数スレッドを実行することができます。 したがって、例えば4コアのCPUは8個の<strong>論理プロセッサコア</strong>を提供することができます。論理プロセッサのコア数は、コンテキストスイッチを必要とせずに一度に効果的に実行できるスレッドの数を測定するために使用できます。</p> - -<p>しかしながら、ブラウザはより少ない論理コア数を報告することを選択することで、一度に実行できる{{domxref("Worker")}}の数をより正確に表すことがあります。したがって、この数値をユーザーのシステムのコア数の絶対的な測定値として扱わないようにしてください。</p> - -<h2 id="例">例</h2> - -<p>この例では、ブラウザが報告した論理プロセッサごとに{{domxref("Worker")}}が1つ作られ、新しいWorkerへの参照と、そのWorkerをまだ使用しているかどうかを示すBooleanの値を含むレコードを作っています。これらのオブジェクトは後で使用するために配列に順々に格納されています。後でリクエストを処理するために使うWorkerのプールを作っています。</p> - -<pre class="brush: js">let workerList = []; - -for (let i = 0; i < window.navigator.hardwareConcurrency; i++) { - let newWorker = { - worker: new Worker('cpuworker.js'), - inUse: false - }; - workerList.push(newWorker); -}</pre> - -<h2 id="仕様">仕様</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('HTML WHATWG', '#dom-navigator-hardwareconcurrency', 'navigator.hardwareConcurrency')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>Initial definition.</td> - </tr> - </tbody> -</table> - -<h2 id="ブラウザでの実装状況">ブラウザでの実装状況</h2> - -<div> - - -<p>{{Compat("api.NavigatorConcurrentHardware.hardwareConcurrency")}}</p> -</div> - -<h2 id="関連情報">関連情報</h2> - -<ul> - <li>{{domxref("Navigator")}}</li> - <li>{{domxref("WorkerNavigator")}}</li> -</ul> diff --git a/files/ja/orphaned/web/api/navigatorconcurrenthardware/index.html b/files/ja/orphaned/web/api/navigatorconcurrenthardware/index.html deleted file mode 100644 index 43e5ae1965..0000000000 --- a/files/ja/orphaned/web/api/navigatorconcurrenthardware/index.html +++ /dev/null @@ -1,72 +0,0 @@ ---- -title: NavigatorConcurrentHardware -slug: orphaned/Web/API/NavigatorConcurrentHardware -tags: - - API - - Concurrency - - HTML DOM - - Interface - - Navigator - - NavigatorCPU - - NavigatorConcurrentHardware - - NeedsBrowserCompatibility - - NeedsTranslation - - Reference - - Threading - - Threads - - TopicStub - - WorkerNavigator - - Workers -translation_of: Web/API/NavigatorConcurrentHardware -original_slug: Web/API/NavigatorConcurrentHardware ---- -<p>{{APIRef("HTML DOM")}}</p> - -<p>The <strong><code>NavigatorConcurrentHardware</code></strong> {{Glossary("mixin")}} adds to the {{domxref("Navigator")}} interface features which allow Web content to determine how many logical processors the user has available, in order to let content and Web apps optimize their operations to best take advantage of the user's CPU.</p> - -<p>{{AvailableInWorkers}}</p> - -<p>The number of <strong>logical processor cores</strong> is a way to measure the number of threads which can effectively be run at once without them having to share CPUs. Modern computers have multiple physical cores in their CPU (two or four cores is typical), but each physical core is also usually able to run more than one thread at a time using advanced scheduling techniques. So a four-core CPU may return 8. The browser may, however, choose to reduce the number in order to represent more accurately the number of {{domxref("Worker")}}s that can run at once</p> - -<h2 id="Properties">Properties</h2> - -<dl> - <dt>{{domxref("NavigatorConcurrentHardware.hardwareConcurrency")}} {{readonlyinline}}</dt> - <dd>Returns the number of logical processors which may be available to the user agent. This value is always at least 1, and will be 1 if the actual number of logical processors can't be determined.</dd> -</dl> - -<h2 id="Methods">Methods</h2> - -<p><em>The <code>NavigatorConcurrentHardware</code></em><em> mixin has no methods.</em></p> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML WHATWG', '#navigatorconcurrenthardware', 'NavigatorConcurrentHardware')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>Initial definition.</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - - - -<p>{{Compat("api.NavigatorConcurrentHardware")}}</p> - -<h2 id="See_also">See also</h2> - -<ul> - <li>{{domxref("Navigator")}}</li> - <li>{{domxref("WorkerNavigator")}}</li> -</ul> diff --git a/files/ja/orphaned/web/api/navigatorid/appcodename/index.html b/files/ja/orphaned/web/api/navigatorid/appcodename/index.html deleted file mode 100644 index 36f09b360f..0000000000 --- a/files/ja/orphaned/web/api/navigatorid/appcodename/index.html +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: window.navigator.appCodeName -slug: orphaned/Web/API/NavigatorID/appCodeName -tags: - - DOM - - DOM_0 - - Gecko - - Gecko DOM Reference -translation_of: Web/API/NavigatorID/appCodeName -original_slug: Web/API/NavigatorID/appCodeName ---- -<div> - {{ApiRef}}</div> -<h2 id="Summary" name="Summary">概要</h2> -<p>現在のブラウザの内部 "コード" ネームを返します。</p> -<h2 id="Syntax" name="Syntax">構文</h2> -<pre class="syntaxbox"><code>codeName = window.navigator.appCodeName</code></pre> -<ul> - <li><code>codeName</code> : ブラウザの内部名を表す文字列</li> -</ul> -<h2 id="Example" name="Example">例</h2> -<pre class="brush:js">console.log(window.navigator.appCodeName); -</pre> -<h2 id="Notes" name="Notes">注記</h2> -<p>Mozilla、Netscape 6、IE5 は全て、内部名に "Mozilla" を用いています。</p> -<h2 id="Specification" name="Specification">仕様</h2> -<p>{{DOM0()}}</p> diff --git a/files/ja/orphaned/web/api/navigatorid/appname/index.html b/files/ja/orphaned/web/api/navigatorid/appname/index.html deleted file mode 100644 index 450525027b..0000000000 --- a/files/ja/orphaned/web/api/navigatorid/appname/index.html +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: window.navigator.appName -slug: orphaned/Web/API/NavigatorID/appName -tags: - - DOM - - DOM_0 - - Gecko - - Gecko DOM Reference - - 要更新 -translation_of: Web/API/NavigatorID/appName -original_slug: Web/API/NavigatorID/appName ---- -<div> - {{ApiRef}}</div> -<h2 id="Summary" name="Summary">概要</h2> -<p>ブラウザの公式な名前を返します。</p> -<h2 id="Syntax" name="Syntax">構文</h2> -<pre class="syntaxbox"><code>appName = window.navigator.appName</code></pre> -<ul> - <li><code>appName</code> は、ブラウザの名前を表す文字列です。</li> -</ul> -<h2 id="Example" name="Example">例</h2> -<pre class="brush:js">dump(window.navigator.appName); -// NS6 のコンソールに "Navigator" を出力します。 -</pre> -<h2 id="Specification" name="Specification">仕様</h2> -<p>{{DOM0}}</p> diff --git a/files/ja/orphaned/web/api/navigatorid/index.html b/files/ja/orphaned/web/api/navigatorid/index.html deleted file mode 100644 index bea00f1477..0000000000 --- a/files/ja/orphaned/web/api/navigatorid/index.html +++ /dev/null @@ -1,75 +0,0 @@ ---- -title: NavigatorID -slug: orphaned/Web/API/NavigatorID -tags: - - API -translation_of: Web/API/NavigatorID -original_slug: Web/API/NavigatorID ---- -<p>{{APIRef("HTML DOM")}}</p> - -<p>The <code><strong>NavigatorID</strong></code> interface contains methods and properties related to the identity of the browser.</p> - -<p>There is no object of type <code>NavigatorID</code>, but other interfaces, like {{domxref("Navigator")}} or {{domxref("WorkerNavigator")}}, implement it.</p> - -<h2 id="Properties">Properties</h2> - -<p><em>The <code>NavigatorID</code></em><em> interface doesn't inherit any property.</em></p> - -<dl> - <dt>{{domxref("NavigatorID.appCodeName")}} {{readonlyInline}}{{deprecated_inline}}</dt> - <dd>Always returns <code>'Mozilla'</code>, on any browser. This property is kept only for compatibility purpose.</dd> - <dt>{{domxref("NavigatorID.appName")}} {{readonlyInline}} {{deprecated_inline}}</dt> - <dd>Returns the official name of the browser. Do not rely on this property to return the correct value.</dd> - <dt>{{domxref("NavigatorID.appVersion")}} {{readonlyInline}} {{deprecated_inline}}</dt> - <dd>Returns the version of the browser as a string. Do not rely on this property to return the correct value.</dd> - <dt>{{domxref("NavigatorID.platform")}} {{readonlyInline}} {{deprecated_inline}}</dt> - <dd>Returns a string representing the platform of the browser. Do not rely on this property to return the correct value.</dd> - <dt>{{domxref("NavigatorID.product")}} {{readonlyInline}} {{deprecated_inline}}</dt> - <dd>Always returns <code>'Gecko'</code>, on any browser. This property is kept only for compatibility purpose.</dd> - <dt>{{domxref("NavigatorID.userAgent")}} {{readonlyInline}}</dt> - <dd>Returns the user agent string for the current browser.</dd> -</dl> - -<h2 id="Methods">Methods</h2> - -<p><em>The </em><em><code>NavigatorID</code></em><em> interface doesn't inherit any method.</em></p> - -<dl> - <dt>{{domxref("NavigatorID.taintEnabled()")}} {{deprecated_inline()}}</dt> - <dd>Always returns <code>false</code>. JavaScript taint/untaint functions were removed in JavaScript 1.2. This method is only kept for compatibility purpose</dd> -</dl> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML WHATWG', '#navigatorid', 'NavigatorID')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>Added the <code>appCodeName</code> property and the <code>taintEnabled()</code> method, for compatibility purpose.</td> - </tr> - <tr> - <td>{{SpecName('HTML5 W3C', '#navigatorid', 'NavigatorID')}}</td> - <td>{{Spec2('HTML5 W3C')}}</td> - <td>Initial specification.</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - -<p>{{Compat("api.NavigatorID")}}</p> - -<h2 id="See_also">See also</h2> - -<ul> - <li>The {{domxref("Navigator")}} and {{domxref("WorkerNavigator")}} interfaces that implement it.</li> -</ul> diff --git a/files/ja/orphaned/web/api/navigatorid/platform/index.html b/files/ja/orphaned/web/api/navigatorid/platform/index.html deleted file mode 100644 index a369a1f12e..0000000000 --- a/files/ja/orphaned/web/api/navigatorid/platform/index.html +++ /dev/null @@ -1,66 +0,0 @@ ---- -title: NavigatorID.platform -slug: orphaned/Web/API/NavigatorID/platform -tags: - - API - - Navigator - - NavigatorID - - Property - - Reference - - platform -translation_of: Web/API/NavigatorID/platform -original_slug: Web/API/NavigatorID/platform ---- -<p>{{APIRef("HTML DOM")}}</p> - -<p>ブラウザーのプラットフォームを表す文字列を返します。仕様書ではブラウザーが常に空文字列を返すことを許可していますので、信頼できる答えを得るためにこのプロパティを頼らないようにしてください。</p> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox"><em>platform</em> = <em>navigator</em>.platform -</pre> - -<ul> - <li><code>platform</code> : 文字列 (例： "Win32" 、 "Linux i686" 、 "MacPPC" 、 "MacIntel" ...等)</li> -</ul> - -<h3 id="Value" name="Value">値</h3> - -<p>ブラウザーを実行しているプラットフォームを識別する {{domxref("DOMString")}}、あるいはブラウザーがプラットフォームの識別を断る (または識別できない) 場合は空文字列になります。<code>platform</code> は空文字列か、ブラウザーを実行しているプラットフォームを表す文字列でなければなりません。</p> - -<p>例: "<code>MacIntel</code>", "<code>Win32</code>", "<code>FreeBSD i386</code>", "<code>WebTV OS</code>"</p> - -<h2 id="Example" name="Example">例</h2> - -<pre class="brush:js">console.log(navigator.platform);</pre> - -<h2 id="Notes" name="Notes">注記</h2> - -<p>Chrome、Edge、Firefox 63 以降を含むほとんどのブラウザーは、64 ビット版の Windows で実行していても <code>"Win32"</code> を返します。Internet Explorer やバージョン 63 より前の Firefox は <code>"Win64"</code> を返します。</p> - -<p>Firefox は設定項目 <code>general.platform.override</code> で、このプロパティが返す値を上書きできます。</p> - -<h2 id="Specifications" name="Specifications">仕様</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">策定状況</th> - <th scope="col">コメント</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML WHATWG', '#dom-navigator-platform', 'NavigatorID.platform')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>初期定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> - - - -<p>{{Compat("api.NavigatorID.platform")}}</p> diff --git a/files/ja/orphaned/web/api/navigatorid/product/index.html b/files/ja/orphaned/web/api/navigatorid/product/index.html deleted file mode 100644 index 7c9649cf3d..0000000000 --- a/files/ja/orphaned/web/api/navigatorid/product/index.html +++ /dev/null @@ -1,39 +0,0 @@ ---- -title: window.navigator.product -slug: orphaned/Web/API/NavigatorID/product -tags: - - DOM - - DOM_0 - - Gecko - - Gecko DOM Reference -translation_of: Web/API/NavigatorID/product -original_slug: Web/API/NavigatorID/product ---- -<div> - {{ApiRef}}</div> -<h2 id="Summary" name="Summary">概要</h2> -<p>このプロパティは、現在のブラウザの製品名を返します。</p> -<h2 id="Syntax" name="Syntax">構文</h2> -<pre class="syntaxbox"><i>productName</i> = window.navigator.product -</pre> -<ul> - <li><code>productName</code> : 製品名を表す文字列</li> -</ul> -<h2 id="Example" name="Example">例</h2> -<pre class="brush:html"><script> -function prod() { - dt = document.getElementById("d"); - dt.innerHTML = window.navigator.product; -} -</script> - -<button onclick="prod();">product</button> -<div id="d"> </div> - -<!-- "Gecko" などの文字列が表示される --> -</pre> -<h2 id="Notes" name="Notes">注記</h2> -<p>製品名は、ユーザエージェント全体の文字列の一部（プラットフォームの直後）です。例えば、Netscape 6.1 を表すユーザエージェントでは、製品名は、"Gecko" であり、ユーザエージェント文字列全体は、次の通りです。</p> -<pre>Mozilla/5.0 (Windows; U; Win98; en-US; rv:0.9.2) Gecko/20010725 Netscape6/6.1</pre> -<h2 id="Specification" name="Specification">仕様</h2> -<p>{{DOM0}}</p> diff --git a/files/ja/orphaned/web/api/node/getuserdata/index.html b/files/ja/orphaned/web/api/node/getuserdata/index.html deleted file mode 100644 index 8c0a07a058..0000000000 --- a/files/ja/orphaned/web/api/node/getuserdata/index.html +++ /dev/null @@ -1,67 +0,0 @@ ---- -title: Node.getUserData() -slug: orphaned/Web/API/Node/getUserData -tags: - - API - - DOM - - Method - - Node - - Obsolete - - Reference - - メソッド -translation_of: Web/API/Node/getUserData -original_slug: Web/API/Node/getUserData ---- -<div>{{APIRef("DOM")}}{{obsolete_header}}</div> - -<p><code><strong>Node.getUserData()</strong></code> メソッドは、以前 {{domxref("Node.setUserData()")}} によってノードに設定されたすべてのユーザーデータを {{domxref("DOMUserData")}} 形式で返します。</p> - -<div class="note"> -<p><code>Node.setUserData</code> および {{domxref("Node.getUserData")}} メソッドはウェブコンテンツから利用できなくなりました。 {{domxref("Element.dataset")}} または <a href="/ja/docs/JavaScript/Reference/Global_Objects/WeakMap"><code>WeakMap</code></a> を代わりに利用することができます。</p> -</div> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox"><em>userData</em> = <em>someNode</em>.getUserData(<em>userKey</em>);</pre> - -<h3 id="Parameters" name="Parameters">引数</h3> - -<ul> - <li><code>userKey</code> は指定されたノードに関連付けられた特定のデータを選択するためのキーです。指定されたノードに複数のキーが、それぞれの値を所持して割り当てられている可能性があります。</li> -</ul> - -<h2 id="Example" name="Example">例</h2> - -<pre class="brush: js">var d = document.setUserData('key', 15, null); -console.log(document.getUserData('key')); // 15</pre> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('DOM3 Core', 'core.html#Node3-getUserData', 'Node.getUserData()')}}</td> - <td>{{Spec2('DOM3 Core')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("api.Node.getUserData")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{domxref("Node.setUserData()")}}</li> - <li>{{domxref("UserDataHandler")}}</li> - <li>{{domxref("DOMUserData")}}</li> -</ul> diff --git a/files/ja/orphaned/web/api/parentnode/append/index.html b/files/ja/orphaned/web/api/parentnode/append/index.html deleted file mode 100644 index 1206957c43..0000000000 --- a/files/ja/orphaned/web/api/parentnode/append/index.html +++ /dev/null @@ -1,143 +0,0 @@ ---- -title: ParentNode.append() -slug: orphaned/Web/API/ParentNode/append -tags: - - API - - DOM - - Method - - Node - - ParentNode - - Reference -translation_of: Web/API/ParentNode/append -original_slug: Web/API/ParentNode/append ---- -<p>{{APIRef("DOM")}}</p> - -<p><strong><code>ParentNode.append()</code></strong> メソッドは、{{domxref("Node")}} オブジェクト、または {{domxref("DOMString")}} オブジェクトのセットを <code>ParentNode</code> の最後に追加します。 {{domxref("DOMString")}} オブジェクトは {{domxref("Text")}} ノードと同等に挿入されます。</p> - -<p>{{domxref("Node.appendChild()")}} との違いは次の通りです。</p> - -<ul> - <li><code>ParentNode.append()</code> は {{domxref("DOMString")}} も追加することができますが、<code>Node.appendChild()</code> は{{domxref("Node")}} オブジェクトのみを受け付けます。</li> - <li><code>ParentNode.append()</code> は戻り値を持っていませんが、<code>Node.appendChild()</code> は追加された{{domxref("Node")}} オブジェクトを返します。</li> - <li><code>ParentNode.append()</code> は複数のノードや文字列を追加することができますが、<code>Node.appendChild()</code> 一つのノードだけしか追加することができせん。</li> -</ul> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox notranslate">// [Throws, Unscopable] -ParentNode.append(...<var>nodesOrDOMStrings</var>) // returns undefined -</pre> - -<h3 id="Parameters" name="Parameters">引数</h3> - -<dl> - <dt><code>nodes</code></dt> - <dd>追加する {{domxref("Node")}} または {{domxref("DOMString")}} オブジェクトのセット</dd> -</dl> - -<h3 id="Exceptions" name="Exceptions">例外</h3> - -<ul> - <li>{{domxref("HierarchyRequestError")}}: ノードを階層の特定の箇所に追加させることができません。</li> -</ul> - -<h2 id="Examples" name="Examples">例</h2> - -<h3 id="Appending_an_element" name="Appending_an_element">要素の追加</h3> - -<pre class="brush: js notranslate">let parent = document.createElement("div") -let p = document.createElement("p") -parent.append(p) - -console.log(parent.childNodes) // NodeList [ <p> ] -</pre> - -<h3 id="Appending_text" name="Appending_text">テキストの追加</h3> - -<pre class="brush: js notranslate">let parent = document.createElement("div") -parent.append("Some text") - -console.log(parent.textContent) // "Some text"</pre> - -<h3 id="Appending_an_element_and_text" name="Appending_an_element_and_text">要素とテキストの追加</h3> - -<pre class="brush: js notranslate">let parent = document.createElement("div") -let p = document.createElement("p") -parent.append("Some text", p) - -console.log(parent.childNodes) // NodeList [ #text "Some text", <p> ]</pre> - -<h3 id="ParentNode.append_is_unscopable" name="ParentNode.append_is_unscopable">ParentNode.append() はスコープが効かない</h3> - -<p><code>append()</code> メソッドは <code>with</code> 文の中ではスコープが効きません。詳しくは {{jsxref("Symbol.unscopables")}} をご覧ください。</p> - -<pre class="brush: js notranslate">let parent = document.createElement("div") - -with(parent) { - append("foo") -} -// ReferenceError: append is not defined </pre> - -<h2 id="Polyfill">Polyfill</h2> - -<p><code>append()</code> メソッドはInternet Explorer 9 以上であれば以下のコードでポリフィルを当てることができます。</p> - -<pre class="brush: js notranslate">// Source: https://github.com/jserz/js_piece/blob/master/DOM/ParentNode/append()/append().md -(function (arr) { - arr.forEach(function (item) { - if (item.hasOwnProperty('append')) { - return; - } - Object.defineProperty(item, 'append', { - configurable: true, - enumerable: true, - writable: true, - value: function append() { - var argArr = Array.prototype.slice.call(arguments), - docFrag = document.createDocumentFragment(); - - argArr.forEach(function (argItem) { - var isNode = argItem instanceof Node; - docFrag.appendChild(isNode ? argItem : document.createTextNode(String(argItem))); - }); - - this.appendChild(docFrag); - } - }); - }); -})([Element.prototype, Document.prototype, DocumentFragment.prototype]);</pre> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('DOM WHATWG', '#dom-parentnode-append', 'ParentNode.append()')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("api.ParentNode.append")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{domxref("ParentNode")}} および {{domxref("ChildNode")}}</li> - <li>{{domxref("ParentNode.prepend()")}}</li> - <li>{{domxref("Node.appendChild()")}}</li> - <li>{{domxref("ChildNode.after()")}}</li> - <li>{{domxref("Element.insertAdjacentElement()")}}</li> - <li>{{domxref("NodeList")}}</li> -</ul> diff --git a/files/ja/orphaned/web/api/parentnode/children/index.html b/files/ja/orphaned/web/api/parentnode/children/index.html deleted file mode 100644 index 537c91d1c6..0000000000 --- a/files/ja/orphaned/web/api/parentnode/children/index.html +++ /dev/null @@ -1,93 +0,0 @@ ---- -title: ParentNode.children -slug: orphaned/Web/API/ParentNode/children -tags: - - API - - Child - - Child Nodes - - DOM - - HTMLCollection - - Node - - ParentNode - - Property - - children -translation_of: Web/API/ParentNode/children -original_slug: Web/API/ParentNode/children ---- -<div>{{ APIRef("DOM") }}</div> - -<p>{{domxref("ParentNode")}} の <strong><code>children</code></strong> プロパティは、呼び出された際のノードの子{{domxref("Element", "要素", "", 1)}}ノードをすべて含んだ動的な（生きている） {{domxref("HTMLCollection")}} を返す、読み取り専用プロパティです。</p> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox notranslate">let <em>children</em> = <var>node</var>.children;</pre> - -<h3 id="Value" name="Value">値</h3> - -<p><em><code>node</code></em> の子の DOM要素の生きている順序付きコレクションの、 {{ domxref("HTMLCollection") }} です。コレクションの {{domxref("HTMLCollection.item()", "item()")}} メソッドか、JavaScript の配列スタイルの記法を使って、コレクション内の個々の子ノードにアクセスすることができます。</p> - -<p>ノードが子要素を持たない場合、 <code>children</code> は要素を含まず、<code>length</code> は <code>0</code> です。</p> - -<h2 id="Example" name="Example">例 </h2> - -<pre class="brush: js notranslate">const foo = document.getElementById('foo'); -for (let i = 0; i < foo.children.length; i++) { - console.log(foo.children[i].tagName); -}</pre> - -<h2 id="Polyfill" name="Polyfill">Polyfill</h2> - -<pre class="brush: js notranslate">// Overwrites native 'children' prototype. -// Adds Document & DocumentFragment support for IE9 & Safari. -// Returns array instead of HTMLCollection. -;(function(constructor) { - if (constructor && - constructor.prototype && - constructor.prototype.children == null) { - Object.defineProperty(constructor.prototype, 'children', { - get: function() { - let i = 0, node, nodes = this.childNodes, children = []; - while (node = nodes[i++]) { - if (node.nodeType === 1) { - children.push(node); - } - } - return children; - } - }); - } -})(window.Node || window.Element); -</pre> - -<h2 id="Specification" name="Specification">仕様</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">仕様</th> - <th scope="col">状態</th> - <th scope="col">コメント</th> - </tr> - <tr> - <td>{{SpecName('DOM WHATWG', '#dom-parentnode-children', 'ParentNode.children')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td>初めての定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> - -<p>{{Compat("api.ParentNode.children")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{domxref("ParentNode")}} および {{domxref("ChildNode")}} インターフェイス</li> - <li> - <div class="syntaxbox">このインターフェイスを実装する次のオブジェクトタイプ。{{domxref("Document")}}、{{domxref("Element")}}、 および {{domxref("DocumentFragment")}}</div> - </li> - <li> - <div class="syntaxbox">{{domxref("Node.childNodes")}}</div> - </li> -</ul> diff --git a/files/ja/orphaned/web/api/parentnode/index.html b/files/ja/orphaned/web/api/parentnode/index.html deleted file mode 100644 index 5d1ec6c97e..0000000000 --- a/files/ja/orphaned/web/api/parentnode/index.html +++ /dev/null @@ -1,93 +0,0 @@ ---- -title: ParentNode -slug: orphaned/Web/API/ParentNode -tags: - - API - - DOM - - Finding Elements - - Finding Nodes - - Interface - - Locating Elements - - Locating Nodes - - Managing Elements - - Managing Nodes - - Mixin - - Node - - ParentNode - - Reference - - Selectors -translation_of: Web/API/ParentNode -original_slug: Web/API/ParentNode ---- -<div>{{APIRef("DOM")}}</div> - -<p><span class="seoSummary"><code><strong>ParentNode</strong></code> ミックスインは、子を持つことができるすべての型の {{domxref("Node")}} オブジェクトに特有のメソッドやプロパティを含みます。</span>これは、{{domxref("Element")}} と {{domxref("Document")}}、{{domxref("DocumentFragment")}} オブジェクトに実装されています。</p> - -<p>対象のノードや要素を見つけるために<a href="/ja/docs/Web/CSS/CSS_Selectors">CSS セレクター</a>を使用する方法について、詳しくは<a href="/ja/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors">セレクタを使用した DOM 要素の指定</a>をご覧ください。</p> - -<h2 id="Properties" name="Properties">プロパティ</h2> - -<dl> - <dt>{{domxref("ParentNode.childElementCount")}} {{readonlyInline}}</dt> - <dd>オブジェクトが持つ子の数を表す <code>unsigned long</code> 値を返します。</dd> - <dt>{{domxref("ParentNode.children")}} {{readonlyInline}}</dt> - <dd>この <code>ParentNode</code> の子であるすべての {{domxref("Element")}} 型のオブジェクトを含む実際の {{domxref("HTMLCollection")}} を返します。要素ではないノードは省きます。</dd> - <dt>{{domxref("ParentNode.firstElementChild")}} {{readonlyInline}}</dt> - <dd>この <code>ParentNode</code> の最初の子である {{domxref("Element")}} を返します。存在しない場合は <code>null</code> を返す。</dd> - <dt>{{domxref("ParentNode.lastElementChild")}} {{readonlyInline}}</dt> - <dd>この <code>ParentNode</code> の最後の子である {{domxref("Element")}} を返します。存在しない場合は <code>null</code> を返す。</dd> -</dl> - -<h2 id="Methods" name="Methods">メソッド</h2> - -<dl> - <dt>{{domxref("ParentNode.append()")}} {{experimental_inline}}</dt> - <dd><code>ParentNode</code> の最後の子の後ろに、{{domxref("Node")}} オブジェクトまたは {{domxref("DOMString")}} オブジェクトのセットを挿入します。{{domxref("DOMString")}} オブジェクトは、同等の {{domxref("Text")}} ノードとして挿入されます。</dd> - <dt>{{domxref("ParentNode.prepend()")}} {{experimental_inline}}</dt> - <dd><code>ParentNode</code> の最初の子の前に、{{domxref("Node")}} オブジェクトまたは {{domxref("DOMString")}} オブジェクトのセットを挿入します。{{domxref("DOMString")}} オブジェクトは、同等の {{domxref("Text")}} ノードとして挿入されます。</dd> - <dt>{{domxref("ParentNode.querySelector()")}}</dt> - <dd>現在の要素をルートとして、指定したセレクターのグループにマッチする最初の {{domxref("Element")}} を返します。</dd> - <dt>{{domxref("ParentNode.querySelectorAll()")}}</dt> - <dd>現在の要素をルートとして、指定したセレクターのグループにマッチする要素のリストを表す {{domxref("NodeList")}} を返します。</dd> - <dt>{{domxref("ParentNode.replaceChildren()")}}</dt> - <dd>ノードの既存の子ノードを、指定した新しい子ノードのセットに入れ替えます。</dd> -</dl> - -<h2 id="Specification" name="Specification">仕様</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状況</th> - <th scope="col">コメント</th> - </tr> - <tr> - <td>{{SpecName('DOM WHATWG', '#parentnode', 'ParentNode')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td><code>ElementTraversal</code> インターフェイスを {{domxref("ChildNode")}} と {{domxref("ParentNode")}} に分割しました。{{domxref("ParentNode.firstElementChild")}} と {{domxref("ParentNode.lastElementChild")}}、{{domxref("ParentNode.childElementCount")}} プロパティは、後者で定義されていません。<br> - {{domxref("ParentNode.children")}} プロパティが追加されました。<br> - {{domxref("ParentNode.querySelector()")}}、{{domxref("ParentNode.querySelectorAll()")}}、{{domxref("ParentNode.append()")}}、{{domxref("ParentNode.prepend()")}} メソッドが追加されました。</td> - </tr> - <tr> - <td>{{SpecName('Element Traversal', '#interface-elementTraversal', 'ElementTraversal')}}</td> - <td>{{Spec2('Element Traversal')}}</td> - <td><code>ElementTraversal</code> 基本インターフェイスにこのプロパティの初期定義が追加され、{{domxref("Element")}} で使われます。</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> - - - -<p>{{Compat("api.ParentNode")}}</p> - -<h2 id="See_also" name="See_also">関連項目</h2> - -<ul> - <li>{{domxref("ChildNode")}} 基本インターフェース。</li> - <li> - <div class="syntaxbox">このミックスインを実装したオブジェクト型: {{domxref("Document")}} と {{domxref("Element")}}、{{domxref("DocumentFragment")}}。</div> - </li> -</ul> diff --git a/files/ja/orphaned/web/api/parentnode/prepend/index.html b/files/ja/orphaned/web/api/parentnode/prepend/index.html deleted file mode 100644 index 8c6c87cede..0000000000 --- a/files/ja/orphaned/web/api/parentnode/prepend/index.html +++ /dev/null @@ -1,143 +0,0 @@ ---- -title: ParentNode.prepend() -slug: orphaned/Web/API/ParentNode/prepend -tags: - - API - - DOM - - Method - - Node - - ParentNode - - Reference - - prepend -translation_of: Web/API/ParentNode/prepend -original_slug: Web/API/ParentNode/prepend ---- -<p>{{APIRef("DOM")}}</p> - -<p><strong><code>ParentNode.prepend()</code></strong> メソッドは、{{domxref("Node")}} オブジェクトまたは {{domxref("DOMString")}} オブジェクトのセットを {{domxref("ParentNode")}} の最初の子の前に挿入します。 {{domxref("DOMString")}} オブジェクトは、同等の {{domxref("Text")}} ノードとして挿入されます。</p> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox notranslate"><em>ParentNode</em>.prepend(<em>...nodesToPrepend</em>); -</pre> - -<h3 id="Parameters" name="Parameters">引数</h3> - -<dl> - <dt><code>nodesToPrepend</code></dt> - <dd>現在 <code>ParentNode</code> にある最初の子ノードの前に挿入する1つ以上のノード。各ノードは {{domxref("Node")}} オブジェクトまたは文字列として指定できます。文字列は新しい {{domxref("Text")}} ノードとして挿入されます。</dd> -</dl> - -<h3 id="Return_value" name="Return_value">返値</h3> - -<p><code>undefined</code>.</p> - -<h3 id="Exceptions" name="Exceptions">例外</h3> - -<ul> - <li>{{domxref("HierarchyRequestError")}}: ノードを階層の特定の箇所に追加させることができません。</li> -</ul> - -<h2 id="Examples" name="Examples">例</h2> - -<h3 id="Prepending_an_element" name="Prepending_an_element">要素の前に追加</h3> - -<pre class="brush: js notranslate">var parent = document.createElement("div"); -var p = document.createElement("p"); -var span = document.createElement("span"); -parent.append(p); -parent.prepend(span); - -console.log(parent.childNodes); // NodeList [ <span>, <p> ] -</pre> - -<h3 id="Prepending_text" name="Prepending_text">テキストの前に追加</h3> - -<pre class="brush: js notranslate">var parent = document.createElement("div"); -parent.append("Some text"); -parent.prepend("Headline: "); - -console.log(parent.textContent); // "Headline: Some text"</pre> - -<h3 id="Appending_an_element_and_text" name="Appending_an_element_and_text">要素とテキストの追加</h3> - -<pre class="brush: js notranslate">var parent = document.createElement("div"); -var p = document.createElement("p"); -parent.prepend("Some text", p); - -console.log(parent.childNodes); // NodeList [ #text "Some text", <p> ]</pre> - -<h3 id="ParentNode.prepend_is_unscopable" name="ParentNode.prepend_is_unscopable">ParentNode.prepend() はスコープが効かない</h3> - -<p><code>prepend()</code> メソッドは <code>with</code> 文の中ではスコープが効きません。詳しくは {{jsxref("Symbol.unscopables")}} をご覧ください。</p> - -<pre class="brush: js notranslate">var parent = document.createElement("div"); - -with(parent) { - prepend("foo"); -} -// ReferenceError: prepend is not defined </pre> - -<h2 id="Polyfill">Polyfill</h2> - -<p><code>prepend()</code> メソッドは Internet Explorer 9 以上であれば以下のコードでポリフィルを当てることができます。</p> - -<pre class="brush: js notranslate">// Source: https://github.com/jserz/js_piece/blob/master/DOM/ParentNode/prepend()/prepend().md -(function (arr) { - arr.forEach(function (item) { - if (item.hasOwnProperty('prepend')) { - return; - } - Object.defineProperty(item, 'prepend', { - configurable: true, - enumerable: true, - writable: true, - value: function prepend() { - var argArr = Array.prototype.slice.call(arguments), - docFrag = document.createDocumentFragment(); - - argArr.forEach(function (argItem) { - var isNode = argItem instanceof Node; - docFrag.appendChild(isNode ? argItem : document.createTextNode(String(argItem))); - }); - - this.insertBefore(docFrag, this.firstChild); - } - }); - }); -})([Element.prototype, Document.prototype, DocumentFragment.prototype]);</pre> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('DOM WHATWG', '#dom-parentnode-prepend', 'ParentNode.prepend()')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("api.ParentNode.prepend")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{domxref("ParentNode")}} および {{domxref("ChildNode")}}</li> - <li>{{domxref("ParentNode.append()")}}</li> - <li>{{domxref("Node.appendChild()")}}</li> - <li>{{domxref("Node.insertBefore()")}}</li> - <li>{{domxref("ChildNode.before()")}}</li> - <li>{{domxref("Element.insertAdjacentElement()")}}</li> - <li>{{domxref("NodeList")}}</li> -</ul> diff --git a/files/ja/orphaned/web/api/parentnode/queryselectorall/index.html b/files/ja/orphaned/web/api/parentnode/queryselectorall/index.html deleted file mode 100644 index 01e307ed31..0000000000 --- a/files/ja/orphaned/web/api/parentnode/queryselectorall/index.html +++ /dev/null @@ -1,162 +0,0 @@ ---- -title: ParentNode.querySelectorAll() -slug: orphaned/Web/API/ParentNode/querySelectorAll -tags: - - API - - DOM - - Document - - Finding Elements - - Finding Nodes - - Method - - ParentNode - - Reference - - Searching Elements - - Searching Nodes - - Selectors - - querySelectorAll -translation_of: Web/API/ParentNode/querySelectorAll -original_slug: Web/API/ParentNode/querySelectorAll ---- -<div>{{ApiRef("DOM")}}</div> - -<p>{{domxref("ParentNode")}} ミックスインは <code><strong>querySelectorAll()</strong></code> メソッドを定義しており、メソッド呼び出しの時点でそのオブジェクトの子孫にあたる要素のうち、一連のセレクターに一致するもののリストを示す {{domxref("NodeList")}} を返します。</p> - -<p>単一の結果のみが必要な場合は、代わりに {{domxref("ParentNode.querySelector", "querySelector()")}} メソッドを使用することを検討してください。</p> - -<div class="note"> -<p><strong>メモ:</strong> このメソッドは {{domxref("Element.querySelectorAll()")}}, {{domxref("Document.querySelectorAll()")}}, {{domxref("DocumentFragment.querySelectorAll()")}} として実装されています。</p> -</div> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox"><var>elementList</var> = <em>parentNode</em>.querySelectorAll(<var>selectors</var>); -</pre> - -<h3 id="Parameters" name="Parameters">引数</h3> - -<dl> - <dt><code>selectors</code></dt> - <dd>マッチのための 1 つまたは複数のセレクターを含む {{domxref("DOMString")}}。この文字列は妥当な <a href="/ja/docs/Web/CSS/CSS_Selectors">CSS セレクター</a>でなければならず、そうでない場合は <code>SyntaxError</code> 例外がスローされます。セレクターの仕様と要素の識別の詳細は、<a href="/ja/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors">セレクターを使用した DOM 要素の指定</a>を参照してください。複数のセレクターを指定する際は、カンマで区切ります。</dd> -</dl> - -<div class="note"> -<p><strong>メモ:</strong> 標準の CSS 構文の一部ではない文字は、バックスラッシュ文字を使ってエスケープしなければなりません。 JavaScript でもバックスラッシュによるエスケープが使われているため、これらの文字を使った文字列リテラルを記述する際は、特に注意する必要があります。詳細は {{anch("Escaping special characters")}} を参照してください。</p> -</div> - -<h3 id="Return_value" name="Return_value">返値</h3> - -<p>生きていない {{domxref("NodeList")}} で、指定されたセレクターの1つ以上に一致する子孫ノード1つに対して1つずつの {{domxref("Element")}} を含みます。</p> - -<div class="note"> -<p><strong>メモ:</strong> 指定された <code>selectors</code> が <a href="/ja/docs/Web/CSS/Pseudo-elements">CSS 擬似要素</a>を含む場合、返されるリストは常に空になります。</p> -</div> - -<h3 id="Exceptions" name="Exceptions">例外</h3> - -<dl> - <dt><code>SyntaxError</code></dt> - <dd>指定された <code>selectors</code> の構文が妥当ではない。</dd> -</dl> - -<h2 id="Examples" name="Examples">例</h2> - -<p>文書内のすべての {{HTMLElement("p")}} 要素の {{domxref("NodeList")}} を入手します。</p> - -<pre class="brush: js">var matches = document.querySelectorAll("p");</pre> - -<p>次の例では、文書内にある <code>note</code> または <code>alert</code> のいずれかのクラスを持つ、すべての {{HTMLElement("div")}} 要素のリストを返します。</p> - -<pre class="brush: js">var matches = document.querySelectorAll("div.note, div.alert"); -</pre> - -<p>次に、 <code>test</code> という ID を持つコンテナ内に位置し、直接の親要素が <code>highlighted</code> クラスを持つ {{HTMLElement("div")}} である、<code><p></code> 要素のリストを取得します。</p> - -<pre class="brush: js">var container = document.querySelector("#test"); -var matches = container.querySelectorAll("div.highlighted > p");</pre> - -<p>次の例では<a href="/ja/docs/Web/CSS/Attribute_selectors">属性セレクター</a>を使用しており、 <code>data-src</code> という名前の属性を持つ、文書内の {{HTMLElement("iframe")}} 要素のリストを返します。</p> - -<pre class="brush: js">var matches = document.querySelectorAll("iframe[data-src]");</pre> - -<p>次の例では、ID が <code>userlist</code> の要素の中にあり、<code>data-active</code> 属性を持ち、その値が <code>1</code> であるリスト項目のリストを返すため、属性セレクターが使用されています。</p> - -<pre class="brush: js">var container = document.querySelector("#userlist"); -var matches = container.querySelectorAll("li[data-active=1]");</pre> - -<h2 id="User_notes" name="User_notes">ユーザーのメモ</h2> - -<p>querySelectorAll() は、最も一般的な JavaScript DOM ライブラリと異なる動作を持ち、意図しない結果をもたらすことがあります。</p> - -<h3 id="HTML">HTML</h3> - -<p>次の、入れ子になった 3 つの {{HTMLElement("div")}} ブロックを持つ HTML について検討します。</p> - -<pre class="brush: html"><div class="outer"> - <div class="select"> - <div class="inner"> - </div> - </div> -</div></pre> - -<h3 id="JavaScript">JavaScript</h3> - -<pre class="brush: js">var select = document.querySelector('.select'); -var inner = select.querySelectorAll('.outer .inner'); -inner.length; // 1 です。0 ではありません! -</pre> - -<p>この例では、<code>select</code> class を持つ <code><div></code> の文脈で <code>.outer .inner</code> を選択するとき、<code>.outer</code> が基準となる要素（<code>.select</code> で検索される）の子孫ではないにもかかわらず、<code>.inner</code> class を持つ要素が見つけられています。<code>querySelectorAll()</code> はデフォルトでは、セレクターの最後の要素が検索スコープに含まれているかどうかのみ検証します。</p> - -<p>{{cssxref(":scope")}} 擬似クラスを使うと、基準となる要素の子孫だけが一致するようになり、期待される挙動を取り戻すことができます。</p> - -<pre class="brush: js">var select = document.querySelector('.select'); -var inner = select.querySelectorAll(':scope .outer .inner'); -inner.length; // 0</pre> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName("DOM WHATWG", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}</td> - <td>{{Spec2("DOM WHATWG")}}</td> - <td>Living standard</td> - </tr> - <tr> - <td>{{SpecName("Selectors API Level 2", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}</td> - <td>{{Spec2("Selectors API Level 2")}}</td> - <td>変更なし</td> - </tr> - <tr> - <td>{{SpecName("DOM4", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}</td> - <td>{{Spec2("DOM4")}}</td> - <td>初回定義</td> - </tr> - <tr> - <td>{{SpecName("Selectors API Level 1", "#interface-definitions", "document.querySelector()")}}</td> - <td>{{Spec2("Selectors API Level 1")}}</td> - <td>元の定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("api.ParentNode.querySelectorAll")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li><a href="/ja/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors">セレクターを使用した DOM 要素の指定</a></li> - <li><a href="/ja/docs/Code_snippets/QuerySelector"><code>querySelector()</code> のコードスニペット</a></li> - <li>CSS ガイドの<a href="/ja/docs/Web/CSS/Attribute_selectors">属性セレクター</a></li> - <li>MDN 学習エリアの<a href="/ja/docs/Learn/CSS/Introduction_to_CSS/Attribute_selectors">属性セレクター</a></li> - <li>メソッドは {{domxref("Element.querySelectorAll()")}}, {{domxref("Document.querySelectorAll()")}}, {{domxref("DocumentFragment.querySelectorAll()")}} で利用可能です</li> -</ul> diff --git a/files/ja/orphaned/web/guide/html/html5/introduction_to_html5/index.html b/files/ja/orphaned/web/guide/html/html5/introduction_to_html5/index.html index 861044c138..c1cdd1d6b5 100644 --- a/files/ja/orphaned/web/guide/html/html5/introduction_to_html5/index.html +++ b/files/ja/orphaned/web/guide/html/html5/introduction_to_html5/index.html @@ -9,7 +9,7 @@ original_slug: Web/Guide/HTML/HTML5/Introduction_to_HTML5 --- <p><a class="external" href="https://www.whatwg.org/specs/web-apps/current-work/">HTML5</a> は、HTML 標準の最も新しいバージョンです。HTML5 によって、リッチメディアのサポートだけでなく、ユーザ、彼らのローカルデータ、サーバの間でより簡単にかつ効果的にやり取りするための Web アプリケーションを作成するための拡張されたサポートを提供するための新機能も手に入れることができます。</p> -<p>HTML5 はまだ策定段階にあるため、現在の仕様に対する変更は当然あり得ます。そのため、すべてのブラウザで HTML5 の機能のすべてがサポートされているわけではありません。ですが、Gecko (そしてその拡張である、Firefox) には、素晴らしいほどに、HTML5 の最初の段階のサポートが含まれており、さらなる機能のサポートに対する取り組みを続けています。Gecko は バージョン1.8.1 から HTML5 の機能をサポートし始めました。<a href="/ja/docs/orphaned/Web/Guide/HTML/HTML5" title="ja/HTML/HTML5">HTML5 のメインページ</a>に Gecko がサポートしている HTML5 の機能のリストがあります。複数ブラウザのサポート状況の詳細な情報については、<a class="external" href="http://caniuse.com/#cats=HTML5">CanIUse</a> ウェブサイトを参照してください。</p> +<p>HTML5 はまだ策定段階にあるため、現在の仕様に対する変更は当然あり得ます。そのため、すべてのブラウザで HTML5 の機能のすべてがサポートされているわけではありません。ですが、Gecko (そしてその拡張である、Firefox) には、素晴らしいほどに、HTML5 の最初の段階のサポートが含まれており、さらなる機能のサポートに対する取り組みを続けています。Gecko は バージョン1.8.1 から HTML5 の機能をサポートし始めました。<a href="/ja/docs/orphaned/Web/Guide/HTML/HTML5">HTML5 のメインページ</a>に Gecko がサポートしている HTML5 の機能のリストがあります。複数ブラウザのサポート状況の詳細な情報については、<a class="external" href="http://caniuse.com/#cats=HTML5">CanIUse</a> ウェブサイトを参照してください。</p> <h2 id="The_HTML5_doctype">HTML5 の DOCTYPE</h2> diff --git a/files/ja/orphaned/web/javascript/guide/class-based_vs._prototype-based_languages/index.html b/files/ja/orphaned/web/javascript/guide/class-based_vs._prototype-based_languages/index.html deleted file mode 100644 index 23daae0e6b..0000000000 --- a/files/ja/orphaned/web/javascript/guide/class-based_vs._prototype-based_languages/index.html +++ /dev/null @@ -1,26 +0,0 @@ ---- -title: Class-Based vs. Prototype-Based Languages -slug: orphaned/Web/JavaScript/Guide/Class-Based_vs._Prototype-Based_Languages -original_slug: Web/JavaScript/Guide/Class-Based_vs._Prototype-Based_Languages ---- -<h3 id=".E3.82.AF.E3.83.A9.E3.82.B9.E3.83.99.E3.83.BC.E3.82.B9.E8.A8.80.E8.AA.9E.E3.81.A8.E3.83.97.E3.83.AD.E3.83.88.E3.82.BF.E3.82.A4.E3.83.97.E3.83.99.E3.83.BC.E3.82.B9.E8.A8.80.E8.AA.9E" name=".E3.82.AF.E3.83.A9.E3.82.B9.E3.83.99.E3.83.BC.E3.82.B9.E8.A8.80.E8.AA.9E.E3.81.A8.E3.83.97.E3.83.AD.E3.83.88.E3.82.BF.E3.82.A4.E3.83.97.E3.83.99.E3.83.BC.E3.82.B9.E8.A8.80.E8.AA.9E">クラスベース言語とプロトタイプベース言語</h3> -<p>Java や C++ といったクラスベースのオブジェクト指向言語はクラスとインスタンスという 2 つの異なる実体があるという概念に基づいています。</p> -<ul> <li>クラスはあるオブジェクトの集合を特徴付けるすべてのプロパティ（Java ではメソッドとフィールドを、C++ ではメンバをプロパティと見なす）を定義する。クラスとはそれが表すオブジェクトの集合の特定のメンバではなく、抽象的なものである。例えば、Employee クラスで従業員すべてを含む集合を表す。</li> <li>一方、インスタンスはクラスを実例にしたものである。つまり、そのメンバの 1 つということである。例えば、Victoria は Employee クラスのインスタンスとなることができる。このクラスは特定の個人を従業者として表すものである。インスタンスはその親クラスのプロパティを正確に保持する（それに他ならない）。</li> -</ul> -<p>JavaScript のようなプロトタイプベース言語はこの区別がありません。単にオブジェクトがあるだけです。プロトタイプベース言語には原型的なオブジェクトという概念があります。このオブジェクトは新しいオブジェクトの初期プロパティを取得する元になるテンプレートとして使用されます。どのオブジェクトもそれ独自のプロパティを指定できます。オブジェクト作成時にも実行時にも可能です。さらに、どのオブジェクトも別のオブジェクトに対するプロトタイプとして関連付けることができます。2 つ目のオブジェクトが 1 つ目のオブジェクトのプロトタイプを共有するということもできます。</p> -<h4 id=".E3.82.AF.E3.83.A9.E3.82.B9.E3.81.AE.E5.AE.9A.E7.BE.A9" name=".E3.82.AF.E3.83.A9.E3.82.B9.E3.81.AE.E5.AE.9A.E7.BE.A9">クラスの定義</h4> -<p>クラスベース言語ではクラス定義ごとにクラスを定義します。定義では特殊なメソッドを指定してそのクラスのインスタンスを作成することができます。そのようなメソッドはコンストラクタと呼びます。コンストラクタメソッドはインスタンスのプロパティに対する初期値を指定することができます。また、作成時に他の適当な処理を実行することもできます。new 演算子をコンストラクタメソッドと一緒に用いることでクラスのインスタンスを作成できます。</p> -<p>JavaScript は同様のモデルに従っていますが、コンストラクタと別になっているクラス定義がありません。その代わりに、プロパティと値からなる特定の初期的なセットを持つオブジェクトを作成するコンストラクタ関数を定義します。どの JavaScript 関数もコンストラクタとして使用できます。new 演算子をコンストラクタ関数とともに使用することで新しいオブジェクトを作成します。</p> -<h4 id=".E3.82.B5.E3.83.96.E3.82.AF.E3.83.A9.E3.82.B9.E3.81.A8.E7.B6.99.E6.89.BF" name=".E3.82.B5.E3.83.96.E3.82.AF.E3.83.A9.E3.82.B9.E3.81.A8.E7.B6.99.E6.89.BF">サブクラスと継承</h4> -<p>クラスベース言語ではクラス定義を通じてクラスの階層を作ります。クラス定義では新しいクラスがある既存のクラスのサブクラスになるように指定することができます。サブクラスはスーパークラスの全プロパティを継承します。さらに新しくプロパティを追加したり継承したものを変更することもできます。例えば、Employee クラスが name および dept プロパティのみを含んでおり、Manager は reports プロパティを追加する Employee のサブクラスであるとします。この場合、Manager クラスのインスタンスは name、dept、reports という 3 つのプロパティをすべて持つことになります。</p> -<p>JavaScript では、原型的なオブジェクトをどのコンストラクタ関数にも結びつけることができるようにして継承を実装しています。そのため、全く同じような Employee と Manager の例を作成することができますが、使用する用語が若干異なります。まず、Employee コンストラクタ関数を定義します。これは name および dept プロパティを指定します。次に Manager コンストラクタ関数を定義します。これは reports プロパティを指定します。最後に新しい Employee オブジェクトを Manager コンストラクタ関数に対するプロトタイプとして代入します。そして新しい Manager を作成すると、このオブジェクトは Employee オブジェクトから name および dept プロパティを継承します。</p> -<h4 id=".E3.83.97.E3.83.AD.E3.83.91.E3.83.86.E3.82.A3.E3.81.AE.E8.BF.BD.E5.8A.A0.E3.81.A8.E5.89.8A.E9.99.A4" name=".E3.83.97.E3.83.AD.E3.83.91.E3.83.86.E3.82.A3.E3.81.AE.E8.BF.BD.E5.8A.A0.E3.81.A8.E5.89.8A.E9.99.A4">プロパティの追加と削除</h4> -<p>クラスベース言語では一般的にクラスをコンパイル時に生成し、コンパイル時または実行時にクラスのインスタンスを作成します。クラス定義後にそのクラスのプロパティの数や型を変更することはできません。しかし、JavaScript ではどんなオブジェクトでも実行時にプロパティを追加したり削除したりすることができます。あるオブジェクトのセットでプロトタイプとして使用されているオブジェクトにプロパティを追加すると、そのプロトタイプの使用元であるオブジェクトにも新しいプロパティが追加されます。</p> -<h4 id=".E9.81.95.E3.81.84.E3.81.AE.E6.A6.82.E8.A6.81" name=".E9.81.95.E3.81.84.E3.81.AE.E6.A6.82.E8.A6.81">違いの概要</h4> -<p>次の表でこれらの違いをいくつか短くまとめてみます。この章の残りで、JavaScript のコンストラクタとプロトタイプを用いてオブジェクト階層を作成することについての詳細を説明していきます。また、この方法が Java ではどう変わるかという比較もします。</p> -<table class="fullwidth-table"> <tbody> <tr> <th>クラスベース (Java)</th> <th>プロトタイプベース (JavaScript)</th> </tr> <tr> <td>クラスとインスタンスは異なる実体である。</td> <td>すべてのオブジェクトはインスタンスである。</td> </tr> <tr> <td>クラス定義を用いてクラスを定義する。また、コンストラクタメソッドを用いてクラスをインスタンス化する。</td> <td>コンストラクタ関数を用いてオブジェクトのセットを定義し、作成する。</td> </tr> <tr> <td><code>new</code> 演算子を用いて単一のオブジェクトを作成する。</td> <td>同じ。</td> </tr> <tr> <td>既存のクラスのサブクラスを定義するクラス定義を用いてオブジェクト階層を構築する。</td> <td>コンストラクタ関数に結びつけられたプロトタイプとしてオブジェクトを代入することでオブジェクト階層を構築する。</td> </tr> <tr> <td>クラスチェーンに従ってプロパティを継承する。</td> <td>プロトタイプチェーンに従ってプロパティを継承する。</td> </tr> <tr> <td>クラス定義がクラスの全インスタンスの全プロパティを指定する。実行時に動的にプロパティを追加することはできない。</td> <td>コンストラクタ関数またはプロトタイプがプロパティの初期セットを指定する。個々のオブジェクトやオブジェクトの全体のセットに動的にプロパティを追加したり、それらからプロパティを除去したりできる。</td> </tr> </tbody> -</table> -<div class="noinclude"> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Predefined_Core_Objects:String_Object", "Core_JavaScript_1.5_Guide:The_Employee_Example") }}</p> -</div> -<p>{{ languages( { "zh-tw": "zh_tw/Core_JavaScript_1.5_教學/以類別為基礎的語言_vs._以原型為基礎的語言", "en": "en/Core_JavaScript_1.5_Guide/Class-Based_vs._Prototype-Based_Languages", "es": "es/Gu\u00eda_JavaScript_1.5/Lenguajes_basados_en_clases_frente_a_basados_en_prototipos", "fr": "fr/Guide_JavaScript_1.5/Langages_bas\u00e9s_sur_les_classes_et_langages_bas\u00e9s_sur_les_prototypes", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/J\u0119zyki_oparte_na_klasach_vs._oparte_na_prototypach", "zh-cn": "cn/Core_JavaScript_1.5_Guide/Class-Based_vs._Prototype-Based_Languages" } ) }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/creating_a_regular_expression/index.html b/files/ja/orphaned/web/javascript/guide/creating_a_regular_expression/index.html index 4da2f3be90..9b09e6c5d2 100644 --- a/files/ja/orphaned/web/javascript/guide/creating_a_regular_expression/index.html +++ b/files/ja/orphaned/web/javascript/guide/creating_a_regular_expression/index.html @@ -18,7 +18,7 @@ original_slug: Web/JavaScript/Guide/Creating_a_Regular_Expression </dd> </dl> <ul> - <li>次のように、<a href="/ja/JavaScript/Reference/Global_Objects/RegExp" title="ja/JavaScript/Reference/Global_Objects/RegExp">RegExp</a> オブジェクトのコンストラクタ関数を呼び出す。</li> + <li>次のように、<a href="/ja/JavaScript/Reference/Global_Objects/RegExp">RegExp</a> オブジェクトのコンストラクタ関数を呼び出す。</li> </ul> <pre>var re = new RegExp("ab+c"); </pre> <dl> diff --git a/files/ja/orphaned/web/javascript/guide/expressions/index.html b/files/ja/orphaned/web/javascript/guide/expressions/index.html index 6c27367d80..90deb434f3 100644 --- a/files/ja/orphaned/web/javascript/guide/expressions/index.html +++ b/files/ja/orphaned/web/javascript/guide/expressions/index.html @@ -8,9 +8,9 @@ original_slug: Web/JavaScript/Guide/Expressions <p>概念的に、式は 2 つの種類に分けることができます。ある値を変数に代入するものと、単純にある値を持つものです。例えば、<code>x = 7</code> という式は x に 7 という値を代入する式です。この式自体の評価結果は 7 です。このような式では<em>代入演算子</em>を用います。一方、<code>3 + 4</code> という式では単純に評価結果が 7 になります。この式は代入を行いません。このような式で用いられる演算子は単に<em>演算子</em>と呼ばれます。</p> <p>JavaScript には以下の種類の式があります。</p> <ul> - <li>算術式：数値に評価する。例えば 3.14159。（一般に <a href="/ja/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators" title="ja/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators">算術演算子</a> を使用）</li> - <li>文字列式：文字列に評価する。例えば "Fred" や "234"。（一般に <a href="/ja/Core_JavaScript_1.5_Guide/Operators/String_Operators" title="ja/Core_JavaScript_1.5_Guide/Operators/String_Operators">文字列演算子</a> を使用）</li> - <li>論理式：true または false に評価する。（よく <a href="/ja/Core_JavaScript_1.5_Guide/Operators/Logical_Operators" title="ja/Core_JavaScript_1.5_Guide/Operators/Logical_Operators">論理演算子</a> を用いる)</li> - <li>オブジェクト式：オブジェクトに評価する。（オブジェクトに評価するさまざまな例については <a href="/ja/Core_JavaScript_1.5_Guide/Operators/Special_Operators" title="ja/Core_JavaScript_1.5_Guide/Operators/Special_Operators">特殊演算子</a> を参照）</li> + <li>算術式：数値に評価する。例えば 3.14159。（一般に <a href="/ja/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators">算術演算子</a> を使用）</li> + <li>文字列式：文字列に評価する。例えば "Fred" や "234"。（一般に <a href="/ja/Core_JavaScript_1.5_Guide/Operators/String_Operators">文字列演算子</a> を使用）</li> + <li>論理式：true または false に評価する。（よく <a href="/ja/Core_JavaScript_1.5_Guide/Operators/Logical_Operators">論理演算子</a> を用いる)</li> + <li>オブジェクト式：オブジェクトに評価する。（オブジェクトに評価するさまざまな例については <a href="/ja/Core_JavaScript_1.5_Guide/Operators/Special_Operators">特殊演算子</a> を参照）</li> </ul> <p>{{ PreviousNext("JavaScript/Guide/Unicode", "JavaScript/Guide/Operators") }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/loop_statements/index.html b/files/ja/orphaned/web/javascript/guide/loop_statements/index.html index 93f9f2c65a..68dab826b1 100644 --- a/files/ja/orphaned/web/javascript/guide/loop_statements/index.html +++ b/files/ja/orphaned/web/javascript/guide/loop_statements/index.html @@ -5,14 +5,14 @@ original_slug: Web/JavaScript/Guide/Loop_Statements --- <h2 id=".E3.83.AB.E3.83.BC.E3.83.97.E6.96.87" name=".E3.83.AB.E3.83.BC.E3.83.97.E6.96.87">ループ文</h2> <p>ループは指定した条件が満たされている限り繰り返し実行されるコマンドのセットです。JavaScript は、label はもちろん、for、do while、while といったループ文をサポートしています（label 自体はループ文ではありませんが、これらの文とともに頻繁に使用されます）。さらに、<code>break</code> および <code>continue</code> 文をループ文の中で使うことができます。</p> -<p>さらに <code>for...in</code> 文も文を繰り返し実行しますが、これはオブジェクトの操作に使用します。<a href="/ja/Core_JavaScript_1.5_Guide/Object_Manipulation_Statements" title="ja/Core_JavaScript_1.5_Guide/Object_Manipulation_Statements">オブジェクト操作文</a> をご覧ください。</p> +<p>さらに <code>for...in</code> 文も文を繰り返し実行しますが、これはオブジェクトの操作に使用します。<a href="/ja/Core_JavaScript_1.5_Guide/Object_Manipulation_Statements">オブジェクト操作文</a> をご覧ください。</p> <p>ループ文は以下のとおりです。</p> <ul> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/for_Statement" title="ja/Core_JavaScript_1.5_Guide/Loop_Statements/for_Statement">for 文</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/do...while_Statement" title="ja/Core_JavaScript_1.5_Guide/Loop_Statements/do...while_Statement">do...while 文</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/while_Statement" title="ja/Core_JavaScript_1.5_Guide/Loop_Statements/while_Statement">while 文</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/label_Statement" title="ja/Core_JavaScript_1.5_Guide/Loop_Statements/label_Statement">label 文</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/break_Statement" title="ja/Core_JavaScript_1.5_Guide/Loop_Statements/break_Statement">break 文</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/continue_Statement" title="ja/Core_JavaScript_1.5_Guide/Loop_Statements/continue_Statement">continue 文</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/for_Statement">for 文</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/do...while_Statement">do...while 文</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/while_Statement">while 文</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/label_Statement">label 文</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/break_Statement">break 文</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/continue_Statement">continue 文</a></li> </ul> <p>{{ PreviousNext("JavaScript/Guide/Conditional_Statements", "JavaScript/Guide/Loop_Statements/for_Statement") }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/object_manipulation_statements/index.html b/files/ja/orphaned/web/javascript/guide/object_manipulation_statements/index.html index 48e820e9ae..800a9e95cf 100644 --- a/files/ja/orphaned/web/javascript/guide/object_manipulation_statements/index.html +++ b/files/ja/orphaned/web/javascript/guide/object_manipulation_statements/index.html @@ -6,7 +6,7 @@ original_slug: Web/JavaScript/Guide/Object_Manipulation_Statements <h3 id=".E3.82.AA.E3.83.96.E3.82.B8.E3.82.A7.E3.82.AF.E3.83.88.E6.93.8D.E4.BD.9C.E6.96.87" name=".E3.82.AA.E3.83.96.E3.82.B8.E3.82.A7.E3.82.AF.E3.83.88.E6.93.8D.E4.BD.9C.E6.96.87">オブジェクト操作文</h3> <p>JavaScript はオブジェクトの操作に <code>for...in</code>、<code>for each...in</code> および <code>with</code> 文を使用します。</p> <h4 id="for...in_.E6.96.87" name="for...in_.E6.96.87">for...in 文</h4> -<p><a href="/ja/Core_JavaScript_1.5_Reference/Statements/for...in" title="ja/Core_JavaScript_1.5_Reference/Statements/for...in"><code>for...in</code></a> 文は指定した変数をオブジェクトの全プロパティに対して反復します。それぞれのプロパティに対して JavaScript は指定した文を実行します。<code>for...in</code> 文は次のように使用します。</p> +<p><a href="/ja/Core_JavaScript_1.5_Reference/Statements/for...in"><code>for...in</code></a> 文は指定した変数をオブジェクトの全プロパティに対して反復します。それぞれのプロパティに対して JavaScript は指定した文を実行します。<code>for...in</code> 文は次のように使用します。</p> <pre>for (variable in object) { statements } @@ -27,11 +27,11 @@ original_slug: Web/JavaScript/Guide/Object_Manipulation_Statements car.model = Mustang </pre> <p><strong>配列</strong><br> - <a href="/ja/Core_JavaScript_1.5_Reference/Global_Objects/Array" title="ja/Core_JavaScript_1.5_Reference/Global_Objects/Array">Array</a> の要素に対して反復する方法としてこれを用いることは魅力的かもしれませんが、<strong>for...in</strong> 文はその配列の要素に加えてユーザ定義プロパティに対して繰り返すため、独自のプロパティやメソッドを追加するなどして Array オブジェクトに変更を加えると <strong>for...in</strong> 文は数値のインデックスに加えてユーザ定義プロパティの名前を返します。したがって、配列に対して反復したいときには数値のインデックスを用いた従来の <a href="/ja/Core_JavaScript_1.5_Reference/Statements/for" title="ja/Core_JavaScript_1.5_Reference/Statements/for">for</a> ループを使用したほうがいいでしょう。</p> + <a href="/ja/Core_JavaScript_1.5_Reference/Global_Objects/Array">Array</a> の要素に対して反復する方法としてこれを用いることは魅力的かもしれませんが、<strong>for...in</strong> 文はその配列の要素に加えてユーザ定義プロパティに対して繰り返すため、独自のプロパティやメソッドを追加するなどして Array オブジェクトに変更を加えると <strong>for...in</strong> 文は数値のインデックスに加えてユーザ定義プロパティの名前を返します。したがって、配列に対して反復したいときには数値のインデックスを用いた従来の <a href="/ja/Core_JavaScript_1.5_Reference/Statements/for">for</a> ループを使用したほうがいいでしょう。</p> <h4 id="for_each...in_.E6.96.87" name="for_each...in_.E6.96.87">for each...in 文</h4> -<p><a href="/ja/Core_JavaScript_1.5_Reference/Statements/for_each...in" title="ja/Core_JavaScript_1.5_Reference/Statements/for_each...in"><code>for each...in</code></a> は <a href="/ja/New_in_JavaScript_1.6" title="ja/New_in_JavaScript_1.6">JavaScript 1.6</a> で導入されるループ文です。これは <code>for...in</code> に似ていますが、オブジェクトのプロパティの名前ではなく、プロパティの値に対して反復します。</p> +<p><a href="/ja/Core_JavaScript_1.5_Reference/Statements/for_each...in"><code>for each...in</code></a> は <a href="/ja/New_in_JavaScript_1.6">JavaScript 1.6</a> で導入されるループ文です。これは <code>for...in</code> に似ていますが、オブジェクトのプロパティの名前ではなく、プロパティの値に対して反復します。</p> <h4 id="with_.E6.96.87" name="with_.E6.96.87">with 文</h4> -<p><a href="/ja/Core_JavaScript_1.5_Reference/Statements/with" title="ja/Core_JavaScript_1.5_Reference/Statements/with"><code>with</code></a> 文はデフォルトのオブジェクトについて文のセットを実行します。JavaScript はその文のセットにおいて非修飾名を検索し、その名前がデフォルトのオブジェクトのプロパティであるかを決定します。非修飾名がプロパティにマッチすると、そのプロパティがその文で使われます。そうでない場合はローカル変数かグローバル変数が使われます。</p> +<p><a href="/ja/Core_JavaScript_1.5_Reference/Statements/with"><code>with</code></a> 文はデフォルトのオブジェクトについて文のセットを実行します。JavaScript はその文のセットにおいて非修飾名を検索し、その名前がデフォルトのオブジェクトのプロパティであるかを決定します。非修飾名がプロパティにマッチすると、そのプロパティがその文で使われます。そうでない場合はローカル変数かグローバル変数が使われます。</p> <p><code>with</code> 文は次のように使用します。</p> <pre>with (object) { statements @@ -47,6 +47,6 @@ with (Math) { y = r * sin(PI/2); } </pre> -<p>注意：<code>with</code> 文を使うことでプログラムをより簡潔にすることができますが、<code>with</code> の不適切な使用はプログラムを大幅にスローダウンさせることに繋がります。<a href="/ja/Core_JavaScript_1.5_Reference/Statements/with" title="ja/Core_JavaScript_1.5_Reference/Statements/with">Core JavaScript 1.5 Reference:Statements:with</a> を参照してください。</p> +<p>注意：<code>with</code> 文を使うことでプログラムをより簡潔にすることができますが、<code>with</code> の不適切な使用はプログラムを大幅にスローダウンさせることに繋がります。<a href="/ja/Core_JavaScript_1.5_Reference/Statements/with">Core JavaScript 1.5 Reference:Statements:with</a> を参照してください。</p> <p>{{ PreviousNext("JavaScript/Guide/Loop_Statements/continue_Statement", "JavaScript/Guide/Comments") }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/predefined_functions/escape_and_unescape_functions/index.html b/files/ja/orphaned/web/javascript/guide/predefined_functions/escape_and_unescape_functions/index.html index 6d126722b1..ca2ec31ef2 100644 --- a/files/ja/orphaned/web/javascript/guide/predefined_functions/escape_and_unescape_functions/index.html +++ b/files/ja/orphaned/web/javascript/guide/predefined_functions/escape_and_unescape_functions/index.html @@ -12,5 +12,5 @@ original_slug: Web/JavaScript/Guide/Predefined_Functions/escape_and_unescape_Fun unescape(string) </pre> <p>これらの関数は主にサーバサイド JavaScript で URL 中の名前と値のペアのエンコードやデコードに使用されます。</p> - <code>escape</code> および <code>unescape</code> 関数は 非 ASCII 文字に対しては正しく機能せず、廃止予定になっています。JavaScript 1.5 以降では <code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/encodeURI" title="ja/Core_JavaScript_1.5_Reference/Global_Functions/encodeURI">encodeURI</a></code>、<code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/decodeURI" title="ja/Core_JavaScript_1.5_Reference/Global_Functions/decodeURI">decodeURI</a></code>、<code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/encodeURIComponent" title="ja/Core_JavaScript_1.5_Reference/Global_Functions/encodeURIComponent">encodeURIComponent</a></code> および <code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/decodeURIComponent" title="ja/Core_JavaScript_1.5_Reference/Global_Functions/decodeURIComponent">decodeURIComponent</a></code> を使用してください。</div> + <code>escape</code> および <code>unescape</code> 関数は 非 ASCII 文字に対しては正しく機能せず、廃止予定になっています。JavaScript 1.5 以降では <code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/encodeURI">encodeURI</a></code>、<code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/decodeURI">decodeURI</a></code>、<code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/encodeURIComponent">encodeURIComponent</a></code> および <code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/decodeURIComponent">decodeURIComponent</a></code> を使用してください。</div> <p>{{ PreviousNext("JavaScript/Guide/Predefined_Functions/Number_and_String_Functions", "JavaScript/Guide/Objects_and_Properties") }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/predefined_functions/index.html b/files/ja/orphaned/web/javascript/guide/predefined_functions/index.html index 3738bf8da4..e802cc270a 100644 --- a/files/ja/orphaned/web/javascript/guide/predefined_functions/index.html +++ b/files/ja/orphaned/web/javascript/guide/predefined_functions/index.html @@ -7,12 +7,12 @@ original_slug: Web/JavaScript/Guide/Predefined_Functions <h3 id=".E5.AE.9A.E7.BE.A9.E6.B8.88.E3.81.BF.E9.96.A2.E6.95.B0" name=".E5.AE.9A.E7.BE.A9.E6.B8.88.E3.81.BF.E9.96.A2.E6.95.B0">定義済み関数</h3> <p>JavaScript にはトップレベルの定義済み関数がいくつかあります。</p> <ul> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/eval_Function" title="ja/Core_JavaScript_1.5_Guide/Predefined_Functions/eval_Function">eval</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isFinite_Function" title="ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isFinite_Function">isFinite</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isNaN_Function" title="ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isNaN_Function">isNaN</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/parseInt_and_parseFloat_Functions" title="ja/Core_JavaScript_1.5_Guide/Predefined_Functions/parseInt_and_parseFloat_Functions">parseInt と parseFloat</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/Number_and_String_Functions" title="ja/Core_JavaScript_1.5_Guide/Predefined_Functions/Number_and_String_Functions">Number と String</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/escape_and_unescape_Functions" title="ja/Core_JavaScript_1.5_Guide/Predefined_Functions/escape_and_unescape_Functions">encodeURI と decodeURI、encodeURIComponent、decodeURIComponent（すべて Javascript 1.5 以降で使用可能）</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/eval_Function">eval</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isFinite_Function">isFinite</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isNaN_Function">isNaN</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/parseInt_and_parseFloat_Functions">parseInt と parseFloat</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/Number_and_String_Functions">Number と String</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/escape_and_unescape_Functions">encodeURI と decodeURI、encodeURIComponent、decodeURIComponent（すべて Javascript 1.5 以降で使用可能）</a></li> </ul> </div> <p>{{ PreviousNext("JavaScript/Guide/Using_the_arguments_object", "JavaScript/Guide/Predefined_Functions/eval_Function") }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/the_employee_example/creating_the_hierarchy/index.html b/files/ja/orphaned/web/javascript/guide/the_employee_example/creating_the_hierarchy/index.html index 9ed2621e37..41ec88a890 100644 --- a/files/ja/orphaned/web/javascript/guide/the_employee_example/creating_the_hierarchy/index.html +++ b/files/ja/orphaned/web/javascript/guide/the_employee_example/creating_the_hierarchy/index.html @@ -6,7 +6,7 @@ original_slug: Web/JavaScript/Guide/The_Employee_Example/Creating_the_Hierarchy <h3 id=".E9.9A.8E.E5.B1.A4.E3.81.AE.E4.BD.9C.E6.88.90" name=".E9.9A.8E.E5.B1.A4.E3.81.AE.E4.BD.9C.E6.88.90">階層の作成</h3> <p>Employee の階層を実装するための適当なコンストラクタ関数を定義する方法はいくつかあります。これの定義に何を選択するかは、アプリケーションで何ができるようにしたいかに大きくよります。</p> <p>このセクションではとても単純（かつ比較的柔軟でない）定義の使用方法を示し、継承を機能させる方法を実際に示します。これらの定義では、オブジェクト作成時に何らかのプロパティの値を指定することはできません。新しく作成されるオブジェクトは単にデフォルトの値を取得するだけです。これは後から変更できます。図 8.2 ではこれらの単純な定義を備えた階層を例示します。</p> -<p>実際のアプリケーションでは、オブジェクト作成時にプロパティの値を設定できるようにするコンストラクタを定義することになるでしょう（詳しくは <a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors">より柔軟なコンストラクタ</a> を参照）。今回はこれらの単純な定義を使用して、継承はどのようにして起こるのかを実際に示していくことにします。</p> +<p>実際のアプリケーションでは、オブジェクト作成時にプロパティの値を設定できるようにするコンストラクタを定義することになるでしょう（詳しくは <a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors">より柔軟なコンストラクタ</a> を参照）。今回はこれらの単純な定義を使用して、継承はどのようにして起こるのかを実際に示していくことにします。</p> <p><img alt="Image:hier02.gif" class="internal" src="/@api/deki/files/1905/=Hier02.gif"><br> <small><strong>図 8.2：Employee オブジェクトの定義</strong></small></p> <p>以下に示すように、Java と JavaScript の <code>Employee</code> の定義は似ています。唯一の相違点は、Java では各プロパティに対して型を指定する必要があるのに対して、JavaScript ではその必要がないことです。また、Java のクラスでは明示的なコンストラクタメソッドを作成する必要があります。</p> diff --git a/files/ja/orphaned/web/javascript/guide/the_employee_example/index.html b/files/ja/orphaned/web/javascript/guide/the_employee_example/index.html index b47856921c..79fd796301 100644 --- a/files/ja/orphaned/web/javascript/guide/the_employee_example/index.html +++ b/files/ja/orphaned/web/javascript/guide/the_employee_example/index.html @@ -17,14 +17,14 @@ original_slug: Web/JavaScript/Guide/The_Employee_Example </ul> <p>残りの例：</p> <ul> - <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Creating_the_Hierarchy" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Creating_the_Hierarchy">階層の作成</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties">オブジェクトのプロパティ</a> + <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Creating_the_Hierarchy">階層の作成</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties">オブジェクトのプロパティ</a> <ul> - <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Inheriting_Properties" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Inheriting_Properties">プロパティの継承</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Adding_Properties" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Adding_Properties">プロパティの追加</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Inheriting_Properties">プロパティの継承</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Adding_Properties">プロパティの追加</a></li> </ul> </li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors">より柔軟なコンストラクタ</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors">より柔軟なコンストラクタ</a></li> </ul> <div class="noinclude"> <p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Class-Based_vs._Prototype-Based_Languages", "Core_JavaScript_1.5_Guide:The_Employee_Example:Creating_the_Hierarchy") }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/index.html b/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/index.html index 80c2494cf2..2cf27ea0ba 100644 --- a/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/index.html +++ b/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/index.html @@ -6,8 +6,8 @@ original_slug: Web/JavaScript/Guide/The_Employee_Example/Object_Properties <h3 id=".E3.82.AA.E3.83.96.E3.82.B8.E3.82.A7.E3.82.AF.E3.83.88.E3.81.AE.E3.83.97.E3.83.AD.E3.83.91.E3.83.86.E3.82.A3" name=".E3.82.AA.E3.83.96.E3.82.B8.E3.82.A7.E3.82.AF.E3.83.88.E3.81.AE.E3.83.97.E3.83.AD.E3.83.91.E3.83.86.E3.82.A3">オブジェクトのプロパティ</h3> <p>このセクションでは、プロトタイプチェーンにおいてオブジェクトが他のオブジェクトからどのようにプロパティを継承するのか、また、実行時にプロパティを追加すると何が起きるのかについて論じます。</p> <ul> - <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Inheriting_Properties" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Inheriting_Properties">プロパティの継承</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Adding_Properties" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Adding_Properties">プロパティの追加</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Inheriting_Properties">プロパティの継承</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Adding_Properties">プロパティの追加</a></li> </ul> <div class="noinclude"> <p>{{ PreviousNext("Core_JavaScript_1.5_Guide:The_Employee_Example:Creating_the_Hierarchy", "Core_JavaScript_1.5_Guide:The_Employee_Example:Object_Properties:Inheriting_Properties") }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/inheriting_properties/index.html b/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/inheriting_properties/index.html index 159c3c4e01..b860b5871f 100644 --- a/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/inheriting_properties/index.html +++ b/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/inheriting_properties/index.html @@ -6,7 +6,7 @@ original_slug: >- Web/JavaScript/Guide/The_Employee_Example/Object_Properties/Inheriting_Properties --- <h3 id=".E3.83.97.E3.83.AD.E3.83.91.E3.83.86.E3.82.A3.E3.81.AE.E7.B6.99.E6.89.BF" name=".E3.83.97.E3.83.AD.E3.83.91.E3.83.86.E3.82.A3.E3.81.AE.E7.B6.99.E6.89.BF">プロパティの継承</h3> -<p>次の文を用いて（<a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Creating_the_Hierarchy" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Creating_the_Hierarchy">図 8.3</a> で示したように）<code>mark</code> オブジェクトを <code>WorkerBee</code> として作成するとします。</p> +<p>次の文を用いて（<a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Creating_the_Hierarchy">図 8.3</a> で示したように）<code>mark</code> オブジェクトを <code>WorkerBee</code> として作成するとします。</p> <pre class="eval">mark = new WorkerBee; </pre> <p>JavaScript は new 演算子に出くわすと、新しく汎用オブジェクトを生成し、この新しいオブジェクトを <code>this</code> キーワードの値として WorkerBee コンストラクタ関数に渡します。コンストラクタ関数は明示的に <code>projects</code> プロパティの値をセットします。さらに、内部的な <code>__proto__</code> プロパティの値として <code>WorkerBee.prototype</code> の値をセットします。（このプロパティ名は最初と最後に 2 文字ずつのアンダースコアが付いています。）<code>__proto__</code> プロパティはプロパティの値を返すのに使用されるプロトタイプチェーンを決定します。これらのプロパティがセットされると JavaScript は新しいオブジェクトを返し、代入文は変数 <code>mark</code> にそのオブジェクトをセットします。</p> @@ -15,7 +15,7 @@ original_slug: >- mark.dept = "general"; mark.projects = []; </pre> -<p><code>mark</code> オブジェクトは <code>mark.__proto__</code> の原型的なオブジェクトから name および dept プロパティの値を継承します。WorkerBee コンストラクタによって projects プロパティにローカルの値が代入されます。このことでプロパティとその値を継承することができます。このプロセスの細かいところは <a href="/ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited" title="ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited">プロパティの継承、再び</a> にて議論します。</p> +<p><code>mark</code> オブジェクトは <code>mark.__proto__</code> の原型的なオブジェクトから name および dept プロパティの値を継承します。WorkerBee コンストラクタによって projects プロパティにローカルの値が代入されます。このことでプロパティとその値を継承することができます。このプロセスの細かいところは <a href="/ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited">プロパティの継承、再び</a> にて議論します。</p> <p>これらのコンストラクタにインスタンス固有の値を渡せないため、この情報は汎用的になります。プロパティの値は WorkerBee によって作成されるすべての新しいオブジェクトに共有される、デフォルトの値になります。もちろん、これらのどのプロパティのでもその値を変えることができます。そのためには次のようにして <code>mark</code> に固有の情報を与えます。</p> <pre class="eval">mark.name = "Doe, Mark"; mark.dept = "admin"; diff --git a/files/ja/orphaned/web/javascript/guide/using_the_arguments_object/index.html b/files/ja/orphaned/web/javascript/guide/using_the_arguments_object/index.html index 18259c91ce..446895507c 100644 --- a/files/ja/orphaned/web/javascript/guide/using_the_arguments_object/index.html +++ b/files/ja/orphaned/web/javascript/guide/using_the_arguments_object/index.html @@ -30,7 +30,7 @@ myConcat("; ", "elephant", "giraffe", "lion", "cheetah"); // "sage. basil. oregano. pepper. parsley. " を返す myConcat(". ", "sage", "basil", "oregano", "pepper", "parsley"); </pre> - <p>さらなる情報については、コア JavaScript リファレンスの <a href="/ja/Core_JavaScript_1.5_Reference/Objects/Function" title="ja/Core_JavaScript_1.5_Reference/Objects/Function">Function オブジェクト</a> をご覧ください。</p> + <p>さらなる情報については、コア JavaScript リファレンスの <a href="/ja/Core_JavaScript_1.5_Reference/Objects/Function">Function オブジェクト</a> をご覧ください。</p> <p><strong>JavaScript 1.3 以前のバージョン</strong><br> arguments オブジェクトは <code>Function</code> オブジェクトのプロパティであり、次のように関数の名前を前に付けることができます。</p> functionName.arguments{{ mediawiki.external('i') }}</div> diff --git a/files/ja/orphaned/web/javascript/guide/writing_a_regular_expression_pattern/index.html b/files/ja/orphaned/web/javascript/guide/writing_a_regular_expression_pattern/index.html index ee4583e4b4..f94d505365 100644 --- a/files/ja/orphaned/web/javascript/guide/writing_a_regular_expression_pattern/index.html +++ b/files/ja/orphaned/web/javascript/guide/writing_a_regular_expression_pattern/index.html @@ -5,7 +5,7 @@ original_slug: Web/JavaScript/Guide/Writing_a_Regular_Expression_Pattern --- <h3 id=".E6.AD.A3.E8.A6.8F.E8.A1.A8.E7.8F.BE.E3.83.91.E3.82.BF.E3.83.BC.E3.83.B3.E3.82.92.E6.9B.B8.E3.81.8F" name=".E6.AD.A3.E8.A6.8F.E8.A1.A8.E7.8F.BE.E3.83.91.E3.82.BF.E3.83.BC.E3.83.B3.E3.82.92.E6.9B.B8.E3.81.8F">正規表現パターンを書く</h3> -<p>正規表現パターンは、<code>/abc/</code> のような単純な文字、または <code>/ab*c/</code> や <code>/Chapter (\d+)\.\d*/</code> のような単純な文字と特殊文字との組み合わせからなります。最後の例では記憶装置として使われている丸括弧が含まれています。パターンのこの部分でなされたマッチは後で使用できるように記憶されます。詳しくは <a href="/ja/docs/JavaScript/Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches" title="ja/docs/JavaScript/Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches">括弧で囲まれた部分文字列のマッチの使用</a> を参照してください。</p> +<p>正規表現パターンは、<code>/abc/</code> のような単純な文字、または <code>/ab*c/</code> や <code>/Chapter (\d+)\.\d*/</code> のような単純な文字と特殊文字との組み合わせからなります。最後の例では記憶装置として使われている丸括弧が含まれています。パターンのこの部分でなされたマッチは後で使用できるように記憶されます。詳しくは <a href="/ja/docs/JavaScript/Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches">括弧で囲まれた部分文字列のマッチの使用</a> を参照してください。</p> <h4 id="単純なパターンの使用">単純なパターンの使用</h4> @@ -183,7 +183,7 @@ original_slug: Web/JavaScript/Guide/Writing_a_Regular_Expression_Pattern <h4 id="括弧の使用">括弧の使用</h4> -<p>正規表現パターンの一部分を括弧で囲むことで、マッチした部分文字列のその部分を記憶しておくことができます。一度記憶すると、後からその部分文字列を呼び戻すことができます。これに関しては <a href="/ja/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches" title="ja/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches">括弧で囲まれた部分文字列のマッチの使用</a> で説明しています。</p> +<p>正規表現パターンの一部分を括弧で囲むことで、マッチした部分文字列のその部分を記憶しておくことができます。一度記憶すると、後からその部分文字列を呼び戻すことができます。これに関しては <a href="/ja/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches">括弧で囲まれた部分文字列のマッチの使用</a> で説明しています。</p> <p>例えば、<code>/Chapter (\d+)\.\d*/</code> というパターンでは、エスケープされた文字と特殊文字の部分がその例で、その部分を記憶するように指示しています。これは 'Chapter ' という文字列、それに続く 1 文字以上の数字（\d はいずれかの数字を意味し、+ は 1 回以上の繰り返しを意味する）、それに続く小数点（それ自体は特殊文字であり、小数点の前の \ はパターンが '.' という文字そのものを探すようにすることを意味する）、それに続く 0 文字以上の数字（\d は数字を意味し、* は 0 回以上の繰り返しを意味する）にマッチします。さらに、括弧を使うことで最初のマッチした数値を記憶させます。</p> diff --git a/files/ja/orphaned/web/svg/element/solidcolor/index.html b/files/ja/orphaned/web/svg/element/solidcolor/index.html deleted file mode 100644 index 56480133c7..0000000000 --- a/files/ja/orphaned/web/svg/element/solidcolor/index.html +++ /dev/null @@ -1,84 +0,0 @@ ---- -title: <solidcolor> -slug: orphaned/Web/SVG/Element/solidColor -tags: - - Element - - Experimental - - Reference - - SVG -translation_of: Web/SVG/Element/solidColor -original_slug: Web/SVG/Element/solidColor ---- -<div>{{SVGRef}}{{obsolete_header}}</div> - -<p class="seoSummary"><strong><code><solidcolor></code></strong> は <a href="/ja/docs/Web/SVG">SVG</a> の要素で、 SVG 文書内の複数の場所で使用する単一の色を定義することができます。パレットの色をアニメーションさせるのにも便利です。</p> - -<p class="note"><strong>注:</strong> これは実験的な義jツウであり、まだブラウザーには実装されていません。回避策としては、 {{SVGElement("linearGradient")}} を単一の色経由点で扱うというものがあります。これはあまりすっきりしておらず、 <code><solidcolor></code> とは異なり、それ自身をグラデーションの定義に使用することができません。</p> - -<h2 id="Usage_context" name="Usage_context">使用場面</h2> - -<p>{{svginfo}}</p> - -<h2 id="Attributes" name="Attributes">属性</h2> - -<h3 id="Global_attributes" name="Global_attributes">グローバル属性</h3> - -<ul> - <li><a href="/ja/docs/Web/SVG/Attribute#Core_attributes">コア属性</a></li> - <li><a href="/ja/docs/Web/API/GlobalEventHandlers">グローバルイベント属性</a></li> - <li><a href="/ja/docs/Web/SVG/Attribute#Presentation_attributes">プレゼンテーション属性</a></li> - <li><a href="/en-US/docs/Web/SVG/Attribute#Style_attributes">スタイル属性</a></li> -</ul> - -<h3 id="Specific_attributes" name="Specific_attributes">固有の属性</h3> - -<p><em>なし。</em></p> - -<h2 id="DOM_interface" name="DOM_interface">DOM インターフェイス</h2> - -<p>この要素は {{domxref("SVGSolidcolorElement")}} インターフェイスを実装しています。</p> - -<h2 id="Example" name="Example">例</h2> - -<h3 id="SVG">SVG</h3> - -<pre class="brush: html notranslate"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 200" height="150"> - <defs> - <!-- solidColor is experimental. --> - <solidcolor id="myColor" solid-color="gold" solid-opacity="0.8"/> - - <!-- linearGradient with a single color stop is a less elegant way to - achieve the same effect, but it works in current browsers. --> - <linearGradient id="myGradient"> - <stop offset="0" stop-color="green" /> - </linearGradient> - </defs> - - <text x="10" y="20">Circles colored with solidColor</text> - <circle cx="150" cy="65" r="35" stroke-width="2" stroke="url(#myColor)" - fill="white"/> - <circle cx="50" cy="65" r="35" fill="url(#myColor)"/> - - <text x="10" y="120">Circles colored with linearGradient</text> - <circle cx="150" cy="165" r="35" stroke-width="2" stroke="url(#myGradient)" - fill="white"/> - <circle cx="50" cy="165" r="35" fill="url(#myGradient)"/> -</svg> -</pre> - -<h3 id="Result" name="Result">結果</h3> - -<p>{{EmbedLiveSample("Example")}}</p> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("svg.elements.solidcolor")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{domxref("SVGSolidcolorElement")}}</li> - <li>{{cssxref("solid-color")}}</li> - <li>{{cssxref("solid-opacity")}}</li> - <li>{{SVGElement("linearGradient")}}</li> -</ul> diff --git a/files/ja/web/api/canvasrenderingcontext2d/setlinedash/index.html b/files/ja/web/api/canvasrenderingcontext2d/setlinedash/index.html index 74051e9a9d..d54da1283b 100644 --- a/files/ja/web/api/canvasrenderingcontext2d/setlinedash/index.html +++ b/files/ja/web/api/canvasrenderingcontext2d/setlinedash/index.html @@ -25,7 +25,7 @@ translation_of: Web/API/CanvasRenderingContext2D/setLineDash <h2 id="例">例</h2> -<h3 id="簡単な例">簡単な例</h3> +<h3 id="Basic_example">簡単な例</h3> <p>この例では、<code>setLineDash()</code>メソッドを使用して、実線の上に破線を描画します。</p> @@ -58,7 +58,7 @@ ctx.stroke(); <p>{{ EmbedLiveSample('Basic_example', 700, 180) }}</p> -<h3 id="いくつかの一般的な模様">いくつかの一般的な模様</h3> +<h3 id="Some_common_patterns">いくつかの一般的な模様</h3> <p>この例は、さまざまな一般的な破線のパターンを示しています。</p> diff --git a/files/ja/web/api/document/getelementbyid/index.html b/files/ja/web/api/document/getelementbyid/index.html index 47aad75103..6bf6b57b97 100644 --- a/files/ja/web/api/document/getelementbyid/index.html +++ b/files/ja/web/api/document/getelementbyid/index.html @@ -100,7 +100,7 @@ element.id = 'testqq'; var el = document.getElementById('testqq'); // el は null になります </pre> -<p><strong>HTML 以外の文書</strong>の場合。 DOM の実装では、どの属性が ID 類であるかを示す情報が必要です。 "id" という名前の属性は、文書の DTD で定義されていない限り ID 類とみなされません。 <code>id</code> 属性は <a href="/ja/docs/XHTML" title="ja/docs/XHTML">XHTML</a>, <a href="/ja/docs/XUL" title="ja/docs/XUL">XUL</a> などの一般的な場合には ID 類として定義されています。属性が ID 類であるかどうかが分からない実装では、 <code>null</code> を返すでしょう。</p> +<p><strong>HTML 以外の文書</strong>の場合。 DOM の実装では、どの属性が ID 類であるかを示す情報が必要です。 "id" という名前の属性は、文書の DTD で定義されていない限り ID 類とみなされません。 <code>id</code> 属性は <a href="/ja/docs/XHTML">XHTML</a>, <a href="/ja/docs/XUL">XUL</a> などの一般的な場合には ID 類として定義されています。属性が ID 類であるかどうかが分からない実装では、 <code>null</code> を返すでしょう。</p> <h2 id="Specification" name="Specification">仕様書</h2> @@ -145,5 +145,5 @@ var el = document.getElementById('testqq'); // el は null になります <ul> <li>{{domxref("Document")}}: 文書内で要素への参照を取得するために使うことができる他のメソッドやプロパティで使用するための参照。</li> <li>{{domxref("Document.querySelector()")}}: <code>'div.myclass'</code> のようなセレクターを通したクエリのためのもの。</li> - <li><a href="/ja/docs/xml/xml:id" title="ja/docs/xml/id">xml:id</a> - <code>getElementById()</code> による XML 文書 (Ajax 呼び出しによって返されるものなど) の 'xml:id' の取得を可能とする便利なメソッドを持つ</li> + <li><a href="/ja/docs/xml/xml:id">xml:id</a> - <code>getElementById()</code> による XML 文書 (Ajax 呼び出しによって返されるものなど) の 'xml:id' の取得を可能とする便利なメソッドを持つ</li> </ul> diff --git a/files/ja/web/api/document_object_model/locating_dom_elements_using_selectors/index.html b/files/ja/web/api/document_object_model/locating_dom_elements_using_selectors/index.html index 65524033fb..4eb86d5287 100644 --- a/files/ja/web/api/document_object_model/locating_dom_elements_using_selectors/index.html +++ b/files/ja/web/api/document_object_model/locating_dom_elements_using_selectors/index.html @@ -46,5 +46,5 @@ translation_of: Web/API/Document_object_model/Locating_DOM_elements_using_select <li>{{domxref("Element.querySelectorAll()")}}</li> <li>{{domxref("Document.querySelector()")}}</li> <li>{{domxref("Document.querySelectorAll()")}}</li> - <li><a href="/ja/docs/Code_snippets/QuerySelector" title="ja/docs/Code_snippets/QuerySelector">Code snippets for querySelector</a></li> + <li><a href="/ja/docs/Code_snippets/QuerySelector">Code snippets for querySelector</a></li> </ul> diff --git a/files/ja/web/api/domstringlist/index.html b/files/ja/web/api/domstringlist/index.html index 27c3d8eb74..dfdf9efb5d 100644 --- a/files/ja/web/api/domstringlist/index.html +++ b/files/ja/web/api/domstringlist/index.html @@ -10,7 +10,7 @@ translation_of: Web/API/DOMStringList --- <p>{{APIRef("DOM")}}</p> -<p><a href="/ja/DOM/DOMString" title="ja/DOM/DOMString">DOMString</a> (strings) のリストを含むいくつかの API が返す型です。</p> +<p><a href="/ja/DOM/DOMString">DOMString</a> (strings) のリストを含むいくつかの API が返す型です。</p> <h2 id="Properties" name="Properties">プロパティ</h2> diff --git a/files/ja/web/api/element/append/index.html b/files/ja/web/api/element/append/index.html new file mode 100644 index 0000000000..82feaa6f91 --- /dev/null +++ b/files/ja/web/api/element/append/index.html @@ -0,0 +1,100 @@ +--- +title: Element.append() +slug: Web/API/Element/append +tags: + - API + - DOM + - Method + - Node + - Element + - Reference +browser-compat: api.Element.append +translation_of: Web/API/Element/append +original_slug: Web/API/ParentNode/append +--- +<p>{{APIRef("DOM")}}</p> + +<p><strong><code>Element.append()</code></strong> メソッドは、一連の {{domxref("Node")}} または {{domxref("DOMString")}} オブジェクトを <code>Element</code> のの最後の子の後に挿入します。 {{domxref("DOMString")}} オブジェクトは等価な {{domxref("Text")}} ノードとして挿入されます。</p> + +<p>{{domxref("Node.appendChild()")}} との違いは次の通りです。</p> + +<ul> + <li><code>Element.append()</code> は {{domxref("DOMString")}} も追加することができますが、<code>Node.appendChild()</code> は{{domxref("Node")}} オブジェクトのみを受け付けます。</li> + <li><code>Element.append()</code> には返値がありませんが、<code>Node.appendChild()</code> は追加された{{domxref("Node")}} オブジェクトを返します。</li> + <li><code>Element.append()</code> は複数のノードや文字列を追加することができますが、<code>Node.appendChild()</code> はノードを 1 つだけしか追加することができせん。</li> +</ul> + +<h2 id="Syntax">構文</h2> + +<pre class="brush: js"> +append(...nodesOrDOMStrings) +</pre> + +<h3 id="Parameters">引数</h3> + +<dl> + <dt><code>nodesOrDOMStrings</code></dt> + <dd>挿入する一連の {{domxref("Node")}} または {{domxref("DOMString")}} オブジェクトです。</dd> +</dl> + +<h3 id="Exceptions">例外</h3> + +<ul> + <li>{{domxref("HierarchyRequestError")}}: ノードを階層の特定の位置に挿入することができません。</li> +</ul> + +<h2 id="Examples">例</h2> + +<h3 id="Appending_an_element">要素の追加</h3> + +<pre class="brush: js">let div = document.createElement("div") +let p = document.createElement("p") +div.append(p) + +console.log(div.childNodes) // NodeList [ <p> ] +</pre> + +<h3 id="Appending_text">テキストの追加</h3> + +<pre class="brush: js">let div = document.createElement("div") +div.append("Some text") + +console.log(div.textContent) // "Some text"</pre> + +<h3 id="Appending_an_element_and_text">要素とテキストの追加</h3> + +<pre class="brush: js">let div = document.createElement("div") +let p = document.createElement("p") +div.append("Some text", p) + +console.log(div.childNodes) // NodeList [ #text "Some text", <p> ]</pre> + +<h3 id="The_append_method_is_unscopable">append メソッドはスコープが効かない</h3> + +<p><code>append()</code> メソッドは <code>with</code> 文の中ではスコープが効きません。詳しくは {{jsxref("Symbol.unscopables")}} をご覧ください。</p> + +<pre class="brush: js">let div = document.createElement("div") + +with(div) { + append("foo") +} +// ReferenceError: append is not defined </pre> + + +<h2 id="Specifications">仕様書</h2> + +{{Specifications}} + +<h2 id="Browser_compatibility">ブラウザーの互換性</h2> + +<p>{{Compat}}</p> + +<h2 id="See_also">関連情報</h2> + +<ul> + <li>{{domxref("Element.prepend()")}}</li> + <li>{{domxref("Node.appendChild()")}}</li> + <li>{{domxref("Element.after()")}}</li> + <li>{{domxref("Element.insertAdjacentElement()")}}</li> + <li>{{domxref("NodeList")}}</li> +</ul> diff --git a/files/ja/web/api/element/childelementcount/index.html b/files/ja/web/api/element/childelementcount/index.html index a06357d366..57d59747ce 100644 --- a/files/ja/web/api/element/childelementcount/index.html +++ b/files/ja/web/api/element/childelementcount/index.html @@ -1,96 +1,42 @@ --- -title: ParentNode.childElementCount +title: Element.childElementCount slug: Web/API/Element/childElementCount tags: - API - DOM - - ParentNode - Property -translation_of: Web/API/ParentNode/childElementCount + - Reference +browser-compat: api.Element.childElementCount +translation_of: Web/API/Element/childElementCount original_slug: Web/API/ParentNode/childElementCount --- <div>{{ APIRef("DOM") }}</div> -<p>読み取り専用の <code><strong>ParentNode.childElementCount</strong></code> プロパティは、与えられた要素の子要素の数を表す <code>unsigned long</code> 値を返します。</p> +<p><code><strong>Element.childElementCount</strong></code> は読み取り専用のプロパティで、この要素の子要素の数を返します。</p> -<div class="note"> -<p>このプロパティは、当初 {{domxref("ElementTraversal")}} 基本インターフェースで定義されていました。このインターフェースには 2 セットの異なるプロパティが含まれており、一つは子要素を持つ {{domxref("Node")}} を対象とし、もう一つはその子要素群を対象としたものでしたが、これらは 2 つの基本インターフェースである {{domxref("ParentNode")}} と {{domxref("ChildNode")}} に移されました。この際、<code>childElementCount</code> は {{domxref("ParentNode")}} へ移されました。これは技術的な変更であり、互換性に影響を与えるものではありません。</p> -</div> +<h2 id="Syntax">構文</h2> -<h2 id="Syntax" name="Syntax">構文</h2> +<pre class="brush: js">element.childElementCount;</pre> -<pre class="syntaxbox notranslate">var <var>count</var> = <em>node</em>.childElementCount; -</pre> - -<dl> - <dt><code>count</code></dt> - <dd><code>unsigned long</code> 型(つまり整数型)の戻り値.</dd> - <dt><code>node</code></dt> - <dd>{{domxref("Document")}}、{{domxref("DocumentFragment")}}、 {{domxref("Element")}}を表現するオブジェクト.</dd> -</dl> - -<h2 id="例">例</h2> +<h2 id="Example">例</h2> -<pre class="brush:js notranslate">var foo = document.getElementById('foo'); -if (foo.childElementCount > 0) { +<pre class="brush:js">let sidebar = document.getElementById('sidebar'); +if (sidebar.childElementCount > 0) { // Do something } </pre> +<h2 id="Specification">仕様書</h2> +{{Specifications}} -<h2 id="IE8_IE9Safari向けの互換コード">IE8, IE9/Safari向けの互換コード</h2> - -<p>このプロパティは IE9 より前のバージョンでサポートされていません。IE9とSafariでは <code>Document</code> と <code>DocumentFragment</code> においてサポートされていません。</p> - -<pre class="brush:js notranslate">;(function(constructor) { - if (constructor && - constructor.prototype && - constructor.prototype.childElementCount == null) { - Object.defineProperty(constructor.prototype, 'childElementCount', { - get: function() { - var i = 0, count = 0, node, nodes = this.childNodes; - while (node = nodes[i++]) { - if (node.nodeType === 1) count++; - } - return count; - } - }); - } -})(window.Node || window.Element);</pre> - -<h2 id="Specification" name="Specification">仕様</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状況</th> - <th scope="col">コメント</th> - </tr> - <tr> - <td>{{SpecName('DOM WHATWG', '#dom-parentnode-childElementCount', 'ParentNode.childElementCount')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td><code>ElementTraversal</code> インターフェースを {{domxref("ChildNode")}} と <code>ParentNode</code> に分割。このメソッドは後者で定義されています。<br> - {{domxref("Document")}} と {{domxref("DocumentFragment")}} が新しいインターフェースを実装しました。</td> - </tr> - <tr> - <td>{{SpecName('Element Traversal', '#attribute-childElementCount', 'ElementTraversal.childElementCount')}}</td> - <td>{{Spec2('Element Traversal')}}</td> - <td>この初期定義は <code>ElementTraversal</code> 基本インターフェースに追加され、{{domxref("Element")}} で使用します。</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザの実装状況</h2> - - +<h2 id="Browser_compatibility">ブラウザーの互換性</h2> -<p>{{Compat("api.ParentNode.childElementCount")}}</p> +<p>{{Compat}}</p> -<h2 id="See_also" name="See_also">関連情報</h2> +<h2 id="See_also">関連情報</h2> <ul> - <li>基本インターフェースの {{domxref("ParentNode")}} と {{domxref("ChildNode")}}</li> - <li>この基本インターフェースを実装するオブジェクト型: {{domxref("Document")}}, {{domxref("Element")}}, {{domxref("DocumentFragment")}}</li> + <li>{{domxref("Document.childElementCount")}}</li> + <li>{{domxref("DocumentFragment.childElementCount")}}</li> </ul> diff --git a/files/ja/web/api/element/children/index.html b/files/ja/web/api/element/children/index.html new file mode 100644 index 0000000000..5dd887af4f --- /dev/null +++ b/files/ja/web/api/element/children/index.html @@ -0,0 +1,58 @@ +--- +title: Element.children +slug: Web/API/Element/children +tags: + - API + - DOM + - Element + - HTMLCollection + - Property + - children +browser-compat: api.Element.children +translation_of: Web/API/Element/children +original_slug: Web/API/ParentNode/children +--- +<div>{{ APIRef("DOM") }}</div> + +<p><strong><code>children</code></strong> は読み取り専用のプロパティで、生きた {{domxref("HTMLCollection")}} で呼び出された要素の子{{domxref("Element", "要素", "", 1)}}をすべて返します。</p> + +<p><code>Element.children</code> は要素のノードしか含みません。すべての子ノード、例えばテキストやコメントノードなどを取得するには、 {{domxref("Node.childNodes")}} を使用してください。</p> + +<h2 id="Syntax">構文</h2> + +<pre class="brush: js"> +// Getter +collection = myElement.children; + +// No setter; read-only property +</pre> + +<h3 id="Return_value">返値</h3> + +<p>生きた {{ domxref("HTMLCollection") }} で、 <code><var>node</var></code> の子の DOM 要素の順序付きコレクションを返します。コレクションの {{domxref("HTMLCollection.item()", "item()")}} メソッドか、 JavaScript の配列スタイルの記法を使って、コレクション内の個々の子ノードにアクセスすることができます。</p> + +<p>ノードが子要素を持たない場合、 <code>children</code> は要素を含まず、<code>length</code> は <code>0</code> です。</p> + +<h2 id="Example">例 </h2> + +<pre class="brush: js">const myElement = document.getElementById('foo'); +for (let i = 0; i < myElement.children.length; i++) { + console.log(myElement.children[i].tagName); +} +</pre> + +<h2 id="Specification">仕様書</h2> + +{{Specifications}} + +<h2 id="Browser_compatibility">ブラウザーの互換性</h2> + +<p>{{Compat}}</p> + +<h2 id="See_also">関連情報</h2> + +<ul> + <li> + {{domxref("Node.childNodes")}} + </li> +</ul> diff --git a/files/ja/web/api/element/getattributenodens/index.html b/files/ja/web/api/element/getattributenodens/index.html index f56fd71658..fb48807b05 100644 --- a/files/ja/web/api/element/getattributenodens/index.html +++ b/files/ja/web/api/element/getattributenodens/index.html @@ -28,7 +28,7 @@ translation_of: Web/API/Element/getAttributeNodeNS <h3 id=".E6.B3.A8.E8.A8.98" name=".E6.B3.A8.E8.A8.98">注記</h3> -<p><span class="comment"><code>getAttributeNodeNS</code> is more specific than <a href="/ja/DOM/element.getAttributeNode">getAttributeNode</a> in that it allows you to specify attributes that are part of a particular namespace. The corresponding setter method is <a href="/ja/DOM/element.setAttributeNodeNS">setAttributeNodeNS</a>.</span> <code>getAttributeNodeNS</code> は特定の名前空間の一部である属性を指定できるという点で <a href="/ja/DOM/element.getAttributeNode" title="ja/DOM/element.getAttributeNode">getAttributeNode</a>より特殊です。対応するsetterメソッドは<a href="/ja/DOM/element.setAttributeNodeNS" title="ja/DOM/element.setAttributeNodeNS">setAttributeNodeNS</a>です。</p> +<p><span class="comment"><code>getAttributeNodeNS</code> is more specific than <a href="/ja/DOM/element.getAttributeNode">getAttributeNode</a> in that it allows you to specify attributes that are part of a particular namespace. The corresponding setter method is <a href="/ja/DOM/element.setAttributeNodeNS">setAttributeNodeNS</a>.</span> <code>getAttributeNodeNS</code> は特定の名前空間の一部である属性を指定できるという点で <a href="/ja/DOM/element.getAttributeNode">getAttributeNode</a>より特殊です。対応するsetterメソッドは<a href="/ja/DOM/element.setAttributeNodeNS">setAttributeNodeNS</a>です。</p> <p>{{ DOMAttributeMethods() }}<span class="comment">== Specification ==</span></p> diff --git a/files/ja/web/api/element/prepend/index.html b/files/ja/web/api/element/prepend/index.html new file mode 100644 index 0000000000..9a0a993e08 --- /dev/null +++ b/files/ja/web/api/element/prepend/index.html @@ -0,0 +1,98 @@ +--- +title: Element.prepend() +slug: Web/API/Element/prepend +tags: + - API + - DOM + - Method + - Node + - Element + - Reference + - prepend +translation_of: Web/API/Element/prepend +original_slug: Web/API/ParentNode/prepend +--- +<p>{{APIRef("DOM")}}</p> + +<p><strong><code>Element.prepend()</code></strong> メソッドは、一連の {{domxref("Node")}} または {{domxref("DOMString")}} オブジェクトをこの {{domxref("Element")}} の最初の子の前に挿入します。 {{domxref("DOMString")}} オブジェクトは、同等の {{domxref("Text")}} ノードとして挿入されます。</p> + +<h2 id="Syntax">構文</h2> + +<pre class="brush: js">prepend(...nodesOrDOMStrings); +</pre> + +<h3 id="Parameters">引数</h3> + +<dl> + <dt><code>nodesOrDOMStrings</code></dt> + <dd>挿入する一連の {{domxref("Node")}} または {{domxref("DOMString")}} オブジェクトです。</dd> +</dl> + +<h3 id="Return_value">返値</h3> + +<p><code>undefined</code>.</p> + +<h3 id="Exceptions">例外</h3> + +<ul> + <li>{{domxref("HierarchyRequestError")}}: ノードを階層の特定の箇所に追加することができません。</li> +</ul> + +<h2 id="Examples">例</h2> + +<h3 id="Prepending_an_element">要素の前に追加</h3> + +<pre class="brush: js">let div = document.createElement("div"); +let p = document.createElement("p"); +let span = document.createElement("span"); +div.append(p); +div.prepend(span); + +console.log(div.childNodes); // NodeList [ <span>, <p> ] +</pre> + +<h3 id="Prepending_text">テキストの前に追加</h3> + +<pre class="brush: js">let div = document.createElement("div"); +div.append("Some text"); +div.prepend("Headline: "); + +console.log(div.textContent); // "Headline: Some text"</pre> + +<h3 id="Appending_an_element_and_text">要素とテキストの追加</h3> + +<pre class="brush: js">let div = document.createElement("div"); +let p = document.createElement("p"); +div.prepend("Some text", p); + +console.log(div.childNodes); // NodeList [ #text "Some text", <p> ]</pre> + +<h3 id="The_prepend_method_is_unscopable">prepend() メソッドはスコープが効かない</h3> + +<p><code>prepend()</code> メソッドは <code>with</code> 文の中ではスコープが効きません。詳しくは {{jsxref("Symbol.unscopables")}} をご覧ください。</p> + +<pre class="brush: js">let div = document.createElement("div"); + +with(div) { + prepend("foo"); +} +// ReferenceError: prepend is not defined </pre> + +<h2 id="Specifications">仕様書</h2> + +{{Specifications}} + +<h2 id="Browser_compatibility">ブラウザーの互換性</h2> + +<p>{{Compat}}</p> + +<h2 id="See_also">関連情報</h2> + +<ul> + <li>{{domxref("Element.append()")}}</li> + <li>{{domxref("Node.appendChild()")}}</li> + <li>{{domxref("Node.insertBefore()")}}</li> + <li>{{domxref("Element.before()")}}</li> + <li>{{domxref("Element.insertAdjacentElement()")}}</li> + <li>{{domxref("NodeList")}}</li> +</ul> diff --git a/files/ja/web/api/element/queryselectorall/index.html b/files/ja/web/api/element/queryselectorall/index.html index ec2323fa35..08dc56b7c0 100644 --- a/files/ja/web/api/element/queryselectorall/index.html +++ b/files/ja/web/api/element/queryselectorall/index.html @@ -1,5 +1,5 @@ --- -title: element.querySelectorAll +title: Element.querySelectorAll() slug: Web/API/Element/querySelectorAll tags: - API @@ -13,59 +13,57 @@ tags: - Selecting Elements - Selectors - querySelector +browser-compat: api.Element.querySelectorAll translation_of: Web/API/Element/querySelectorAll +original_slug: Web/API/ParentNode/querySelectorAll --- <div>{{APIRef("DOM")}}</div> -<p>{{domxref("Element")}} の <code><strong>querySelectorAll()</strong></code> メソッドは対象要素の子孫の内、与えられた CSS セレクターに一致する要素リストを示す静的な（生きていない） {{domxref("NodeList")}} を返します（起点となる要素は、たとえマッチしていても含まれません）。</p> +<p>{{domxref("Element")}} の <code><strong>querySelectorAll()</strong></code> メソッドは、静的な (生きていない) {{domxref("NodeList")}} で、メソッド呼び出しの時点でそのオブジェクトの子孫にあたる要素のうち、一連のセレクターに一致するもののリストを返します。</p> -<div class="note"> -<p><strong>注:</strong> このメソッドは {{domxref("ParentNode")}} ミックスインの {{domxref("ParentNode.querySelectorAll", "querySelectorAll()")}} メソッドを元に実装されています。</p> -</div> - -<h2 id="Syntax" name="Syntax">構文</h2> +<h2 id="Syntax">構文</h2> -<pre class="syntaxbox notranslate"><var>elementList</var> = <em>parentNode</em>.querySelectorAll(<var>selectors</var>); +<pre class="brush: js"><var>elementList</var> = <em>parentNode</em>.querySelectorAll(<var>selectors</var>); </pre> -<h3 id="Parameters" name="Parameters">引数</h3> +<h3 id="Parameters">引数</h3> <dl> <dt><code>selectors</code></dt> - <dd>マッチのための 1 つまたは複数のセレクターを含む {{domxref("DOMString")}} です。この文字列は妥当な <a href="/ja/docs/Web/CSS/CSS_Selectors">CSS セレクター</a>文字列でなければならず、そうでない場合は <code>SyntaxError</code> 例外がスローされます。セレクターの仕様と要素の識別の詳細は、<a href="/ja/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors">セレクターを使用した DOM 要素の特定</a>を参照してください。複数のセレクターを指定する際は、カンマで区切ります。</dd> + <dd>一致させるための 1 つまたは複数のセレクターを含む {{domxref("DOMString")}}。この文字列は妥当な <a href="/ja/docs/Web/CSS/CSS_Selectors">CSS セレクター</a>でなければならず、そうでない場合は <code>SyntaxError</code> 例外が発生します。セレクターの仕様と要素の識別の詳細は、<a href="/ja/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors">セレクターを使用した DOM 要素の指定</a>を参照してください。複数のセレクターを指定する際は、カンマで区切ります。</dd> </dl> <div class="note"> -<p><strong>注:</strong> 標準の CSS 構文の一部ではない文字は、バックスラッシュ文字を使ってエスケープしなければなりません。 JavaScript でもバックスラッシュによるエスケープが使われているため、これらの文字を使った文字列リテラルを記述する際は、特に注意する必要があります。詳細は{{domxref("Document.querySelector#Escaping_special_character", "特殊文字のエスケープ", "", 1)}}を参照してください。</p> +<p><strong>メモ:</strong> 標準の CSS 構文の一部ではない文字は、バックスラッシュ文字を使ってエスケープしなければなりません。 JavaScript でもバックスラッシュによるエスケープが使われているため、これらの文字を使った文字列リテラルを記述する際は、特に注意する必要があります。詳細は {{anch("Escaping special characters")}} を参照してください。</p> </div> -<h3 id="Return_value" name="Return_value">戻り値</h3> +<h3 id="Return_value">返値</h3> -<p>指定されたセレクターのうち1つ以上にマッチする {{domxref("Element")}} オブジェクトを含んだ非ライブな {{domxref("NodeList")}} です。</p> +<p>生きていない {{domxref("NodeList")}} で、指定されたセレクターの 1 つ以上に一致する子孫ノード 1 つに対して 1 つずつの {{domxref("Element")}} を含みます。</p> <div class="note"> -<p><strong>メモ:</strong> 指定した <code>selectors</code> に<a href="/ja/docs/Web/CSS/Pseudo-elements">CSS 疑似要素</a>が含まれている場合、返されるリストは常に空になります。</p> +<p><strong>メモ:</strong> 指定された <code>selectors</code> が <a href="/ja/docs/Web/CSS/Pseudo-elements">CSS 擬似要素</a>を含む場合、返されるリストは常に空になります。</p> </div> -<h3 id="Exceptions" name="Exceptions">例外</h3> +<h3 id="Exceptions">例外</h3> <dl> <dt><code>SyntaxError</code></dt> - <dd>指定した <code>selectors</code> の構文が妥当ではない。</dd> + <dd>指定された <code>selectors</code> の構文が妥当ではない。</dd> </dl> -<h2 id="Example" name="Example">例</h2> +<h2 id="Examples">例</h2> -<h3 id="dataset_selector_attribute_selectors" name="dataset_selector_attribute_selectors">dataset セレクターと属性セレクター</h3> +<h3 id="dataset_selector_attribute_selectors">データセットセレクターと属性セレクター</h3> -<pre class="brush: html notranslate"><section class="box" id="sect1"> +<pre class="brush: html"><section class="box" id="sect1"> <div class="funnel-chart-percent1">10.900%</div> <div class="funnel-chart-percent2">3700.00%</div> <div class="funnel-chart-percent3">0.00%</div> </section> </pre> -<pre class="brush: js notranslate">// dataset セレクター +<pre class="brush: js">// データセットセレクター const refs = [...document.querySelectorAll(`[data-name*="funnel-chart-percent"]`)]; // 属性セレクター @@ -75,129 +73,95 @@ const refs = [...document.querySelectorAll(`[data-name*="funnel-chart-percent"]` // const refs = [...document.querySelectorAll(`[class~="funnel-chart-percent"]`)]; </pre> -<h3 id="Obtaining_a_list_of_matches" name="Obtaining_a_list_of_matches">一致のリストを入手する</h3> +<h3 id="Obtaining_a_list_of_matches">一致するもののリストの入手</h3> -<p>次の例では、<code>myBox</code> 要素の中に存在するすべての {{HTMLElement("p")}} 要素の {{domxref("NodeList")}} を取得しています。</p> -<pre class="brush: js notranslate">var matches = myBox.querySelectorAll("p"); -</pre> +<p>{{domxref("NodeList")}} で <code>"myBox"</code> 要素の中にあるすべての {{HTMLElement("p")}} 要素を取得するには、次のようにします。</p> + +<pre class="brush: js">var matches = myBox.querySelectorAll("p");</pre> -<p>次の例では、<code>mybox</code> 内にある <code>note</code> または <code>alert</code> のいずれかのクラスを持つ、すべての {{HTMLElement("div")}} 要素のリストを返します。</p> +<p>次の例では、文書内にある <code>note</code> または <code>alert</code> のいずれかのクラスを持つ、すべての {{HTMLElement("div")}} 要素のリストを返します。</p> -<pre class="brush: js notranslate">var matches = myBox.querySelectorAll("div.note, div.alert"); +<pre class="brush: js">var matches = myBox.querySelectorAll("div.note, div.alert"); </pre> -<p>次の例では、<code>test</code> という ID を持つコンテナー内に位置し、直接の親要素が <code>highlighted</code> のクラスを持つ {{domxref("div")}} である <code>p</code> 要素のリストを取得します。</p> +<p>次に、 <code>"test"</code> という ID を持つコンテナー内に位置し、直接の親要素が <code>"highlighted"</code> クラスを持つ {{HTMLElement("div")}} である、<code><p></code> 要素のリストを取得します。</p> -<pre class="brush: js notranslate">var container = document.querySelector("#test"); +<pre class="brush: js">var container = document.querySelector("#test"); var matches = container.querySelectorAll("div.highlighted > p");</pre> -<p>次の例では、<a href="/ja/docs/Web/CSS/Attribute_selectors">属性セレクター</a>を使って、文書内にある、 <code>data-src</code> 属性を持つ文書内の {{domxref("iframe")}} 要素のリストを返します。</p> +<p>次の例では<a href="/ja/docs/Web/CSS/Attribute_selectors">属性セレクター</a>を使用しており、 <code>data-src</code> という名前の属性を持つ、文書内の {{HTMLElement("iframe")}} 要素のリストを返します。</p> -<pre class="brush: js notranslate">var matches = domument.querySelectorAll("iframe[data-src]"); -</pre> +<pre class="brush: js">var matches = document.querySelectorAll("iframe[data-src]");</pre> -<p>次の例では、属性セレクターを使って、「ID が <code>userlist</code> である要素内の、<code>data-active</code> 属性を持ち、その値が <code>1</code> である要素群」のリストを返します。</p> +<p>次の例では、ID が <code>userlist</code> の要素の中にあり、<code>data-active</code> 属性を持ち、その値が <code>1</code> であるリスト項目のリストを返すため、属性セレクターが使用されています。</p> -<pre class="brush: js notranslate">var container = document.querySelector("#userlist"); +<pre class="brush: js">var container = document.querySelector("#userlist"); var matches = container.querySelectorAll("li[data-active='1']");</pre> -<h3 id="Accessing_the_matches" name="Accessing_the_matches">一致したリストへアクセスする</h3> +<h3 id="Accessing_the_matches">一致したものへのアクセス</h3> -<p>一旦、一致した要素の {{domxref("NodeList")}}} が返されると、それをちょうど配列のように試すことができます。配列が空である (<code>length</code> プロパティが 0 である) 場合は、一致がなかったということです。</p> +<p>一致した要素の {{domxref("NodeList")}} が返されると、配列と同様に調べることができます。配列が空であれば (つまり、 <code>length</code> プロパティが 0 であれば)、一致するものが見つからなかったということです。</p> -<p>それ以外の場合は、単純に標準の配列表記を使って、リストの内容にアクセスすることができます。次のように、任意の一般的なループ処理を使うことができます。</p> +<p>それ以外の場合は、標準的な配列記法でリストの内容にアクセスすることができます。次のような一般的なループ文を使用することができます。</p> -<pre class="brush: js notranslate">var highlightedItems = userList.querySelectorAll(".highlighted"); +<pre class="brush: js">var highlightedItems = userList.querySelectorAll(".highlighted"); highlightedItems.forEach(function(userItem) { deleteUser(userItem); });</pre> <div class="note"> -<p><strong>注: </strong>NodeList は純正な配列ではないので、slice, some, map などのArray メソッドを持っていません。Array.from(nodeList) を使うことで純正の配列に変換することができます。</p> + <p><strong>メモ:</strong> NodeList は、本物の配列ではありません。つまり、slice、some、map などの配列メソッドを持っていません。これを配列に変換するには、 Array.from(nodeList) のようにします。</p> </div> -<h2 id="User_notes" name="User_notes">特殊な例</h2> +<h2 id="User_notes">ユーザーのメモ</h2> -<p><code>querySelectorAll()</code> は、最も一般的な JavaScript DOM ライブラリと異なる動作を持ち、意図しない結果をもたらすことがあります。</p> +<p>querySelectorAll() は、最も一般的な JavaScript DOM ライブラリと異なる動作を持ち、意図しない結果をもたらすことがあります。</p> -<h3 id="HTML" name="HTML">HTML</h3> +<h3 id="HTML">HTML</h3> <p>次の、入れ子になった 3 つの {{HTMLElement("div")}} ブロックを持つ HTML について検討します。</p> -<pre class="brush: html notranslate"><div class="outer"> +<pre class="brush: html"><div class="outer"> <div class="select"> <div class="inner"> </div> </div> </div></pre> -<h3 id="JavaScript" name="JavaScript">JavaScript</h3> +<h3 id="JavaScript">JavaScript</h3> -<pre class="brush: js notranslate">var select = document.querySelector('.select'); +<pre class="brush: js">var select = document.querySelector('.select'); var inner = select.querySelectorAll('.outer .inner'); -inner.length; // 1, not 0! +inner.length; // 1 です。0 ではありません! </pre> -<p>この例では、<code>"select"</code> class を持つ <code><div></code> の文脈で <code>".outer .inner"</code> を選択するとき、<code>.outer</code> が基準となる要素（<code>.select</code> で検索される）の子孫ではないにもかかわらず、<code>".inner"</code> class を持つ要素が見つけられています。<code>querySelectorAll()</code> はデフォルトでは、セレクターの最後の要素が検索スコープに含まれているかどうかのみ検証します。</p> +<p>この例では、<code>select</code> class を持つ <code><div></code> の文脈で <code>.outer .inner</code> を選択するとき、<code>.outer</code> が基準となる要素（<code>.select</code> で検索される）の子孫ではないにもかかわらず、<code>.inner</code> class を持つ要素が見つけられています。<code>querySelectorAll()</code> はデフォルトでは、セレクターの最後の要素が検索スコープに含まれているかどうかのみ検証します。</p> -<p>{{cssxref(":scope")}} 擬似クラスを使うと、基準となる要素の子孫だけが一致するようになり、期待される挙動を取り戻すことができます。</p> +<p>{{cssxref(":scope")}} 擬似クラスを使うと、基準となる要素の子孫だけが一致するようになり、期待される挙動を取り戻すことができます。</p> -<pre class="brush: js notranslate">var select = document.querySelector('.select'); +<pre class="brush: js">var select = document.querySelector('.select'); var inner = select.querySelectorAll(':scope .outer .inner'); inner.length; // 0 </pre> -<h2 id="Specifications" name="Specifications">仕様</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">策定状況</th> - <th scope="col">コメント</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName("DOM WHATWG", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}</td> - <td>{{Spec2("DOM WHATWG")}}</td> - <td>Living standard</td> - </tr> - <tr> - <td>{{SpecName("Selectors API Level 2", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}</td> - <td>{{Spec2("Selectors API Level 2")}}</td> - <td>変更なし</td> - </tr> - <tr> - <td>{{SpecName("DOM4", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}</td> - <td>{{Spec2("DOM4")}}</td> - <td>初期定義</td> - </tr> - <tr> - <td>{{SpecName('Selectors API Level 1','#queryselectorall','querySelectorAll')}}</td> - <td>{{Spec2('Selectors API Level 1')}}</td> - <td>初期定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> - -<div> -<p>{{Compat("api.Element.querySelectorAll")}}</p> -</div> +<h2 id="Specifications">仕様書</h2> + +{{Specifications}} + +<h2 id="Browser_compatibility">ブラウザーの互換性</h2> + +<p>{{Compat}}</p> -<h2 id="See_also" name="See_also">関連情報</h2> +<h2 id="See_also">関連情報</h2> <ul> - <li><a href="/ja/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors">セレクターを使用した DOM 要素の特定</a></li> - <li>CSS ガイドの<a href="/ja/docs/Web/CSS/Attribute_selectors">属性セレクター</a></li> - <li>MDN 学習エリアの<a href="/ja/docs/Learn/CSS/Introduction_to_CSS/Attribute_selectors">属性セレクター</a></li> - <li>{{domxref("Element.querySelector()")}}</li> - <li>{{domxref("Document.querySelector()")}} および {{domxref("Document.querySelectorAll()")}}</li> - <li>{{domxref("DocumentFragment.querySelector()")}} および {{domxref("DocumentFragment.querySelectorAll()")}}</li> - <li>{{domxref("ParentNode.querySelector()")}} および {{domxref("ParentNode.querySelectorAll()")}}</li> - <li><a href="/ja/docs/Code_snippets/QuerySelector" title="Code_snippets/QuerySelector"><code>querySelector()</code> のコードスニペット</a></li> + <li><a href="/ja/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors">セレクターを使用した DOM 要素の指定</a></li> + <li>CSS ガイドの<a href="/ja/docs/Web/CSS/Attribute_selectors">属性セレクター</a></li> + <li>MDN 学習エリアの<a href="/ja/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">属性セレクター</a></li> + <li>{{domxref("Element.querySelector()")}}</li> + <li>{{domxref("Document.querySelector()")}} および {{domxref("Document.querySelectorAll()")}}</li> + <li>{{domxref("DocumentFragment.querySelector()")}} および {{domxref("DocumentFragment.querySelectorAll()")}}</li> + <li><a href="/ja/docs/Code_snippets/QuerySelector"><code>querySelector()</code> のコードスニペット</a></li> </ul> diff --git a/files/ja/web/api/history_api/working_with_the_history_api/index.html b/files/ja/web/api/history_api/working_with_the_history_api/index.html index c7b71399b2..a2fb053d73 100644 --- a/files/ja/web/api/history_api/working_with_the_history_api/index.html +++ b/files/ja/web/api/history_api/working_with_the_history_api/index.html @@ -54,7 +54,7 @@ history.pushState(stateObj, "page 2", "bar.html"); </li> </ul> -<div class="note"><strong>注:</strong> Gecko 2.0 {{ geckoRelease("2.0") }} より Gecko 5.0 {{ geckoRelease("5.0") }} に於いては、渡されたオブジェクトは JSON を使用してシリアライズされます。Gecko 6.0 {{ geckoRelease("6.0") }} より、オブジェクトは <a href="/ja/DOM/The_structured_clone_algorithm" title="ja/DOM/The structured clone algorithm">the structured clone algorithm</a> を使用してシリアライズされます。これにより多種多様なオブジェクトを安全に渡せるようになります。</div> +<div class="note"><strong>注:</strong> Gecko 2.0 {{ geckoRelease("2.0") }} より Gecko 5.0 {{ geckoRelease("5.0") }} に於いては、渡されたオブジェクトは JSON を使用してシリアライズされます。Gecko 6.0 {{ geckoRelease("6.0") }} より、オブジェクトは <a href="/ja/DOM/The_structured_clone_algorithm">the structured clone algorithm</a> を使用してシリアライズされます。これにより多種多様なオブジェクトを安全に渡せるようになります。</div> <p>ある意味では、<code>pushState()</code> の呼び出しは <code>window.location = "#foo";</code> と設定するのと似ています。どちらも、現在のドキュメントに関連する別の履歴エントリの生成とアクティベートを行います。ですが <code>pushState()</code> にはいくらかの利点があります：</p> @@ -77,7 +77,7 @@ history.pushState(stateObj, "page 2", "bar.html"); <p>具体的には、何らかのユーザーのアクションを受け、現在の履歴エントリの URL または state オブジェクトを更新したい場合に <code>replaceState()</code> が役立ちます。</p> -<div class="note"><strong>注:</strong> Gecko 2.0 {{ geckoRelease("2.0") }} より Gecko 5.0 {{ geckoRelease("5.0") }} に於いては、渡されたオブジェクトは JSON を使用してシリアライズされます。Gecko 6.0 {{ geckoRelease("6.0") }} より、オブジェクトは <a href="/ja/DOM/The_structured_clone_algorithm" title="ja/DOM/The structured clone algorithm">the structured clone algorithm</a> を使用してシリアライズされます。これにより多種多様なオブジェクトを安全に渡せるようになります。</div> +<div class="note"><strong>注:</strong> Gecko 2.0 {{ geckoRelease("2.0") }} より Gecko 5.0 {{ geckoRelease("5.0") }} に於いては、渡されたオブジェクトは JSON を使用してシリアライズされます。Gecko 6.0 {{ geckoRelease("6.0") }} より、オブジェクトは <a href="/ja/DOM/The_structured_clone_algorithm">the structured clone algorithm</a> を使用してシリアライズされます。これにより多種多様なオブジェクトを安全に渡せるようになります。</div> <h3 id="replaceState_の例">replaceState() の例</h3> diff --git a/files/ja/web/api/html_drag_and_drop_api/multiple_items/index.html b/files/ja/web/api/html_drag_and_drop_api/multiple_items/index.html index 23d2cd518f..5a4fded9fe 100644 --- a/files/ja/web/api/html_drag_and_drop_api/multiple_items/index.html +++ b/files/ja/web/api/html_drag_and_drop_api/multiple_items/index.html @@ -4,14 +4,14 @@ slug: Web/API/HTML_Drag_and_Drop_API/Multiple_items translation_of: Web/API/HTML_Drag_and_Drop_API/Multiple_items original_slug: DragDrop/Dragging_and_Dropping_Multiple_Items --- -<p>Mozillaはいくつかの非標準の機能によって、複数の項目のドラッグをサポートしています。それらの機能は<a class="internal" href="/Ja/DragDrop/DataTransfer#types.28.29" title="Ja/DragDrop/DataTransfer#types.28.29">types</a>プロパティや<a class="internal" href="/Ja/DragDrop/DataTransfer#getData.28.29" title="Ja/DragDrop/DataTransfer#getData.28.29">getData</a>、<a class="internal" href="/Ja/DragDrop/DataTransfer#setData.28.29" title="Ja/DragDrop/DataTransfer#setData.28.29">setData</a>、<a class="internal" href="/Ja/DragDrop/DataTransfer#clearData.28.29" title="Ja/DragDrop/DataTransfer#clearData.28.29">clearData</a>の各メソッドに酷似していますが、データの取得や変更、削除の際などに項目のインデックスを追加の引数として要求します。</p> -<p><a class="internal" href="/Ja/DragDrop/DataTransfer#mozSetDataAt.28.29" title="Ja/DragDrop/DataTransfer#mozSetDataAt.28.29">mozSetDataAt</a>を使うと、<code>dragstart</code>イベントで複数の項目を登録することができます。これは<a class="internal" href="/Ja/DragDrop/DataTransfer#setData.28.29" title="Ja/DragDrop/DataTransfer#setData.28.29">setData</a>メソッドとよく似た働きをします。</p> +<p>Mozillaはいくつかの非標準の機能によって、複数の項目のドラッグをサポートしています。それらの機能は<a class="internal" href="/Ja/DragDrop/DataTransfer#types.28.29">types</a>プロパティや<a class="internal" href="/Ja/DragDrop/DataTransfer#getData.28.29">getData</a>、<a class="internal" href="/Ja/DragDrop/DataTransfer#setData.28.29">setData</a>、<a class="internal" href="/Ja/DragDrop/DataTransfer#clearData.28.29">clearData</a>の各メソッドに酷似していますが、データの取得や変更、削除の際などに項目のインデックスを追加の引数として要求します。</p> +<p><a class="internal" href="/Ja/DragDrop/DataTransfer#mozSetDataAt.28.29">mozSetDataAt</a>を使うと、<code>dragstart</code>イベントで複数の項目を登録することができます。これは<a class="internal" href="/Ja/DragDrop/DataTransfer#setData.28.29">setData</a>メソッドとよく似た働きをします。</p> <pre>var dt = event.dataTransfer; dt.mozSetDataAt("text/plain", "ドラッグされるデータ", 0); dt.mozSetDataAt("text/plain", "ドラッグされる2つめのデータ", 1); </pre> -<p>この例では2つのドラッグ項目を追加しています。最後の引数は追加する項目のインデックスを示しています。これらの項目は0番から順番に登録するべきで、最後の方（インデックスの大きなもの）から逆順に登録することはできません。また、すでにデータが登録されているインデックスを指定してもう1度データを登録すると、前に登録したデータを置き換えることができます。インデックスとして0を指定すると、<a class="internal" href="/Ja/DragDrop/DataTransfer#setData.28.29" title="Ja/DragDrop/DataTransfer#setData.28.29">setData</a>メソッドを呼んだのと等しく扱われます。</p> -<p><a class="internal" href="/Ja/DragDrop/DataTransfer#mozClearDataAt.28.29" title="Ja/DragDrop/DataTransfer#mozClearDataAt.28.29">mozClearDataAt</a>メソッドを使って、指定した項目を削除することもできます。</p> +<p>この例では2つのドラッグ項目を追加しています。最後の引数は追加する項目のインデックスを示しています。これらの項目は0番から順番に登録するべきで、最後の方（インデックスの大きなもの）から逆順に登録することはできません。また、すでにデータが登録されているインデックスを指定してもう1度データを登録すると、前に登録したデータを置き換えることができます。インデックスとして0を指定すると、<a class="internal" href="/Ja/DragDrop/DataTransfer#setData.28.29">setData</a>メソッドを呼んだのと等しく扱われます。</p> +<p><a class="internal" href="/Ja/DragDrop/DataTransfer#mozClearDataAt.28.29">mozClearDataAt</a>メソッドを使って、指定した項目を削除することもできます。</p> <pre>event.dataTransfer.mozClearDataAt("text/plain", 1); </pre> <p>あるインデックスで示される項目について、最後のデータ形式の削除によって項目全体を削除すると、残りの項目が繰り上がって項目のインデックスが変わることに注意してください。例えば、</p> @@ -36,9 +36,9 @@ dt.mozClearDataAt("text/plain", 1); </pre> <p>幸いなことに、通常は項目を削除する必要がある場合は希で、それよりも、必要に応じて項目を追加するだけの場合の方がずっと多いです。</p> <p>複数の項目のドラッグが使われる場合の代表は、複数のファイルやブックマークをドラッグする時です。この場合には、適切な形式でそれらの項目を追加してください。また必須ではありませんが、それぞれの項目は常に同じ形式でデータを追加するべきです。これによりドロップ対象は、一貫したデータの受け取りを期待できます。</p> -<p>複数のファイルがドラッグされているかどうかを確認するには、<a class="internal" href="/Ja/DragDrop/DataTransfer#mozItemCount.28.29" title="Ja/DragDrop/DataTransfer#mozItemCount.28.29">mozItemCount</a>プロパティを調べます。このプロパティにはドラッグされている項目の数がセットされます。もしそのドロップ対象が1つの項目のドロップだけを受け付ける場合には、ドラッグされた項目すべてを拒否することもできますし、最初の項目だけを受け取ることもできます。複数の項目の受け取りを拒否するには、dragoverイベントをキャンセルしないか、<a class="internal" href="/Ja/DragDrop/DataTransfer#effectAllowed.28.29" title="Ja/DragDrop/DataTransfer#effectAllowed.28.29">effectAllowed</a>プロパティに<code>none</code>を指定します。他のイベントリスナがすでにイベントをキャンセルしている場合に備えて、両方を実行しても構いません。</p> -<p>ドロップされた項目のうち最初の項目だけを扱う場合は、1つだけの項目のドラッグの場合と同様に<a class="internal" href="/Ja/DragDrop/DataTransfer#getData.28.29" title="Ja/DragDrop/DataTransfer#getData.28.29">getData</a>を使います。これは、何も追加の処理が必要ないドロップ項目を1つだけ受け取るドロップ対象のために有用です。</p> -<p>それに対して、任意のインデックスの項目をデータトランスファーから取得するには<a class="internal" href="/Ja/DragDrop/DataTransfer#mozGetDataAt.28.29" title="Ja/DragDrop/DataTransfer#mozGetDataAt.28.29">mozGetDataAt</a>メソッドを使います。以下の例は、ドラッグされたファイルを取得し、それらを配列に追加するものです。</p> +<p>複数のファイルがドラッグされているかどうかを確認するには、<a class="internal" href="/Ja/DragDrop/DataTransfer#mozItemCount.28.29">mozItemCount</a>プロパティを調べます。このプロパティにはドラッグされている項目の数がセットされます。もしそのドロップ対象が1つの項目のドロップだけを受け付ける場合には、ドラッグされた項目すべてを拒否することもできますし、最初の項目だけを受け取ることもできます。複数の項目の受け取りを拒否するには、dragoverイベントをキャンセルしないか、<a class="internal" href="/Ja/DragDrop/DataTransfer#effectAllowed.28.29">effectAllowed</a>プロパティに<code>none</code>を指定します。他のイベントリスナがすでにイベントをキャンセルしている場合に備えて、両方を実行しても構いません。</p> +<p>ドロップされた項目のうち最初の項目だけを扱う場合は、1つだけの項目のドラッグの場合と同様に<a class="internal" href="/Ja/DragDrop/DataTransfer#getData.28.29">getData</a>を使います。これは、何も追加の処理が必要ないドロップ項目を1つだけ受け取るドロップ対象のために有用です。</p> +<p>それに対して、任意のインデックスの項目をデータトランスファーから取得するには<a class="internal" href="/Ja/DragDrop/DataTransfer#mozGetDataAt.28.29">mozGetDataAt</a>メソッドを使います。以下の例は、ドラッグされたファイルを取得し、それらを配列に追加するものです。</p> <pre>function onDrop(event) { var files = []; @@ -47,15 +47,15 @@ dt.mozClearDataAt("text/plain", 1); files.push(dt.mozGetDataAt("application/x-moz-file", i)); } </pre> -<p><a class="internal" href="/Ja/DragDrop/DataTransfer#mozTypesAt.28.29" title="Ja/DragDrop/DataTransfer#mozTypesAt.28.29">mozTypesAt</a>メソッドを使って、望んでいる形式のデータが存在しているかどうかを確かめたいとも思うでしょう。<a class="internal" href="/Ja/DragDrop/DataTransfer#types.28.29" title="Ja/DragDrop/DataTransfer#types.28.29">types</a>プロパティと同様に、このメソッドは、その項目が保持しているデータの型の文字列を返します。<a class="internal" href="/Ja/DragDrop/DataTransfer#types.28.29" title="Ja/DragDrop/DataTransfer#types.28.29">types</a>プロパティを取得する事は、インデックスが0の項目の型のリストを取得する事に等しいです。</p> +<p><a class="internal" href="/Ja/DragDrop/DataTransfer#mozTypesAt.28.29">mozTypesAt</a>メソッドを使って、望んでいる形式のデータが存在しているかどうかを確かめたいとも思うでしょう。<a class="internal" href="/Ja/DragDrop/DataTransfer#types.28.29">types</a>プロパティと同様に、このメソッドは、その項目が保持しているデータの型の文字列を返します。<a class="internal" href="/Ja/DragDrop/DataTransfer#types.28.29">types</a>プロパティを取得する事は、インデックスが0の項目の型のリストを取得する事に等しいです。</p> <pre>var types = event.dataTransfer.mozTypesAt(1); </pre> <h2 id="文字列でないデータのドラッグ">文字列でないデータのドラッグ</h2> -<p>上で解説した追加のメソッドが扱えるデータは文字列に限定されず、どんな種類のデータでも指定することができます。例えば、ファイルは<a class="internal" href="/Ja/DragDrop/Recommended_Drag_Types#file" title="Ja/DragDrop/Recommended Drag Types#file">application/x-moz-file</a>型で<a class="internal" href="/ja/nsIFile" title="ja/nsIFile">nsIFile</a>のオブジェクトとして保持されてドラッグされます。<code>setData</code>メソッドは文字列しかサポートしておらず、 ドラッグするファイルを指定するのには利用できないため、代わりに<a class="internal" href="/Ja/DragDrop/DataTransfer#mozSetDataAt.28.29" title="Ja/DragDrop/DataTransfer#mozSetDataAt.28.29">mozSetDataAt</a>メソッドを使わなくてはなりません。</p> +<p>上で解説した追加のメソッドが扱えるデータは文字列に限定されず、どんな種類のデータでも指定することができます。例えば、ファイルは<a class="internal" href="/Ja/DragDrop/Recommended_Drag_Types#file">application/x-moz-file</a>型で<a class="internal" href="/ja/nsIFile">nsIFile</a>のオブジェクトとして保持されてドラッグされます。<code>setData</code>メソッドは文字列しかサポートしておらず、 ドラッグするファイルを指定するのには利用できないため、代わりに<a class="internal" href="/Ja/DragDrop/DataTransfer#mozSetDataAt.28.29">mozSetDataAt</a>メソッドを使わなくてはなりません。</p> <pre>dt.mozSetDataAt("application/x-moz-file", file, 0); </pre> <p>複数の項目を扱う必要がない場合でも、このメソッドを使うことによって任意のオブジェクトをデータに指定できます。この場合には、インデックスとして0を指定しておきます。</p> -<p>同様に、ファイルやその他のオブジェクトを取得するには<a class="internal" href="/Ja/DragDrop/DataTransfer#mozGetDataAt.28.29" title="Ja/DragDrop/DataTransfer#mozGetDataAt.28.29">mozGetDataAt</a>メソッドを使う必要があります。もし<a class="internal" href="/Ja/DragDrop/DataTransfer#getData.28.29" title="Ja/DragDrop/DataTransfer#getData.28.29">getData</a>を使った場合は、値が文字列でない型のデータは空文字として取得されます。ただし、数値のような単純な型のデータについては文字列に変換できるため、この場合は<a class="internal" href="/Ja/DragDrop/DataTransfer#getData.28.29" title="Ja/DragDrop/DataTransfer#getData.28.29">getData</a>を使っても問題ありません。</p> +<p>同様に、ファイルやその他のオブジェクトを取得するには<a class="internal" href="/Ja/DragDrop/DataTransfer#mozGetDataAt.28.29">mozGetDataAt</a>メソッドを使う必要があります。もし<a class="internal" href="/Ja/DragDrop/DataTransfer#getData.28.29">getData</a>を使った場合は、値が文字列でない型のデータは空文字として取得されます。ただし、数値のような単純な型のデータについては文字列に変換できるため、この場合は<a class="internal" href="/Ja/DragDrop/DataTransfer#getData.28.29">getData</a>を使っても問題ありません。</p> <h2 id="複数項目のドロップの例">複数項目のドロップの例</h2> <p>以下は、ドロップされた項目のデータとその形式を一覧表示するボックスの例です。</p> <pre><html> @@ -103,7 +103,7 @@ function output(text) </body> </html> </pre> -<p>この例は、<a class="internal" href="/ja/DOM/event.preventDefault" title="ja/DOM/event.preventDefault">preventDefault</a>メソッドによって<code>dragenter</code>イベントと<code>dragover</code>イベントを両方ともキャンセルします。これにより、要素の上でのドロップが可能になっています。</p> -<p>項目をドロップした時に、<code>dodrop</code>関数が呼ばれます。この関数は<a class="internal" href="/Ja/DragDrop/DataTransfer#mozItemCount.28.29" title="Ja/DragDrop/DataTransfer#mozItemCount.28.29">mozItemCount</a>プロパティを見て、いくつの項目がドロップされたのかを調べ、それらに繰り返し処理を行います。それぞれの項目について、型の一覧を得るために<a class="internal" href="/Ja/DragDrop/DataTransfer#mozTypesAt.28.29" title="Ja/DragDrop/DataTransfer#mozTypesAt.28.29">mozTypesAt</a>メソッドが呼ばれます。この一覧の生成処理は、ドラッグに対して関連づけられたすべてのデータに対して繰り返されます。</p> +<p>この例は、<a class="internal" href="/ja/DOM/event.preventDefault">preventDefault</a>メソッドによって<code>dragenter</code>イベントと<code>dragover</code>イベントを両方ともキャンセルします。これにより、要素の上でのドロップが可能になっています。</p> +<p>項目をドロップした時に、<code>dodrop</code>関数が呼ばれます。この関数は<a class="internal" href="/Ja/DragDrop/DataTransfer#mozItemCount.28.29">mozItemCount</a>プロパティを見て、いくつの項目がドロップされたのかを調べ、それらに繰り返し処理を行います。それぞれの項目について、型の一覧を得るために<a class="internal" href="/Ja/DragDrop/DataTransfer#mozTypesAt.28.29">mozTypesAt</a>メソッドが呼ばれます。この一覧の生成処理は、ドラッグに対して関連づけられたすべてのデータに対して繰り返されます。</p> <p>この例は、あるドラッグ操作が保持しているデータを確かめたい時に便利です。ただ項目をこの例のドロップ対象にドロップするだけで、ドラッグされたどの項目がどんな形式でどのようなデータを保持しているのかを見ることができます。</p> <p>{{ languages( { "en": "En/DragDrop/Dragging_and_Dropping_Multiple_Items" } ) }}</p> diff --git a/files/ja/web/api/indexeddb_api/basic_terminology/index.html b/files/ja/web/api/indexeddb_api/basic_terminology/index.html new file mode 100644 index 0000000000..e03aeb6c1d --- /dev/null +++ b/files/ja/web/api/indexeddb_api/basic_terminology/index.html @@ -0,0 +1,206 @@ +--- +title: IndexedDB の主な特徴と基本用語 +slug: Web/API/IndexedDB_API/Basic_Terminology +tags: + - Advanced + - IndexedDB + - terminology +translation_of: Web/API/IndexedDB_API/Basic_Terminology +--- +<p>{{DefaultAPISidebar("IndexedDB")}}</p> + +<div class="summary"> +<p>この記事では IndexedDB の主な特徴を説明し、IndexedDB API の理解に関連する重要な用語を紹介しています。</p> +</div> + +<p>また、以下の記事も参考になるでしょう。</p> + +<ul> + <li>APIの使用方法に関する詳細なチュートリアルについては、<a href="/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB">IndexedDB の使用</a>を参照してください。</li> + <li>IndexedDB API のリファレンス文書については、<a href="/ja/docs/Web/API/IndexedDB_API">IndexedDB API</a> のメイン記事と、IndexedDB で使用されるオブジェクトの型を記したそのサブページを参照してください。</li> + <li>ブラウザーがバックグラウンドでデータを保存する方法の詳細については、<a href="/ja/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria">ブラウザーのストレージ制限と削除基準</a>を参照してください。</li> +</ul> + +<h2 id="key_characteristics">主な特徴</h2> + +<p>IndexedDB は、ユーザーのブラウザー内にデータを永続的に保存するための方法です。ネットワークの利用可否にかかわらず、豊富なクエリー機能を備えたウェブアプリケーションを作成できるため、オンラインでもオフラインでも動作します。IndexedDB は、大量のデータを保存するアプリケーション (貸し出し用図書館の DVD カタログなど) や、インターネットへの持続的な接続を必要としないアプリケーション (メールクライアント、ToDo リスト、メモ帳など) に有効です。</p> + +<p>IndexedDB では、「キー」に基づいてインデックス化されたオブジェクトを保存・取得することができます。データベースへの変更は、すべてトランザクション内で行われます。多くのウェブストレージ技術と同様に、IndexedDB は<a href="https://www.w3.org/Security/wiki/Same_Origin_Policy">同一オリジンポリシー</a>に従っています。そのため、ドメイン内の保存データにはアクセスできますが、異なるドメイン間のデータにはアクセスできません。</p> + +<p>他の種類のデータベースでの作業を前提としていると、IndexedDB での作業に戸惑うことがあるかもしれません。そのため、以下のような IndexedDB の主な特徴を覚えておくことが重要です。</p> + +<ul> + <li> + <p><strong>IndexedDB データベースは、キーと値の組を格納します。</strong>値は複雑な構造のオブジェクトで、キーはそのオブジェクトのプロパティです。オブジェクトの任意のプロパティを使用するインデックスを作成して、迅速な検索や並べ替えされた列挙を行うことができます。キーにはバイナリーオブジェクトを使用することができます。</p> + </li> + <li> + <p><strong>IndexedDBは、トランザクションデータベースモデルに基づいて構築されています</strong>。IndexedDB で行うことは、常に<a href="#gloss_transaction">トランザクション</a>のコンテキストで行われます。IndexedDB の API には、インデックス、テーブル、カーソルなどを表す多くのオブジェクトが用意されていますが、これらはそれぞれ特定のトランザクションに関連付けられています。そのため、トランザクションの外でコマンドを実行したり、カーソルを開いたりすることはできません。トランザクションには十分に定義された有効期間があるため、トランザクションが完了した後に使用しようとすると、例外が発生します。また、トランザクションは自動コミットされ、手動でコミットすることはできません。</p> + + <p>このトランザクションモデルは、ユーザーがウェブアプリケーションの 2 つのインスタンスを 2 つの異なるタブで同時に開いた場合のことを考えると、とても有用です。トランザクション操作がなければ、 2 つのインスタンスが互いの変更に干渉してしまう可能性があります。データベースのトランザクションに慣れていない方は、<a class="link-https" href="https://ja.wikipedia.org/wiki/%E3%83%88%E3%83%A9%E3%83%B3%E3%82%B6%E3%82%AF%E3%82%B7%E3%83%A7%E3%83%B3">Wikipedia のトランザクションに関する記事</a>をご覧ください。また、「定義」の章の<a href="#gloss_transaction">トランザクション</a>もご覧ください。</p> + </li> + <li> + <p><strong>IndexedDB API は、ほとんどが非同期です。</strong>API は値を返すことでデータを提供するわけではありません。コールバック関数を渡す必要があります。同期的な方法でデータベースに値を「格納」したり、データベースから値を「取り出す」ことはしません。代わりに、データベース操作を「リクエスト」します。操作が終了すると DOM イベントで通知され、そのイベントの種類によって操作が成功したか失敗したかが分かります。最初は少し複雑に聞こえるかもしれませんが、そこには健全性を保つための対策が組み込まれています。これは、<a href="/ja/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a> が動作する方法と大きな違いはありません。</p> + </li> + <li> + <p><strong>IndexedDB は多くのリクエストを使用します。</strong>リクエストは、前述の成功または失敗の DOM イベントを受け取るオブジェクトです。このオブジェクトには <code>onsuccess</code> と <code>onerror</code> のプロパティがあり、<code>addEventListener()</code> と <code>removeEventListener()</code> を呼び出すことができます。また、<code>readyState</code>、<code>result</code>、<code>errorCode</code> の各プロパティがあり、リクエストの状態を知ることができます。<code>result</code> プロパティは、リクエストの生成方法 (例えば <code>IDBCursor</code> インスタンスや、データベースに挿入したばかりの値のキー) に応じて、さまざまなものになるため、特に魔法のようなものです。</p> + </li> + <li> + <p><strong>IndexedDB は DOM イベントを使って、結果が利用可能になったことを通知します。</strong> DOM イベントには、必ず <code>type</code> プロパティがあります (IndexedDB では、最も一般的に <code>"success"</code> または <code>"error"</code> に設定されます)。また、DOM イベントには、イベントの目的地を示す <code>target</code> プロパティがあります。ほとんどの場合、イベントの <code>target</code> は、何らかのデータベース操作の結果として生成された <code>IDBRequest</code> オブジェクトです。成功イベントはバブルアップしませんし、キャンセルもできません。一方、エラーイベントはバブリングします、キャンセルも可能です。これは非常に重要なことで、エラーイベントはキャンセルされない限り、実行中のトランザクションを中断します。</p> + </li> + <li> + <p><strong>IndexedDB はオブジェクト指向です。</strong> IndexedDB は、行と列の集合体であるテーブルを持つリレーショナルデータベースではありません。この重要かつ根本的な違いは、アプリケーションの設計・構築方法に影響します。</p> + + <p>従来のリレーショナルデータストアでは、データの行と名前の付いたデータの列の集合体を格納するテーブルがあります。一方、IndexedDB では、データの種類に応じてオブジェクトストアを作成し、そのストアに JavaScript オブジェクトを永続化する必要があります。各オブジェクトストアには、クエリや反復処理を効率的に行うためのインデックスのコレクションを持つことができます。オブジェクト指向データベース管理システムに慣れていない方は、<a href="https://ja.wikipedia.org/wiki/%E3%82%AA%E3%83%96%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88%E3%83%87%E3%83%BC%E3%82%BF%E3%83%99%E3%83%BC%E3%82%B9">Wikipedia のオブジェクトデータベースの記事</a>をお読みください。</p> + </li> + <li> + <p><strong>IndexedDB は Structured Query Language (<abbr>SQL</abbr>) を使用しません。</strong>インデックスに対するクエリーを使用してカーソルを生成し、そのカーソルを使用して結果セットを反復処理します。NoSQL システムについてよく知らない方は、<a href="https://ja.wikipedia.org/wiki/NoSQL">Wikipedia の NoSQL に関する記事</a>をご覧ください。</p> + </li> + <li> + <p><a name="origin"><strong>IndexedDB は、同一オリジンポリシーを採用しています</strong></a>。オリジンとは、スクリプトを実行している文書の URL のドメイン、アプリケーション層のプロトコル、およびポートのことです。各オリジンには、それぞれ関連するデータベースのセットがあります。すべてのデータベースには、オリジン内で識別するための名前があります。</p> + + <p>IndexedDB にはセキュリティ境界が課せられており、アプリケーションが異なるオリジンのデータにアクセスすることを防ぎます。例えば、<a href="https://www.example.com/app/">http://www.example.com/app/</a> のアプリやページは、<a href="https://www.example.com/dir/">http://www.example.com/dir/</a> からはオリジンが同じであるためデータを取得することができますが、<a href="https://www.example.com:8080/dir/">http://www.example.com:8080/dir/</a> (ポートが異なる) や <a class="link-https" href="https://www.example.com/dir/">https://www.example.com/dir/</a> (プロトコルが異なる) からは、オリジンが異なるためデータを取得することはできません。</p> + + <div class="note"><strong>メモ</strong>: サードパーティのウィンドウコンテンツ (例: {{htmlelement("iframe")}} コンテンツ) は、ブラウザーがサードパーティのクッキーを受け入れないように設定されていない限り、埋め込まれたオリジンの IndexedDB ストアにアクセスすることができます ({{bug("1147821")}} を参照)。</div> + </li> +</ul> + +<h3 id="limitations">制限事項</h3> + +<p>IndexedDB は、クライアントサイドのストレージを必要とするほとんどのケースをカバーするように設計されています。しかし、以下のようないくつかのケースには対応していません。</p> + +<ul> + <li>国際化に対応した並べ替え。すべての言語で文字列が同じように並べ替えされるわけではないので、国際化に対応した並べ替えには対応していません。データベースは特定の国際化に対応した順序でデータを保存することはできませんが、データベースから読み取ったデータを自分で並べ替えすることはできます。ただし、Firefox 43 以降、実験的なフラグを有効にすることで、<a href="/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB#locale-aware_sorting">ロケールを考慮した並べ替え</a>が可能になっています (現在は Firefox のみ)。</li> + <li>同期。この API は、サーバー側のデータベースとの同期を行うようには設計されていません。クライアント側の indexedDB データベースとサーバー側のデータベースを同期させるコードを書く必要があります。</li> + <li>全文検索。この API には、 SQL の <code>LIKE</code> 演算子に相当するものがありません。</li> +</ul> + +<p>また、以下のような条件でブラウザーがデータベースを消去することがあるので注意が必要です。</p> + +<ul> + <li>ユーザーが消去を要求した場合。多くのブラウザーには、Cookie、ブックマーク、保存されたパスワード、IndexedDB データなど、特定のウェブサイトに保存されたすべてのデータを消去できる設定があります。</li> + <li>ブラウザーがプライベートブラウジングモードになっている場合。一部のブラウザーには、「プライベートブラウジング」 (Firefox) または「シークレット」 (Chrome) モードがあります。セッションの終了時に、ブラウザーはデータベースを消去します。</li> + <li>ディスクまたはクォータの容量の上限に達した場合。</li> + <li>データが破損した場合。</li> + <li>この機能に対して互換性のない変更が行われた場合。</li> +</ul> + +<p>正確な状況やブラウザーの機能は時間とともに変化しますが、ブラウザーベンダーの一般的な考え方は、可能な限りデータを残すために最善の努力をするというものです。</p> + +<h2 id="core_terminology">主な用語</h2> + +<p>この節では、IndexedDB API の理解に関連する主な用語を定義および説明します。</p> + +<h3 id="database">データベース</h3> + +<dl> + <dt><a name="gloss_database">データベース (database)</a></dt> + <dd>ふつう 1 つ以上の<a href="#gloss_object_store"><em>オブジェクトストア</em></a>で構成される、情報の格納庫です。それぞれのデータベースには以下のものがあります。 + <ul> + <li>名前。これは、特定のオリジン内でデータベースを識別し、その生涯を通じて一定です。名前は任意の文字列値 (空文字列を含む) とすることができます。</li> + <li> + <p>現在の<a href="#gloss_version"><em>バージョン</em></a>。データベースが最初に作成されたとき、特に指定がなければそのバージョンは整数の 1 です。各データベースは、常に 1 つのバージョンしか持つことができません。</p> + </li> + </ul> + </dd> + <dt><a name="durable">永続性 (durable)</a></dt> + <dd> + <p>Firefox では、IndexedDB は以前は<strong>永続性</strong>がありました。つまり、読み書きトランザクションにおいて、すべてのデータがディスクにフラッシュされたことが保証されたときにのみ、{{domxref("IDBTransaction.oncomplete")}} が発行されていました。</p> + + <p>Firefox 40 では、IndexedDB トランザクションは、パフォーマンスを向上させるために、他の IndexedDB に対応するブラウザーと同様に永続性の保証を緩和しています ({{Bug("1112702")}} を参照)。この場合、 {{Event("complete")}} イベントは、OS がデータの書き込みを指示した後に発生しますが、そのデータが実際にディスクにフラッシュされる前に発生する可能性もあります。そのため、イベントは以前よりも早く配信されるかもしれませんが、データがディスクにフラッシュされる前に OS がクラッシュしたり、システムの電源が切れたりすると、トランザクション全体が失われてしまう可能性がわずかながらあります。このような致命的な事象は稀であるため、ほとんどの人はこれ以上気にする必要はありません。</p> + + <div class="note"> + <p><strong>メモ</strong>: Firefox では、何らかの理由で永続性を確保したい場合 (たとえば、後で再計算できない重要なデータを保存している場合)、実験的な (標準外の) <code>readwriteflush</code> モードを使用してトランザクションを作成することで、<code>complete</code> イベントを配信する前にトランザクションをディスクに強制的にフラッシュさせることができます({{domxref("IDBDatabase.transaction")}} を参照)。これは現在実験的なものであり、<code>about:config</code> で <code>dom.indexedDB.experimental</code> 設定項目が <code>true</code> に設定されている場合にのみ使用できます。</p> + </div> + </dd> + <dt><a name="gloss_object_store">オブジェクトストア (object store)</a></dt> + <dd> + <p>データベースにデータを保存する仕組みです。オブジェクトストアはレコードを持続的に保持しており、これはキーと値の組です。オブジェクトストア内のレコードは、<em><a href="#gloss_key">キー</a></em>によって昇順に整列して保存されています。</p> + + <p>すべてのオブジェクトストアには、そのデータベース内で一意となる名前が必要です。オブジェクトストアは、オプションで<em><a href="#gloss_keygenerator">キージェネレーター</a></em>と<em><a href="#gloss_keypath">キーパス</a></em>を持つことができます。オブジェクトストアにキーパスがある場合は<em><a href="#gloss_inline_key">インラインキー</a></em>、ない場合は<em><a href="#gloss_outofline_key">アウトオブラインキー</a></em>が使用されます。</p> + + <p>オブジェクトストアのリファレンス文書は、 {{domxref("IDBObjectStore")}} を参照してください。</p> + </dd> + <dt><a name="gloss_version">バージョン (version)</a></dt> + <dd>始めにデータベースを生成したとき、バージョンは整数の 1 になります。それぞれのデータベースは、一度に 1 つのバージョンを持ちます。一度に複数のバージョンを持つことはできません。バージョンを変更する唯一の方法は、現在のバージョンより大きなバージョンでデータベースを開くことです。</dd> + <dt><a name="gloss_database_connection">データベース接続 (database connection)</a></dt> + <dd><em><a href="#gloss_database">データベース</a></em>を開くことで生成される操作です。データベースは同時に複数の接続を持つことができます。</dd> + <dt><a name="gloss_transaction">トランザクション (transaction)</a></dt> + <dd> + <p>特定のデータベースで行う、原子性を持つデータアクセスやデータ変更の操作のセットです。これは、データベース内のデータと対話する手段です。実際は、データベース内のデータの読み取りや変更はトランザクション内で実施しなければなりません。</p> + + <p>書き込みトランザクションの<a href="#scope"><em>スコープ</em></a>が重ならない限り、ひとつのデータベース接続で同時に複数のアクティブなトランザクションが存在できます。トランザクションのスコープは生成時に定義され、トランザクションがどのオブジェクトストアと対話できるかや、トランザクションの持続期間にわたって保持し続けるかを示します。よって例えば、データベース接続で <code>flyingMonkey</code> オブジェクトストアのみ対象とするスコープを持つ書き込みトランザクションがすでに存在するとき、<code>unicornCentaur</code> オブジェクトストアや <code>unicornPegasus</code> オブジェクトストアをスコープで持つ別のトランザクションを開始できます。読み取りトランザクションは、スコープが重なっていても複数実行できます。</p> + + <p>トランザクションは持続期間が短いものを除き、長時間のトランザクションがストレージ資源をロックする状況から解放するために、ブラウザーが終了させることができます。トランザクションは中止させることができ、トランザクションによるデータベースの変更箇所はロールバックされます。また、開始するトランザクションや中止するトランザクションを待つ必要はありません。</p> + + <p>トランザクションには <code>readwrite</code>、<code>readonly</code>、<code>versionchange</code> の 3 つのモードがあります。オブジェクトストアやインデックスの生成および削除は、<a href="/ja/docs/Web/API/IDBDatabase/versionchange_event"><code>versionchange</code></a> トランザクションを使用する場合に限り実行できます。トランザクションのタイプについて詳しくは、<a href="/ja/docs/Web/API/IndexedDB_API">IndexedDB</a> のリファレンスをご覧ください。</p> + + <p>すべての操作はトランザクション内で発生しますので、トランザクションは IndexedDB の重要な概念です。トランザクションについて、特にバージョン付けとの関係については、{{domxref("IDBTransaction")}} および関連文書をご覧ください。ここにリファレンス文書もあります。</p> + </dd> + <dt><a name="gloss_request">リクエスト (request)</a></dt> + <dd>データベースの読み書きを実施する操作です。すべてのリクエストは、ひとつの読み取りまたは書き込みの操作を表します。</dd> + <dt><a name="gloss_index">インデックス (index)</a></dt> + <dd> + <p>インデックスは<em>参照先オブジェクトストア (referenced object store)</em> から呼び出されて、別のオブジェクトストアのレコードを検索するための特別なオブジェクトストアです。インデックスは持続的なキーと値のストレージであり、インデックスのレコードの値は、参照先オブジェクトストアのレコードのキーです。インデックス内のレコードは、参照先オブジェクトストアでレコードが挿入、更新、削除されるたびに、自動的に収集されます。インデックス内の各レコードは参照先オブジェクトストア内のレコードをひとつだけ示すことができますが、複数のインデックスが同一のオブジェクトストアを参照することもできます。オブジェクトストアが変更されると、そのオブジェクトストアを参照するすべてのインデックスが自動的に更新されます。</p> + + <p>代わりに、<a href="#gloss_key">キー</a>を使用してオブジェクトストア内のレコードを検索することもできます。</p> + + <p>インデックスの使用法について詳しくは、<a href="/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB#using_an_index" title="IndexedDB/Using_IndexedDB#Using_an_index">IndexedDB を使用する</a>をご覧ください。インデックスのリファレンス文書として、<a href="/ja/docs/Web/API/IDBKeyRange" rel="internal">IDBKeyRange</a> をご覧ください。</p> + </dd> +</dl> + +<h3 id="key">キーと値</h3> + +<dl> + <dt><a name="gloss_key">キー (key)</a></dt> + <dd> + <p>オブジェクトストアに保存された値は、このデータ値によって編成および取り出しされます。オブジェクトストアは<em><a href="#gloss_keygenerator">キージェネレーター</a></em>、<em><a href="#gloss_keypath">キーパス</a></em>、明示的に指定した値の、3 種類の生成源のいずれかからキーを得られます。キーは、自身の前にあるものより大きな数値を持つデータ型であることが必要です。オブジェクトストア内の各レコードはオブジェクトストア内で一意のキーを持たなければならず、オブジェクトストア内で複数のレコードが同じキーを持つことはできません。</p> + + <p>キーは <a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/String">文字列</a>、<a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/Date">date</a>、浮動小数点数値、<a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/Array">配列</a>のいずれかの型を使用できます。配列では、キーは空の値から無限大までの範囲を使用できます。また、配列の中に配列を含めることができます。文字列または整数値のキーしか使用できないという条件はありません。</p> + + <p>代わりに、<em><a href="#gloss_index">インデックス</a>を使用してオブジェクトストア内のレコードを検索することもできます。</em></p> + </dd> + <dt><a name="gloss_keygenerator">キージェネレーター (key generator)</a></dt> + <dd>指定した順序で新たなキーを生成する仕組みです。オブジェクトストアがキージェネレーターを持たない場合は、保存するレコードのキーをアプリケーションが提供しなければなりません。ジェネレーターはストア間で共有しません。これはむしろブラウザーの実装の細部であり、Web 開発において実際にはキージェネレーターの生成やアクセスは行いません。</dd> + <dt><a name="gloss_inline_key">インラインキー (in-line key)</a></dt> + <dd>保存される値の一部として保存されるキーです。これは<em>キーパス</em>を使用して見つけます。インラインキーは、ジェネレーターを使用して生成できます。キーが生成されると、キーパスを使用してキーを値の中に保存したり、キーとして使用したりすることができます。</dd> + <dt><a name="gloss_outofline_key">アウトオブラインキー (out-of-line key)</a></dt> + <dd>保存する値とは別に保存されるキーです。</dd> + <dt><a name="gloss_keypath">キーパス (key path)</a></dt> + <dd>オブジェクトストアやインデックスのどこからブラウザーがキーを取り出すべきかを定義します。有効なキーパスは空文字列、JavaScript の識別子、ピリオドで区切られた複数の JavaScript の識別子、あるいはそれらを収めた配列のいずれかを含むことができます。空白を含むことはできません。</dd> + <dt><a name="gloss_value">値 (value)</a></dt> + <dd> + <p>それぞれのレコードは値を持っており、<a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/Boolean" rel="internal">論理値</a>、<a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/Number" rel="internal">数値</a>、<a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/String">文字列</a>、<a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/Date">date</a>、<a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/Object">オブジェクト</a>、<a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/Array" rel="internal">配列</a>、<a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/RegExp" rel="internal">正規表現</a>、<a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/undefined">undefined</a>、null を含む、JavaScript で表現可能なものをどれでも含むことができます。</p> + + <p>オブジェクトまたは配列を保存する場合は、それらのプロパティや値もまた、有効な値をどれでも持つことができます。</p> + + <p>また、<a href="/ja/docs/Web/API/Blob">Blob</a> やファイルも保存可能です。<a href="https://dvcs.w3.org/hg/IndexedDB/raw-file/tip/Overview.html">仕様書</a> をご覧ください。</p> + </dd> +</dl> + +<h3 id="range">レンジとスコープ</h3> + +<dl> + <dt id="scope"><a id="gloss_scope" name="gloss_scope">スコープ (scope)</a></dt> + <dd>トランザクションの適用先であるオブジェクトストアやインデックスのセットです。読み取りのみのトランザクションのスコープは、同時に重ね合ったり実行することができます。一方、書き込みトランザクションのスコープは重ね合うことができません。同時に同一のスコープで複数のトランザクションを開始することはできますが、それらはキューに収められ、順番に実行されます。</dd> + <dt id="cursor"><a id="gloss_cursor">カーソル (cursor)</a></dt> + <dd><em>キーレンジ</em>に属する複数のレコードにわたって反復処理を行うための仕組みです。カーソルは、反復処理を行うインデックスやオブジェクトストアがどれかを示す source を持ちます。またレンジ内の位置や、レコードキーの順序について増加方向に移動しているか減少方向に移動しているかの情報も持ちます。カーソルのリファレンス文書として、{{domxref("IDBCursor")}} をご覧ください。</dd> + <dt id="key_range"><a id="gloss_keyrange">キーレンジ (key range)</a></dt> + <dd> + <p>キーとして使用する、何らかのデータ型の連続的な区間です。キーまたはキーレンジを使用して、オブジェクトストアやインデックスからレコードを取り出すことができます。下限または上限を使用して、レンジを制限またはフィルターリングできます。例えばキーが x から y の間であるすべての値に対して、反復処理を行うことができます。</p> + + <p>キーレンジのリファレンス文書として、{{domxref("IDBKeyRange")}} をご覧ください。</p> + </dd> +</dl> + +<h2 id="next">次のステップ</h2> + +<p>IndexedDB の主な特徴と主要な用語を理解できたら、より具体的な作業に入ることができます。API の使い方のチュートリアルについては、<a href="/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB">IndexedDB の使用</a>をご覧ください。</p> + +<h2 id="See_also">関連情報</h2> + +<ul> + <li><a href="https://www.w3.org/TR/IndexedDB/">Indexed Database API 仕様書</a></li> + <li><a href="/ja/docs/Web/API/IndexedDB_API">IndexedDB API リファレンス</a></li> + <li><a href="/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB">IndexedDB の使用</a></li> + <li><a href="https://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx">IndexedDB — The Store in Your Browser</a></li> +</ul> diff --git a/files/ja/web/api/indexeddb_api/browser_storage_limits_and_eviction_criteria/index.html b/files/ja/web/api/indexeddb_api/browser_storage_limits_and_eviction_criteria/index.html index 47c47bad45..0db54a15b6 100644 --- a/files/ja/web/api/indexeddb_api/browser_storage_limits_and_eviction_criteria/index.html +++ b/files/ja/web/api/indexeddb_api/browser_storage_limits_and_eviction_criteria/index.html @@ -16,12 +16,12 @@ translation_of: Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criter <p class="summary">クライアント側 (すなわちローカルディスク) に何らかのデータを保存するウェブ技術は何種類かがあります。ブラウザーがどれだけの容量をウェブデータストレージに割り当てるかや、容量の上限に達したときにどのデータを削除するかのプロセスは単純ではなく、またブラウザーにより異なります。この記事では、必要なローカルストレージの容量を確保するために、いつどのローカルコンテンツを破棄するのかをどうやって特定するのかを説明します。</p> <div class="note"> -<p><strong>メモ</strong>: 以下の情報はほとんどの最新ブラウザーでおおむね正確ですが、既知の詳細情報も記載しています。 Opera および Chrome は、すべての場合において同じ動作になるでしょう。 <a href="http://www.opera.com/mobile/mini">Opera Mini</a> (Presto ベースで、サーバー側でレンダリングする) は、クライアントにデータを保存しません。</p> +<p><strong>メモ</strong>: 以下の情報はほとんどの最新ブラウザーではおおむね正確ですが、ブラウザー固有の注意事項も知られています。 Opera と Chrome は、すべての場合において同じ動作になるでしょう。 <a href="http://www.opera.com/mobile/mini">Opera Mini</a> (Presto ベースで、サーバー側でレンダリングする) は、クライアントにデータを保存しません。</p> </div> -<h2 id="What_technologies_use_browser_data_storage" name="What_technologies_use_browser_data_storage">ブラウザーのデータストレージを使用する技術は何か?</h2> +<h2 id="What_technologies_use_browser_data_storage">ブラウザーのデータストレージを使用する技術は何か?</h2> -<p>Firefox では以下の技術が、必要なデータを保存するためにブラウザーのデータストレージを使用します。ここではそれらの技術を "クォータクライアント" と呼びます。</p> +<p>Firefox では以下の技術が、必要なデータを保存するためにブラウザーのデータストレージを使用します。ここではこれらの技術を「クォータクライアント」と呼びます。</p> <ul> <li><a href="/ja/docs/Web/API/IndexedDB_API">IndexedDB</a></li> @@ -31,45 +31,45 @@ translation_of: Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criter </ul> <div class="note"> -<p><strong>メモ</strong>: Firefox では、 <a href="/ja/docs/Web/API/Web_Storage_API">Web Storage</a> もすぐに同じストレージ管理ツールとして使えるようになり、それはこの文書で記述します。</p> +<p><strong>メモ</strong>: Firefox では、<a href="/ja/docs/Web/API/Web_Storage_API">ウェブストレージ</a>もまもなく同じストレージ管理ツールを使い始めます。それはこの文書で記述します。</p> </div> <div class="note"> <p><strong>メモ</strong>: プライベートブラウジングモードは、大半のデータストレージに対応していません。ローカルストレージのデータと Cookie は保存されますが、短命です。 — 最後のプライベートブラウジングウィンドウを閉じた時にデータは消去されます。</p> </div> -<p>生成元の "最終アクセス日時" は、これらのいずれかによってアクティブ化/非アクティブ化される origin eviction によって、すべてのクォータクライアントでデータ削除が行われたときに更新されます。</p> +<p>オリジンの「最終アクセス日時」はこれらのうちの何れかがアクティブ化/非アクティブ化されたときに更新されます。オリジン立ち退き (origin eviction) によって、すべてのクォータクライアントでデータ削除が行われたときに更新されます。</p> -<p>Chrome/Opera では、 Quota Management API が <a href="/ja/docs/Web/HTML/Using_the_application_cache">AppCache</a>, <a href="/ja/docs/Web/API/IndexedDB_API">IndexedDB</a>, WebSQL, <a href="/ja/docs/Web/API/File_System_API">File System API</a> のクォータ管理を制御しています。</p> +<p>Chrome/Opera では、 Quota Management API が <a href="/ja/docs/Web/HTML/Using_the_application_cache">AppCache</a>, <a href="/ja/docs/Web/API/IndexedDB_API">IndexedDB</a>, WebSQL, <a href="/ja/docs/Web/API/File_and_Directory_Entries_API">File System API</a> のクォータ管理を制御しています。</p> -<h2 id="Different_types_of_data_storage" name="Different_types_of_data_storage">さまざまな種類のデータストレージ</h2> +<h2 id="Different_types_of_data_storage">さまざまな種類のデータストレージ</h2> <p>同じブラウザー内で同じ保存方法を使用していても、解釈されるデータストレージの種類はさまざまです。この章では、さまざまなブラウザーで見つけられる多様なストレージについて説明します。</p> <p>ストレージは 2 種類に分けられます。</p> <ul> - <li>永続的: 長期間にわたって保持されることを意図するデータです。これはユーザーが決断した場合にのみ削除されます (例えば Firefox では、各ページのページ情報ダイアログに "ストレージを消去" ボタンがあります)。</li> - <li>一時的: 長期間にわたって維持する必要がないデータです。ストレージの容量制限に達すると、もっとも過去に使用されたものから削除されます ({{anch("LRU policy", "LRU ポリシー")}})。</li> + <li>永続的なもの。長期間保存されることを意図したデータです。これは、ユーザーが選択した場合にのみ削除されます (たとえば、Firefox では、<em>設定</em>に進み、<em>プライバシーとセキュリティ > Cookie とサイトデータ</em>のオプションを使用することで、すべての保存データを削除するか、または選択したオリジンからの保存データのみを削除するかを選択できます)。</li> + <li>一時的なもの。長期間にわたって維持する必要がないデータです。{{anch("Storage limits", "ストレージの容量制限")}}に達すると、 {{anch("LRU policy", "LRU ポリシー")}}によりもっとも古く使用されたものから削除されます。</li> </ul> <p>Firefox では、永続的なストレージが使用されると、ユーザーにはデータが永続的になることを警告するポップアップが表示され、それが良いかどうかを尋ねます。一時的データストレージは明示的にユーザーにプロンプトを表示しません。</p> -<p>既定では、一時的なストレージがほとんどの使用環境 (例えば、標準的な Web アプリ) で使用され、永続的なストレージはインストールされたアプリ (例えば、Firefox OS やデスクトップ版 Firefox にインストールした Firefox アプリ、および Chrome アプリ) で使用されます。</p> +<p>ストレージは既定では一時的です。開発者は <a href="/ja/docs/Web/API/Storage_API">Storage API</a> で利用できる {{domxref("StorageManager.persist()")}} メソッドを使用して永続的なストレージにすることができます。</p> -<h2 id="Where_is_the_data_stored" name="Where_is_the_data_stored">データの保存先は?</h2> +<h2 id="Where_is_the_data_stored">データの保存先は?</h2> -<p>それぞれのストレージタイプが別々のリポジトリに相当しており、ユーザーの Firefox プロファイル内のディレクトリーとは以下のように対応づけられます (ほかのブラウザーでは、若干異なるでしょう):</p> +<p>それぞれのストレージ種別は、個別のリポジトリーーを表します。以下は、ユーザーの Firefox プロファイル下のディレクトリにおける実際のマッピングです (他のブラウザーでは若干異なる場合があります)。</p> <ul> - <li><code><profile>/storage</code> — クォータマネージャ (後述) に管理されている、ストレージの主要なトップレベルディレクトリーです。</li> - <li><code><profile>/storage/permanent</code> — 永続的なデータストレージのリポジトリです。</li> - <li><code><profile>/storage/temporary</code> — 一時的なデータストレージのリポジトリです。</li> - <li><code><profile>/storage/default</code> — 既定のデータストレージのリポジトリです。</li> + <li><code><profile>/storage</code> — クォータマネージャーー (後述) に管理されている、ストレージの主要な最上位ディレクトリーです。</li> + <li><code><profile>/storage/permanent</code> — 永続的なデータストレージのリポジトリーです。</li> + <li><code><profile>/storage/temporary</code> — 一時的なデータストレージのリポジトリーです。</li> + <li><code><profile>/storage/default</code> — 既定のデータストレージのリポジトリーです。</li> </ul> <div class="note"> -<p><strong>メモ</strong>: <a href="/ja/docs/Web/API/Storage_API">Storage API</a> の導入後は、"permanent" フォルダーは廃止されると考えられます。"permanent" フォルダーは IndexedDB の永続的なタイプのデータベースのみ保存します。ボックスモードが "best-effort" や "persistent" であっても、データは <profile>/storage/default 以下に保存されます。</p> +<p><strong>メモ</strong>: <a href="/ja/docs/Web/API/Storage_API">Storage API</a> の導入後は、"permanent" フォルダーは廃止されると考えられます。"permanent" フォルダーは IndexedDB の永続的な種類のデータベースのみ保存します。ボックスモードが "best-effort" や "persistent" であっても、データは <profile>/storage/default 以下に保存されます。</p> </div> <div class="note"> @@ -81,52 +81,52 @@ translation_of: Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criter </div> <div class="note"> -<p><strong>メモ</strong>: ユーザーが <code><profile>/storage</code> の配下に、独自のディレクトリーやファイルを作成すべきではありません。このようなことを行うと、ストレージの初期化が失敗します。例えば、{{domxref("IDBFactory.open()", "open()")}} でエラーイベントが発生します。</p> +<p><strong>メモ</strong>: ユーザーが <code><profile>/storage</code> の配下に、独自のディレクトリーやファイルを作成すべきではありません。このようなことを行うと、ストレージの初期化に失敗します。例えば、{{domxref("IDBFactory.open()", "open()")}} でエラーイベントが発生します。</p> </div> -<h2 id="Storage_limits" name="Storage_limits">ストレージの制限</h2> +<h2 id="Storage_limits">ストレージの制限</h2> -<p>ブラウザーのストレージの最大容量は動的であり、ハードディスクドライブのサイズに応じて変わります。<strong>グローバルリミット</strong>はディスクの空き量量の 50% に決められます。Firefox では、クォータマネージャと飛ばれる内部のブラウザーツールが生成元ごとにどれだけディスク容量を使用しているかを絶えず注視しており、必要に応じてデータを削除します。</p> +<p>ブラウザーのストレージの最大容量は動的であり、ハードディスクドライブのサイズに応じて変わります。<strong>グローバルリミット</strong>はディスクの空き量量の 50% に決められます。Firefox では、クォータマネージャーと飛ばれる内部のブラウザーツールがオリジンごとにどれだけディスク容量を使用しているかを絶えず注視しており、必要に応じてデータを削除します。</p> -<p>従ってハードディスクドライブが 500GB であれば、ブラウザーの合計ストレージサイズは 250GB になります。上限に達すると <strong>origin eviction</strong> と呼ばれる処理を実行して、ストレージの総量が再び上限を下回るまで、生成元全体に相当するデータを削除します。生成元内の一部分を削除するような縮小法はありません。生成元内のひとつのデータベースだけ削除すると、矛盾の問題が発生するおそれがあります。</p> +<p>従ってハードディスクドライブの空き容量が 500GB であれば、ブラウザーの合計ストレージサイズは 250GB になります。上限に達すると<strong>オリジン立ち退き (origin eviction)</strong> と呼ばれる処理を実行して、ストレージの総量が再び上限を下回るまで、オリジン全体に相当するデータを削除します。オリジン内の一部分を削除するような縮小法はありません。オリジン内のデータベースをひとつだけ削除すると、矛盾が発生するおそれがあります。</p> -<p>また、<strong>グループリミット</strong>というもうひとつの制限もあります。これは、グローバルリミットの 20% として定義されます。それぞれの生成元は、グループ (生成元のグループ) の一部です。グループは、eTLD+1 ドメインごとに 1 つ作られます。例えば次の通り:</p> +<p>また、<strong>グループリミット</strong>というもうひとつの制限もあります。これは、グローバルリミットの 20% として定義されます。それぞれのオリジンは、グループ (オリジンのグループ) の一部です。グループは、eTLD+1 ドメインごとに 1 つ作られます。例えば次の通りです。</p> <ul> - <li><code>mozilla.org</code> — グループ 1、生成元 1</li> - <li><code>www.mozilla.org</code> — グループ 1、生成元 2</li> - <li><code>joe.blogs.mozilla.org</code> — グループ 1、生成元 3</li> - <li><code>firefox.com</code> — グループ 2、生成元 4</li> + <li><code>mozilla.org</code> — グループ 1、オリジン 1</li> + <li><code>www.mozilla.org</code> — グループ 1、オリジン 2</li> + <li><code>joe.blogs.mozilla.org</code> — グループ 1、オリジン 3</li> + <li><code>firefox.com</code> — グループ 2、オリジン 4</li> </ul> <p>このグループでは <code>mozilla.org</code>、<code>www.mozilla.org</code>、<code>joe.blogs.mozilla.org</code> が、合わせてグローバルリミットの 20% を上限としてストレージを使用できます。<code>firefox.com</code> は、別に 20% の上限を持ちます。</p> -<p>これら 2 種類の制限は、制限に達したときの動作が異なります:</p> +<p>これら 2 種類の制限は、制限に達したときの動作が異なります。</p> <ul> - <li>グループリミットは "ハードリミット" とも呼ばれます。 origin eviction を発生させません。</li> - <li>グローバルリミットは、いくらかの領域が解放されて処理を継続できる可能性がありますので "ソフトリミット" です。</li> + <li>グループリミットは「ハードリミット」とも呼ばれます。オリジン立ち退きを発生させません。</li> + <li>グローバルリミットは、いくらかの領域が解放されて処理を継続できる可能性がありますので「ソフトリミット」です。</li> </ul> <div class="note"> -<p><strong>メモ</strong>: グループリミットは、上記で触れた最小のグループリミットにかかわらず、グローバルリミットより大きくすることはできません。グローバルリミットが 8MB といった本当に低メモリな状況では、グループリミットも 8MB となります。</p> +<p><strong>メモ</strong>: グループリミットは、上記で触れた最小のグループリミットにかかわらず、グローバルリミットより大きくすることはできません。グローバルリミットが 8MB といった本当にメモリーが少ない状況では、グループリミットも 8MB となります。</p> </div> <div class="note"> -<p><strong>メモ</strong>: グループリミットに達したとき、あるいは origin eviction で十分な空き容量を確保できないときは、ブラウザーで <code>QuotaExceededError</code> が発生します。</p> +<p><strong>メモ</strong>: グループリミットに達したとき、あるいはオリジン立ち退きで十分な空き容量を確保できないときは、ブラウザーで <code>QuotaExceededError</code> が発生します。</p> </div> <div class="note"> <p><strong>メモ</strong>: Chrome では、ソフトおよびハードのストレージのクォータの限界が <strong>M66</strong> から変更されました。詳しい情報は<a href="https://chromium.googlesource.com/chromium/src/+/refs/heads/master/storage/browser/quota/quota_settings.cc#68">こちら</a>にあります。</p> </div> -<h2 id="LRU_policy" name="LRU_policy">LRU ポリシー</h2> +<h2 id="LRU_policy">LRU ポリシー</h2> -<p>使用可能なディスク領域がすべて埋まったときは、クォータマネージャーが LRU ポリシーに基づいてデータの削除処理を始めます。もっとも過去に使用された生成元のデータが始めに削除され、上限に達しなくなるなるまで削除を繰り返します。</p> +<p>使用可能なディスク領域がすべて埋まったときは、クォータマネージャーーが LRU ポリシーに基づいてデータの削除処理を始めます。もっとも過去に使用されたオリジンのデータが始めに削除され、上限に達しなくなるなるまで削除を繰り返します。</p> -<p>一時的なストレージを使用して、生成元ごとに "最終アクセス日時" を記録しています。一時的なストレージがグローバルリミットに達する (後に上限をさらに超える) と、現在使用していない (すなわち、データストアを開き続けているタブやアプリがない) 生成元をすべて発見しようとします。これらは、"最終アクセス日時" によって整列されます。 origin eviction を発生させたリクエストを満たすのに十分な領域を確保するまで、もっとも過去に使用された生成元を削除し続けます。</p> +<p>一時的なストレージを使用して、オリジンごとに「最終アクセス日時」を記録しています。一時的なストレージがグローバルリミットに達する (後に上限をさらに超える) と、現在使用していない (すなわち、データストアを開き続けているタブやアプリがない) オリジンをすべて発見しようとします。これらは、「最終アクセス日時」によって整列されます。オリジン立ち退きを発生させたリクエストを満たすのに十分な領域を確保するまで、もっとも過去に使用されたオリジンを削除し続けます。</p> -<h2 id="See_also" name="See_also">関連情報</h2> +<h2 id="See_also">関連情報</h2> <ul> <li><a href="http://www.html5rocks.com/en/tutorials/offline/quota-research/">Working with quota on mobile browsers</a>, by<a href="http://blog.agektmr.com" title="Eiji Kitamura"> Eiji Kitamura.</a> モバイルブラウザーのクライアント側ストレージについて詳しく分析した記事。</li> diff --git a/files/ja/web/api/indexeddb_api/checking_when_a_deadline_is_due/index.html b/files/ja/web/api/indexeddb_api/checking_when_a_deadline_is_due/index.html new file mode 100644 index 0000000000..ac21ce3e45 --- /dev/null +++ b/files/ja/web/api/indexeddb_api/checking_when_a_deadline_is_due/index.html @@ -0,0 +1,213 @@ +--- +title: 期限の確認 +slug: Web/API/IndexedDB_API/Checking_when_a_deadline_is_due +tags: + - Apps + - Date + - Example + - Guide + - IndexedDB + - deadline +translation_of: Web/API/IndexedDB_API/Checking_when_a_deadline_is_due +--- +<div>{{DefaultAPISidebar("IndexedDB")}}</div><div class="summary"> +<p>この記事では、 IndexedDB で保存された期限と現在の日時を照合する複雑な例を見てみましょう。ここでの主な課題は、保存されている期限情報 (月、時、日など) を、<a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/Date">Date</a> オブジェクトから取得した現在の日時と照合することです。</p> +</div> + +<img alt="サンプルアプリのスクリーンショット。赤いメインタイトルの「To do app」、テスト用の To Do 項目、ユーザーが新しいタスクを入力するための赤いフォーム。" src="to-do-app.png"> + +<p>この記事で紹介するアプリケーションの例は、 <strong>To-do リスト通知</strong>です。これは、タスクのタイトルと期限を <a href="/ja/docs/Web/API/IndexedDB_API">IndexedDB</a> に格納し、期限になったときに <a href="/ja/docs/Web/API/Notification">Notification</a> および <a href="/ja/docs/Web/API/Vibration_API">Vibration</a> API を使ってユーザーに通知を行う、シンプルな To-do リストアプリケーションです。 <a href="https://github.com/chrisdavidmills/to-do-notifications/tree/gh-pages">To-do リスト通知アプリは GitHub ダウンロード</a>してソースコードをいじったり、<a href="https://mdn.github.io/to-do-notifications/">アプリの動作をライブで閲覧</a>したりすることができます。</p> + +<h2 id="The_basic_problem">基本的な問題点</h2> + +<p>この ToDo アプリでは、まず時間と日付の情報を、機械が読め、表示されたときに人間が理解できる形式で記録し、次にそれぞれの時間と日付が現在の時点で発生しているかどうかをチェックしたいと考えました。基本的には、現在の時刻と日付を確認し、保存されている各イベントの締め切りが現在の時刻と日付に一致するかどうかを確認します。もし一致していれば、ユーザーに何らかの通知をしたいと考えています。</p> + +<p>2 つの {{jsxref("Global_Objects/Date", "Date")}} オブジェクトを比較するだけなら簡単ですが、もちろん人間は JavaScript が理解できるような形式で期限を入力したいわけではありません。人間が読むことのできる日付はかなり違っていて、いくつもの異なる表現があります。</p> + +<h3 id="Recording_the_date_information">日付情報の記録</h3> + +<p>モバイル端末での合理的な使い勝手を提供するために、そして曖昧さを減らすために、 HTML フォームを作成することにしました。</p> + +<img alt="この ToDo アプリのフォームで、タスクのタイトルを入力するフィールドと、期限の年、月、日、時、分の値が入っています。" src="to-do-app-form2.png"> + +<ul> + <li>ToDo リストのタイトルを入力するためのテキスト入力です。これはユーザーの入力作業の中で最も避けられないものです。</li> + <li>期限の「時」と「分」を入力するための数値入力。 <code>type="number"</code> に対応しているブラウザーでは、小さな上下矢印の数字ピッカーが表示されます。モバイルプラットフォームでは、データを入力するためのテンキーが用意されていることが多く、これは便利です。他のプラットフォームでは、標準的なテキスト入力になりますが、これは問題ありません。</li> + <li>期限の日、月、年を入力するための {{HTMLElement("select")}} 要素。これらの値は、ユーザーにとって最も曖昧な入力となるため (7, sunday, sun? 04, 4, April, Apr? 2013, '13, 13?) 日は数値で、月は月名で、年は 4 桁の年号で記録されます。</li> +</ul> + +<p>フォームの送信ボタンが押されると、 <code>addData()</code> 関数が実行され、次のように始まります。</p> + +<pre class="brush: js">function addData(e) { + e.preventDefault(); + + if(title.value == '' || hours.value == null || minutes.value == null || day.value == '' || month.value == '' || year.value == null) { + note.innerHTML += '<li>Data not submitted — form incomplete.</li>'; + return; + } +</pre> + +<p>この部分では、フォームのフィールドにすべての情報が入力されているかどうかを確認します。記入されていない場合は、開発者通知ペイン (アプリの UI の左下を参照) にメッセージを表示して、何が起こっているのかをユーザーに伝え、機能を終了します。このステップは、主に HTML フォームの検証に対応していないブラウザーのためのものです (検証に対応しているブラウザーでは、 HTML で required 属性を使用して検証を強制しています)。</p> + +<pre class="brush: js"> else { + var newItem = [ + { + taskTitle: title.value, + hours : hours.value, + minutes : minutes.value, + day : day.value, + month : month.value, + year : year.value, + notified : "no" + } + ]; + + // open a read/write db transaction, ready for adding the data + var transaction = db.transaction(["toDoList"], "readwrite"); + + // report on the success of opening the transaction + transaction.oncomplete = function(event) { + note.innerHTML += '<li>Transaction opened for task addition.</li>'; + }; + + transaction.onerror = function(event) { + note.innerHTML += '<li>Transaction not opened due to error. Duplicate items not allowed.</li>'; + }; + + // create an object store on the transaction + var objectStore = transaction.objectStore("toDoList"); + + // add our newItem object to the object store + var request = objectStore.add(newItem[0]); </pre> + +<p>この部分では、データベースへの挿入に必要な形式でデータを保存する <code>newItem</code> というオブジェクトを作成します。次の数行では、データベーストランザクションを開き、これが成功したか失敗したかをユーザーに通知するメッセージを提供しています。そして、新しい項目が追加される <code>objectStore</code> が生成されます。データオブジェクトの <code>notified</code> プロパティは、 To-do リストの項目の期限がまだ来ておらず、通知されていないことを示しています。これについては後ほど説明します。</p> + +<div class="note"> +<p><strong>メモ:</strong> 変数 <code>db</code> には IndexedDB のデータベースインスタンスへの参照が格納されています。この変数の様々なプロパティを使用してデータを操作することができます。</p> +</div> + +<pre class="brush: js"> + request.onsuccess = function(event) { + + note.innerHTML += '<li>New item added to database.</li>'; + + title.value = ''; + hours.value = null; + minutes.value = null; + day.value = 01; + month.value = 'January'; + year.value = 2020; + }; + }</pre> + +<p>次の部分では、新しい項目の追加が成功したことを示すログメッセージを作成し、次のタスクが入力できるようにフォームをリセットします。</p> + +<pre class="brush: js"> + // update the display of data to show the newly added item, by running displayData() again. + displayData(); +};</pre> + +<p>最後に <code>displayData()</code> 関数を実行して、アプリ内のデータの表示を更新し、先ほど入力された新しいタスクを表示します。</p> + +<h3 id="Checking_whether_a_deadline_has_been_reached">期限に達したかどうかの確認</h3> + +<p>この時点でデータはデータベースに入っていますが、今度は期限に達しているかどうかをチェックしたいと思います。これを行うのが <code>checkDeadlines()</code> 関数です。</p> + +<pre class="brush: js">function checkDeadlines() { + var now = new Date();</pre> + +<p>まず、空の <code>Date</code> オブジェクトを作成して、現在の日付と時刻を取得します。簡単でしょう？ここからは少し複雑な話になります。</p> + +<pre class="brush: js"> var minuteCheck = now.getMinutes(); + var hourCheck = now.getHours(); + var dayCheck = now.getDate(); + var monthCheck = now.getMonth(); + var yearCheck = now.getFullYear(); +</pre> + +<p><code>Date</code> オブジェクトには、内部の日付や時刻のさまざまな部分を抽出するためのメソッドがいくつかあります。ここでは、現在の分 (簡単な数値として取得)、時 (簡単な数値として取得)、日 (これは <code>getDate()</code> が必要、 <code>getDay()</code> は曜日を 1-7 で返すため)、月 (0-11 の数値を返す。下記参照)、年 (<code>getFullYear()</code> が必要、<code>getYear()</code> は非推奨であり、誰にとってもあまり役に立たない奇妙な値を返します) を読み取ります。</p> + +<pre class="brush: js"> var objectStore = db.transaction(['toDoList'], "readwrite").objectStore('toDoList'); + + objectStore.openCursor().onsuccess = function(event) { + var cursor = event.target.result; + + if(cursor) {</pre> + +<p>次にもう一つ、 IndexedDB の <code>objectStore</code> を生成し、 <code>openCursor()</code> メソッドを使用してカーソルを開きます。これは基本的に IndexedDB がストア内のすべての項目を反復処理する方法です。そして、カーソル内に有効な項目が残っている限り、カーソル内のすべての項目をループします。</p> + +<pre class="brush: js"> switch(cursor.value.month) { + case "January": + var monthNumber = 0; + break; + case "February": + var monthNumber = 1; + break; + + // other lines removed from listing for brevity + + case "December": + var monthNumber = 11; + break; + default: + alert('Incorrect month entered in database.'); + }</pre> + +<p>まず最初に行うことは、データベースに保存されている月名を、 JavaScript が理解できる月の数値に変換することです。前に見たように、 JavaScript の Date オブジェクトは月の値を 0 から 11 までの数値として生成します。</p> + +<pre class="brush: js"> if(+(cursor.value.hours) == hourCheck && + +(cursor.value.minutes) == minuteCheck && + +(cursor.value.day) == dayCheck && + monthNumber == monthCheck && + cursor.value.year == yearCheck && + notified == "no") { + + // If the numbers all do match, run the createNotification() + // function to create a system notification + createNotification(cursor.value.taskTitle); + }</pre> + +<p>IndexedDB に格納された値と照合したい現在の時刻と日付の部分がすべて組み立てられたので、いよいよチェックを実行します。ユーザーに期限切れを知らせる何らかの通知を行う前に、すべての値が一致している必要があります。</p> + +<p>ここでの <code>+</code> 演算子は、先頭にゼロが付いている数字を、先頭にゼロが付いていない同等の数字に変換します (例えば 09 -> 9)。これが必要なのは、 JavaScript の Date の数値には先頭にゼロがないが、データにはあるかもしれないからです。</p> + +<p><code>notified == "no"</code> のチェックは、 1 つの To-Do アイテムに対して 1 つの通知しか受け取れないようにするためのものです。各項目のオブジェクトに対して通知が発生すると、その <code>notification</code> プロパティが <code>"yes"</code> に設定されるので、次の繰り返しではこのチェックが通らないようにするために、 <code>createNotification()</code> 関数の中に次のようなコードを入れています (詳しくは <a href="/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB">IndexedDB の使用</a>を読んでください)。</p> + +<pre class="brush: js"> // now we need to update the value of notified to "yes" in this particular data object, so the + // notification won't be set off on it again + + // first open up a transaction as usual + var objectStore = db.transaction(['toDoList'], "readwrite").objectStore('toDoList'); + + // get the to-do list object that has this title as it's title + var request = objectStore.get(title); + + request.onsuccess = function() { + // grab the data object returned as the result + var data = request.result; + + // update the notified value in the object to "yes" + data.notified = "yes"; + + // create another request that inserts the item back into the database + var requestUpdate = objectStore.put(data); + + // when this new request succeeds, run the displayData() function again to update the display + requestUpdate.onsuccess = function() { + displayData(); + }</pre> + +<p>すべてのチェックが一致した場合は、 <code>createNotification()</code> 関数を実行して、ユーザーに通知を行います。</p> + +<pre class="brush: js"> cursor.continue(); + } + } +}</pre> + +<p>この関数の最後の行では、カーソルが上に移動し、 IndexedDB に格納されている次のタスクに対して、上記の期限チェックの仕組みが実行されます。</p> + +<h3 id="Keep_on_checking!">チェックし続ける</h3> + +<p>もちろん、上記の期限チェック機能を一度実行するだけでは意味がありません。すべての締切に達していないかどうかを常にチェックし続けたいのです。そのために、 <code>setInterval()</code> を使って 1 秒に 1 回 <code>checkDeadlines()</code> を実行します。</p> + +<pre class="brush: js">setInterval(checkDeadlines, 1000);</pre> diff --git a/files/ja/web/api/indexeddb_api/index.html b/files/ja/web/api/indexeddb_api/index.html index 14369351fa..1d08f26cc8 100644 --- a/files/ja/web/api/indexeddb_api/index.html +++ b/files/ja/web/api/indexeddb_api/index.html @@ -13,54 +13,54 @@ translation_of: Web/API/IndexedDB_API --- <div>{{DefaultAPISidebar("IndexedDB")}}</div> -<p>IndexedDB は、ファイルや blob を含む構造化された多くのデータを保存する、クライアントサイドのローレベル API です。この API は高パフォーマンスなデータの検索を行うために、インデックスを使用します。<a href="/ja/docs/Web/API/Web_Storage_API">Web Storage</a> は比較的少量のデータを保存するのに有用ではありますが、構造化された非常に多くのデータを扱うには不十分です。IndexedDB が解決策を提供します。本ページは、MDN における IndexedDB のランディングページです。ここでは API リファレンスへのリンク、使用ガイド、ブラウザーのサポート状況、主要なコンセプトの説明を掲載します。</p> +<p>IndexedDB は、ファイルや blob を含む大量の構造化データをクライアント側で保存するための低レベル API です。この API はインデックスを使用して、高パフォーマンスなデータの検索を行うことができます。<a href="/ja/docs/Web/API/Web_Storage_API">Web Storage</a> は比較的少量のデータを保存するのに有用ではありますが、構造化された非常に多くのデータを扱うには不十分です。IndexedDB が解決策を提供します。ここでは、完全な API リファレンスと使用ガイド、ブラウザーの対応の詳細、および重要な概念の説明へのリンクを提供します。</p> <p>{{AvailableInWorkers}}</p> <div class="note"> -<p><strong>メモ</strong>: IndexedDB API は強力ですが、シンプルな用途にとってはとても複雑に見えるかもしれません。シンプルな API が好ましいのでしたら、IndexedDB をより開発者フレンドリーに扱える <a href="https://localforage.github.io/localForage/">localForage</a> や <a href="http://www.dexie.org/">dexie.js</a>、<a href="https://github.com/erikolson186/zangodb">ZangoDB</a>、<a href="https://pouchdb.com/">PouchDB</a>、<a href="http://jsstore.net/">JsStore</a> などのライブラリを検討してください。</p> +<p><strong>メモ</strong>: IndexedDB API は強力ですが、シンプルな用途にはとても複雑に見えるかもしれません。シンプルな API が好ましいのであれば、<a href="#see_also">関連情報</a>の節にある IndexedDB をプログラマーにとって扱いやすくするライブラリーを試してみてください。</p> </div> -<h2 id="Key_concepts_and_usage" name="Key_concepts_and_usage">主要概念と使用法</h2> +<h2 id="Key_concepts_and_usage">主要概念と使用法</h2> -<p>IndexedDB は SQL ベースの RDBMS に似たトランザクショナルデータベースシステムですが、SQL ベース の RDBMS が固定された列を持つテーブルを使用するのに対して、IndexedDB は JavaScript ベースのオブジェクト指向データベースです。IndexedDB では、<strong>キー</strong>でインデックス付けされたオブジェクトを保存および取り出すことができます。<a href="/ja/docs/Web/Guide/API/DOM/The_structured_clone_algorithm">Structured Clone アルゴリズム</a>がサポートする、任意のオブジェクトを保存できます。データベースのスキーマを定義する、データベースへの接続を確立する、そして一連の<strong>トランザクション</strong>でデータの取り出しや更新を行うことが必要です。</p> +<p>IndexedDB は SQL ベースの RDBMS に似たトランザクショナルデータベースシステムです。しかし、SQL ベース の RDBMS が固定された列を持つテーブルを使用するのに対して、IndexedDB は JavaScript ベースのオブジェクト指向データベースです。IndexedDB では、<strong>キー</strong>でインデックス付けされたオブジェクトを保存および取り出すことができます。<a href="/ja/docs/Web/API/Web_Workers_API/Structured_clone_algorithm">構造化クローンアルゴリズム</a>に対応した、任意のオブジェクトを保存することができます。データベースのスキーマを定義し、データベースへの接続を確立し、そして一連の<strong>トランザクション</strong>でデータの取り出しや更新を行う必要があります。</p> <ul> - <li><a href="/ja/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB">IndexedDB のコンセプト</a>を詳しく知る</li> - <li><a href="/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB">IndexedDB 使用ガイド</a>で、非同期に IndexedDB を扱い方法を基本原理から学ぶ</li> - <li><a href="/ja/docs/Web/Progressive_web_apps/Offline_Service_workers">Service Worker により PWA をオフラインで動作させる</a>で概説されているように、データをオフラインに格納する IndexedDB と資産をオフラインに格納する Service Worker を組み合わせる。</li> + <li><a href="/ja/docs/Web/API/IndexedDB_API/Basic_Terminology">IndexedDB の主な特徴と基本用語</a>についてはこちらをご覧ください。</li> + <li><a href="/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB">IndexedDB の使用</a>のガイドで、で、非同期的に IndexedDB を使用する方法を基本原理から学びます。</li> + <li>データをオフラインで保存するための IndexedDB と、資産をオフラインで保存するためのサービスワーカーを組み合わせる方法は、 <a href="/ja/docs/Web/Progressive_web_apps/Offline_Service_workers">サービスワーカーにより PWA をオフラインで動作させる</a>で概説しています。</li> </ul> <div class="note"> -<p><strong>メモ</strong>: たいていのウェブストレージ技術と同様に、IndexedDB も<a class="external" href="http://www.w3.org/Security/wiki/Same_Origin_Policy">同一オリジンポリシー</a>に従います。よって、保存済みデータは同一ドメイン内からアクセスできますが、異なるドメインにまたがってデータへアクセスすることはできません。</p> +<p><strong>メモ</strong>: たいていのウェブストレージ技術と同様に、IndexedDB も<a href="https://www.w3.org/Security/wiki/Same_Origin_Policy">同一オリジンポリシー</a>に従います。よって、保存済みデータは同一ドメイン内からアクセスできますが、異なるドメインにまたがってデータへアクセスすることはできません。</p> </div> -<h3 id="Synchronous_and_asynchronous" name="Synchronous_and_asynchronous">同期と非同期</h3> +<h3 id="Synchronous_and_asynchronous">同期と非同期</h3> -<p>IndexedDB を扱う操作は非同期に実行しますので、他のアプリケーションを妨げません。 IndexedDB は元々同期 API と<span style="background-color: #f5f6f5;">非同期</span> API の両方を提供していました。同期 API は <a href="/ja/docs/Web/Guide/Performance/Using_web_workers">Web Worker</a> 内でのみの使用を意図していましたが、必要性に疑問があったため仕様から削除されました。ただし、<span style="background-color: #f5f6f5;">同期 API</span> はウェブ開発者から十分な要望がある場合は、将来再び導入される可能性があります。</p> +<p>IndexedDB を扱う操作は非同期に実行しますので、他のアプリケーションを妨げません。 IndexedDB は元々同期 API と非同期 API の両方を提供していました。同期 API は<a href="/ja/docs/Web/API/Web_Workers_API/Using_web_workers">ウェブワーカー</a>内でのみの使用を意図していましたが、必要性に疑問があったため仕様から削除されました。ただし、同期 API はウェブ開発者から十分な要望がある場合は、将来再び導入される可能性があります。</p> -<h3 id="Storage_limits_and_eviction_criteria" name="Storage_limits_and_eviction_criteria">ストレージの上限と破棄基準</h3> +<h3 id="Storage_limits_and_eviction_criteria">ストレージの上限と破棄基準</h3> -<p>クライアントサイド (すなわちローカルディスク) に何らかのデータを保存するウェブ技術がいくつかあり、IndexedDB はそのような技術としてもっともよく語られます。ブラウザーがどれだけの容量をウェブデータストレージに割り当てるかや、容量の上限に達したときにどのデータを削除するかのプロセスは単純ではなく、またブラウザーにより異なります。<a href="/ja/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria">Browser storage limits and eviction criteria</a> で、少なくとも Firefox ではどのようにしているかを説明しようとしています。</p> +<p>クライアント側 (すなわちローカルディスク) に何らかのデータを保存するウェブ技術はいくつかあります。IndexedDB はそのような技術としてもっともよく語られます。ブラウザーがどれだけの容量をウェブデータストレージに割り当てるかや、容量の上限に達したときにどのデータを削除するかのプロセスは単純ではなく、またブラウザーにより異なります。<a href="/ja/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria">ブラウザーのストレージ制限と削除基準</a>で、少なくとも Firefox ではどのようにしているかの解説を試みています。</p> -<h2 id="Interfaces" name="Interfaces">インターフェイス</h2> +<h2 id="Interfaces">インターフェイス</h2> -<p>データベースへのアクセスを行いたい場合は、<a href="/ja/docs/DOM/window" title="DOM/window">window</a> オブジェクトの <a href="/ja/docs/Web/API/IDBEnvironment.indexedDB"><code>indexedDB</code></a> 属性上の <a href="/ja/docs/Web/API/IDBFactory.open"><code>open()</code></a> を呼び出してください。このメソッドは {{domxref("IDBRequest")}} オブジェクトを返します。{{domxref("IDBRequest")}} オブジェクト上で発火したイベントによってアプリケーションが呼び出されることにより、非同期操作が行われます。</p> +<p>データベースへのアクセスを行いたい場合は、<a href="/ja/docs/Web/API/Window">window</a> オブジェクトの <a href="/ja/docs/Web/API/WindowOrWorkerGlobalScope/indexedDB"><code>indexedDB</code></a> 属性上で <a href="/ja/docs/Web/API/IDBFactory/open"><code>open()</code></a> を呼び出してください。このメソッドは {{domxref("IDBRequest")}} オブジェクトを返します。{{domxref("IDBRequest")}} オブジェクト上で発行されたイベントによってアプリケーションが呼び出されることにより、非同期操作が行われます。</p> -<h3 id="Connecting_to_a_database" name="Connecting_to_a_database">データベースへの接続</h3> +<h3 id="Connecting_to_a_database">データベースへの接続</h3> <dl> <dt>{{domxref("IDBEnvironment")}}</dt> <dd>IndexedDB 機能へのアクセスを提供します。{{domxref("window")}} および {{domxref("worker")}} オブジェクトによって実装されています。このインターフェイスは 2.0 仕様の一部ではありません。</dd> <dt>{{domxref("IDBFactory")}}</dt> - <dd>データベースへのアクセスを提供します。<a href="/ja/docs/Web/API/IDBEnvironment.indexedDB"><code>indexedDB</code></a> グローバルオブジェクトによって実装されており、従って API へのエントリーポイントになります。</dd> + <dd>データベースへのアクセスを提供します。{{domxref("WindowOrWorkerGlobalScope/indexedDB", "indexedDB")}} グローバルオブジェクトによって実装されており、従って API へのエントリーポイントになります。</dd> <dt>{{domxref("IDBOpenDBRequest")}}</dt> <dd>データベースを開くリクエストを表します。</dd> <dt>{{domxref("IDBDatabase")}}</dt> <dd>データベース接続を表します。データベースとのトランザクション処理を行うためのみに使用されます。</dd> </dl> -<h3 id="Retrieving_and_modifying_data" name="Retrieving_and_modifying_data">データの取り出しと変更</h3> +<h3 id="Retrieving_and_modifying_data">データの取り出しと変更</h3> <dl> <dt>{{domxref("IDBTransaction")}}</dt> @@ -72,88 +72,83 @@ translation_of: Web/API/IndexedDB_API <dt>{{domxref("IDBIndex")}}</dt> <dd>こちらも IndexedDB データベース内のデータのサブセットにアクセスできますが、レコードの探索に主キーではなくインデックスを使用します。{{domxref("IDBObjectStore")}} より高速に動作する場合があります。</dd> <dt>{{domxref("IDBCursor")}}</dt> - <dd>オブジェクトストアとインデックスをイテレートします。</dd> + <dd>オブジェクトストアとインデックスを反復処理します。</dd> <dt>{{domxref("IDBCursorWithValue")}}</dt> - <dd>オブジェクトストアとインデックスをイテレートして、カーソルの現在の値を返します。</dd> + <dd>オブジェクトストアとインデックスを反復処理して、カーソルの現在の値を返します。</dd> <dt>{{domxref("IDBKeyRange")}}</dt> <dd>データベースから一定の範囲のデータを取り出すために使用可能な、キーの範囲を定義します。</dd> <dt>{{domxref("IDBLocaleAwareKeyRange")}} {{Non-standard_inline}}</dt> - <dd>データベースから一定の範囲のデータを取り出すために使用可能な、インデックス用に指定したロケール (<a href="/ja/docs/Web/API/IDBObjectStore/createIndex#Parameters"><code>createIndex()</code> の optionalParameters</a> をご覧ください) の規則によって並べ替えたキーの範囲を定義します。</dd> + <dd>データベースから一定の範囲のデータを取り出すために使用可能な、インデックス用に指定したロケール (<a href="/ja/docs/Web/API/IDBObjectStore/createIndex#parameters"><code>createIndex()</code> の optionalParameters</a> をご覧ください) の規則によって並べ替えたキーの範囲を定義します。</dd> </dl> -<h3 id="Custom_event_interfaces" name="Custom_event_interfaces">カスタムイベントインターフェイス</h3> +<h3 id="Custom_event_interfaces">カスタムイベントインターフェイス</h3> -<p>本仕様では、以下のカスタムインターフェイスでイベントが発生します:</p> +<p>本仕様では、以下のカスタムインターフェイスでイベントが発生します。</p> <dl> <dt>{{domxref("IDBVersionChangeEvent")}}</dt> - <dd><code>IDBVersionChangeEvent</code> インターフェイスは、{{domxref("IDBOpenDBRequest.onupgradeneeded")}} イベントハンドラ関数によってデータベースのバージョンが変更されたことを表します。</dd> + <dd><code>IDBVersionChangeEvent</code> インターフェイスは、{{domxref("IDBOpenDBRequest.onupgradeneeded")}} イベントハンドラー関数によってデータベースのバージョンが変更されたことを表します。</dd> </dl> -<h3 id="Obsolete_interfaces" name="Obsolete_interfaces">廃止インターフェイス</h3> +<h3 id="Obsolete_interfaces">廃止インターフェイス</h3> -<p>仕様の早期段階で定義されていたインターフェイスの一部が、現在、削除されています。以前書いたコードを最新の仕様に合わせて更新する際に必要になるであろうことから、削除されたインターフェイスに関するドキュメントは残してあります:</p> +<p>仕様の早期段階では、以下のようなインターフェイスを定義していましたが、既に削除されています。以前書かれたコードを更新する必要がある場合のために、ドキュメントを残しています。</p> <dl> - <dt>{{domxref("IDBVersionChangeRequest")}} {{obsolete_inline}}</dt> - <dd>データベースのバージョンの変更リクエストを表現します。データベースのバージョンを変更する方法が ({{domxref("IDBDatabase.setVersion")}} ではなく {{domxref("IDBFactory.open")}} を呼び出すように) 変わりました。また削除された {{domxref("IDBVersionChangeRequest")}} に代わり {{domxref("IDBOpenDBRequest")}} インターフェイスが用意されています。</dd> - <dt>{{domxref("IDBDatabaseException")}} {{obsolete_inline}}</dt> + <dt>{{domxref("IDBDatabaseException")}} {{deprecated_inline}}</dt> <dd>データベース操作が実行されている間に発生した例外状況を表します。</dd> - <dt>{{domxref("IDBTransactionSync")}} {{obsolete_inline}}</dt> - <dd>同期型の {{domxref("IDBTransaction")}} です。</dd> - <dt>{{domxref("IDBObjectStoreSync")}} {{obsolete_inline}}</dt> - <dd>同期型の {{domxref("IDBObjectStore")}} です。</dd> - <dt>{{domxref("IDBIndexSync")}} {{obsolete_inline}}</dt> - <dd>同期型の {{domxref("IDBIndex")}} です。</dd> - <dt>{{domxref("IDBFactorySync")}} {{obsolete_inline}}</dt> - <dd>同期型の {{domxref("IDBFactory")}} です。</dd> - <dt>{{domxref("IDBEnvironmentSync")}} {{obsolete_inline}}</dt> - <dd>同期型の {{domxref("IDBEnvironment")}} です。</dd> - <dt>{{domxref("IDBDatabaseSync")}} {{obsolete_inline}}</dt> - <dd>同期型の {{domxref("IDBDatabase")}} です。</dd> - <dt>{{domxref("IDBCursorSync")}} {{obsolete_inline}}</dt> - <dd>同期型の {{domxref("IDBCursor")}} です。</dd> + <dt>{{domxref("IDBTransactionSync")}} {{deprecated_inline}}</dt> + <dd>同期版の {{domxref("IDBTransaction")}} です。</dd> + <dt>{{domxref("IDBObjectStoreSync")}} {{deprecated_inline}}</dt> + <dd>同期版の {{domxref("IDBObjectStore")}} です。</dd> + <dt>{{domxref("IDBIndexSync")}} {{deprecated_inline}}</dt> + <dd>同期版の {{domxref("IDBIndex")}} です。</dd> + <dt>{{domxref("IDBFactorySync")}} {{deprecated_inline}}</dt> + <dd>同期版の {{domxref("IDBFactory")}} です。</dd> + <dt>{{domxref("IDBEnvironmentSync")}} {{deprecated_inline}}</dt> + <dd>同期版の {{domxref("IDBEnvironment")}} です。</dd> + <dt>{{domxref("IDBDatabaseSync")}} {{deprecated_inline}}</dt> + <dd>同期版の {{domxref("IDBDatabase")}} です。</dd> + <dt>{{domxref("IDBCursorSync")}} {{deprecated_inline}}</dt> + <dd>同期版の {{domxref("IDBCursor")}} です。</dd> </dl> -<h2 id="Examples" name="Examples">例</h2> +<h2 id="Examples">例</h2> <ul> - <li><a href="http://marco-c.github.io/eLibri/">eLibri:</a> Marco Castelluccio が作成した、高度なライブラリおよび電子書籍リーダーアプリケーションです。IndexedDB Mozilla DevDerby の最優秀作品です。</li> - <li><a href="https://github.com/chrisdavidmills/to-do-notifications/tree/gh-pages">To-do Notifications</a> (<a href="http://mdn.github.io/to-do-notifications/">ライブデモ</a>): リファレンスドキュメントで例示している、参考アプリケーションです。</li> - <li><a href="http://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/">Storing images and files in IndexedDB</a></li> + <li><a href="https://marco-c.github.io/eLibri/">eLibri:</a> Marco Castelluccio が作成した、高度なライブラリおよび電子書籍リーダーアプリケーションです。IndexedDB Mozilla DevDerby の最優秀作品です。</li> + <li><a href="https://github.com/chrisdavidmills/to-do-notifications/tree/gh-pages">To-do Notifications</a> (<a href="https://mdn.github.io/to-do-notifications/">ライブデモ</a>): リファレンスドキュメントで例示している、参考アプリケーションです。</li> + <li><a href="https://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/">Storing images and files in IndexedDB</a></li> </ul> -<h2 id="Specifications" name="Specifications">仕様書</h2> +<h2 id="Specifications">仕様書</h2> <table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName("IndexedDB 2")}}</td> - <td>{{Spec2("IndexedDB 2")}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('IndexedDB')}}</td> - <td>{{Spec2('IndexedDB')}}</td> - <td>初回定義</td> - </tr> - </tbody> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td><a href="https://w3c.github.io/IndexedDB/">Indexed Database API</a></td> + </tr> + </tbody> </table> -<h2 id="See_also" name="See_also">関連情報</h2> +<h2 id="See_also">関連情報</h2> <ul> - <li><a class="external" href="https://localforage.github.io/localForage/">localForage</a>: クライアントサイドのデータストレージ向けに、シンプルな name:value 形式の構文を提供する Polyfill です。バックグラウンドで IndexedDB を使用しますが、IndexedDB をサポートしないブラウザーでは WebSQL や localStorage にフォールバックします。</li> - <li><a href="http://www.dexie.org/">dexie.js</a>: 優良でシンプルな構文により高速なコード開発を可能にする、IndexedDB のラッパーです。</li> + <li><a href="https://localforage.github.io/localForage/">localForage</a>: クライアント側のデータストレージ向けに、シンプルな name:value 形式の構文を提供するポリフィルです。バックグラウンドで IndexedDB を使用しますが、IndexedDB をに対応していないブラウザーでは WebSQL や localStorage にフォールバックします。</li> + <li><a href="https://dexie.org/">Dexie.js</a>: 優良でシンプルな構文により高速なコード開発を可能にする、IndexedDB のラッパーです。</li> <li><a href="https://github.com/erikolson186/zangodb">ZangoDB</a>: IndexedDB の MongoDB ライクなインターフェイスで、MongoDB でおなじみのフィルターリング、射影、ソート、アップデート、集計をサポートしています。</li> - <li><a href="http://jsstore.net/">JsStore</a>: SQL 風の構文による IndexedDB のラッパーです。</li> - <li><a href="https://github.com/mWater/minimongo">MiniMongo</a>: クライアントサイドのインメモリーの mongodb で localstorage と server sync over http を元にしたもの。MiniMongo は MeteorJS で使われています。</li> - <li><a href="https://pouchdb.com">PouchDB</a>: クライアントサイドのブラウザー内の CouchDB 実装で IndexedDB を使っています。</li> + <li><a href="https://jsstore.net/">JsStore</a>: SQL 風の構文による IndexedDB のラッパーです。</li> + <li><a href="https://github.com/mWater/minimongo">MiniMongo</a>: クライアント側のインメモリーの mongodb で localstorage と server sync over http を元にしたもの。MiniMongo は MeteorJS で使われています。</li> + <li><a href="https://pouchdb.com">PouchDB</a>: クライアント側のブラウザー内の CouchDB 実装で IndexedDB を使っています。</li> + <li><a href="https://www.npmjs.com/package/idb">idb</a>: IndexedDB API をほぼ反映した小さな (~1.15k) ライブラリーですが、使いやすさを大きく変える小さな改良が加えられています。</li> + <li><a href="https://www.npmjs.com/package/idb-keyval">idb-keyval</a>: IndexedDB で実装された超シンプルで小さな (~600B) プロミスベースのキーバリューストア</li> + <li><a href="https://www.npmjs.com/package/@sifrr/storage">sifrr-storage:</a> クライアントサイドのキーバリューストレージ用の小さな (~2kB) プロミスベースのライブラリーです。IndexedDB、localStorage、WebSQL、Cookie で動作します。優先度に基づいて、対応しているストレージを自動的に使用できます。</li> + <li><a href="https://github.com/google/lovefield">lovefield</a>: Lovefield は、ウェブアプリケーション用のリレーショナルデータベースです。 JavaScript で書かれており、クロスブラウザーで動作します。SQL ライクな API を提供しており、高速で安全、かつ簡単に使用できます。</li> + <li><a href="https://github.com/hyoo-ru/mam_mol/tree/master/db">$mol_db</a>: 小さな (~1.3kB) TypeScript のファサードで、プロミスベースの API と自動マイグレーションを備えています。</li> + </ul> diff --git a/files/ja/web/api/indexeddb_api/using_indexeddb/index.html b/files/ja/web/api/indexeddb_api/using_indexeddb/index.html index 333cda62f1..a4727f8781 100644 --- a/files/ja/web/api/indexeddb_api/using_indexeddb/index.html +++ b/files/ja/web/api/indexeddb_api/using_indexeddb/index.html @@ -1,46 +1,52 @@ --- -title: IndexedDB を使用する +title: IndexedDB の使用 slug: Web/API/IndexedDB_API/Using_IndexedDB tags: - API - Advanced - Database + - Guide - IndexedDB - Storage - Tutorial + - jsstore translation_of: Web/API/IndexedDB_API/Using_IndexedDB --- <p>{{DefaultAPISidebar("IndexedDB")}}</p> <div class="summary"> -<p>IndexedDB は、ユーザーのブラウザー内にデータを永続的に保存する手段です。ネットワークの状態にかかわらず高度な問い合わせ機能を持つ ウェブアプリケーションを作成できますので、オンラインとオフラインの両方で動作するアプリケーションになります。</p> +<p>IndexedDB は、ユーザーのブラウザー内にデータを永続的に保存する手段です。ネットワークの状態にかかわらず高度な問い合わせ機能を持つウェブアプリケーションを作成できますので、アプリケーションがオンラインとオフラインの両方で動作するようになります。</p> </div> -<h2 id="About_this_document" name="About_this_document">このドキュメントについて</h2> +<h2 id="About_this_document">このドキュメントについて</h2> -<p>このチュートリアルでは、IndexedDB の非同期 API の使い方を見ていきます。IndexedDB について詳しくない場合は、始めに <a href="/ja/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB" title="IndexedDB/Basic Concepts Behind IndexedDB">IndexedDB の基本的な概念</a>をお読みください。</p> +<p>このチュートリアルでは、IndexedDB の非同期 API の使い方を見ていきます。IndexedDB について詳しくない場合は、始めに <a href="/ja/docs/Web/API/IndexedDB_API/Basic_Terminology">IndexedDB の主な特徴と基本用語</a>をお読みください。</p> -<p>IndexedDB API のリファレンスドキュメントとして、<a href="/ja/docs/Web/API/IndexedDB_API" title="https://developer.mozilla.org/en/IndexedDB">IndexedDB</a> の記事とそのサブ記事をご覧ください。IndexedDB で使用されるオブジェクトの型や、同期 API および非同期 API のドキュメントがあります。</p> +<p>IndexedDB API のリファレンスドキュメントとして、<a href="/ja/docs/Web/API/IndexedDB_API">IndexedDB API</a> の記事とそのサブ記事をご覧ください。この記事では、IndexedDB で使用されるオブジェクトの種類と、非同期 API のメソッドについて説明します (同期 API は仕様から削除されました)。</p> -<h2 id="pattern" name="pattern">基本パターン</h2> +<h2 id="pattern">基本パターン</h2> -<p>IndexedDB で推奨される基本パターンは、以下のようになります:</p> +<p>IndexedDB で推奨される基本パターンは、以下のようになります。</p> <ol> <li>データベースを開きます。</li> <li>データベース内に、オブジェクトストアを作成します。</li> <li>データの追加や取り出しといった、データベース操作のトランザクションを開始して、リクエストを行います。</li> - <li>適切な DOM イベントを受け取ることにより、操作が完了するのを待ちます。</li> - <li>結果 (リクエストオブジェクトで見つけることができます) に応じた処理を行います。</li> + <li> + <div>適切な DOM イベントを受け取ることにより、操作が完了するのを待ちます。</div> + </li> + <li> + <div>結果 (リクエストオブジェクトにある) に応じた処理を行います。</div> + </li> </ol> <p>これらの主要な概念を踏まえることで、より具体的な手続きを理解できます。</p> -<h2 id="open" name="open">ストアを作成および構築する</h2> +<h2 id="open">ストアを作成および構築する</h2> -<h3 id="Using_an_experimental_version_of_IndexedDB" name="Using_an_experimental_version_of_IndexedDB">実験的なバージョンの IndexedDB を使用する</h3> +<h3 id="Using_an_experimental_version_of_IndexedDB">実験的なバージョンの IndexedDB を使用する</h3> -<p>まだ接頭辞を使用しているブラウザーでコードのテストを行いたい場合は、以下のコードを使用するとよいでしょう:</p> +<p>まだ接頭辞を使用しているブラウザーでコードのテストを行いたい場合は、以下のコードを使用するとよいでしょう。</p> <pre class="brush: js">// 以下の行に、テストを行いたい実装の接頭辞を含めてください。 window.indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB; @@ -50,35 +56,35 @@ window.IDBTransaction = window.IDBTransaction || window.webkitIDBTransaction || window.IDBKeyRange = window.IDBKeyRange || window.webkitIDBKeyRange || window.msIDBKeyRange; // (Mozilla はこれらのオブジェクトに接頭辞をつけていませんので、window.mozIDB* は不要です)</pre> -<p>接頭辞を使用している実装は不具合がある、未完成、あるいは古い版の仕様に従っている可能性がありますので注意してください。よって、これらを製品版のコードで使用することは推奨しません。サポートしているものとして失敗するより、未サポートとする方が好ましいでしょう:</p> +<p>接頭辞を使用している実装は不具合がある、未完成、あるいは古い版の仕様に従っている可能性がありますので注意してください。よって、これらを製品版のコードで使用することは推奨しません。対応しているものとして失敗するより、未対応とする方が好ましいでしょう。</p> <pre class="brush: js">if (!window.indexedDB) { - window.alert("このブラウザーは安定版の IndexedDB をサポートしていません。IndexedDB の機能は利用できません。"); + window.console.log("このブラウザーは安定版の IndexedDB を対応していません。IndexedDB の機能は利用できません。"); } </pre> -<h3 id="Opening_a_database" name="Opening_a_database">データベースを開く</h3> +<h3 id="Opening_a_database">データベースを開く</h3> -<p>プロセス全体は以下のようにして始めます:</p> +<p>プロセス全体は以下のようにして始めます。</p> <pre class="brush: js">// データベースを開く var request = window.indexedDB.open("MyTestDatabase", 3); </pre> -<p>わかりますか? データベースを開くことも他の操作と同様であり、"リクエスト" が必要です。</p> +<p>わかりますか? データベースを開くことも他の操作と同様であり、「リクエスト」が必要です。</p> -<p>データベースを開くリクエストは、すぐにはデータベースを開いたりトランザクションを開始したりはしません。<code>open()</code> 関数を呼び出すと、結果 (成功) またはイベントとして扱うエラー値を伴う <a href="/ja/docs/Web/API/IDBOpenDBRequest" title="IndexedDB/IDBOpenDBRequest"><code>IDBOpenDBRequest</code></a> オブジェクトを返します。IndexedDB のほとんどの他の非同期関数も同様であり、結果またはエラーを伴う <a href="/ja/docs/Web/API/IDBRequest" title="IndexedDB/IDBRequest"><code>IDBRequest</code></a> オブジェクトを返します。open 関数の結果は <code><a href="/ja/docs/Web/API/IDBDatabase" title="IndexedDB/IDBDatabase">IDBDatabase</a></code> のインスタンスです。</p> +<p>データベースを開くリクエストは、すぐにはデータベースを開いたりトランザクションを開始したりはしません。<code>open()</code> 関数を呼び出すと、結果 (成功) またはイベントとして扱うエラー値を伴う <a href="/ja/docs/Web/API/IDBOpenDBRequest"><code>IDBOpenDBRequest</code></a> オブジェクトを返します。IndexedDB のほとんどの他の非同期関数も同様であり、結果またはエラーを伴う <a href="/ja/docs/Web/API/IDBRequest"><code>IDBRequest</code></a> オブジェクトを返します。open 関数の結果は <code><a href="/ja/docs/Web/API/IDBDatabase">IDBDatabase</a></code> のインスタンスです。</p> -<p>open メソッドの第 2 引数は、データベースのバージョンです。データベースのバージョンは、データベースのスキーマ、すなわちデータベース内のオブジェクトストアとその構造を決定します。データベースが存在しない場合に <code>open</code> 操作でデータベースが作成されると、<code>onupgradeneeded</code> イベントが発生して、そのイベントハンドラでデータベースのスキーマを作成できます。データベースが存在する場合に従来より高いバージョン番号を指定すると、すぐに <code>onupgradeneeded</code> イベントが発生して、そのイベントハンドラで更新されたスキーマを提供できます。詳しくは、後ほど<a href="#Updating_the_version_of_the_database">データベースのバージョンを更新する</a>で説明します。また、{{domxref("IDBFactory.open")}} のリファレンスページもご覧ください。</p> +<p>open メソッドの第 2 引数は、データベースのバージョンです。データベースのバージョンは、データベースのスキーマ、すなわちデータベース内のオブジェクトストアとその構造を決定します。データベースが存在しない場合に <code>open</code> 操作でデータベースが作成されると、<code>onupgradeneeded</code> イベントが発生し、そのイベントハンドラーでデータベースのスキーマを作成することができます。データベースが存在する場合に従来より高いバージョン番号を指定すると、すぐに <code>onupgradeneeded</code> イベントが発生して、そのイベントハンドラーで更新されたスキーマを提供することができます。詳しくは、後ほど<a href="#updating_the_version_of_the_database">データベースのバージョンの更新</a>で説明します。また、{{domxref("IDBFactory.open")}} のリファレンスページもご覧ください。</p> <div class="warning"> -<p><strong>重要</strong>: バージョン番号は <code>unsigned long long</code> 型の数値であり、とても大きい整数にすることができます。また浮動小数点数値は使用できず、使用した場合は <code>upgradeneeded</code> イベントが発生せず、もっとも近い小さな数値に変換されてトランザクションが始まるでしょう。よって、例えばバージョン番号として 2.4 を使用しないでください:<br> +<p><strong>重要</strong>: バージョン番号は <code>unsigned long long</code> 型の数値であり、とても大きい整数にすることができます。また浮動小数点数値は使用できず、使用した場合は <code>upgradeneeded</code> イベントが発生せず、もっとも近い小さな数値に変換されてトランザクションが始まるでしょう。よって、例えばバージョン番号として 2.4 を使用しないでください。<br> <code>var request = indexedDB.open("MyTestDatabase", 2.4); // 行ってはいけません。バージョンは 2 に丸められます</code></p> </div> -<h4 id="Generating_handlers" name="Generating_handlers">ハンドラを生成する</h4> +<h4 id="Generating_handlers">ハンドラーの生成</h4> -<p>ほぼすべてのリクエスト生成に合わせて始めに行いたいことは、成功およびエラーのハンドラを生成することでしょう:</p> +<p>ほぼすべてのリクエスト生成に合わせて始めに行いたいことは、成功およびエラーのハンドラーを生成することでしょう。</p> <pre class="brush: js">request.onerror = function(event) { // request.errorCode に対して行うこと! @@ -89,38 +95,38 @@ request.onsuccess = function(event) { <p>2 つの関数 <code>onsuccess()</code> と <code>onerror()</code> のどちらが呼び出されるのでしょう? すべてが成功すると成功イベント (すなわち <code>type</code> プロパティが <code>"success"</code> である DOM イベント) が、<code>request</code> を <code>target</code> として発生します。イベントが発生すると <code>request</code> の <code>onsuccess()</code> 関数が、success イベントを引数として呼び出されます。一方、何らかの問題がある場合はエラーイベント (すなわち <code>type</code> プロパティが <code>"error"</code> である DOM イベント) が <code>request</code> で発生します。これは、エラーイベントを引数として <code>onerror()</code> 関数を呼び出します。</p> -<p>IndexedDB API は必要なエラー処理を最小限にするよう設計されていますので、多くのエラーイベントを見ることはないでしょう (少なくとも、API に慣れていなければ!)。しかしデータベースを開く場合は、エラーイベントが発生する一般的な状況があります。もっとも多いであろう問題は、データベースを作成する許可をユーザーが ウェブアプリに与えなかったことです。IndexedDB の主要な設計目標のひとつが、オフラインで使用するために大量のデータを保存できるようにすることです。(各ブラウザーでどれだけの量のストレージを持てるかについては、<a href="/ja/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria#Storage_limits" title="IndexedDB#Storage_limits">ストレージの制限</a>をご覧ください)</p> +<p>IndexedDB API は必要なエラー処理を最小限にするよう設計されていますので、多くのエラーイベントを見ることはないでしょう (少なくとも、API に慣れていなければ)。しかしデータベースを開く場合は、エラーイベントが発生する一般的な状況があります。もっとも多いであろう問題は、データベースを作成する許可をユーザーがウェブアプリに与えなかったことです。IndexedDB の主要な設計目標のひとつが、オフラインで使用するために大量のデータを保存できるようにすることです。(各ブラウザーでどれだけの量のストレージを持てるかについては、<a href="/ja/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria#storage_limits" title="IndexedDB#Storage_limits">ストレージの制限</a>をご覧ください)</p> -<p>広告ネットワークやコンピュータを汚染させる悪意のある Web サイトをブラウザーが許可したくないことは明らかですので、ブラウザーは ウェブアプリが初めてストレージ用に IndexedDB を開こうとしたときに、ユーザーへプロンプトを表示します。ユーザーはアクセスを許可または拒否できます。またブラウザーのプライバシーモードでの IndexedDB ストレージは、匿名のセッションを閉じるまでの間だけメモリ上に存在します (Firefox のプライベートブラウジングモードや Chrome のシークレットモードのことですが、2015 年 11 月現在の Firefox ではこれが<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=781982">未実装です</a>ので、Firefox のプライベートブラウジングでは IndexedDB をまったく使用できません)。</p> +<p>広告ネットワークやコンピューターを汚染させる悪意のあるウェブサイトをブラウザーが許可したくないことは明らかですので、ブラウザーは ウェブアプリが初めてストレージ用に IndexedDB を開こうとしたときに、ユーザーへプロンプトを表示します。ユーザーはアクセスを許可または拒否できます。またブラウザーのプライバシーモードでの IndexedDB ストレージは、匿名のセッションを閉じるまでの間だけメモリー上に存在します (Firefox のプライベートブラウジングモードや Chrome のシークレットモードのことですが、2021 年 5 月現在の Firefox ではこれが<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=781982">未実装です</a>ので、Firefox のプライベートブラウジングでは IndexedDB をまったく使用できません)。</p> -<p>ユーザーがデータベース作成の要求を許可して、成功コールバックを実行する成功イベントを受け取ったと想定します。次は何を行うのでしょうか? 以下のリクエストは <code>indexedDB.open()</code> の呼び出しを伴って生成されており、<code>request.result</code> は <code>IDBDatabase</code> のインスタンスですので、以降のためにこれを保存したいことは確実です。よって、コードは以下のようになるでしょう:</p> +<p>ユーザーがデータベース作成の要求を許可して、成功コールバックを実行する成功イベントを受け取ったと想定します。次は何を行うのでしょうか? 以下のリクエストは <code>indexedDB.open()</code> の呼び出しを伴って生成されており、<code>request.result</code> は <code>IDBDatabase</code> のインスタンスですので、以降のためにこれを保存したいことは確実です。よって、コードは以下のようになるでしょう。</p> <pre class="brush: js">var db; var request = indexedDB.open("MyTestDatabase"); request.onerror = function(event) { - alert("なぜ私の ウェブアプリで IndexedDB を使わせてくれないのですか?!"); + console.log("なぜ私の ウェブアプリで IndexedDB を使わせてくれないのですか?!"); }; request.onsuccess = function(event) { db = event.target.result; }; </pre> -<h4 id="Handling_Errors" name="Handling_Errors">エラーを処理する</h4> +<h4 id="Handling_Errors">エラーを処理する</h4> -<p>前述のとおり、エラーイベントはバブリングします。エラーイベントはエラーを発生させたリクエストをターゲットにして、さらにトランザクションや最終的にデータベースオブジェクトへバブリングします。すべてのリクエストにエラーハンドラを追加することを避けたい場合は、代わりに以下のように、ひとつのエラーハンドラをデータベースオブジェクトに追加することができます:</p> +<p>前述のとおり、エラーイベントはバブリングします。エラーイベントはエラーを発生させたリクエストをターゲットにして、さらにトランザクションや最終的にデータベースオブジェクトへバブリングします。すべてのリクエストにエラーハンドラーを追加することを避けたい場合は、代わりに以下のように、ひとつのエラーハンドラーをデータベースオブジェクトに追加することができます。</p> <pre class="brush: js">db.onerror = function(event) { // このデータベースのリクエストに対するすべてのエラー用の - // 汎用エラーハンドラ! - alert("Database error: " + event.target.errorCode); + // 汎用エラーハンドラー! + console.log("Database error: " + event.target.errorCode); }; </pre> -<p>データベースを開く際によく発生するエラーのひとつが <code>VER_ERR</code> です。これはディスクに保存されているデータベースのバージョンが、開こうとしているバージョンより<em>大きい</em>ことを表します。これは、必ずエラーハンドラで処理しなければならないエラーの実例です。</p> +<p>データベースを開く際によく発生するエラーのひとつが <code>VER_ERR</code> です。これはディスクに保存されているデータベースのバージョンが、開こうとしているバージョンより<em>大きい</em>ことを表します。これは、必ずエラーハンドラーで処理しなければならないエラーの実例です。</p> <h3 id="Creating_or_updating_the_version_of_the_database" name="Creating_or_updating_the_version_of_the_database">データベースを作成またはデータベースのバージョンを更新する</h3> -<p><a name="Updating_the_version_of_the_database"></a>新しいデータベースを作成したり既存のデータベースのバージョンを更新したりする ({{anch("Opening a database","データベースを開く")}}際に、従来より大きなバージョン番号を指定する) と <code>onupgradeneeded</code> イベントが発生して、<code>request.result</code> (すなわち、以下の例の <code>db</code>) に設定した <code>onversionchange</code> イベントハンドラに <a href="/ja/docs/Web/API/IDBVersionChangeEvent">IDBVersionChangeEvent</a> オブジェクトが渡されます。<code>upgradeneeded</code> イベントのハンドラでは、このバージョンのデータベースで必要なオブジェクトストアを作成します:</p> +<p><a name="Updating_the_version_of_the_database"></a>新しいデータベースを作成したり既存のデータベースのバージョンを更新したりする ({{anch("Opening a database","データベースを開く")}}際に、従来より大きなバージョン番号を指定する) と <code>onupgradeneeded</code> イベントが発生して、<code>request.result</code> (すなわち、以下の例の <code>db</code>) に設定した <code>onversionchange</code> イベントハンドラーに <a href="/ja/docs/Web/API/IDBVersionChangeEvent">IDBVersionChangeEvent</a> オブジェクトが渡されます。<code>upgradeneeded</code> イベントのハンドラーでは、このバージョンのデータベースで必要なオブジェクトストアを作成します。</p> <pre class="brush:js;">// このイベントは最新のブラウザーにのみ実装されています request.onupgradeneeded = function(event) { @@ -135,21 +141,19 @@ request.onupgradeneeded = function(event) { <p>既存の名称を使用してオブジェクトストアを作成しようとする (あるいは、存在しない名称のオブジェクトストアを削除しようとする) と、エラーが発生します。</p> -<p><code>onupgradeneeded</code> イベントから正常に抜けた場合は、データベースを開くリクエストの <code>onsuccess</code> ハンドラが実行されます。</p> +<p><code>onupgradeneeded</code> イベントから正常に抜けた場合は、データベースを開くリクエストの <code>onsuccess</code> ハンドラーが実行されます。</p> -<p>Chrome 23 以降および Opera 17 以降の Blink/Webkit は、現行バージョンの仕様をサポートします。IE10 以降も同様です。他の実装や古い実装では現行バージョンの仕様を実装しておらず、<code>indexedDB.open(name, version).onupgradeneeded</code> シグネチャが未サポートです。古い Webkit/Blink でデータベースのバージョンを更新する方法について、詳しくは <a href="/ja/docs/Web/API/IDBDatabase#setVersion()_.0A.0ADeprecated" title="IndexedDB/IDBDatabase#setVersion()_.0A.0ADeprecated">IDBDatabase のリファレンス記事</a>をご覧ください。</p> +<h3 id="Structuring_the_database">データベースを構築する</h3> -<h3 id="Structuring_the_database" name="Structuring_the_database">データベースを構築する</h3> +<p>次に、データベースを構築します。IndexedDB はテーブルではなくオブジェクトストアを使用しており、ひとつのデータベースに複数のオブジェクトストアを含めることができます。値をオブジェクトストアへ保存するたびに、値がキーと関連付けられます。オブジェクトストアで<a href="/ja/docs/Web/API/IndexedDB_API/Basic_Terminology#gloss_keypath">キーパス</a>を使用するか<a href="/ja/docs/Web/API/IndexedDB_API/Basic_Terminology#gloss_keygenerator">キージェネレーター</a>を使用するかに応じて、キーを供給する方法がいくつか存在します。</p> -<p>次に、データベースを構築します。IndexedDB はテーブルではなくオブジェクトストアを使用しており、ひとつのデータベースに複数のオブジェクトストアを含めることができます。値をオブジェクトストアへ保存するたびに、値がキーと関連付けられます。オブジェクトストアで<a href="/ja/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB#gloss_keypath" title="IndexedDB#gloss_key_path">キーパス</a>を使用するか<a href="/ja/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB#gloss_keygenerator" title="IndexedDB#gloss key generator">キージェネレータ</a>を使用するかに応じて、キーを供給する方法がいくつか存在します。</p> - -<p>以下の表で、キーを供給するさまざまな方法を示します:</p> +<p>以下の表で、キーを供給するさまざまな方法を示します。</p> <table class="standard-table"> <thead> <tr> <th scope="col">キーパス (<code>keyPath</code>)</th> - <th scope="col">キージェネレータ (<code>autoIncrement</code>)</th> + <th scope="col">キージェネレーター (<code>autoIncrement</code>)</th> <th scope="col">説明</th> </tr> </thead> @@ -181,7 +185,7 @@ request.onupgradeneeded = function(event) { <p>さらにインデックスには、保存されたデータに単純な制限を強制する機能があります。インデックスを作成する際に unique フラグを設定すると、インデックスのキーパスで同じ値を持つオブジェクトが複数保存されないことを、インデックスが保証します。よって例えば人々の集団の情報を保持するオブジェクトストアがある場合に、同じメールアドレスを持つ人が 2 人存在しないことを保証したい場合は、これを強制するために unique フラグを設定したインデックスを使用するとよいでしょう。</p> -<p>これには混乱するかもしれませんので、シンプルな例で概念を説明するべきでしょう。始めに、例で使用する顧客データをいくつか定義します:</p> +<p>これには混乱するかもしれませんので、シンプルな例で概念を説明するべきでしょう。始めに、例で使用する顧客データをいくつか定義します。</p> <pre class="brush: js">// 顧客データがどのようなものかを示します const customerData = [ @@ -192,7 +196,7 @@ const customerData = [ <p>もちろん、誰かの社会保障番号を顧客テーブルの主キーとして使用するべきではないですし (社会保障番号を持っていない人もいます)、年齢の代わりに誕生日を保管することもできますが、これらの不適切な選択は利便性のために無視して先へ進みましょう。</p> -<p>次に、データを保存する IndexedDB を作成するところを見てみましょう:</p> +<p>次に、データを保存する IndexedDB を作成するところを見てみましょう。</p> <pre class="brush: js">const dbName = "the_name"; @@ -222,28 +226,28 @@ request.onupgradeneeded = function(event) { objectStore.transaction.oncomplete = function(event) { // 新たに作成した objectStore に値を保存します。 var customerObjectStore = db.transaction("customers", "readwrite").objectStore("customers"); - for (var i in customerData) { - customerObjectStore.add(customerData[i]); - } + customerData.forEach(function(customer) { + customerObjectStore.add(customer); + }); }; }; </pre> <p>先に示したように、<code>onupgradeneeded</code> はデータベースの構造を変えることができる唯一の場所です。ここではオブジェクトストアの作成および削除や、インデックスの構築および削除が可能です。</p> -<p>オブジェクトストアは <code>createObjectStore()</code> を 1 回呼び出して作成します。このメソッドの引数は、ストアの名前とパラメータオブジェクトです。パラメータオブジェクトは省略可能ですが、重要なオプションプロパティを定義したり、作成したいオブジェクトストアの型を改良することができますので、とても重要です。この例では "customers" という名前のオブジェクトストアを要求して、<code>keyPath</code> を定義しています。<code>keyPath</code> は、ストア内で個々のオブジェクトを一意にするプロパティです。この例では、社会保障番号が一意であることが保証されていますので "ssn" にしています。"ssn" は、<code>objectStore</code> に保存するすべてのオブジェクトに与えなければなりません。</p> +<p>オブジェクトストアは <code>createObjectStore()</code> を 1 回呼び出して作成します。このメソッドの引数は、ストアの名前と引数オブジェクトです。引数オブジェクトは省略可能ですが、重要なオプションプロパティを定義したり、作成したいオブジェクトストアの型を改良することができますので、とても重要です。この例では "customers" という名前のオブジェクトストアを要求して、<code>keyPath</code> を定義しています。<code>keyPath</code> は、ストア内で個々のオブジェクトを一意にするプロパティです。この例では、社会保障番号が一意であることが保証されていますので "ssn" にしています。"ssn" は、<code>objectStore</code> に保存するすべてのオブジェクトに与えなければなりません。</p> <p>また、保存されたオブジェクトの <code>name</code> プロパティを参照する、"name" という名前のインデックスも要求しています。<code>createObjectStore()</code> と同様に <code>createIndex()</code> も、作成したいインデックスの型を改良するための省略可能な引数 <code>options</code> オブジェクトを指定できます。<code>name</code> プロパティを持たないオブジェクトを追加することはできますが、そのオブジェクトは "name" インデックス内に現れません。</p> -<p>以上でオブジェクトストアに保存された顧客オブジェクトを、<code>ssn</code> を使用して直接、またはインデックスを使用して名前をもとにして、取り出すことができます。この仕組みについて詳しくは、<a href="#Using_an_index" title="Using IndexedDB#Using an index">インデックスを使用する</a> をご覧ください。</p> +<p>以上でオブジェクトストアに保存された顧客オブジェクトを、<code>ssn</code> を使用して直接、またはインデックスを使用して名前をもとにして、取り出すことができます。この仕組みについて詳しくは、<a href="#using_an_index">インデックスを使用する</a> をご覧ください。</p> -<h3 id="Using_a_key_generator" name="Using_a_key_generator">キージェネレータを使用する</h3> +<h3 id="Using_a_key_generator">キージェネレーターを使用する</h3> -<p>オブジェクトストアを作成するときに <code>autoIncrement</code> フラグを設定すると、そのオブジェクトストアでキージェネレータを使用できます。デフォルトで、このフラグは設定されません。</p> +<p>オブジェクトストアを作成するときに <code>autoIncrement</code> フラグを設定すると、そのオブジェクトストアでキージェネレーターを使用できます。デフォルトで、このフラグは設定されません。</p> -<p>キージェネレータを使用すると、オブジェクトストアに値を追加するのに応じて自動的にキーが生成されます。オブジェクトストアでキージェネレータを初めて作成した時点では、キージェネレータの値が常に 1 になります。基本的に、新たに自動生成されるキーは、前のキーから 1 増加した値になります。データベースのトランザクションが中止されるなど、データベースの操作が取り消された場合を除き、キージェネレータの現在の値が減少することはありません。従って、オブジェクトストアからレコードを削除したりすべてのレコードをクリアしたりしても、オブジェクトストアのキージェネレータには影響がありません。</p> +<p>キージェネレーターを使用すると、オブジェクトストアに値を追加するのに応じて自動的にキーが生成されます。オブジェクトストアでキージェネレーターを初めて作成した時点では、キージェネレーターの値が常に 1 になります。基本的に、新たに自動生成されるキーは、前のキーから 1 増加した値になります。データベースのトランザクションが中止されるなど、データベースの操作が取り消された場合を除き、キージェネレーターの現在の値が減少することはありません。従って、オブジェクトストアからレコードを削除したりすべてのレコードをクリアしたりしても、オブジェクトストアのキージェネレーターには影響がありません。</p> -<p>以下のように、キージェネレータを持つ別のオブジェクトストアを作成できます:</p> +<p>以下のように、キージェネレーターを持つ別のオブジェクトストアを作成できます。</p> <pre class="brush: js">// indexedDB を開きます。 var request = indexedDB.open(dbName, 3); @@ -255,7 +259,7 @@ request.onupgradeneeded = function (event) { // autoIncrement フラグに true を設定した、"names" という名前のオブジェクトストアを作成します。 var objStore = db.createObjectStore("names", { autoIncrement : true }); - // "names" オブジェクトストアはキージェネレータを持っていますので、値 name のキーは自動的に生成されます。 + // "names" オブジェクトストアはキージェネレーターを持っていますので、値 name のキーは自動的に生成されます。 // 追加したレコードは以下のようになります: // キー : 1 => 値 : "Bill" // キー : 2 => 値 : "Donna" @@ -264,34 +268,34 @@ request.onupgradeneeded = function (event) { } };</pre> -<p>キージェネレータについて詳しくは、<a href="http://www.w3.org/TR/IndexedDB/#key-generator-concept">"W3C Key Generators"</a> をご覧ください。</p> +<p>キージェネレーターについて詳しくは、<a href="https://www.w3.org/TR/IndexedDB/#key-generator-concept">"W3C Key Generators"</a> をご覧ください。</p> -<h2 id="Adding_retrieving_and_removing_data" name="Adding_retrieving_and_removing_data">データを追加する、読み出す、削除する</h2> +<h2 id="Adding_retrieving_and_removing_data">データの追加、読み取り、削除</h2> <p>新しいデータベースで何かを行えるようにする前に、トランザクションを開始しなければなりません。トランザクションはデータベースオブジェクトから生じており、トランザクションの対象にしたいオブジェクトストアを指定しなければなりません。トランザクションの内部では、データを保持しているオブジェクトストアへのアクセスや、リクエストの実行が可能です。次に、データベースに変更処理を行うのか、あるいはデータベースから読み出すだけかを決めなければなりません。トランザクションは <code>readonly</code>、<code>readwrite</code>、<code>versionchange</code> の 3 つのモードを使用できます。</p> -<p>データベースの "スキーマ" や構造を変更する (オブジェクトストアやインデックスを作成または削除する) には、トランザクションを <code>versionchange</code> モードにしなければなりません。このトランザクションは、<code>version</code> を指定して {{domxref("IDBFactory.open")}} メソッドを呼び出すことによって開きます。(最新の仕様を実装していない WebKit ブラウザーは {{domxref("IDBFactory.open")}} メソッドの引数が、データベースの <code>name</code> の 1 つしかありません。よって、<code>versionchange</code> トランザクションを開始するには {{domxref("IDBVersionChangeRequest.setVersion")}} を呼び出さなければなりません)</p> +<p>データベースの「スキーマ」や構造を変更する (オブジェクトストアやインデックスを作成または削除する) には、トランザクションを <code>versionchange</code> モードにしなければなりません。このトランザクションは、<code>version</code> を指定して {{domxref("IDBFactory.open")}} メソッドを呼び出すことによって開きます。</p> <p>既存のオブジェクトストアからレコードを読み出すには、トランザクションで <code>readonly</code> モードまたは <code>readwrite</code> モードを使用できます。既存のオブジェクトストアに変更処理を行うには、トランザクションを <code>readwrite</code> モードにしなければなりません。このようなトランザクションは {{domxref("IDBDatabase.transaction")}} で開きます。このメソッドの引数は 2 つあり、<code>storeNames</code> (アクセスしたいオブジェクトストアの配列で定義されるスコープ) とトランザクションの <code>mode</code> (<code>readonly</code> または <code>readwrite</code>) です。またこのメソッドは、{{domxref("IDBTransaction.objectStore")}} メソッドを持つトランザクションオブジェクトを返します。<code>objectStore</code> メソッドは、オブジェクトストアにアクセスするために使用できます。デフォルトでは、モードを指定しなければ <code>readonly</code> モードでトランザクションを開きます。</p> <div class="note"> -<p><strong>注記</strong>: Firefox 40 で、IndexedDB トランザクションはパフォーマンスを向上させるために、永続性の保証を緩和しました ({{Bug("1112702")}} を参照)。以前は <code>readwrite</code> モードのトランザクションで、すべてのデータをディスク上に反映したことが保証された場合に限り {{domxref("IDBTransaction.oncomplete")}} 発生しました。Firefox 40 以降では OS がデータの書き込みを指示した時点で <code>complete</code> が発生しており、実際にはデータがディスク上に反映されていない可能性があります。これにより <code>complete</code> イベントをより早く発生させられますが、データをディスク上に反映する前に OS のクラッシュや電源断が発生するとトランザクション全体を失う危険性が若干あります。このような破壊的な事象はまれですので、ほとんどの利用者は心配する必要がないでしょう。何らかの理由 (例えば、後で再計算できない重要なデータを保存する) で永続性を保証しなければならない場合は、実験的 (非標準) な <code>readwriteflush</code> モード ({{domxref("IDBDatabase.transaction")}} を参照) を使用してトランザクションを生成すると、<code>complete</code> イベントを発生させる前にディスクへの反映を強制させることができます。</p> +<p><strong>メモ</strong>: Firefox 40 で、IndexedDB トランザクションはパフォーマンスを向上させるために、永続性の保証を緩和しました ({{Bug("1112702")}} を参照)。以前は <code>readwrite</code> モードのトランザクションで、すべてのデータをディスク上に反映したことが保証された場合に限り {{domxref("IDBTransaction.oncomplete")}} 発生しました。Firefox 40 以降では OS がデータの書き込みを指示した時点で <code>complete</code> が発生しており、実際にはデータがディスク上に反映されていない可能性があります。これにより <code>complete</code> イベントをより早く発生させられますが、データをディスク上に反映する前に OS のクラッシュや電源断が発生するとトランザクション全体を失う危険性が若干あります。このような破壊的な事象はまれですので、ほとんどの利用者は心配する必要がないでしょう。何らかの理由 (例えば、後で再計算できない重要なデータを保存する) で永続性を保証しなければならない場合は、実験的 (非標準) な <code>readwriteflush</code> モード ({{domxref("IDBDatabase.transaction")}} を参照) を使用してトランザクションを生成すると、<code>complete</code> イベントを発生させる前にディスクへの反映を強制させることができます。</p> </div> -<p>トランザクションで適切なスコープおよびモードを使用すると、データアクセスを高速化できます。ヒントを 2 つ紹介します:</p> +<p>トランザクションで適切なスコープおよびモードを使用すると、データアクセスを高速化できます。ヒントを 2 つ紹介します。</p> <ul> <li>スコープを定義するときは、必要なオブジェクトストアのみ指定します。これにより、同時にスコープが重なり合うことなく、複数のトランザクションを実行できます。</li> - <li><code>readwrite</code> トランザクションモードは、必要な場合に限り指定します。<code>readonly</code> トランザクションはスコープが重なっても複数同時に実行できますが、<code>readwrite</code> トランザクションはオブジェクトストアに対して 1 個しか実行できません。詳しくは、<a href="/ja/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB">基本的な概念</a>の記事で <dfn><a href="/ja/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB#Database">トランザクション</a></dfn>の定義をご覧ください。</li> + <li><code>readwrite</code> トランザクションモードは、必要な場合に限り指定します。<code>readonly</code> トランザクションはスコープが重なっても複数同時に実行できますが、<code>readwrite</code> トランザクションはオブジェクトストアに対して 1 個しか実行できません。詳しくは、<a href="/ja/docs/Web/API/IndexedDB_API/Basic_Terminology">IndexedDB の主な特徴と基本用語</a>の記事で <a href="/ja/docs/Web/API/IndexedDB_API/Basic_Terminology#gloss_transaction">トランザクション</a>の定義をご覧ください。</li> </ul> -<h3 id="Adding_data_to_the_database" name="Adding_data_to_the_database">データベースにデータを追加する</h3> +<h3 id="Adding_data_to_the_database">データベースにデータを追加する</h3> -<p>データベースを作成したら、書き込みを行いたいと考えるでしょう。これは以下のようにします:</p> +<p>データベースを作成したら、書き込みを行いたいと考えるでしょう。これは以下のようにします。</p> <pre class="brush:js;">var transaction = db.transaction(["customers"], "readwrite"); -// 注記: 古い実験的な実装では、"readwrite" の代わりに非推奨の定数 IDBTransaction.READ_WRITE を使用します。 -// そのような実装をサポートしたい場合は、以下のように記述します: +// メモ: 古い実験的な実装では、"readwrite" の代わりに非推奨の定数 IDBTransaction.READ_WRITE を使用します。 +// そのような実装をサポートしたい場合は、以下のように記述します。 // var transaction = db.transaction(["customers"], IDBTransaction.READ_WRITE);</pre> <p><code>transaction()</code> 関数は引数が 2 つあり (ひとつは省略可能)、トランザクションオブジェクトを返します。第 1 引数は、トランザクションの対象にするオブジェクトストアのリストです。トランザクションですべてのオブジェクトを対象にしたい場合は空の配列を渡すことができますが、仕様書では空の配列に対して InvalidAccessError を生成すべきとされていますので、行わないようにしてください。第 2 引数に何も指定しなければ、読み取り専用のトランザクションになります。書き込みを行いたい場合は、<code>"readwrite"</code> フラグを渡さなければなりません。</p> @@ -304,7 +308,7 @@ request.onupgradeneeded = function (event) { <pre class="brush: js">// すべてのデータがデータベースに追加されたときに行う処理 transaction.oncomplete = function(event) { - alert("All done!"); + console.log("All done!"); }; transaction.onerror = function(event) { @@ -321,9 +325,9 @@ for (var i in customerData) { <p><code>add()</code> を呼び出して生成されたリクエストの <code>result</code> は、追加された値のキーです。よってこのケースでは、オブジェクトストアでキーパスとして <code>ssn</code> プロパティを使用していますので、追加されたオブジェクトの <code>ssn</code> プロパティと等しくなります。<code>add()</code> 関数では、データベース内に同一のキーを持つオブジェクトが存在しないことを要求しますので注意してください。既存の項目を変更しようとする場合や、既存の項目があるかを配慮しない場合は、{{anch("Updating an entry in the database", "データベース内の項目を更新する")}} の章で説明している <code>put()</code> 関数を使用できます。</p> -<h3 id="Removing_data_from_the_database" name="Removing_data_from_the_database">データベースからデータを削除する</h3> +<h3 id="Removing_data_from_the_database">データベースからのデータの削除</h3> -<p>データの削除もよく似ています:</p> +<p>データの削除もよく似ています。</p> <pre class="brush: js">var request = db.transaction(["customers"], "readwrite") .objectStore("customers") @@ -332,9 +336,9 @@ request.onsuccess = function(event) { // 削除完了! };</pre> -<h3 id="Getting_data_from_the_database" name="Getting_data_from_the_database">データベースからデータを取得する</h3> +<h3 id="Getting_data_from_the_database">データベースからのデータの取得</h3> -<p>データベースは情報を持っていますので、いくつかの方法でデータを読み出すことができます。まずは、単純に <code>get()</code> を使用します。以下のように、値を読み出すためにキーを提供しなければなりません:</p> +<p>データベースは情報を持っていますので、いくつかの方法でデータを読み出すことができます。まずは、単純に <code>get()</code> を使用します。以下のように、値を読み出すためにキーを提供しなければなりません。</p> <pre class="brush: js">var transaction = db.transaction(["customers"]); var objectStore = transaction.objectStore("customers"); @@ -344,27 +348,27 @@ request.onerror = function(event) { }; request.onsuccess = function(event) { // request.result に対して行う処理! - alert("Name for SSN 444-44-4444 is " + request.result.name); + console.log("Name for SSN 444-44-4444 is " + request.result.name); };</pre> -<p>"単純に" 読み出すにも多くのコードがあります。データベースレベルでエラー処理を行うとすれば、コードを少々短縮できることを以下に示します:</p> +<p>"単純に" 読み出すにも多くのコードがあります。データベースレベルでエラー処理を行うとすれば、コードを少々短縮できることを以下に示します。</p> <pre class="brush: js">db.transaction("customers").objectStore("customers").get("444-44-4444").onsuccess = function(event) { - alert("Name for SSN 444-44-4444 is " + event.target.result.name); + console.log("Name for SSN 444-44-4444 is " + event.target.result.name); };</pre> <p>どのように動作するかわかりますか? オブジェクトストアが 1 つしかありませんので、トランザクションで必要とするオブジェクトストアのリストを渡さずに、名称を文字列で渡しています。また、データベースから読み出すだけですので、<code>"readwrite"</code> トランザクションは不要です。モードを指定せずに <code>transaction()</code> を呼び出すと、<code>"readonly"</code> トランザクションになります。さらに細かいことですが、実はリクエストオブジェクトを変数に保存していません。DOM イベントはターゲットとしてリクエストを持ちますので、<code>result</code> プロパティを得るためにイベントを使用できます。</p> -<p>トランザクションでスコープやモードを制限することにより、データアクセスを高速化できることに留意してください。ヒントを 2 つ紹介します:</p> +<p>トランザクションでスコープやモードを制限することにより、データアクセスを高速化できることに留意してください。ヒントを 2 つ紹介します。</p> <ul> <li><a href="#scope">スコープ</a>を定義するときは、必要なオブジェクトストアのみ指定します。これにより、同時にスコープが重なり合うことなく、複数のトランザクションを実行できます。</li> - <li>readwrite トランザクションモードは、必要な場合に限り指定します。readonly トランザクションはスコープが重なっても複数同時に実行できますが、readwrite トランザクションはオブジェクトストアに対して 1 個しか実行できません。詳しくは、<a href="/ja/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB#gloss_transaction">基本的な概念の記事でトランザクション</a>の定義をご覧ください。</li> + <li>readwrite トランザクションモードは、必要な場合に限り指定します。readonly トランザクションはスコープが重なっても複数同時に実行できますが、readwrite トランザクションはオブジェクトストアに対して 1 個しか実行できません。詳しくは、<a href="/ja/docs/Web/API/IndexedDB_API/Basic_Terminology#gloss_transaction">基本的な概念の記事でトランザクション</a>の定義をご覧ください。</li> </ul> -<h3 id="Updating_an_entry_in_the_database" name="Updating_an_entry_in_the_database">データベース内の項目を更新する</h3> +<h3 id="Updating_an_entry_in_the_database">データベース内の項目の更新</h3> -<p>読み出したデータを更新して IndexedDB に書き戻す方法は、とてもシンプルです。先ほどのサンプルを多少更新しましょう:</p> +<p>読み出したデータを更新して IndexedDB に書き戻す方法は、とてもシンプルです。先ほどのサンプルを多少更新しましょう。</p> <pre class="brush: js">var objectStore = db.transaction(["customers"], "readwrite").objectStore("customers"); var request = objectStore.get("444-44-4444"); @@ -391,29 +395,29 @@ request.onsuccess = function(event) { <p>ここでは <code>objectStore</code> を作成して、ssn の値 (<code>444-44-4444</code>) で特定される顧客レコードの取り出しを要求しています。リクエストの結果を変数 (<code>data</code>) に代入して、そのオブジェクトの <code>age</code> プロパティを更新します。そして、顧客レコードを <code>objectStore</code> に書き戻して前の値を上書きする、第 2 のリクエスト (<code>requestUpdate</code>) を作成します。</p> <div class="note"> -<p><strong>注記</strong>: このケースではデータベースから読み出すだけでなく書き込みも行いたいので、<code>readwrite</code> トランザクションを指定しました。</p> +<p><strong>メモ</strong>: このケースではデータベースから読み出すだけでなく書き込みも行いたいので、<code>readwrite</code> トランザクションを指定しました。</p> </div> -<h3 id="Using_a_cursor" name="Using_a_cursor">カーソルを使用する</h3> +<h3 id="Using_a_cursor">カーソルの使用</h3> -<p><code>get()</code> を使用する際は、読み出したいキーがどれかを知っていることが必要です。オブジェクトストア内のすべての値を渡り歩きたい場合は、カーソルを使用できます。以下のようなものです:</p> +<p><code>get()</code> を使用する際は、読み出したいキーがどれかを知っていることが必要です。オブジェクトストア内のすべての値を渡り歩きたい場合は、カーソルを使用できます。以下のようなものです。</p> <pre class="brush: js">var objectStore = db.transaction("customers").objectStore("customers"); objectStore.openCursor().onsuccess = function(event) { var cursor = event.target.result; if (cursor) { - alert("Name for SSN " + cursor.key + " is " + cursor.value.name); + console.log("Name for SSN " + cursor.key + " is " + cursor.value.name); cursor.continue(); } else { - alert("No more entries!"); + console.log("No more entries!"); } };</pre> -<p><code>openCursor()</code> 関数は、引数がいくつかあります。第一に、すぐに取得するキーレンジオブジェクトを使用して、読み出すアイテムの範囲を制限できます。第二に、反復処理を行いたい方向を指定できます。上記の例では、すべてのオブジェクトを昇順方向に反復します。カーソルの成功イベントのコールバックは、やや特殊です。カーソルオブジェクト自体は、リクエストの <code>result</code> です (上記の例ではショートハンドを使用しており、<code>event.target.result</code> になります)。そして実際のキーと値は、カーソルオブジェクトの <code>key</code> プロパティと <code>value</code> プロパティで見つかります。進み続けたい場合は、カーソルで <code>continue()</code> を呼び出さなければなりません。データの終端に達した (または、<code>openCursor()</code> リクエストにマッチする項目が存在しない) 場合は成功のコールバックを受け取りますが、<code>result</code> プロパティが <code>undefined</code> になります。</p> +<p><code>openCursor()</code> 関数は、引数がいくつかあります。第一に、すぐに取得するキーレンジオブジェクトを使用して、読み出すアイテムの範囲を制限できます。第二に、反復処理を行いたい方向を指定できます。上記の例では、すべてのオブジェクトを昇順方向に反復します。カーソルの成功イベントのコールバックは、やや特殊です。カーソルオブジェクト自体は、リクエストの <code>result</code> です (上記の例では略記法を使用しており、<code>event.target.result</code> になります)。そして実際のキーと値は、カーソルオブジェクトの <code>key</code> プロパティと <code>value</code> プロパティで見つかります。進み続けたい場合は、カーソルで <code>continue()</code> を呼び出さなければなりません。データの終端に達した (または、<code>openCursor()</code> リクエストに一致する項目が存在しない) 場合は成功のコールバックを受け取りますが、<code>result</code> プロパティが <code>undefined</code> になります。</p> -<p>カーソルをよく使用するパターンのひとつが、以下のようにオブジェクトストア内の全データを読み出して、配列に追加することです:</p> +<p>カーソルをよく使用するパターンのひとつが、以下のようにオブジェクトストア内の全データを読み出して、配列に追加することです。</p> <pre class="brush: js">var customers = []; @@ -424,40 +428,45 @@ objectStore.openCursor().onsuccess = function(event) { cursor.continue(); } else { - alert("Got all customers: " + customers); + console.log("Got all customers: " + customers); } };</pre> <div class="note"> -<p><strong>注記</strong>: Mozilla は、このような処理を行うために <code>getAll()</code> も実装しています (および <code>getAllKeys()</code> もあり、これは現在、about:config の設定項目 <code>dom.indexedDB.experimental</code> で隠しています)。これらは IndexedDB 標準の一部ではなく、将来削除する可能性があります。これらは便利であると考えられますので、実装しました。以下のコードは、前出の例とまったく同じことを行います:</p> +<p><strong>メモ</strong>: それ以外に、このような処理を行うために <code>getAll()</code> (および <code>getAllKeys()</code>)。を使用することができます。以下のコードは、前出の例とまったく同じことを行います。</p> <pre class="brush: js">objectStore.getAll().onsuccess = function(event) { - alert("Got all customers: " + event.target.result); + console.log("Got all customers: " + event.target.result); };</pre> <p>これはオブジェクトを横着な方法で作成するため、カーソルの <code>value</code> プロパティの検索に関してパフォーマンスコストが発生します。例えば <code>getAll()</code> を使用するとき、Gecko はすべてのオブジェクトを一度に作成しなければなりません。例えばそれぞれのキーを検索することにのみ関心がある場合は、<code>getAll()</code> よりもカーソルを使用する方がとても効率的です。オブジェクトストア内の全データの配列を得ようとしている場合は、<code>getAll()</code> を使用しましょう。</p> </div> -<h3 id="Using_an_index" name="Using_an_index">インデックスを使用する</h3> +<h3 id="Using_an_index">インデックスの使用</h3> <p>SSN は個人を一意に識別しますので、キーとして SSN を使用して顧客データを保管することは論理的です。(プライバシーの観点でよいアイデアであるかは別の問題であり、この記事の対象外です) 一方、名前で顧客を検索しなければならない場合は、正しいものが見つかるまでデータベース内のすべての SSN に対して反復処理を行わなければなりません。この方法による検索はとても遅いため、代わりにインデックスを使用するとよいでしょう。</p> -<pre class="brush: js">var index = objectStore.index("name"); +<pre class="brush: js">// 最初に、 request.onupgradeneeded の中にインデックスを生成したか確認してください。 +// objectStore.createIndex("name", "name"); +// まだであれば、 DOMException が発生します。 + +var index = objectStore.index("name"); index.get("Donna").onsuccess = function(event) { - alert("Donna's SSN is " + event.target.result.ssn); -};</pre> + console.log("Donna's SSN is " + event.target.result.ssn); +}; +</pre> <p>"name" カーソルは一意ではないので、<code>name</code> に <code>"Donna"</code> が設定されている項目は複数存在する可能性があります。この場合は常に、キーの値がもっとも小さいものを取得します。</p> -<p>指定した <code>name</code> に該当するすべての項目にアクセスしなければならない場合は、カーソルを使用します。インデックス上で、2 種類のカーソルを開くことができます。ノーマルカーソルは、インデックスのプロパティと、オブジェクトストア内のオブジェクトを紐づけます。キーカーソルは、インデックスのプロパティと、オブジェクトストア内にオブジェクトを保存するために使用するキーを紐づけます。これらの違いを以下に示します:</p> +<p>指定した <code>name</code> に該当するすべての項目にアクセスしなければならない場合は、カーソルを使用します。インデックス上で、2 種類のカーソルを開くことができます。ノーマルカーソルは、インデックスのプロパティと、オブジェクトストア内のオブジェクトを紐づけます。キーカーソルは、インデックスのプロパティと、オブジェクトストア内にオブジェクトを保存するために使用するキーを紐づけます。これらの違いを以下に示します。</p> <pre class="brush: js">// 顧客レコードのオブジェクト全体を得るために、ノーマルカーソルを使用します。 index.openCursor().onsuccess = function(event) { var cursor = event.target.result; if (cursor) { // cursor.key は "Bill" のような名前、cursor.value はオブジェクト全体です。 - alert("Name: " + cursor.key + ", SSN: " + cursor.value.ssn + ", email: " + cursor.value.email); + console.log("Name: " + cursor.key + ", SSN: " + cursor.value.ssn + ", email: " + cursor.value.email); cursor.continue(); } }; @@ -468,40 +477,40 @@ index.openKeyCursor().onsuccess = function(event) { if (cursor) { // cursor.key は "Bill" のような名前、cursor.value は SSN です。 // 保存されたオブジェクトの他の部分を直接取得する方法はありません。 - alert("Name: " + cursor.key + ", SSN: " + cursor.value); + console.log("Name: " + cursor.key + ", SSN: " + cursor.value); cursor.continue(); } };</pre> -<h3 id="Specifying_the_range_and_direction_of_cursors" name="Specifying_the_range_and_direction_of_cursors">カーソルの範囲や方向を指定する</h3> +<h3 id="Specifying_the_range_and_direction_of_cursors">カーソルの範囲や方向を指定する</h3> -<p>カーソルで参照する値の範囲を制限したい場合は、<code>IDBKeyRange</code> オブジェクトを使用して、<code>openCursor()</code> または <code>openKeyCursor()</code> の第 1 引数として渡します。ひとつのキーのみ許可するキーレンジ、下限または上限の片方を持つキーレンジ、あるいは下限と上限の両方を持つキーレンジを作成できます。境界は "closed" (すなわち、キーレンジは指定した値を含む) または "open" (すなわち、キーレンジは指定した値を含まない) のどちらにもできます。使い方を以下に示します:</p> +<p>カーソルで参照する値の範囲を制限したい場合は、<code>IDBKeyRange</code> オブジェクトを使用して、<code>openCursor()</code> または <code>openKeyCursor()</code> の第 1 引数として渡します。ひとつのキーのみ許可するキーレンジ、下限または上限の片方を持つキーレンジ、あるいは下限と上限の両方を持つキーレンジを作成できます。境界は "closed" (すなわち、キーレンジは指定した値を含む) または "open" (すなわち、キーレンジは指定した値を含まない) のどちらにもできます。使い方を以下に示します。</p> -<pre class="brush: js">// "Donna" にのみマッチします。 +<pre class="brush: js">// "Donna" にのみ一致します。 var singleKeyRange = IDBKeyRange.only("Donna"); -// "Bill" より先のすべてにマッチします。"Bill" を含みます。 +// "Bill" より先のすべてに一致します。"Bill" を含みます。 var lowerBoundKeyRange = IDBKeyRange.lowerBound("Bill"); -// "Bill" より先のすべてにマッチします。ただし "Bill" は含みません。 +// "Bill" より先のすべてに一致します。ただし "Bill" は含みません。 var lowerBoundOpenKeyRange = IDBKeyRange.lowerBound("Bill", true); -// "Donna" までのすべてにマッチします。ただし "Donna" は含みません。 +// "Donna" までのすべてに一致します。ただし "Donna" は含みません。 var upperBoundOpenKeyRange = IDBKeyRange.upperBound("Donna", true); -// "Bill" から "Donna" までにマッチします。ただし "Donna" は含みません。 +// "Bill" から "Donna" までに一致します。ただし "Donna" は含みません。 var boundKeyRange = IDBKeyRange.bound("Bill", "Donna", false, true); // いずれかのキーレンジを使用するには、openCursor()/openKeyCursor() の第 1 引数として渡します。 index.openCursor(boundKeyRange).onsuccess = function(event) { var cursor = event.target.result; if (cursor) { - // マッチした場合の処理。 + // 一致した場合の処理。 cursor.continue(); } };</pre> -<p>昇順 (すべてのカーソルのデフォルトの方向) ではなく、降順に反復処理を行いたい場合があるかもしれません。方向の切り替えは、<code>openCursor()</code> の第 2 引数に <code>prev</code> を渡すことで実現します:</p> +<p>昇順 (すべてのカーソルのデフォルトの方向) ではなく、降順に反復処理を行いたい場合があるかもしれません。方向の切り替えは、<code>openCursor()</code> の第 2 引数に <code>prev</code> を渡すことで実現します。</p> <pre class="brush: js">objectStore.openCursor(boundKeyRange, "prev").onsuccess = function(event) { var cursor = event.target.result; @@ -511,7 +520,7 @@ index.openCursor(boundKeyRange).onsuccess = function(event) { } };</pre> -<p>方向を変えたいだけで表示する結果は制限しない場合は、第 1 引数に null を渡します:</p> +<p>方向を変えたいだけで表示する結果は制限しない場合は、第 1 引数に null を渡します。</p> <pre class="brush: js">objectStore.openCursor(null, "prev").onsuccess = function(event) { var cursor = event.target.result; @@ -521,7 +530,7 @@ index.openCursor(boundKeyRange).onsuccess = function(event) { } };</pre> -<p>"name" インデックスは一意ではありませんので、<code>name</code> が同じ項目が複数存在する可能性があります。キーは常に一意でなければならないため、オブジェクトストアでこのような状況は発生できないことに注意してください。インデックスに対して反復処理を行う際に重複を取り除きたい場合は、方向のパラメータに <code>nextunique</code> (逆向きであれば <code>prevunique</code>) を指定します。<code>nextunique</code> または <code>prevunique</code> を使用すると、常にキーが最小の項目が返ります。</p> +<p>"name" インデックスは一意ではありませんので、<code>name</code> が同じ項目が複数存在する可能性があります。キーは常に一意でなければならないため、オブジェクトストアでこのような状況は発生できないことに注意してください。インデックスに対して反復処理を行う際に重複を取り除きたい場合は、方向の引数に <code>nextunique</code> (逆向きであれば <code>prevunique</code>) を指定します。<code>nextunique</code> または <code>prevunique</code> を使用すると、常にキーが最小の項目が返ります。</p> <pre class="brush: js">index.openKeyCursor(null, "nextunique").onsuccess = function(event) { var cursor = event.target.result; @@ -531,18 +540,18 @@ index.openCursor(boundKeyRange).onsuccess = function(event) { } };</pre> -<p>有効な方向の引数については、"<a href="/ja/docs/Web/API/IDBCursor#Constants">IDBCursor Constants</a>" をご覧ください。</p> +<p>有効な方向の引数については、"<a href="/ja/docs/Web/API/IDBCursor#constants">IDBCursor Constants</a>" をご覧ください。</p> -<h2 id="Version_changes_while_a_web_app_is_open_in_another_tab" name="Version_changes_while_a_web_app_is_open_in_another_tab">ウェブアプリが別のタブで開かれているときにバージョンを変更する</h2> +<h2 id="Version_changes_while_a_web_app_is_open_in_another_tab">ウェブアプリが別のタブで開かれているときにバージョンを変更する</h2> -<p>データベースのバージョン変更が必要である場合に ウェブアプリでそのようなことを行うときは、ユーザーが古いバージョンの ウェブアプリをタブで開いている場合に別のタブで新しいバージョンのアプリを読み込んだときに発生することを考慮しなければなりません。データベースの実際のバージョンより大きなバージョンを指定して <code>open()</code> を呼び出すときは、データベースに変更を施す前に、他にデータベースを開いているものが明示的に要求を認めなければなりません (それらを閉じるか再読み込みするまで、<code>onblocked</code> イベントが発生します)。使い方を以下に示します:</p> +<p>データベースのバージョン変更が必要である場合に ウェブアプリでそのようなことを行うときは、ユーザーが古いバージョンの ウェブアプリをタブで開いている場合に別のタブで新しいバージョンのアプリを読み込んだときに発生することを考慮しなければなりません。データベースの実際のバージョンより大きなバージョンを指定して <code>open()</code> を呼び出すときは、データベースに変更を施す前に、他にデータベースを開いているものが明示的に要求を認めなければなりません (それらを閉じるか再読み込みするまで、<code>onblocked</code> イベントが発生します)。使い方を以下に示します。</p> <pre class="brush: js">var openReq = mozIndexedDB.open("MyTestDatabase", 2); openReq.onblocked = function(event) { // 他のタブがデータベースを読み込んでいる場合は、処理を進める前に // それらを閉じなければなりません。 - alert("このサイトを開いている他のタブをすべて閉じてください!"); + console.log("このサイトを開いている他のタブをすべて閉じてください!"); }; openReq.onupgradeneeded = function(event) { @@ -558,12 +567,12 @@ openReq.onsuccess = function(event) { }; function useDatabase(db) { - // 別のページがバージョン変更を求めた場合に、通知されるようにするためのハンドラを追加するようにしてください。 + // 別のページがバージョン変更を求めた場合に、通知されるようにするためのハンドラーを追加するようにしてください。 // データベースを閉じなければなりません。データベースを閉じると、別のページがデータベースをアップグレードできます。 // これを行わなければ、ユーザーがタブを閉じるまでデータベースはアップグレードされません。 db.onversionchange = function(event) { db.close(); - alert("新しいバージョンのページが使用可能になりました。再読み込みしてください!"); + console.log("新しいバージョンのページが使用可能になりました。再読み込みしてください!"); }; // データベースを使用する処理 @@ -572,39 +581,39 @@ function useDatabase(db) { <p>すでに開かれているアプリが新たにデータベースを開こうとするコードを開始したが、古いバージョンのデータベースを使用している状況に対処するため、<code>VersionError</code> エラーもリッスンしましょう。</p> -<h2 id="Security" name="Security">セキュリティ</h2> +<h2 id="Security">セキュリティ</h2> <p>IndexedDB は同一生成元の原則を使用します。すなわち、ストアとサイトの生成元 (通常、サイトのドメインまたはサブドメイン) を紐づけますので、他の生成元からアクセスすることはできません。</p> <p>サードパーティの window コンテンツ (例えば {{htmlelement("iframe")}} のコンテンツ) は、ブラウザーが<a href="https://support.mozilla.org/ja/kb/disable-third-party-cookies">サードパーティ Cookie を禁止していない</a>限り、自身が埋め込まれている生成元の IndexedDB ストアにアクセスできます ({{bug("1147821")}} をご覧ください)。</p> -<h2 id="Warning_About_Browser_Shutdown" name="Warning_About_Browser_Shutdown">ブラウザーの終了に関する警告</h2> +<h2 id="Warning_About_Browser_Shutdown">ブラウザーの終了に関する警告</h2> -<p>ブラウザーを終了するとき (例えばユーザーが "終了" や "閉じる" ボタンをクリックしたとき)、データベースを含むディスクは予期せず削除されたり、データベースストアへのパーミッションが失われたり、次のことが起きたりします:</p> +<p>ブラウザーを終了するとき (例えばユーザーが「終了」や「閉じる」ボタンをクリックしたとき)、データベースを含むディスクは予期せず削除されたり、データベースストアへのパーミッションが失われたり、次のことが起きたりします。</p> <ol> <li>影響するデータベース (あるいは、ブラウザーを終了する場合はすべての開いているデータベース) の各トランザクションは <code>AbortError</code> とともに中断されます。この効果は各トランザクションで {{domxref("IDBTransaction.abort()")}} が呼ばれたのと同等です。</li> <li>すべてのトランザクションが完了していたら、データベース接続は閉じられます。</li> - <li>最後に、データベース接続を表す {{domxref("IDBDatabase")}} オブジェクトは {{event("close")}} イベントを受け取ります。{{domxref("IDBDatabase.onclose")}} イベントハンドラを使ってこのイベントをリッスンできます。その結果、データベースが予期せず閉じられたことがわかります。</li> + <li>最後に、データベース接続を表す {{domxref("IDBDatabase")}} オブジェクトは {{event("close")}} イベントを受け取ります。{{domxref("IDBDatabase.onclose")}} イベントハンドラーを使ってこのイベントを待ち受けできます。その結果、データベースが予期せず閉じられたことがわかります。</li> </ol> -<p>上記の挙動は新しく、下記のブラウザーリリース以降で利用できます: Firefox 50, Google Chrome 31 (おおよそ)。</p> +<p>上記の挙動は新しく、ブラウザーの Firefox 50、Google Chrome 31 以降 (おおよそ) のリリースで利用できます。</p> -<p>このブラウザーバージョンの前は、トランザクションは静かに中断され、{{event("close")}} イベントは発火せず、予期せぬデータベースの停止を検出する方法はありませんでした。</p> +<p>このバージョンのブラウザーの前は、トランザクションは暗黙裡に中断され、{{event("close")}} イベントが発行されず、予期せぬデータベースの停止を検出する方法はありませんでした。</p> <p>ユーザーはいつでもブラウザーを終了することができますので、特定のトランザクションが完了することをあてにしたり、完了しなかったことを知ったりすることはできません。この動作が暗示することがいくつかあります。</p> <p>第一に、データベースであらゆるトランザクションが終了したときに、常に一貫性がある状態を保つように注意するべきです。例えば、ユーザーが編集可能な項目のリストを保存する IndexedDB を使用していると想定します。オブジェクトストアを消去してから新たなリストを書き込むことにより、編集後のリストを保存します。あるトランザクションでオブジェクトストアを消去して、別のトランザクションで新たなリストを書き込むとすれば、消去した後かつ書き込む前にブラウザーが閉じられる危険性があり、その場合は空のデータベースが残ります。これを避けるために、消去と書き込みをひとつのトランザクションに結合しましょう。</p> -<p>第二に、データベースのトランザクションと unload イベントを紐づけるべきではありません。ブラウザーを閉じることで unload イベントが発生した場合、unload イベントハンドラで作成したトランザクションは完了しません。ブラウザーのセッションにわたって情報を管理するための直感的な方法は、ブラウザー (または特定のページ) を開いたときに情報を読み込んで、ユーザーとブラウザーとの対話に応じて更新して、ブラウザー (またはページ) を閉じるときに保存する流れです。しかし、これは動作しないでしょう。データベースのトランザクションは unload イベントハンドラで作成されますが、これらは非同期処理ですので、実行できるようになる前に中止されるでしょう。</p> +<p>第二に、データベースのトランザクションと unload イベントを紐づけるべきではありません。ブラウザーを閉じることで unload イベントが発生した場合、unload イベントハンドラーで作成したトランザクションは完了しません。ブラウザーのセッションにわたって情報を管理するための直感的な方法は、ブラウザー (または特定のページ) を開いたときに情報を読み込んで、ユーザーとブラウザーとの対話に応じて更新して、ブラウザー (またはページ) を閉じるときに保存する流れです。しかし、これは動作しないでしょう。データベースのトランザクションは unload イベントハンドラーで作成されますが、これらは非同期処理ですので、実行できるようになる前に中止されるでしょう。</p> <p>実は通常のブラウザー終了であっても、IndexedDB のトランザクションが完了するよう保証する手段はありません。{{bug(870645)}} をご覧ください。通常の終了通知の回避策として、トランザクションの状況を追跡して、アンロード時にトランザクションが完了していないことをユーザーに警告するための <code>beforeunload</code> イベントを追加するとよいでしょう。</p> -<p>少なくともアボート通知と{{domxref("IDBDatabase.onclose")}}を追加することで、いつ起こったのかがわかります。</p> +<p>少なくとも中止通知と{{domxref("IDBDatabase.onclose")}}を追加することで、いつ起こったのかがわかります。</p> -<h2 id="Locale-aware_sorting" name="Locale-aware_sorting">ロケールを意識した並べ替え</h2> +<h2 id="Locale-aware_sorting">ロケールを意識した並べ替え</h2> -<p>Mozilla は Firefox 43 以降に、IndexedDB のデータでロケールを意識した並べ替えを行う機能を実装しました。デフォルトでは、IndexedDB は文字列の並べ替えで国際化にまったく対処せず、すべてが英語のテキストであるかのように並べ替えられます。例えば b、á、z、a は以下のように並べ替えられます:</p> +<p>Mozilla は Firefox 43 以降に、IndexedDB のデータでロケールを意識した並べ替えを行う機能を実装しました。デフォルトでは、IndexedDB は文字列の並べ替えで国際化にまったく対処せず、すべてが英語のテキストであるかのように並べ替えられます。例えば b、á、z、a は以下のように並べ替えられます。</p> <ul> <li>a</li> @@ -613,19 +622,19 @@ function useDatabase(db) { <li>á</li> </ul> -<p>これは明らかに、ユーザーが望むデータの並べ替えではありません。例えば Aaron と Áaron は、連絡先一覧で隣り合うべきです。従って適切な国際化並べ替えを実現するには、データセット全体をメモリに読み込んで、クライアントサイド JavaScript で並べ替えを実行しなければならず、非効率的です。</p> +<p>これは明らかに、ユーザーが望むデータの並べ替えではありません。例えば Aaron と Áaron は、連絡先一覧で隣り合うべきです。従って適切な国際化並べ替えを実現するには、データセット全体をメモリーに読み込んで、クライアントサイド JavaScript で並べ替えを実行しなければならず、非効率的です。</p> <p>この新機能は、開発者が {{domxref("IDBObjectStore.createIndex()")}} を使用してインデックスを作成する際にロケールを指定できるようにします (引数を確認してください)。データセットに対して反復処理を行うためにカーソルを使用するときに、ロケールを意識した並べ替えを行いたい場合は、特化した {{domxref("IDBLocaleAwareKeyRange")}} を使用できます。</p> <p>また {{domxref("IDBIndex")}} には、ロケールが指定されているか、およびどのロケールが指定されているかを特定するために追加された新たなプロパティがあります。<code>locale</code> (指定されたロケール、または未指定であれば null を返します) と <code>isAutoLocale</code> (プラットフォームの既定のロケールを使用する自動ロケールでインデックスが作成されていれば <code>true</code>、そうでなければ <code>false</code> を返します) です。</p> <div class="note"> -<p><strong>注記</strong>: 現在、この機能はフラグで隠されています。有効化して実験するには、<a>about:config</a> に移動して <code>dom.indexedDB.experimental</code> を有効化してください。</p> +<p><strong>メモ</strong>: 現在、この機能はフラグで隠されています。有効化して実験するには、<a>about:config</a> に移動して <code>dom.indexedDB.experimental</code> を有効化してください。</p> </div> -<h2 id="Full_IndexedDB_example" name="Full_IndexedDB_example">包括的な IndexedDB のサンプル</h2> +<h2 id="Full_IndexedDB_example">包括的な IndexedDB のサンプル</h2> -<h3 id="HTML_Content" name="HTML_Content">HTML コンテンツ</h3> +<h3 id="HTML_Content">HTML コンテンツ</h3> <pre class="brush: html"><script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> @@ -760,7 +769,7 @@ function useDatabase(db) { </div> </pre> -<h3 id="CSS_Content" name="CSS_Content">CSS コンテンツ</h3> +<h3 id="CSS_Content">CSS コンテンツ</h3> <pre class="brush: css">body { font-size: 0.8em; @@ -849,7 +858,7 @@ input { } </pre> -<h3 id="JavaScript_Content" name="JavaScript_Content">JavaScript コンテンツ</h3> +<h3 id="JavaScript_Content">JavaScript コンテンツ</h3> <pre class="brush: js">(function () { var COMPAT_ENVS = [ @@ -877,9 +886,7 @@ input { console.log("openDb ..."); var req = indexedDB.open(DB_NAME, DB_VERSION); req.onsuccess = function (evt) { - // ガベージコレクションの問題を避けるため、結果を得る際は - // "req" より "this" を使用する方がよい - // db = req.result; + // db = req.result; と同等 db = this.result; console.log("openDb DONE"); }; @@ -907,7 +914,7 @@ input { return tx.objectStore(store_name); } - function clearObjectStore(store_name) { + function clearObjectStore() { var store = getObjectStore(DB_STORE_NAME, 'readwrite'); var req = store.clear(); req.onsuccess = function(evt) { @@ -996,7 +1003,7 @@ input { // ストア内の次のオブジェクトに移動する cursor.continue(); - // このカウンタは、個別の ID を作成するためだけに使用する + // このカウンターは、個別の ID を作成するためだけに使用する i++; } else { console.log("No more entries"); @@ -1069,7 +1076,7 @@ input { * @param {string} url ダウンロードしてローカルの IndexedDB データベースに保存する * 画像の URL。この URL の背後にあるリソースは、"同一生成元ポリシー" に従います。 * よって、この方法を動作させるために URL は、このコードを配置する - * Web サイト/アプリと同一生成元であることが必要です。 + * ウェブサイト/アプリと同一生成元であることが必要です。 */ function addPublicationFromUrl(biblioid, title, year, url) { console.log("addPublicationFromUrl:", arguments); @@ -1189,8 +1196,8 @@ input { // 警告: 削除するには、作成時に使用したものとまったく同じキーを使用しなければ // なりません。作成時のキーが数値であった場合は、削除時も数値でなければ // なりません。 - req = store.delete(key); - req.onsuccess = function(evt) { + var deleteReq = store.delete(key); + deleteReq.onsuccess = function(evt) { console.log("evt:", evt); console.log("evt.target:", evt.target); console.log("evt.target.result:", evt.target.result); @@ -1198,7 +1205,7 @@ input { displayActionSuccess("Deletion successful"); displayPubList(store); }; - req.onerror = function (evt) { + deleteReq.onerror = function (evt) { console.error("deletePublication:", evt.target.errorCode); }; }; @@ -1298,37 +1305,38 @@ input { openDb(); addEventListeners(); -})(); // Immediately-Invoked Function Expression (IIFE) -</pre> +})(); // Immediately-Invoked Function Expression (IIFE)</pre> <p>{{LiveSampleLink('Full_IndexedDB_example', "オンラインのライブデモを試す")}}</p> -<h2 id="See_also" name="See_also">関連情報</h2> +<div class="notecard note"> +<p><strong>メモ</strong>: <code>window.indexedDB.open()</code> は非同期です。このメソッドは <code>success</code> イベントが発行されるよりもはるかに前に終了します。すなわち、ある関数 (例えば <code>openDb()</code>) が <code>open()</code> や <code>onsuccess</code> を呼び出すと、 <code>onsuccess</code> ハンドラーが実行されるよりも前に戻ります。この問題は、 <code>transaction()</code> や <code>get()</code> のような他のリクエストメソッドでも言えます。</p> +</div> + +<h2 id="See_also">関連情報</h2> <p>必要に応じて、より多くの情報を知るための記事集です。</p> -<h3 id="Reference" name="Reference">リファレンス</h3> +<h3 id="Reference">リファレンス</h3> <ul> - <li><a href="/ja/docs/Web/API/IndexedDB_API" title="IndexedDB">IndexedDB API リファレンス</a></li> - <li><a href="http://www.w3.org/TR/IndexedDB/">Indexed Database API Specification</a></li> - <li><a href="/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB_in_chrome" title="IndexedDB/Using_IndexedDB_in_chrome">chrome で IndexedDB を使用する</a></li> - <li><a href="/ja/docs/Web/API/IndexedDB_API/Using_JavaScript_Generators_in_Firefox">Firefox で JavaScript ジェネレータを使用する</a></li> - <li>Firefox のソースコード内の、IndexedDB <a class="link-https" href="https://mxr.mozilla.org/mozilla-central/find?text=&string=dom%2FindexedDB%2F.*%5C.idl&regexp=1" title="https://mxr.mozilla.org/mozilla-central/find?text=&string=dom/indexedDB/.*\.idl&regexp=1">インタフェースのファイル</a></li> + <li><a href="/ja/docs/Web/API/IndexedDB_API">IndexedDB API リファレンス</a></li> + <li><a href="https://www.w3.org/TR/IndexedDB/">Indexed Database API Specification</a></li> + <li>IndexedDB <a class="link-https" href="https://searchfox.org/mozilla-central/search?q=dom%2FindexedDB%2F.*%5C.idl&path=&case=false®exp=true">インターフェイスファイル</a> (Firefox のソースコード内)</li> </ul> -<h3 id="Tutorials_and_guides" name="Tutorials_and_guides">チュートリアルとガイド</h3> +<h3 id="Tutorials_and_guides">チュートリアルとガイド</h3> <ul> - <li><a href="http://www.html5rocks.com/en/tutorials/indexeddb/uidatabinding/">Databinding UI Elements with IndexedDB</a></li> - <li><a href="http://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx">IndexedDB — The Store in Your Browser</a></li> + <li><a href="https://www.html5rocks.com/en/tutorials/indexeddb/uidatabinding/">Databinding UI Elements with IndexedDB</a></li> + <li><a href="https://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx">IndexedDB — The Store in Your Browser</a></li> </ul> -<h3 id="Libraries" name="Libraries">ライブラリ</h3> +<h3 id="Libraries">ライブラリー</h3> <ul> - <li><a href="http://mozilla.github.io/localForage/">localForage</a>: クライアントサイドのデータストレージ向けに、シンプルな name:value 形式の構文を提供する Polyfill です。バックグラウンドで IndexedDB を使用しますが、IndexedDB をサポートしないブラウザーでは WebSQL や localStorage にフォールバックします。</li> - <li><a href="http://www.dexie.org/">dexie.js</a>: 優良でシンプルな構文により高速なコード開発を可能にする、IndexedDB のラッパーです。</li> + <li><a href="https://localforage.github.io/localForage/">localForage</a>: クライアント側のデータストレージ向けに、シンプルな name:value 形式の構文を提供するポリフィルです。バックグラウンドで IndexedDB を使用しますが、IndexedDB に対応していないブラウザーでは WebSQL や localStorage にフォールバックします。</li> + <li><a href="https://www.dexie.org/">dexie.js</a>: 優良でシンプルな構文により高速なコード開発を可能にする、IndexedDB のラッパーです。</li> <li><a href="https://github.com/erikolson186/zangodb">ZangoDB</a>: IndexedDB の MongoDB ライクなインターフェイスで、MongoDB でおなじみのフィルタリング、射影、ソート、アップデート、集計をサポートしています。</li> - <li><a href="http://jsstore.net/">JsStore</a>: シンプルで高度な IndexedDB ラッパーで SQL ライクな文法があります。</li> + <li><a href="https://jsstore.net/">JsStore</a>: シンプルで高度な IndexedDB ラッパーで SQL ライクな文法があります。</li> </ul> diff --git a/files/ja/web/api/navigator/appcodename/index.html b/files/ja/web/api/navigator/appcodename/index.html new file mode 100644 index 0000000000..befb274cb5 --- /dev/null +++ b/files/ja/web/api/navigator/appcodename/index.html @@ -0,0 +1,44 @@ +--- +title: Navigator.appCodeName +slug: Web/API/Navigator/appCodeName +tags: + - API + - Deprecated + - HTML DOM + - Navigator + - Property + - Reference +browser-compat: api.Navigator.appCodeName +translation_of: Web/API/NavigatorID/appCodeName +original_slug: Web/API/NavigatorID/appCodeName +--- +<div>{{APIRef("HTML DOM")}} {{Deprecated_Header}}</div> + +<p><strong><code>Navigator.appCodeName</code></strong> プロパティの値は、どのブラウザーでも常に "<code>Mozilla</code>" です。このプロパティは互換性のためだけに維持されています。</p> + +<div class="note"><strong>メモ:</strong> このプロパティが実際の製品名を返すことを期待しないでください。どのブラウザーもこのプロパティの値として "<code>Mozilla</code>" を返します。 +</div> + +<h2 id="Syntax">構文</h2> + +<pre class="brush: js"><em>codeName</em> = navigator.appCodeName +</pre> + +<h3 id="Value">値</h3> + +<p>"<code>Mozilla</code>" という文字列です。</p> + +<h2 id="Specifications">仕様書</h2> + +{{Specifications}} + +<h2 id="Browser_compatibility">ブラウザーの互換性</h2> + +<p>{{Compat}}</p> + +<h2 id="See_also">関連情報</h2> + +<ul> + <li>{{domxref("Navigator.appName")}}</li> + <li>{{domxref("Navigator.product")}}</li> +</ul> diff --git a/files/ja/web/api/navigator/appname/index.html b/files/ja/web/api/navigator/appname/index.html new file mode 100644 index 0000000000..0ecf702fba --- /dev/null +++ b/files/ja/web/api/navigator/appname/index.html @@ -0,0 +1,46 @@ +--- +title: Navigator.appName +slug: Web/API/Navigator/appName +tags: + - API + - Deprecated + - HTML DOM + - Navigator + - Property + - Reference +browser-compat: api.Navigator.appName +translation_of: Web/API/NavigatorID/appName +original_slug: Web/API/NavigatorID/appName +--- +<div>{{APIRef("HTML DOM")}} {{Deprecated_Header}}</div> + +<p><strong><code>Navigator.appName</code></strong> プロパティの値は、どのブラウザーでも常に "<code>Netscape</code>" です。このプロパティは互換性ためだけに維持されています。</p> + +<div class="notecard note"> + <h4>メモ</h4> + <p>このプロパティが実際のブラウザー名を返すことを期待しないでください。どのブラウザーもこのプロパティの値として "<code>Netscape</code>" を返します。</p> +</div> + +<h2 id="Syntax">構文</h2> + +<pre class="brush: js"><var>appName</var> = navigator.appName +</pre> + +<h3 id="Value">値</h3> + +<p>文字列 "<code>Netscape</code>" です。</p> + +<h2 id="Specifications">仕様書</h2> + +{{Specifications}} + +<h2 id="Browser_compatibility">ブラウザーの互換性</h2> + +<p>{{Compat}}</p> + +<h2 id="See_also">関連情報</h2> + +<ul> + <li>{{domxref("Navigator.appCodeName")}}</li> + <li>{{domxref("Navigator.product")}}</li> +</ul> diff --git a/files/ja/orphaned/web/api/navigatorid/appversion/index.html b/files/ja/web/api/navigator/appversion/index.html index 48436c71ca..d3908733b7 100644 --- a/files/ja/orphaned/web/api/navigatorid/appversion/index.html +++ b/files/ja/web/api/navigator/appversion/index.html @@ -1,13 +1,14 @@ --- -title: NavigatorID.appVersion -slug: orphaned/Web/API/NavigatorID/appVersion +title: Navigator.appVersion +slug: Web/API/Navigator/appVersion tags: - API - Deprecated - - NavigatorID + - Navigator - Property - Reference - appVersion +browser-compat: api.Navigator.appVersion translation_of: Web/API/NavigatorID/appVersion original_slug: Web/API/NavigatorID/appVersion --- @@ -16,7 +17,7 @@ original_slug: Web/API/NavigatorID/appVersion <p>"<code>4.0</code>" またはそのブラウザーのバージョン情報を表す文字列のどちらかを返します。</p> <div class="notecard note"> - <h4>注</h4> + <h4>メモ</h4> <p>このプロパティがブラウザーの正しいバージョンを返すことを期待しないでください。</p> </div> @@ -42,24 +43,8 @@ original_slug: Web/API/NavigatorID/appVersion <h2 id="Specifications">仕様書</h2> -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML WHATWG', '#dom-navigator-appversion', - 'NavigatorID.appVersion')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> +{{Specifications}} <h2 id="Browser_compatibility">ブラウザーの互換性</h2> -<p>{{Compat("api.NavigatorID.appVersion")}}</p> +<p>{{Compat}}</p> diff --git a/files/ja/web/api/navigator/hardwareconcurrency/index.html b/files/ja/web/api/navigator/hardwareconcurrency/index.html new file mode 100644 index 0000000000..cd8a14f7ab --- /dev/null +++ b/files/ja/web/api/navigator/hardwareconcurrency/index.html @@ -0,0 +1,58 @@ +--- +title: Navigator.hardwareConcurrency +slug: Web/API/Navigator/hardwareConcurrency +tags: + - API + - HTML DOM + - Navigator + - Property + - hardwareConcurrency +browser-compat: api.Navigator.hardwareConcurrency +translation_of: Web/API/Navigator/hardwareConcurrency +original_slug: Web/API/NavigatorConcurrentHardware/hardwareConcurrency +--- +<p>{{APIRef("HTML DOM")}}</p> + +<p><code><strong>navigator.hardwareConcurrency</strong></code> は読み取り専用のプロパティで、ユーザーのコンピューター上でスレッドを実行するために使用可能な論理プロセッサー数を返します。</p> + +<h2 id="Syntax">構文</h2> + +<pre class="brush: js"><em>logicalProcessors</em> = window.navigator.hardwareConcurrency +</pre> + +<h2 id="Value">値</h2> + +<p>論理プロセッサーのコア数を示す数値です。</p> + +<p>現代のコンピューターは CPU に複数の物理プロセッサーのコアがあります (通常は 2 コアか 4 コア)。しかし、通常それぞれの物理コアは高度なスケジューリング技術を用いて、一度に複数スレッドを実行することができます。 したがって、例えば 4 コアの CPU は 8 個の<strong>論理プロセッサーコア</strong>を提供することができます。論理プロセッサーのコア数は、コンテキスト切り替えを必要とせずに一度に効果的に実行できるスレッドの数を測定するために利用できます。</p> + +<p>しかしながら、ブラウザーはより少ない論理コア数を報告することを選択することで、一度に実行できる {{domxref("Worker")}} の数をより正確に表すことがあります。したがって、この数値をユーザーのシステムのコア数の絶対的な測定値として扱わないようにしてください。</p> + +<h2 id="Examples">例</h2> + +<p>この例では、ブラウザーが報告した論理プロセッサーごとに {{domxref("Worker")}} が 1 つ作られ、新しいワーカーへの参照と、そのワーカーをまだ使用しているかどうかを示す論理値の値を含むレコードを作っています。これらのオブジェクトは後で使用するために配列に順々に格納されています。後でリクエストを処理するために使うワーカーのプールを作っています。</p> + +<pre class="brush: js">let workerList = []; + +for (let i = 0; i < window.navigator.hardwareConcurrency; i++) { + let newWorker = { + worker: new Worker('cpuworker.js'), + inUse: false + }; + workerList.push(newWorker); +}</pre> + +<h2 id="Specifications">仕様書</h2> + +{{Specifications}} + +<h2 id="Browser_compatibility">ブラウザーの互換性</h2> + +<p>{{Compat}}</p> + +<h2 id="See_also">関連情報</h2> + +<ul> + <li>{{domxref("Navigator")}}</li> + <li>{{domxref("WorkerNavigator")}}</li> +</ul> diff --git a/files/ja/web/api/navigator/index.html b/files/ja/web/api/navigator/index.html index 19a930cabf..b40f8c485a 100644 --- a/files/ja/web/api/navigator/index.html +++ b/files/ja/web/api/navigator/index.html @@ -32,7 +32,7 @@ translation_of: Web/API/Navigator <dt>{{domxref("Navigator.credentials")}} {{readonlyInline}}</dt> <dd>ログインやログアウトの成功といったイベントが発生したときに、資格情報を要求してユーザーエージェントへ通知する手段を提供する {{domxref("CredentialsContainer")}} インターフェイスを返します。</dd> <dt>{{domxref("Navigator.deviceMemory")}} {{readonlyInline}} {{experimental_inline}}</dt> - <dd>端末のメモリーをギガバイト単位で返します。この値は 2 の階乗の最も近い値を 1024 で割った概算値です。</dd> + <dd>端末のメモリーをギガバイト単位で返します。この値は 2 の累乗に最も近い値を 1024 で割った概算値です。</dd> <dt>{{domxref("Navigator.doNotTrack")}} {{readonlyInline}} {{experimental_inline}}</dt> <dd>ユーザーの do-not-track 設定の値を返します。この値が "yes" であるとき、ウェブサイトやアプリケーションはユーザーを追跡するべきではありません。</dd> <dt>{{domxref("Navigator.geolocation")}} {{readonlyInline}}</dt> diff --git a/files/ja/web/api/navigator/platform/index.html b/files/ja/web/api/navigator/platform/index.html new file mode 100644 index 0000000000..c0e4620269 --- /dev/null +++ b/files/ja/web/api/navigator/platform/index.html @@ -0,0 +1,45 @@ +--- +title: Navigator.platform +slug: Web/API/Navigator/platform +tags: + - API + - Deprecated + - HTML DOM + - Navigator + - Property + - Reference + - platform +browser-compat: api.Navigator.platform +translation_of: Web/API/NavigatorID/platform +original_slug: Web/API/NavigatorID/platform +--- +<p>{{ APIRef("HTML DOM") }} {{Deprecated_Header}}</p> + +<p>ブラウザーのプラットフォームを表す文字列を返します。仕様書ではブラウザーが常に空文字列を返すことを許可していますので、信頼できる答えを得るためにこのプロパティを頼らないようにしてください。</p> + +<h2 id="Syntax">構文</h2> + +<pre class="brush: js"><em>platform</em> = navigator.platform +</pre> + +<h3 id="Value">値</h3> + +<p>ブラウザーを実行しているプラットフォームを識別する {{domxref("DOMString")}}、あるいはブラウザーがプラットフォームの識別を断わった (または識別できない) 場合は空文字列になります。<code>platform</code> は空文字列か、ブラウザーを実行しているプラットフォームを表す文字列でなければなりません。</p> + +<p>例: "<code>MacIntel</code>", "<code>Win32</code>", "<code>FreeBSD i386</code>", "<code>WebTV OS</code>"</p> + +<h2 id="Example">例</h2> + +<pre class="brush: js">console.log(navigator.platform);</pre> + +<h2 id="Usage_notes">使用上のメモ</h2> + +<p>Chrome、Edge、Firefox 63 以降を含むほとんどのブラウザーは、64 ビット版の Windows で実行していても <code>"Win32"</code> を返します。 Internet Explorer やバージョン 63 より前の Firefox は <code>"Win64"</code> を返します。</p> + +<h2 id="Specifications">仕様書</h2> + +{{Specifications}} + +<h2 id="Browser_compatibility">ブラウザーの互換性</h2> + +<p>{{Compat}}</p> diff --git a/files/ja/web/api/navigator/product/index.html b/files/ja/web/api/navigator/product/index.html new file mode 100644 index 0000000000..d1f5b35941 --- /dev/null +++ b/files/ja/web/api/navigator/product/index.html @@ -0,0 +1,45 @@ +--- +title: Navigator.product +slug: Web/API/Navigator/product +tags: + - API + - Deprecated + - Navigator + - Property + - Reference +browser-compat: api.Navigator.product +translation_of: Web/API/NavigatorID/product +original_slug: Web/API/NavigatorID/product +--- +<div>{{APIRef("HTML DOM")}} {{Deprecated_Header}}</div> + +<p><strong><code>Navigator.product</code></strong> プロパティの値は、どのブラウザーでも常に "<code>Gecko</code>" です。このプロパティは互換性のためだけに維持されています。</p> + + +<div class="notecard note"> + <p>このプロパティが実際の製品名を返すことを期待しないでください。どのブラウザーもこのプロパティの値として "<code>Gecko</code>" を返します。</p> +</div> + +<h2 id="Syntax">構文</h2> + +<pre class="brush: js"><em>productName</em> = navigator.product +</pre> + +<h3 id="Value">値</h3> + +<p>文字列 "<code>Gecko</code>" です。</p> + +<h2 id="Specifications">仕様書</h2> + +{{Specifications}} + +<h2 id="Browser_compatibility">ブラウザーの互換性</h2> + +<p>{{Compat}}</p> + +<h2 id="See_also">関連情報</h2> + +<ul> + <li>{{domxref("Navigator.appCodeName")}}</li> + <li>{{domxref("Navigator.appName")}}</li> +</ul> diff --git a/files/ja/orphaned/web/api/navigatorid/useragent/index.html b/files/ja/web/api/navigator/useragent/index.html index 6fe20d0c79..d02c88de43 100644 --- a/files/ja/orphaned/web/api/navigatorid/useragent/index.html +++ b/files/ja/web/api/navigator/useragent/index.html @@ -1,13 +1,13 @@ --- -title: NavigatorID.userAgent -slug: orphaned/Web/API/NavigatorID/userAgent +title: Navigator.userAgent +slug: Web/API/Navigator/userAgent tags: - API - - Deprecated - - NavigatorID + - Navigator - Property - Read-only - Reference +browser-compat: api.Navigator.userAgent translation_of: Web/API/NavigatorID/userAgent original_slug: Web/API/NavigatorID/userAgent --- @@ -18,68 +18,50 @@ original_slug: Web/API/NavigatorID/userAgent <div class="note"> <p>仕様書では、ブラウザーがこのフィールドを介して提供する情報をできるだけ少なくすることを求めています。このプロパティの値は、同じブラウザーの将来のバージョンでも同じままであると仮定してはいけません。まったく使用しないようにしたり、ブラウザーの現在のバージョンと過去のバージョンのためだけに使用するようにしてください。新しいブラウザーは、古いブラウザーと同じ UA、またはその一部を使い始めるかもしれません。ブラウザーエージェントが本当にこのプロパティによって広告されたものであるという保証は本当にありません。<br> <br> -また、ブラウザのユーザーはこのフィールドの値を変更することができることを覚えておいてください (UA なりすまし)。</p> +また、ブラウザーのユーザーはこのフィールドの値を変更することができることを覚えておいてください (UA なりすまし)。</p> </div> <p>ユーザーエージェント文字列の検出に基づくブラウザーの識別は<strong>信頼性が低く</strong>、ユーザーエージェント文字列はユーザーが設定可能なので<strong>推奨されません</strong>。例えば、以下のようになります。</p> <ul> - <li>Mozilla Suite と Firefox では、 about:config の "general.useragent.override" 設定を使うことができます。いくつかの Firefox の拡張や多機能バーでも設定可能です。</li> + <li>Firefox では、 about:config の "general.useragent.override" 設定を使うことができます。いくつかの Firefox の拡張や多機能バーでも設定可能です。</li> <li>Opera 6 以降では、メニューからブラウザー識別文字列を設定できます。</li> - <li>Microsoft Internet Explorer では、 Windows レジストリを利用できます。</li> - <li>Safari と iCab は、メニューから、ブラウザユーザエージェントを定義済みの Internet Explorer、または、 Netscape の文字列に変更できます。</li> + <li>Microsoft Internet Explorer では、 Windows レジストリーを使用します。</li> + <li>Safari と iCab は、メニューから、ブラウザーユーザエージェントを定義済みの Internet Explorer、または、 Netscape の文字列に変更できます。</li> </ul> -<h2 id="Syntax" name="Syntax">構文</h2> +<h2 id="Syntax">構文</h2> -<pre class="syntaxbox notranslate">var <var>ua</var> = navigator.userAgent; +<pre class="brush: js">var <var>ua</var> = navigator.userAgent; </pre> -<h3 id="Value" name="Value">値</h3> +<h3 id="Value">値</h3> <p>{{domxref("DOMString")}} で、ブラウザーが {{Glossary("HTTP")}} ヘッダーで提供する完全なユーザーエージェント文字列と、 {{domxref("Navigator")}} オブジェクト上のメソッドやその他の関連メソッドへのレスポンスを指定します。</p> <p>ユーザーエージェント文字列は形式的な構造に基づいて構築されており、いくつかの情報に分解することができます。これらの情報の各部分は、ユーザ－が設定可能な他の Navigator のプロパティから来ています。Gecko ベースのブラウザは以下の一般的な構造に準拠しています。</p> -<pre class="notranslate">userAgent = appCodeName/appVersion number (Platform; Security; OS-or-CPU; +<pre class="brush: js">userAgent = appCodeName/appVersion number (Platform; Security; OS-or-CPU; Localization; rv: revision-version-number) product/productSub Application-Name Application-Name-version </pre> -<h2 id="Example" name="Example">例</h2> +<h2 id="Example">例</h2> -<pre class="brush:js notranslate">alert(window.navigator.userAgent) +<pre class="brush:js">alert(window.navigator.userAgent) // alerts "Mozilla/5.0 (Windows; U; Win98; en-US; rv:0.9.2) Gecko/20010725 Netscape6/6.1" </pre> -<ul> -</ul> - -<h2 id="Specifications" name="Specifications">仕様書</h2> +<h2 id="Specifications">仕様書</h2> -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML WHATWG', '#dom-navigator-useragent', 'NavigatorID.userAgent')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> +{{Specifications}} -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> +<h2 id="Browser_compatibility">ブラウザーの互換性</h2> -<p>{{Compat("api.NavigatorID.userAgent")}}</p> +<p>{{Compat}}</p> -<h2 id="See_also" name="See_also">関連情報</h2> +<h2 id="See_also">関連情報</h2> <ul> - <li>{{httpheader("User-Agent")}} HTTP ヘッダー</li> + <li>{{httpheader("User-Agent")}} HTTP ヘッダー</li> </ul> diff --git a/files/ja/web/api/xmlserializer/index.html b/files/ja/web/api/xmlserializer/index.html index 48bd19f8e5..1bae104f64 100644 --- a/files/ja/web/api/xmlserializer/index.html +++ b/files/ja/web/api/xmlserializer/index.html @@ -96,7 +96,7 @@ document.body.insertAdjacentHTML('afterbegin', inp_xmls);</pre> <h2 id="See_also" name="See_also">関連項目</h2> <ul> - <li><a href="/ja/Parsing_and_serializing_XML" title="ja/Parsing_and_serializing_XML">Parsing and serializing XML</a></li> + <li><a href="/ja/Parsing_and_serializing_XML">Parsing and serializing XML</a></li> <li>{{domxref("XMLHttpRequest")}}</li> <li>{{domxref("DOMParser")}}</li> </ul> diff --git a/files/ja/web/css/@media/scripting/index.html b/files/ja/web/css/@media/scripting/index.html index af015db428..0d01c7bed8 100644 --- a/files/ja/web/css/@media/scripting/index.html +++ b/files/ja/web/css/@media/scripting/index.html @@ -32,7 +32,7 @@ translation_of: Web/CSS/@media/scripting <h3 id="HTML">HTML</h3> -<pre class="brush: htm notranslatel notranslate"><p class="script-none">スクリプトは利用できません。 :-(</p> +<pre class="brush: html notranslate"><p class="script-none">スクリプトは利用できません。 :-(</p> <p class="script-initial-only">スクリプトはページを読み込んでいる間だけ有効です。残念。</p> <p class="script-enabled">スクリプトは有効です。 :-)</p> </pre> diff --git a/files/ja/web/css/css_flow_layout/index.html b/files/ja/web/css/css_flow_layout/index.html index a16c0cbd4f..3021ce3f4a 100644 --- a/files/ja/web/css/css_flow_layout/index.html +++ b/files/ja/web/css/css_flow_layout/index.html @@ -43,7 +43,7 @@ translation_of: Web/CSS/CSS_Flow_Layout <li>{{Glossary("Block/CSS", "ブロック (CSS)")}}</li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/CSS"><strong>CSS</strong></a></li> <li><a href="/ja/docs/Web/CSS/Reference"><strong>CSS リファレンス</strong></a></li> diff --git a/files/ja/web/css/css_grid_layout/auto-placement_in_css_grid_layout/index.html b/files/ja/web/css/css_grid_layout/auto-placement_in_css_grid_layout/index.html index b6a71891c9..118bc26766 100644 --- a/files/ja/web/css/css_grid_layout/auto-placement_in_css_grid_layout/index.html +++ b/files/ja/web/css/css_grid_layout/auto-placement_in_css_grid_layout/index.html @@ -554,7 +554,7 @@ dd { <p>It may be that you come up with your own use cases for auto-placement or any other part of grid layout. If you do, raise them as issues or add to an existing issue that could solve your use case. This will help to make future versions of the specification better.</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/CSS"><strong>CSS</strong></a></li> <li><a href="/ja/docs/Web/CSS/Reference"><strong>CSS リファレンス</strong></a></li> diff --git a/files/ja/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html b/files/ja/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html index 0037394932..667917d069 100644 --- a/files/ja/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html +++ b/files/ja/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html @@ -664,7 +664,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout <h2 id="Subnav">Subnav</h2> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/CSS"><strong>CSS</strong></a></li> <li><a href="/ja/docs/Web/CSS/Reference"><strong>CSS リファレンス</strong></a></li> diff --git a/files/ja/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.html b/files/ja/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.html index 536a0e931a..3f83a21dbd 100644 --- a/files/ja/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.html +++ b/files/ja/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.html @@ -648,7 +648,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout <p><code>margin-right</code> または <code>margin-left</code> で自動マージンを使用した場合、および <code>top</code> 、<code>right</code> 、<code>bottom</code> 、<code>left</code> を使って位置を絶対指定した場合、書字方向が尊重されません。次のガイドでは、CSS グリッドレイアウト・ボックス配置と書字方向の間における相互作用を見ていきます。複数の言語で表示するサイトを開発したり、言語や書字方向を混ぜたサイトをデザインするなら、非常に役立つでしょう。</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/CSS"><strong>CSS</strong></a></li> <li><a href="/ja/docs/Web/CSS/Reference"><strong>CSS リファレンス</strong></a></li> diff --git a/files/ja/web/css/css_grid_layout/index.html b/files/ja/web/css/css_grid_layout/index.html index 77237096cf..59e1592ef5 100644 --- a/files/ja/web/css/css_grid_layout/index.html +++ b/files/ja/web/css/css_grid_layout/index.html @@ -206,7 +206,7 @@ translation_of: Web/CSS/CSS_Grid_Layout <h2 id="Subnav">Subnav</h2> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/CSS"><strong>CSS</strong></a></li> <li><a href="/ja/docs/Web/CSS/Reference"><strong>CSS リファレンス</strong></a></li> diff --git a/files/ja/web/css/css_grid_layout/layout_using_named_grid_lines/index.html b/files/ja/web/css/css_grid_layout/layout_using_named_grid_lines/index.html index 6358de6b22..5f67402f98 100644 --- a/files/ja/web/css/css_grid_layout/layout_using_named_grid_lines/index.html +++ b/files/ja/web/css/css_grid_layout/layout_using_named_grid_lines/index.html @@ -436,7 +436,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines <p>That’s all I need. I don’t need to do any calculations, grid automatically removed my 10 pixel gutter track before assigning the space to the <code>1fr</code> column tracks. As you start to build out your own layouts, you will find that the syntax becomes more familiar and you choose the ways that work best for you and the type of projects you like to build. Try building some common patterns with these various methods, and you will soon find your most productive way to work. Then, in the next guide we will look at how grid can position items for us - without us needing to use placement properties at all!</p> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/CSS"><strong>CSS</strong></a></li> <li><a href="/ja/docs/Web/CSS/Reference"><strong>CSS リファレンス</strong></a></li> diff --git a/files/ja/web/css/css_grid_layout/relationship_of_grid_layout/index.html b/files/ja/web/css/css_grid_layout/relationship_of_grid_layout/index.html index 2650339665..476cf929bf 100644 --- a/files/ja/web/css/css_grid_layout/relationship_of_grid_layout/index.html +++ b/files/ja/web/css/css_grid_layout/relationship_of_grid_layout/index.html @@ -574,7 +574,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout <li><a href="/ja/docs/Web/CSS/CSS_Columns">段組みレイアウトガイド</a></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/CSS"><strong>CSS</strong></a></li> <li><a href="/ja/docs/Web/CSS/Reference"><strong>CSS リファレンス</strong></a></li> diff --git a/files/ja/web/css/grid-column-start/index.html b/files/ja/web/css/grid-column-start/index.html index 851c96552c..cf2f596e8d 100644 --- a/files/ja/web/css/grid-column-start/index.html +++ b/files/ja/web/css/grid-column-start/index.html @@ -181,7 +181,7 @@ grid-column-start: unset; <li>動画チュートリアル: <em><a href="http://gridbyexample.com/video/series-line-based-placement/">行ベースの配置</a></em></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/CSS"><strong>CSS</strong></a></li> <li><a href="/ja/docs/Web/CSS/Reference"><strong>CSS リファレンス</strong></a></li> diff --git a/files/ja/web/css/grid-column/index.html b/files/ja/web/css/grid-column/index.html index 8f96c2f915..3a6f29ac1d 100644 --- a/files/ja/web/css/grid-column/index.html +++ b/files/ja/web/css/grid-column/index.html @@ -132,7 +132,7 @@ translation_of: Web/CSS/grid-column <li>動画チュートリアル: <em><a href="http://gridbyexample.com/video/series-line-based-placement/">行ベースの配置</a></em></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/CSS"><strong>CSS</strong></a></li> <li><a href="/ja/docs/Web/CSS/Reference"><strong>CSS リファレンス</strong></a></li> diff --git a/files/ja/web/css/grid-row/index.html b/files/ja/web/css/grid-row/index.html index 5ec045442a..7531bbfdec 100644 --- a/files/ja/web/css/grid-row/index.html +++ b/files/ja/web/css/grid-row/index.html @@ -149,7 +149,7 @@ grid-row: unset; <li>動画チュートリアル: <em><a href="http://gridbyexample.com/video/series-line-based-placement/">行ベースの配置</a></em></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/CSS"><strong>CSS</strong></a></li> <li><a href="/ja/docs/Web/CSS/Reference"><strong>CSS Reference</strong></a></li> diff --git a/files/ja/web/css/grid-template-areas/index.html b/files/ja/web/css/grid-template-areas/index.html index ab3aa7b42a..f753d8596d 100644 --- a/files/ja/web/css/grid-template-areas/index.html +++ b/files/ja/web/css/grid-template-areas/index.html @@ -126,7 +126,7 @@ grid-template-areas: unset; <li>動画チュートリアル: <em><a href="http://gridbyexample.com/video/grid-template-areas/">Grid Template Areas</a></em></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/CSS"><strong>CSS</strong></a></li> <li><a href="/ja/docs/Web/CSS/Reference"><strong>CSS リファレンス</strong></a></li> diff --git a/files/ja/web/css/grid-template-columns/index.html b/files/ja/web/css/grid-template-columns/index.html index 8dd5cc65cc..d0b5627b94 100644 --- a/files/ja/web/css/grid-template-columns/index.html +++ b/files/ja/web/css/grid-template-columns/index.html @@ -158,7 +158,7 @@ grid-template-columns: unset; <li><a href="/ja/docs/Web/CSS/CSS_Grid_Layout/Subgrid">Subgrid</a></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/CSS"><strong>CSS</strong></a></li> <li><a href="/ja/docs/Web/CSS/Reference"><strong>CSS リファレンス</strong></a></li> diff --git a/files/ja/web/css/grid-template/index.html b/files/ja/web/css/grid-template/index.html index 7108c8f12b..c80fd2a006 100644 --- a/files/ja/web/css/grid-template/index.html +++ b/files/ja/web/css/grid-template/index.html @@ -152,7 +152,7 @@ footer { <li>動画チュートリアル:<em> <a href="http://gridbyexample.com/video/grid-template-shorthand/">Grid Template shorthand</a></em></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/CSS"><strong>CSS</strong></a></li> <li><a href="/ja/docs/Web/CSS/Reference"><strong>CSS リファレンス</strong></a></li> diff --git a/files/ja/web/css/grid/index.html b/files/ja/web/css/grid/index.html index f952fbd25d..6b5a8f0d1f 100644 --- a/files/ja/web/css/grid/index.html +++ b/files/ja/web/css/grid/index.html @@ -140,7 +140,7 @@ grid: unset; <li>グリッドレイアウトガイド: <em><a href="/ja/docs/Web/CSS/CSS_Grid_Layout/Grid_Template_Areas#Grid_definition_shorthands">グリッドテンプレート領域 - グリッド定義の一括指定</a></em></li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/CSS"><strong>CSS</strong></a></li> <li><a href="/ja/docs/Web/CSS/Reference"><strong>CSS リファレンス</strong></a></li> diff --git a/files/ja/web/css/inheritance/index.html b/files/ja/web/css/inheritance/index.html index bf2dd3f663..9bf6dfaa86 100644 --- a/files/ja/web/css/inheritance/index.html +++ b/files/ja/web/css/inheritance/index.html @@ -38,7 +38,7 @@ translation_of: Web/CSS/inheritance <h2 id="Non-inherited_properties" name="Non-inherited_properties">非継承プロパティ</h2> -<p>値を持たない<strong>非継承プロパティ</strong>が要素に指定された場合、要素はプロパティの<a href="/ja/docs/Web/CSS/initial_value" title="ja/docs/Web/CSS/initial_value">初期値</a>（※各プロパティのページの「概要」の章に記されています）を取得します。</p> +<p>値を持たない<strong>非継承プロパティ</strong>が要素に指定された場合、要素はプロパティの<a href="/ja/docs/Web/CSS/initial_value">初期値</a>（※各プロパティのページの「概要」の章に記されています）を取得します。</p> <p>非継承プロパティの一般的な例としては {{ Cssxref("border") }} プロパティが挙げられます。次の様なスタイルルールを指定し、</p> diff --git a/files/ja/web/css/minmax()/index.html b/files/ja/web/css/minmax()/index.html index 9ab7b88e97..ca68c8d134 100644 --- a/files/ja/web/css/minmax()/index.html +++ b/files/ja/web/css/minmax()/index.html @@ -156,7 +156,7 @@ minmax(auto, 300px) </li> </ul> -<section class="Quick_links" id="Quick_Links"> +<section id="Quick_links"> <ol> <li><a href="/ja/docs/Web/CSS"><strong>CSS</strong></a></li> <li><a href="/ja/docs/Web/CSS/Reference"><strong>CSS リファレンス</strong></a></li> diff --git a/files/ja/web/css/padding-bottom/index.html b/files/ja/web/css/padding-bottom/index.html index 877b22fa80..8aa21ff9bb 100644 --- a/files/ja/web/css/padding-bottom/index.html +++ b/files/ja/web/css/padding-bottom/index.html @@ -104,7 +104,7 @@ padding-bottom: unset; <h2 id="See_also" name="See_also">関連情報</h2> <ul> - <li><a href="/ja/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model" title="ja/CSS/box model">CSS 基本ボックスモデルの紹介</a></li> + <li><a href="/ja/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model">CSS 基本ボックスモデルの紹介</a></li> <li>{{cssxref("padding-top")}}, {{cssxref("padding-right")}}, {{cssxref("padding-left")}} および {{cssxref("padding")}} 一括指定</li> <li>対応付けられる論理的プロパティ: {{cssxref("padding-block-start")}}, {{cssxref("padding-block-end")}}, {{cssxref("padding-inline-start")}}, {{cssxref("padding-inline-end")}} および一括指定の {{cssxref("padding-block")}} と {{cssxref("padding-inline")}}</li> </ul> diff --git a/files/ja/web/css/text-decoration-color/index.html b/files/ja/web/css/text-decoration-color/index.html index 7b0322e9d0..f41da12a5c 100644 --- a/files/ja/web/css/text-decoration-color/index.html +++ b/files/ja/web/css/text-decoration-color/index.html @@ -3,14 +3,18 @@ title: text-decoration-color slug: Web/CSS/text-decoration-color tags: - CSS - - CSS テキスト - - CSS テキスト装飾 - - CSS プロパティ - - HTML スタイル - - HTML 色 + - CSS Property + - CSS Text + - CSS Text Decoration + - HTML Colors + - HTML Styles - Reference - - text-decoration-color - - 色 + - Styling HTML + - Styling text + - color + - colors + - 'recipe:css-property' +browser-compat: css.properties.text-decoration-color translation_of: Web/CSS/text-decoration-color --- <div>{{ CSSRef }}</div> @@ -21,14 +25,13 @@ translation_of: Web/CSS/text-decoration-color <div>{{EmbedInteractiveExample("pages/css/text-decoration-color.html")}}</div> -<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> <p>CSS はそれぞれの線種ごとに固有の色を指定する仕組みを直接は持っていません。しかしながら、この効果は要素を入れ子にして、それぞれの要素毎に ({{cssxref("text-decoration-line")}} プロパティで) 異なる線種を適用し、 (code>text-decoration-color で) 線の色を指定することで実現できます。</p> -<h2 id="Syntax" name="Syntax">構文</h2> +<h2 id="Syntax">構文</h2> <pre class="brush:css no-line-numbers">/* <color> 値 */ -text-decoration-color: currentColor; +text-decoration-color: currentcolor; text-decoration-color: red; text-decoration-color: #00ff00; text-decoration-color: rgba(255, 128, 128, 0.5); @@ -37,21 +40,40 @@ text-decoration-color: transparent; /* グローバル値 */ text-decoration-color: inherit; text-decoration-color: initial; +text-decoration-color: revert; text-decoration-color: unset; </pre> -<h3 id="Values" name="Values">値</h3> +<h3 id="Values">値</h3> <dl> - <dt>{{cssxref("<color>")}}</dt> - <dd>装飾線の色です。</dd> + <dt>{{cssxref("<color>")}}</dt> + <dd>装飾線の色です。</dd> </dl> -<h3 id="Formal_syntax" name="Formal_syntax">形式文法</h3> +<h2 id="Accessibility_concerns">アクセシビリティの考慮</h2> + +<p>テキストの色、テキストが置かれている背景、テキストの装飾線の間のコントラスト比が、弱視の人がページの内容を読むことができるように十分に高いことを確認ことが重要です。色のコントラスト比は、テキストと背景の色の輝度を比較して決定されます。</p> + +<p>色だけで意味を伝えるべきではありません。例えば、テキストの色と text-decoration-color の変更だけでは、リンクにフォーカスがあることを示すのに十分ではありません。</p> + +<ul> + <li><a href="https://webaim.org/resources/contrastchecker/">WebAIM: Color Contrast Checker</a></li> + <li><a href="/ja/docs/Web/Accessibility/Understanding_WCAG/Perceivable#Guideline_1.4_Make_it_easier_for_users_to_see_and_hear_content_including_separating_foreground_from_background">MDN "WCAG を理解する ― ガイドライン 1.4 の解説"</a></li> + <li><a href="https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html">Understanding Success Criterion 1.4.3 | W3C Understanding WCAG 2.0</a></li> +</ul> + +<h2 id="Formal_definition">公式定義</h2> + +<p>{{CSSInfo}}</p> + +<h3 id="Formal_syntax">形式文法</h3> {{csssyntax}} -<h2 id="Examples" name="Examples">例</h2> +<h2 id="Examples">例</h2> + +<h3 id="Basic_example">基本的な例</h3> <pre class="brush: html"><p>This paragraph has <s>some erroneous text</s> inside it that I want to call attention to.</p></pre> @@ -62,51 +84,22 @@ text-decoration-color: unset; } s { - text-decoration-line: <code>line-through</code>; + text-decoration-line: line-through; text-decoration-color: red; text-decoration-style: wavy; }</pre> <p>{{ EmbedLiveSample('Examples') }}</p> -<h2 id="Accessibility_concerns" name="Accessibility_concerns">アクセシビリティの考慮事項</h2> - -<p>テキストの色、テキストが置かれている背景、テキストの装飾線の間のコントラスト比が、弱視の人がページの内容を読むことができるように十分に高いことを確認ことが重要です。色のコントラスト比は、テキストと背景の色の輝度を比較して決定されます。</p> - -<p>色だけで意味を伝えるべきではありません。例えば、テキストの色と text-decoration-color の変更だけでは、リンクにフォーカスがあることを示すのに十分ではありません。</p> - -<ul> - <li><a href="https://webaim.org/resources/contrastchecker/">WebAIM: Color Contrast Checker</a></li> - <li><a href="/ja/docs/Web/Accessibility/Understanding_WCAG/Perceivable#Guideline_1.4_Make_it_easier_for_users_to_see_and_hear_content_including_separating_foreground_from_background">MDN "WCAG を理解する ― ガイドライン 1.4 の解説"</a></li> - <li><a href="https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html">Understanding Success Criterion 1.4.3 | W3C Understanding WCAG 2.0</a></li> -</ul> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{ SpecName('CSS3 Text Decoration', '#text-decoration-color-property', 'text-decoration-color') }}</td> - <td>{{ Spec2('CSS3 Text Decoration') }}</td> - <td>初回定義。 {{cssxref("text-decoration")}} プロパティが複数の関連するプロパティを定義する一括指定になりました。</td> - </tr> - </tbody> -</table> +<h2 id="Specifications">仕様書</h2> -<p>{{cssinfo}}</p> +{{Specifications}} -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> +<h2 id="Browser_compatibility">ブラウザーの互換性</h2> -<p>{{Compat("css.properties.text-decoration-color")}}</p> +<p>{{Compat}}</p> -<h2 id="See_also" name="See_also">関連情報</h2> +<h2 id="See_also">関連情報</h2> <ul> <li>複数の行内装飾プロパティを一度に設定するときは、代わりに一括指定の {{cssxref("text-decoration")}} プロパティを使った方が便利かもしれません。</li> diff --git a/files/ja/web/css/text-emphasis/index.html b/files/ja/web/css/text-emphasis/index.html index 8d838fe112..6d0ae6bf2c 100644 --- a/files/ja/web/css/text-emphasis/index.html +++ b/files/ja/web/css/text-emphasis/index.html @@ -14,21 +14,28 @@ translation_of: Web/CSS/text-emphasis --- <div>{{CSSRef}}</div> -<p><a href="/ja/docs/Web/CSS">CSS</a> の <strong><code>text-emphasis</code></strong> プロパティは、 (空白や制御文字を除く) テキストに圏点を適用します。これは {{cssxref("text-emphasis-style")}} と {{cssxref("text-emphasis-color")}} の<a href="/ja/docs/Web/CSS/Shorthand_properties">一括指定</a>です。</p> +<p><strong><code>text-emphasis</code></strong> は <a href="/ja/docs/Web/CSS">CSS</a> のプロパティで、 (空白や制御文字を除く) テキストに圏点を適用します。これは {{cssxref("text-emphasis-style")}} と {{cssxref("text-emphasis-color")}} の<a href="/ja/docs/Web/CSS/Shorthand_properties">一括指定</a>です。</p> <div>{{EmbedInteractiveExample("pages/css/text-emphasis.html")}}</div> -<p class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</p> - <p><code>text-emphasis</code> プロパティは、 {{cssxref("text-decoration")}} とは大きく異なります。 <code>text-decoration</code> プロパティは継承されず、指定される装飾は要素全体にわたって適用されます。しかし、 <code>text-emphasis</code> は継承されます。これは、子孫に対して圏点を変更できることを意味します。</p> -<p>圏点の大きさは、ルビと同様にフォントの大きさの約50%であり、 <code>text-emphasis</code> は現在の行間隔が圏点を表示するのに十分でない場合、行の高さに影響を与えることがあります。</p> +<p>圏点の大きさは、ルビと同様にフォントの大きさの約 50% であり、 <code>text-emphasis</code> は現在の行間隔が圏点を表示するのに十分でない場合、行の高さに影響を与えることがあります。</p> <div class="note"> -<p><code>text-emphasis</code> は、 {{cssxref("text-emphasis-position")}} の値をリセットしません。これは、圏点のスタイルと色がテキストで異なる場合に、圏点の位置を要求することがほとんど見込まれないためです。稀にこれを必要とする場合は、プロパティ {{cssxref("text-emphasis-position")}} を使用してください。</p> +<p><code>text-emphasis</code> は、 {{cssxref("text-emphasis-position")}} の値をリセットしません。これは、圏点のスタイルと色がテキストで異なる場合に、圏点の位置を要求することがほとんど見込まれないためです。これを必要とするような珍しい場合は、プロパティ {{cssxref("text-emphasis-position")}} を使用してください。</p> </div> -<h2 id="Syntax" name="Syntax">構文</h2> +<h2 id="Constituent_properties">構成要素のプロパティ</h2> + +<p>このプロパティは以下のプロパティの一括指定です。</p> + +<ul> + <li><a href="/ja/docs/Web/CSS/text-emphasis-color"><code>text-emphasis-color</code></a></li> + <li><a href="/ja/docs/Web/CSS/text-emphasis-style"><code>text-emphasis-style</code></a></li> +</ul> + +<h2 id="Syntax">構文</h2> <pre class="brush:css no-line-numbers">/* 初期値 */ text-emphasis: none; /* 圏点なし */ @@ -38,7 +45,7 @@ text-emphasis: 'x'; text-emphasis: '点'; text-emphasis: '\25B2'; text-emphasis: '*' #555; -text-emphasis: 'foo'; /* 使用するべきではない。計算されるか 'f' のみが表示される */ +text-emphasis: 'foo'; /* 使用するべきではない。 'f' のみとして計算や表示が行われる */ /* キーワード値 */ text-emphasis: filled; @@ -52,18 +59,19 @@ text-emphasis: filled sesame #555; /* グローバル値 */ text-emphasis: inherit; text-emphasis: initial; +text-emphasis: revert; text-emphasis: unset; </pre> -<h3 id="Values" name="Values">値</h3> +<h3 id="Values">値</h3> <dl> <dt><code>none</code></dt> <dd>圏点なし。</dd> <dt><code>filled</code></dt> - <dd>図形は単色で塗りつぶされます。 <code>filled</code> も <code>open</code> も指定されない場合は、これが既定値です。</dd> + <dd>図形が単色で塗りつぶされます。 <code>filled</code> も <code>open</code> も指定されない場合は、これが既定値です。</dd> <dt><code>open</code></dt> - <dd>図形は中抜きになります。</dd> + <dd>図形が中抜きになります。</dd> <dt><code>dot</code></dt> <dd>記号として小さな円を表示します。 filled dot は <code>'•'</code> (<code>U+2022</code>)、 open dot は <code>'◦'</code> (<code>U+25E6</code>) です。</dd> <dt><code>circle</code></dt> @@ -75,18 +83,22 @@ text-emphasis: unset; <dt><code>sesame</code></dt> <dd>記号としてゴマを表示します。 filled sesame は <code>'﹅'</code> (<code>U+FE45</code>)、 open sesame は<code>'﹆'</code> (<code>U+FE46</code>) です。これは、他の図形が与えられていない場合、縦書きモードで既定の形状です。</dd> <dt><code><string></code></dt> - <dd>記号として文字列を表示します。 <code><string></code> には1<em>文字</em>を超える文字列を指定しないでください。ユーザーエージェントは、1つより多い書記素クラスターから構成される文字列を短縮したり無視したりする可能性があります。</dd> + <dd>記号として文字列を表示します。 <code><string></code> には 1 <em>文字</em>を超える文字列を指定しないでください。ユーザーエージェントは、 1 つより多い書記素クラスターから構成される文字列を短縮したり無視したりする可能性があります。</dd> <dt><code><color></code></dt> - <dd>記号の色を定義します。 color を指定しない場合、既定では <code>currentColor</code> です。</dd> + <dd>記号の色を定義します。 color を指定しない場合、既定では <code>currentcolor</code> です。</dd> </dl> -<h3 id="Formal_syntax" name="Formal_syntax">形式文法</h3> +<h2 id="Formal_definition">公式定義</h2> + +<p>{{CSSInfo}}</p> + +<h2 id="Formal_syntax">形式文法</h2> {{csssyntax}} -<h2 id="Examples" name="Examples">例</h2> +<h2 id="Examples">例</h2> -<h3 id="A_heading_with_emphasis_shape_and_color" name="A_heading_with_emphasis_shape_and_color">強調して色を付けた見出し</h3> +<h3 id="A_heading_with_emphasis_shape_and_color">強調して色を付けた見出し</h3> <p>この例は、見出しの各文字に三角形の圏点を付けて描画します。</p> @@ -100,36 +112,19 @@ text-emphasis: unset; <pre class="brush: html"><h2>これは重要です！</h2></pre> -<h4 id="Result" name="Result">結果</h4> +<h4 id="Result">結果</h4> <p>{{EmbedLiveSample("A_heading_with_emphasis_shape_and_color", 500, 70)}}</p> -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('CSS3 Text Decoration', '#text-emphasis-property', 'text-emphasis')}}</td> - <td>{{Spec2('CSS3 Text Decoration')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> +<h2 id="Specifications">仕様書</h2> -<p>{{cssinfo}}</p> +{{Specifications}} -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの対応</h2> +<h2 id="Browser_compatibility">ブラウザーの互換性</h2> -<p>{{Compat("css.properties.text-emphasis")}}</p> +<p>{{Compat}}</p> -<h2 id="See_also" name="See_also">関連情報</h2> +<h2 id="See_also">関連情報</h2> <ul> <li>個別指定プロパティ: {{cssxref('text-emphasis-style')}}, {{cssxref('text-emphasis-color')}}</li> diff --git a/files/ja/web/exslt/index.html b/files/ja/web/exslt/index.html index fde3c0c0c4..f3a787e9f5 100644 --- a/files/ja/web/exslt/index.html +++ b/files/ja/web/exslt/index.html @@ -10,7 +10,7 @@ translation_of: Web/EXSLT <p>{{XSLTRef}}</p> <div> -<section id="Quick_Links"> +<section id="Quick_links"> <ol> <li><strong><a href="https://developer.mozilla.org/en-US/docs/Web/XSLT">XSLT</a></strong></li> <li><strong><a href="https://developer.mozilla.org/en-US/docs/Web/EXSLT">EXSLT</a></strong></li> diff --git a/files/ja/web/guide/css/getting_started/challenge_solutions/index.html b/files/ja/web/guide/css/getting_started/challenge_solutions/index.html index df62dacd38..a3825b30aa 100644 --- a/files/ja/web/guide/css/getting_started/challenge_solutions/index.html +++ b/files/ja/web/guide/css/getting_started/challenge_solutions/index.html @@ -3,7 +3,7 @@ title: Challenge solutions slug: Web/Guide/CSS/Getting_started/Challenge_solutions translation_of: Web/Guide/CSS/Getting_started/Challenge_solutions --- -<p>このページは、 <a href="/ja/CSS/Getting_Started" title="ja/CSS/Getting Started">CSS Getting Started</a> チュートリアルにあるチャレンジの解答例です。これ以外の解答も考えられます。以下の章名はチュートリアルページのタイトルと一致します。</p> +<p>このページは、 <a href="/ja/CSS/Getting_Started">CSS Getting Started</a> チュートリアルにあるチャレンジの解答例です。これ以外の解答も考えられます。以下の章名はチュートリアルページのタイトルと一致します。</p> <h2 id="CSS_をなぜ用いるか"><a href="/ja/CSS/Getting_Started/Why_use_CSS" id="Why_use_CSS_Colors" title="MDC">CSS をなぜ用いるか</a></h2> <h3 id="Colors">Colors</h3> <dl> @@ -16,7 +16,7 @@ translation_of: Web/Guide/CSS/Getting_started/Challenge_solutions <dt> Solution</dt> <dd> - CSS supports common color names like <code>orange</code>, <code>yellow</code>, <code>blue</code>, <code>green</code>, or <code>black</code>. It also supports some more exotic color names like <code>chartreuse</code>, <code>fuschia</code>, or <code>burlywood</code>. See <a href="/ja/CSS/color_value" title="ja/CSS/color value">CSS Color value</a> for a complete list as well as other ways of specifying colors.</dd> + CSS supports common color names like <code>orange</code>, <code>yellow</code>, <code>blue</code>, <code>green</code>, or <code>black</code>. It also supports some more exotic color names like <code>chartreuse</code>, <code>fuschia</code>, or <code>burlywood</code>. See <a href="/ja/CSS/color_value">CSS Color value</a> for a complete list as well as other ways of specifying colors.</dd> </dl> <h2 id="どのように_CSS_は動作するのか"><a href="/ja/CSS/Getting_Started/How_CSS_works" id="How_CSS_works_DOM_inspector" title="MDC">どのように CSS は動作するのか</a></h2> <h3 id="DOM_inspector">DOM inspector</h3> @@ -244,7 +244,7 @@ h3:before { } </pre> </dd> </dl> -<h2 id="表"><a href="/ja/CSS/Getting_Started/Tables" id="Tables" title="ja/CSS/Getting_Started/Tables">表</a></h2> +<h2 id="表"><a href="/ja/CSS/Getting_Started/Tables" id="Tables">表</a></h2> <h3 id="Borders_on_data_cells_only">Borders on data cells only</h3> <dl> <dt> diff --git a/files/ja/web/guide/html/content_categories/index.html b/files/ja/web/guide/html/content_categories/index.html index 9f0b98251f..cc2b9c20f3 100644 --- a/files/ja/web/guide/html/content_categories/index.html +++ b/files/ja/web/guide/html/content_categories/index.html @@ -84,9 +84,9 @@ translation_of: Web/Guide/HTML/Content_categories <li>{{HTMLElement("area")}}: {{HTMLElement("map")}} 要素の子孫である場合</li> <li>{{HTMLElement("del")}}: 記述コンテンツだけを含む場合</li> <li>{{HTMLElement("ins")}}: 記述コンテンツだけを含む場合</li> - <li>{{HTMLElement("link")}}: <a href="/ja/docs/HTML/Global_attributes#itemprop" title="ja/docs/HTML/Global attributes#itemprop"><strong>itemprop</strong></a> 属性がある場合</li> + <li>{{HTMLElement("link")}}: <a href="/ja/docs/HTML/Global_attributes#itemprop"><strong>itemprop</strong></a> 属性がある場合</li> <li>{{HTMLElement("map")}}: 記述コンテンツだけを含む場合</li> - <li>{{HTMLElement("meta")}}: <a href="/ja/docs/HTML/Global_attributes#itemprop" title="ja/docs/HTML/Global attributes#itemprop"><strong>itemprop</strong></a> 属性がある場合</li> + <li>{{HTMLElement("meta")}}: <a href="/ja/docs/HTML/Global_attributes#itemprop"><strong>itemprop</strong></a> 属性がある場合</li> </ul> <h3 id="Embedded_content" name="Embedded_content">埋め込みコンテンツ</h3> diff --git a/files/ja/web/guide/html/editable_content/rich-text_editing_in_mozilla/index.html b/files/ja/web/guide/html/editable_content/rich-text_editing_in_mozilla/index.html index 07826fa870..8a2b1b2b00 100644 --- a/files/ja/web/guide/html/editable_content/rich-text_editing_in_mozilla/index.html +++ b/files/ja/web/guide/html/editable_content/rich-text_editing_in_mozilla/index.html @@ -50,7 +50,7 @@ translation_of: Web/Guide/HTML/Editable_content/Rich-Text_Editing_in_Mozilla <p>さらに、 Mozilla には、ドキュメントが designMode になると、そのドキュメント内のイベントが無効になるという特徴があります。designMode をオフにすると (Mozilla 1.5 ではこの切り替えが可能となります)、再びイベントはアクティブになります。</p> -<p><strong>さらなる情報</strong> は、<a class="internal" href="/ja/Migrate_apps_from_Internet_Explorer_to_Mozilla" title="ja/Migrate apps from Internet Explorer to Mozilla">Migrate apps from Internet Explorer to Mozilla</a> の <a class="internal" href="/ja/Migrate_apps_from_Internet_Explorer_to_Mozilla#Rich_text_editing" title="ja/Migrate apps from Internet Explorer to Mozilla#Rich text editing">Rich text editing</a> の節をご覧ください。</p> +<p><strong>さらなる情報</strong> は、<a class="internal" href="/ja/Migrate_apps_from_Internet_Explorer_to_Mozilla">Migrate apps from Internet Explorer to Mozilla</a> の <a class="internal" href="/ja/Migrate_apps_from_Internet_Explorer_to_Mozilla#Rich_text_editing">Rich text editing</a> の節をご覧ください。</p> <h3 id="Examples" name="Examples">例</h3> @@ -277,7 +277,7 @@ img.intLink { border: 0; } <li><code><a href="/ja/docs/Web/API/Document/designMode">designMode</a></code></li> <li><a href="https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/platform-apis/ms537834(v=vs.85)">MSDN: How to Create an HTML Editor Application</a></li> <li><a class="external" href="http://www.kevinroth.com/rte/demo.htm">A closed source, cross-browser rich-text editing demo</a></li> - <li><a href="/ja/Rich-Text_Editing_in_Mozilla/Class_xbDesignMode" title="ja/Rich-Text_Editing_in_Mozilla/Class_xbDesignMode">xbDesignMode; a JavaScript helper class for easier cross-browser development using designMode.</a></li> + <li><a href="/ja/Rich-Text_Editing_in_Mozilla/Class_xbDesignMode">xbDesignMode; a JavaScript helper class for easier cross-browser development using designMode.</a></li> <li><a class="external" href="http://starkravingfinkle.org/blog/2007/07/firefox-3-contenteditable/">Firefox 3 and contentEditable</a></li> </ul> diff --git a/files/ja/web/guide/parsing_and_serializing_xml/index.html b/files/ja/web/guide/parsing_and_serializing_xml/index.html index 9adb073f0c..5a473bfc8f 100644 --- a/files/ja/web/guide/parsing_and_serializing_xml/index.html +++ b/files/ja/web/guide/parsing_and_serializing_xml/index.html @@ -109,7 +109,7 @@ const xmlStr = serializer.serializeToString(doc);</pre> <h2 id="See_also" name="See_also">関連項目</h2> <ul> - <li><a class="internal" href="/ja/XPath" title="ja/XPath">XPath</a></li> + <li><a class="internal" href="/ja/XPath">XPath</a></li> <li>{{domxref("XMLHttpRequest")}}</li> <li>{{domxref("Document")}}, {{domxref("XMLDocument")}} および {{domxref("HTMLDocument")}}</li> </ul> diff --git a/files/ja/web/html/element/xmp/index.html b/files/ja/web/html/element/xmp/index.html index 639da9a3c8..a2e858eb0f 100644 --- a/files/ja/web/html/element/xmp/index.html +++ b/files/ja/web/html/element/xmp/index.html @@ -26,7 +26,7 @@ translation_of: Web/HTML/Element/xmp <h2 id="Attributes" name="Attributes">属性</h2> -<p>この要素は、すべての要素が持つ <a href="/ja/docs/HTML/global_attributes" rel="internal" title="ja/docs/HTML/global attributes">グローバル属性</a> 以外の属性を持ちません。</p> +<p>この要素は、すべての要素が持つ <a href="/ja/docs/HTML/global_attributes" rel="internal">グローバル属性</a> 以外の属性を持ちません。</p> <h2 id="DOM_interface" name="DOM_interface">DOM インターフェイス</h2> diff --git a/files/ja/web/html/inline_elements/index.html b/files/ja/web/html/inline_elements/index.html index cb1100ea03..6d4ba241e0 100644 --- a/files/ja/web/html/inline_elements/index.html +++ b/files/ja/web/html/inline_elements/index.html @@ -161,7 +161,7 @@ the block-level element's influence.</div></pre> <h2 id="See_also" name="See_also">関連情報</h2> <ul> - <li><a href="/ja/HTML/Block-level_elements" title="ja/HTML/Block-level_elements">ブロックレベル要素</a></li> + <li><a href="/ja/HTML/Block-level_elements">ブロックレベル要素</a></li> <li><a href="/ja/docs/Web/HTML/Element">HTML 要素リファレンス</a></li> <li>{{cssxref("display")}}</li> <li><a href="/ja/docs/Web/Guide/HTML/Content_categories">コンテンツカテゴリ</a></li> diff --git a/files/ja/web/http/headers/expect-ct/index.html b/files/ja/web/http/headers/expect-ct/index.html index e815e30946..d402887ddb 100644 --- a/files/ja/web/http/headers/expect-ct/index.html +++ b/files/ja/web/http/headers/expect-ct/index.html @@ -6,16 +6,33 @@ tags: - Reference - ヘッダー - レスポンスヘッダー +browser-compat: http.headers.Expect-CT translation_of: Web/HTTP/Headers/Expect-CT --- <p>{{HTTPSidebar}}</p> -<p><code>Expect-CT</code> ヘッダーは、サイトが認証透過性の要件の報告や強制に参加して、サイトの不正な認証情報が通知されない状態を防ぐことができます。</p> +<p><code>Expect-CT</code> ヘッダーは、サイトが<a href="/ja/docs/Web/Security/Certificate_Transparency">証明書の透明性</a>の要件の報告や強制に参加して、サイトの不正な認証情報の使用が通知されない状態を防ぐことができます。</p> + +<p>CT の要件は、以下のいずれかの仕組みで満たすことができます。</p> + +<ul> + <li>個々のログで発行された署名付き証明書のタイムスタンプを埋め込めるようにするための X.509v3 証明書の拡張</li> + <li>ハンドシェイク中に送信される <code>signed_certificate_timestamp</code> 型の TLS 拡張</li> + <li>OCSP ステープリング (つまり、 <code>status_request</code> TLS 拡張) に対応し、 <code>SignedCertificateTimestampList</code> を提供すること</li> +</ul> <div class="note"> <p>サイトが <code>Expect-CT</code> ヘッダーを有効にすると、ブラウザーが<strong><a href="https://www.certificate-transparency.org/known-logs">公開 CT ログ</a></strong>に現れるサイトのすべての認証情報をチェックするよう要求します。</p> </div> +<div class="notecard note"> + <p><strong>メモ:</strong> ブラウザーは、 HTTP では <code>Expect-CT</code> ヘッダーを<strong>無視</strong>し、 HTTPS 接続でのみ効果を発揮します。</p> +</div> + +<div class="notecard note"> +<p><strong>メモ:</strong> <code>Expect-CT</code> は 2021 年 6 月に廃止される可能性が高いです。 2018 年 5 月以降、新しい証明書は既定で SCT に対応することが期待されています。 2018 年 3 月以前の証明書は 39 ヶ月の有効期限が認められていましたが、それらが 2021 年 6 月にすべて失効します。</p> +</div> + <table class="properties"> <tbody> <tr> @@ -29,43 +46,48 @@ translation_of: Web/HTTP/Headers/Expect-CT </tbody> </table> -<h2 id="Syntax" name="Syntax">構文</h2> +<h2 id="Syntax">構文</h2> <pre>Expect-CT: report-uri="<uri>", enforce, max-age=<age></pre> -<h2 id="Directives" name="Directives">ディレクティブ</h2> +<h2 id="Directives">ディレクティブ</h2> <dl> - <dt>max-age</dt> + <dt><code>max-age</code></dt> <dd> <p><code>Expect-CT</code> ヘッダーフィールドを受信した後で、ユーザーエージェントがメッセージを受信したホストを、既知の Expect-CT ホストと見なすべき時間を秒数で指定します。</p> - <p>キャッシュが表現可能な値よりも大きな値を受信した場合や、計算でオーバーフローが発生した場合、キャッシュは値を 2147483648 (2^31) または使用している表現方法で最も大きな整数値とみなします。</p> + <p>キャッシュが表現可能な値よりも大きな値を受信した場合や、計算でオーバーフローが発生した場合、キャッシュは値を 2,147,483,648 (2^31) または使用している表現方法で最も大きな整数値とみなします。</p> </dd> - <dt>report-uri="<uri>" {{optional_inline}}</dt> + <dt><code>report-uri="<uri>"</code> {{optional_inline}}</dt> <dd> - <p>ユーザーエージェントが Expect-CT の失敗を報告する URI を指定します。</p> - <code>enforce</code> ディレクティブと <code>report-uri</code> ディレクティブが両方ともある場合、設定は "enforce-and-report" の設定と呼ばれ、ユーザーエージェントに認証透過性ポリシーに従い、違反を報告することを指示します。 - - <p> </p> - </dd> - <dt>enforce {{optional_inline}}</dt> + <p>ユーザーエージェントが <code>Expect-CT</code> の失敗を報告する URI を指定します。</p> + <code>enforce</code> ディレクティブと <code>report-uri</code> ディレクティブが両方ともある場合、設定は "enforce-and-report" の設定と呼ばれ、ユーザーエージェントに証明書の透明性ポリシーに従い、違反を報告することを指示します。</dd> + <dt><code>enforce</code> {{optional_inline}}</dt> <dd> - <p>ユーザーエージェントに (報告するだけでなく) 認証透過性ポリシーに従い、ユーザーエージェントが認証透過性ポリシーに違反するコネクションを拒否するよう指示します。</p> + <p>ユーザーエージェントに (報告するだけでなく) 証明書の透明性ポリシーに従い、ユーザーエージェントが証明書の透明性ポリシーに違反するコネクションを拒否するよう指示します。</p> - <p><code>enforce</code> ディレクティブと <code>report-uri</code> ディレクティブが両方ともある場合、設定は "enforce-and-report" の設定と呼ばれ、ユーザーエージェントに認証透過性ポリシーに従い、違反を報告することを指示します。</p> + <p><code>enforce</code> ディレクティブと <code>report-uri</code> ディレクティブが両方ともある場合、設定は "enforce-and-report" の設定と呼ばれ、ユーザーエージェントに証明書の透明性ポリシーに従い、違反を報告することを指示します。</p> </dd> </dl> -<h2 id="Example" name="Example">例</h2> +<h2 id="Example">例</h2> -<p>以下の例は認証透過性を24時間強制し、違反を foo.example に報告することを示します。</p> +<p>以下の例は証明書の透明性を 24 時間強制し、違反を <code>foo.example</code> に報告することを示します。</p> <pre>Expect-CT: max-age=86400, enforce, report-uri="https://foo.example/report"</pre> -<h2 id="Specifications" name="Specifications">仕様書</h2> +<h2 id="Notes">メモ</h2> + +<p>信頼ストアに手動で追加されたルート CA は、 <code>Expect-CT</code> の報告/強制を上書きし、抑制します。</p> + +<p>ブラウザーは、サイトが証明書の透明性要件を満たす証明書を提供できることを「証明」しない限り、 <code>Expect-CT</code> ポリシーを記憶しません。ブラウザーは、どの CT ログが証明書のログとして信頼できるとみなされるかについて、独自の信頼モデルを実装しています。</p> + +<p>Chrome のビルドは、インストールのビルド日から 10 週間後に <code>Expect-CT</code> ポリシーの施行を停止するように設計されています。</p> + +<h2 id="Specifications">仕様書</h2> <table class="standard-table"> <thead> @@ -76,12 +98,12 @@ translation_of: Web/HTTP/Headers/Expect-CT </thead> <tbody> <tr> - <td><a href="https://tools.ietf.org/html/draft-ietf-httpbis-expect-ct-07">Internet Draft</a></td> + <td><a href="https://datatracker.ietf.org/doc/html/draft-ietf-httpbis-expect-ct-08">Internet Draft</a></td> <td>Expect-CT Extension for HTTP</td> </tr> </tbody> </table> -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの対応</h2> +<h2 id="Browser_compatibility">ブラウザーの互換性</h2> -<p>{{Compat("http.headers.Expect-CT")}}</p> +<p>{{Compat}}</p> diff --git a/files/ja/web/javascript/about_javascript/index.html b/files/ja/web/javascript/about_javascript/index.html index 072f271b5c..ab4cb35741 100644 --- a/files/ja/web/javascript/about_javascript/index.html +++ b/files/ja/web/javascript/about_javascript/index.html @@ -49,10 +49,10 @@ translation_of: Web/JavaScript/About_JavaScript <dd>C/C++エンジンでMozillaが実装したJavaScript (SpiderMonkey と呼ばれている) について、アプリケーションへの組込方法を含む詳細情報。</dd> <dt><a href="/ja/docs/Rhino">Rhino</a></dt> <dd>Javaで記述されたJavaScript実装(Rhino と呼ばれている) についての詳細情報</dd> - <dt><a href="/ja/docs/JavaScript_Language_Resources" title="ja/JavaScript_Language_Resources">言語リソース</a></dt> + <dt><a href="/ja/docs/JavaScript_Language_Resources">言語リソース</a></dt> <dd>公布されている JavaScript の標準を指します。</dd> - <dt><a href="/ja/docs/JavaScript/A_re-introduction_to_JavaScript" title="ja/A_re-introduction_to_JavaScript">JavaScript「再」入門</a></dt> - <dd><a href="/ja/docs/JavaScript/Guide" title="ja/JavaScript/Guide">JavaScript ガイド</a> および <a href="/ja/docs/JavaScript/Reference" title="ja/JavaScript/Reference">JavaScript リファレンス</a></dd> + <dt><a href="/ja/docs/JavaScript/A_re-introduction_to_JavaScript">JavaScript「再」入門</a></dt> + <dd><a href="/ja/docs/JavaScript/Guide">JavaScript ガイド</a> および <a href="/ja/docs/JavaScript/Reference">JavaScript リファレンス</a></dd> </dl> <p>JavaScript® は、米国およびその他の国における、Oracle の商標または登録商標です。</p> diff --git a/files/ja/web/javascript/data_structures/index.md b/files/ja/web/javascript/data_structures/index.md index 7f68263671..dc2d9291a8 100644 --- a/files/ja/web/javascript/data_structures/index.md +++ b/files/ja/web/javascript/data_structures/index.md @@ -64,7 +64,7 @@ null 型は値が `null` の 1 つしかありません。詳しくは {{jsxref( 値が代入されていない変数の値は `undefined` になります。詳しくは {{jsxref("undefined")}} および [Undefined](/ja/docs/Glossary/undefined) を参照してください。 -### 整数型 (Number) +### 数値型 (Number) ECMAScript には、**数値型** (Number) と**長整数型** (BigInt、下記参照) の 2 つの組み込み数値型があります。 diff --git a/files/ja/web/javascript/guide/working_with_objects/index.html b/files/ja/web/javascript/guide/working_with_objects/index.html index 6200e1aa36..bf382dd5c7 100644 --- a/files/ja/web/javascript/guide/working_with_objects/index.html +++ b/files/ja/web/javascript/guide/working_with_objects/index.html @@ -109,10 +109,10 @@ myCar.year = 1969</pre> <h2 id="Enumerate_the_properties_of_an_object" name="Enumerate_the_properties_of_an_object">オブジェクトの全プロパティの列挙</h2> -<p><a href="/ja/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_5_support_in_Mozilla" title="ja/docs/JavaScript/ECMAScript 5 support in Mozilla">ECMAScript 5</a> 以降では、オブジェクトのプロパティをリストアップ/トラバース (横断走査) する言語特有の方法が 3 つあります。</p> +<p><a href="/ja/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_5_support_in_Mozilla">ECMAScript 5</a> 以降では、オブジェクトのプロパティをリストアップ/トラバース (横断走査) する言語特有の方法が 3 つあります。</p> <ul> - <li><code><a href="/ja/docs/Web/JavaScript/Reference/Statements/for...in" title="ja/docs/JavaScript/Reference/Statements/for...in">for...in</a></code> ループ<br> + <li><code><a href="/ja/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a></code> ループ<br> この方法は、オブジェクトとそのプロトタイプチェーンにある列挙可能なプロパティをすべて横断します</li> <li>{{jsxref("Object.keys", "Object.keys(o)")}}<br> このメソッドは、そのオブジェクト独自の (プロトタイプチェーンを除く) 列挙可能なすべてのプロパティ名 ("keys") を配列で返します</li> @@ -288,7 +288,7 @@ fish.displayType(); // 出力 : Fishes</pre> car1.color = 'black'; </pre> -<p>詳しくは、<a href="/ja/docs/JavaScript/Reference">JavaScript リファレンス</a>内にある、<code>Function</code> オブジェクトの <a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype" title="ja/docs/JavaScript/Reference/Global Objects/Function/prototype"><code>prototype</code> プロパティ</a>を参照してください。</p> +<p>詳しくは、<a href="/ja/docs/JavaScript/Reference">JavaScript リファレンス</a>内にある、<code>Function</code> オブジェクトの <a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype"><code>prototype</code> プロパティ</a>を参照してください。</p> <h2 id="Defining_methods" name="Defining_methods">メソッドの定義</h2> diff --git a/files/ja/web/javascript/reference/global_objects/intl/locale/index.html b/files/ja/web/javascript/reference/global_objects/intl/locale/index.html deleted file mode 100644 index 58744e2b26..0000000000 --- a/files/ja/web/javascript/reference/global_objects/intl/locale/index.html +++ /dev/null @@ -1,102 +0,0 @@ ---- -title: Intl.Locale -slug: Web/JavaScript/Reference/Global_Objects/Intl/Locale -tags: - - Class - - Internationalization - - Intl - - JavaScript - - Reference - - クラス - - 国際化 -translation_of: Web/JavaScript/Reference/Global_Objects/Intl/Locale ---- -<div>{{JSRef}}</div> - -<p><span class="seoSummary"><strong><code>Intl.Locale</code></strong> オブジェクトは、 Unicode ロケール識別子を表す Intl オブジェクトの標準組み込みプロパティです。</span></p> - -<div>{{EmbedInteractiveExample("pages/js/intl-locale.html")}}</div> - -<h2 id="Description" name="Description">解説</h2> - -<p><code><strong>Intl.Locale</strong></code> オブジェクトは、 Unicode ロケールをより簡単に操作できるようにするために作成されました。 Unicode は、ロケールを<em>ロケール識別子</em>と呼ばれる文字列で表します。ロケール識別子は、<em>言語識別子</em>と<em>拡張タグ</em>から構成されます。言語識別子はロケールの中核となるもので、<em>言語</em>、<em>文字体系</em>、<em>地域サブタグ</em>から構成されます。ロケールに関する追加情報は、オプションの拡張タグに格納されます。<em>拡張タグ</em>には、暦の種類や時計の種類、数値表記法の種類などのロケールに関する情報が格納されています。</p> - -<p>従来、 Intl API は Unicode と同様に文字列を使用してロケールを表していました。これはシンプルで軽量な解決策であり、うまく機能します。しかし、 Locale クラスを追加することで、言語、文字体系、地域、拡張タグの解析や操作が容易になります。</p> - -<h2 id="Constructor" name="Constructor">コンストラクター</h2> - -<dl> - <dt>{{jsxref("Locale/Locale", "Intl.Locale()")}}</dt> - <dd>新しい <code>Locale</code> オブジェクトを生成します。</dd> -</dl> - -<h2 id="Properties" name="Properties">プロパティ</h2> - -<dl> - <dt><code>Intl.Locale.prototype</code></dt> - <dd><code>Locale</code> コンストラクターのプロトタイプオブジェクトです。</dd> -</dl> - -<h2 id="Instance_properties" name="Instance_properties">インスタンスプロパティ</h2> - -<dl> - <dt>{{jsxref("Locale/baseName", "Intl.Locale.prototype.baseName")}}</dt> - <dd>この <code>Locale</code> に関する基本的な情報を、完全なデータ文字列の部分文字列の形で返します。</dd> - <dt>{{jsxref("Locale/calendar", "Intl.Locale.prototype.calendar")}}</dt> - <dd>このロケールの暦年を示す <code>Locale</code> の部分を返します。</dd> - <dt>{{jsxref("Locale/caseFirst", "Intl.Locale.prototype.caseFirst")}}</dt> - <dd>ロケールの照合規則に大文字・小文字を考慮しているかどうかを返します。</dd> - <dt>{{jsxref("Locale/collation", "Intl.Locale.prototype.collation")}}</dt> - <dd>この <code>Locale</code> の照合の種類を返します。これは、ロケールの規則に従って文字列を並べ替えるために使用します。</dd> - <dt>{{jsxref("Locale/hourCycle", "Intl.Locale.prototype.hourCycle")}}</dt> - <dd>このロケールが使用している時刻保持書式の規約を返します。</dd> - <dt>{{jsxref("Locale/language", "Intl.Locale.prototype.language")}}</dt> - <dd>このロケールに関連づけられた言語を返します。</dd> - <dt>{{jsxref("Locale/numberingSystem", "Intl.Locale.prototype.numberingSystem")}}</dt> - <dd>このロケールが使用している数値表記法を返します。</dd> - <dt>{{jsxref("Locale/numeric", "Intl.Locale.prototype.numeric")}}</dt> - <dd>このロケールが数字に対して特殊な照合順序を持っているかどうかを返します。</dd> - <dt>{{jsxref("Locale/region", "Intl.Locale.prototype.region")}}</dt> - <dd>このロケールに関連付けられた世界の地域 (通常は国) を返します。</dd> - <dt>{{jsxref("Locale/script", "Intl.Locale.prototype.script")}}</dt> - <dd>このロケールで使われている特定の言語を書く際に使用する文字体系を返します。</dd> -</dl> - -<h2 id="Instance_methods" name="Instance_methods">インスタンスメソッド</h2> - -<dl> - <dt>{{jsxref("Locale/minimize", "Intl.Locale.prototype.minimize()")}}</dt> - <dd>既存の値に基づいて、ロケールの言語、表記法、地域の最も可能性の高い値を取得します。</dd> - <dt>{{jsxref("Locale/maximize", "Intl.Locale.prototype.maximize()")}}</dt> - <dd>既存の値に基づいて、ロケールの言語、表記法、地域の最も可能性の高い値を取得します。</dd> - <dt>{{jsxref("Locale/toString", "Intl.Locale.prototype.toString()")}}</dt> - <dd>このロケールの完全なロケール識別子文字列を返します。</dd> -</dl> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('ES Int Draft', '#locale-objects')}}</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<div> -<p>{{Compat("javascript.builtins.Intl.Locale")}}</p> -</div> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li><a href="https://github.com/zbraniecki/Intl.js/tree/intllocale">The Intl.Locale Polyfill</a></li> - <li><a href="https://www.unicode.org/reports/tr35/#Canonical_Unicode_Locale_Identifiers">Unicode locale identifiers spec</a></li> -</ul> diff --git a/files/ja/web/javascript/reference/global_objects/intl/locale/index.md b/files/ja/web/javascript/reference/global_objects/intl/locale/index.md new file mode 100644 index 0000000000..2889af2f7c --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/intl/locale/index.md @@ -0,0 +1,98 @@ +--- +title: Intl.Locale +slug: Web/JavaScript/Reference/Global_Objects/Intl/Locale +tags: + - Class + - Internationalization + - Intl + - JavaScript + - Locale + - Reference + - クラス + - 国際化 +browser-compat: javascript.builtins.Intl.Locale +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/Locale +--- +{{JSRef}} + +**`Intl.Locale`** オブジェクトは、 Unicode ロケール識別子を表す Intl オブジェクトの標準組み込みプロパティです。 + +{{EmbedInteractiveExample("pages/js/intl-locale.html")}} + +<!-- The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request. --> + +## 解説 + +**`Intl.Locale`** オブジェクトは、 Unicode ロケールをより簡単に操作できるようにするために作成されました。 Unicode は、ロケールを*ロケール識別子*と呼ばれる文字列で表します。ロケール識別子は、*言語識別子*と*拡張タグ*から構成されます。言語識別子はロケールの中核となるもので、*言語*、*文字体系*、*地域サブタグ*から構成されます。ロケールに関する追加情報は、オプションの拡張タグに格納されます。*拡張タグ*には、暦の種類や時計の種類、数値表記法の種類などのロケールに関する情報が格納されています。 + +従来、 Intl API は Unicode と同様に文字列を使用してロケールを表していました。これはシンプルで軽量な解決策であり、うまく機能します。しかし、 Locale クラスを追加することで、言語、文字体系、地域、拡張タグの解析や操作が容易になります。 + +## コンストラクター + +- {{jsxref("Intl/Locale/Locale", "Intl.Locale()")}} + - : 新しい `Locale` オブジェクトを生成します。 + +## インスタンスプロパティ + +- {{jsxref("Intl/Locale/baseName", "Intl.Locale.prototype.baseName")}} + - : この `Locale` に関する基本的な情報を、完全なデータ文字列の部分文字列の形で返します。 +- {{jsxref("Intl/Locale/calendar", "Intl.Locale.prototype.calendar")}} + - : このロケールの暦年を示す `Locale` の部分を返します。 +- {{jsxref("Intl/Locale/caseFirst", "Intl.Locale.prototype.caseFirst")}} + - : ロケールの照合規則に大文字・小文字を考慮しているかどうかを返します。 +- {{jsxref("Intl/Locale/collation", "Intl.Locale.prototype.collation")}} + - : この `Locale` の照合の種類を返します。これは、ロケールの規則に従って文字列を並べ替えるために使用します。 +- {{jsxref("Intl/Locale/hourCycle", "Intl.Locale.prototype.hourCycle")}} + - : このロケールが使用している時刻保持書式の規則を返します。 +- {{jsxref("Intl/Locale/language", "Intl.Locale.prototype.language")}} + - : このロケールに関連づけられた言語を返します。 +- {{jsxref("Intl/Locale/numberingSystem", "Intl.Locale.prototype.numberingSystem")}} + - : このロケールが使用している数値表記法を返します。 +- {{jsxref("Intl/Locale/numeric", "Intl.Locale.prototype.numeric")}} + - : このロケールが数字に対して特殊な照合順序を持っているかどうかを返します。 +- {{jsxref("Intl/Locale/region", "Intl.Locale.prototype.region")}} + - : このロケールに関連付けられた世界の地域 (通常は国) を返します。 +- {{jsxref("Intl/Locale/script", "Intl.Locale.prototype.script")}} + - : このロケールで使われている特定の言語を書く際に使用する文字体系を返します。 + +## インスタンスメソッド + +- {{jsxref("Intl/Locale/maximize", "Intl.Locale.prototype.maximize()")}} + - : 既存の値に基づいて、ロケールの言語、表記法、地域の最も可能性の高い値を取得します。 +- {{jsxref("Intl/Locale/minimize", "Intl.Locale.prototype.minimize()")}} + - : {{jsxref("Intl/Locale/maximize", "Locale.maximize()")}} を呼び出すことで追加されるロケールに関する情報を削除しようとします。 +- {{jsxref("Intl/Locale/toString", "Intl.Locale.prototype.toString()")}} + - : このロケールの完全なロケール識別子文字列を返します。 + +## 例 + +### 基本的な使用 + +{{jsxref("Intl/Locale/Locale", "Intl.Locale")}} のコンストラクターは、もっとも簡単なものでは、ロケール識別子の文字列を引数に取ります。 + +```js +let us = new Intl.Locale('en-US'); +``` + +### Locale コンストラクターの options オブジェクト付きでの使用 + +このコンストラクターは、オプションで構成オブジェクトの引数を取ることができます。たとえば、構成オブジェクトの {{jsxref("Intl/Locale/hourCycle", "hourCycle")}} プロパティに任意の時間サイクル種別を設定し、それをコンストラクターに渡します。 + +```js +let us12hour = new Intl.Locale("en-US", {hourCycle: "h12"}); +console.log(us12hour.hourCycle); // Prints "h12" +``` + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- {{jsxref("Intl")}} +- [Intl.Locale のポリフィル](https://formatjs.io/docs/polyfills/intl-locale) +- [Unicode ロケール識別子の仕様書](https://www.unicode.org/reports/tr35/#Canonical_Unicode_Locale_Identifiers) diff --git a/files/ja/web/javascript/reference/global_objects/webassembly/memory/index.html b/files/ja/web/javascript/reference/global_objects/webassembly/memory/index.html index 9c93cf21cc..4064df7666 100644 --- a/files/ja/web/javascript/reference/global_objects/webassembly/memory/index.html +++ b/files/ja/web/javascript/reference/global_objects/webassembly/memory/index.html @@ -32,7 +32,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Memory <dt><code>Memory.prototype.constructor</code></dt> <dd>このオブジェクトのインスタンスを生成した関数を返します。既定では {{jsxref("WebAssembly.Memory()")}} コンストラクターです。</dd> <dt>{{jsxref("WebAssembly/Memory/buffer","Memory.prototype.buffer")}}</dt> - <dd>メモリに格納されているバッファーを返すアクセサープロパティです。/dd></dd> + <dd>メモリに格納されているバッファーを返すアクセサープロパティです。</dd> </dl> <h3 id="Instance_methods" name="Instance_methods">インスタンスメソッド</h3> diff --git a/files/ja/web/javascript/reference/strict_mode/index.html b/files/ja/web/javascript/reference/strict_mode/index.html index c24a489769..5ef5aaf11e 100644 --- a/files/ja/web/javascript/reference/strict_mode/index.html +++ b/files/ja/web/javascript/reference/strict_mode/index.html @@ -26,7 +26,7 @@ translation_of: Web/JavaScript/Reference/Strict_mode <h2 id="Invoking_strict_mode" name="Invoking_strict_mode">Strict モードの呼び出し</h2> -<p>Strict モードは<em>スクリプト全体</em>または<em>個別の関数</em>に適用できます。括弧 <code><a href="/ja/docs/Web/JavaScript/Reference/Statements/block">{}</a></code> で括られるブロック構文には適用できません。そのような場所に適用しようとしても何も起きません。<code><a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/eval">eval</a></code> コード、<code><a href="/ja/docs/Web/JavaScript/Reference/Statements/function">Function</a></code> コード、イベントハンドラ属性、<a href="/ja/DOM/window.setTimeout" title="ja/DOM/window.setTimeout"><code>setTimeout</code></a> コードに渡す文字列、およびこれらに似たものはスクリプト全体であり、Strict モードを呼び出すと期待どおりに動作します。</p> +<p>Strict モードは<em>スクリプト全体</em>または<em>個別の関数</em>に適用できます。括弧 <code><a href="/ja/docs/Web/JavaScript/Reference/Statements/block">{}</a></code> で括られるブロック構文には適用できません。そのような場所に適用しようとしても何も起きません。<code><a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/eval">eval</a></code> コード、<code><a href="/ja/docs/Web/JavaScript/Reference/Statements/function">Function</a></code> コード、イベントハンドラ属性、<a href="/ja/DOM/window.setTimeout"><code>setTimeout</code></a> コードに渡す文字列、およびこれらに似たものはスクリプト全体であり、Strict モードを呼び出すと期待どおりに動作します。</p> <h3 id="Strict_mode_for_scripts" name="Strict_mode_for_scripts">スクリプトでの Strict モード</h3> @@ -79,7 +79,7 @@ export default strict; mistypeVariable = 17; // この行は変数のスペルミスによる参照エラーを投げます。 </pre> -<p>第二に、Strict モードでは、代入文で暗黙的に失敗せずに例外が発生するようにします。例えば、<code>NaN</code> は書き込み不可のグローバル変数です。通常のコードでは <code>NaN</code> に代入しても何も起きません。つまり、開発者は失敗したという通知を受けません。Strict モードでは <code>NaN</code> に代入すると例外が発生します。通常のコードで暗黙的に失敗する代入 (書き込み不可のプロパティへの代入、getter のみのプロパティへの代入、<a href="/ja/JavaScript/Reference/Global_Objects/Object/preventExtensions" title="ja/JavaScript/Reference/Global Objects/Object/preventExtensions">拡張不可</a> オブジェクトへの新規プロパティ割り当て) について、Strict モードでは例外が発生します:</p> +<p>第二に、Strict モードでは、代入文で暗黙的に失敗せずに例外が発生するようにします。例えば、<code>NaN</code> は書き込み不可のグローバル変数です。通常のコードでは <code>NaN</code> に代入しても何も起きません。つまり、開発者は失敗したという通知を受けません。Strict モードでは <code>NaN</code> に代入すると例外が発生します。通常のコードで暗黙的に失敗する代入 (書き込み不可のプロパティへの代入、getter のみのプロパティへの代入、<a href="/ja/JavaScript/Reference/Global_Objects/Object/preventExtensions">拡張不可</a> オブジェクトへの新規プロパティ割り当て) について、Strict モードでは例外が発生します:</p> <pre class="brush: js notranslate">'use strict'; @@ -257,7 +257,7 @@ f(); // TypeError が投げられます <p>Strict モードにより"セキュアな" JavaScript の記述がより簡単になります。現在、一部の Web サイトではユーザー向に対し、Web サイトの<em>他のユーザーが</em>実行することができる JavaScript を記述する方法を提供しています。ブラウザー上の JavaScript はユーザーの個人的な情報にアクセスできることから、そのような JavaScript は禁じられた機能へのアクセスを削除するよう、実行前に部分的に変換する必要があります。JavaScript の柔軟性は、ランタイムによる多くのチェックなしにこれを行うことを事実上不可能にします。ある言語機能は、ランタイムのチェック実行にかなりパフォーマンスのコストがかかるとして広まっています。Strict モードのいくつかの調整、そしてユーザーが投稿した JavaScript が Strict モードのコードであることや信頼できる方法で呼び出されることの要求により、ランタイムのチェックの必要性をかなり減らします。</p> -<p>第一に、Strict モードでは、<code><a href="/ja/docs/Web/JavaScript/Reference/Operators/this">this</a></code> として関数に渡された値をオブジェクトへボクシングしません。非ストリクトモードでの関数にとって <code><a href="/ja/docs/Web/JavaScript/Reference/Operators/this">this</a></code> は常にオブジェクトになります。this の値は、実行時に this オブジェクト値として提供されたオブジェクトであったり、真偽値・文字列・数値などのプリミティブな値が <code><a href="/ja/docs/Web/JavaScript/Reference/Operators/this">this</a></code> として呼び出した時はオブジェクトへボクシングした値、<code>{{Glossary("Undefined", "undefined")}}</code> または <code>{{Glossary("Null", "null")}}</code> の <code><a href="/ja/docs/Web/JavaScript/Reference/Operators/this">this</a></code> で呼び出された時はグローバルオブジェクトとなります。(特定の <code><a href="/ja/docs/Web/JavaScript/Reference/Operators/this">this</a></code> を指定するために <a href="/ja/JavaScript/Reference/Global_Objects/Function/call" title="ja/JavaScript/Reference/Global_Objects/Function/call"><code>call</code></a>、<a href="/ja/JavaScript/Reference/Global_Objects/Function/apply" title="ja/JavaScript/Reference/Global_Objects/Function/apply"><code>apply</code></a>、<a href="/ja/JavaScript/Reference/Global_Objects/Function/bind" title="ja/JavaScript/Reference/Global_Objects/Function/bind"><code>bind</code></a> を使用してください)。自動的なボクシングはパフォーマンス上のコストがあり、しかしブラウザーでグローバルオブジェクトを公開することは、"セキュアな" JavaScript 環境へのアクセスを提供するグローバルオブジェクトを制限する必要があるためにセキュリティ上の危険性があります。従って Strict モードの関数では、指定された <code><a href="/ja/docs/Web/JavaScript/Reference/Operators/this">this</a></code> を変更せずに使用します:</p> +<p>第一に、Strict モードでは、<code><a href="/ja/docs/Web/JavaScript/Reference/Operators/this">this</a></code> として関数に渡された値をオブジェクトへボクシングしません。非ストリクトモードでの関数にとって <code><a href="/ja/docs/Web/JavaScript/Reference/Operators/this">this</a></code> は常にオブジェクトになります。this の値は、実行時に this オブジェクト値として提供されたオブジェクトであったり、真偽値・文字列・数値などのプリミティブな値が <code><a href="/ja/docs/Web/JavaScript/Reference/Operators/this">this</a></code> として呼び出した時はオブジェクトへボクシングした値、<code>{{Glossary("Undefined", "undefined")}}</code> または <code>{{Glossary("Null", "null")}}</code> の <code><a href="/ja/docs/Web/JavaScript/Reference/Operators/this">this</a></code> で呼び出された時はグローバルオブジェクトとなります。(特定の <code><a href="/ja/docs/Web/JavaScript/Reference/Operators/this">this</a></code> を指定するために <a href="/ja/JavaScript/Reference/Global_Objects/Function/call"><code>call</code></a>、<a href="/ja/JavaScript/Reference/Global_Objects/Function/apply"><code>apply</code></a>、<a href="/ja/JavaScript/Reference/Global_Objects/Function/bind"><code>bind</code></a> を使用してください)。自動的なボクシングはパフォーマンス上のコストがあり、しかしブラウザーでグローバルオブジェクトを公開することは、"セキュアな" JavaScript 環境へのアクセスを提供するグローバルオブジェクトを制限する必要があるためにセキュリティ上の危険性があります。従って Strict モードの関数では、指定された <code><a href="/ja/docs/Web/JavaScript/Reference/Operators/this">this</a></code> を変更せずに使用します:</p> <pre class="brush: js notranslate">'use strict'; function fun() { return this; } diff --git a/files/ja/web/mathml/element/mfenced/index.html b/files/ja/web/mathml/element/mfenced/index.html index e931d5dc22..210ce30041 100644 --- a/files/ja/web/mathml/element/mfenced/index.html +++ b/files/ja/web/mathml/element/mfenced/index.html @@ -49,7 +49,7 @@ translation_of: Web/MathML/Element/mfenced <h3 id="余分な区切り記号（）は無視される">余分な区切り記号（<code>,</code>）は無視される</h3> -<p>サンプルレンダリング: <img alt="[a|b|c|d|e]" src="https://wiki.developer.mozilla.org/files/3195/mfenced02.png"></p> +<p>サンプルレンダリング: <img alt="[a|b|c|d|e]" src="/files/3195/mfenced02.png"></p> <p>ブラウザーでのレンダリング: <math> <mfenced close="]" open="[" separators="||||,"> <mi>a</mi> <mi>b</mi> <mi>c</mi> <mi>d</mi> <mi>e</mi> </mfenced> </math></p> diff --git a/files/ja/web/security/securing_your_site/index.html b/files/ja/web/security/securing_your_site/index.html index 8d375d18b7..915c555d8c 100644 --- a/files/ja/web/security/securing_your_site/index.html +++ b/files/ja/web/security/securing_your_site/index.html @@ -19,7 +19,7 @@ translation_of: Web/Security/Securing_your_site <dl> <dt><a href="/ja/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion">フォームオートコンプリートを無効にするには</a></dt> <dd>Geckoではフォームのオートコンプリートがサポートされています。つまり、ユーザがフォームに入力した値を記憶し、次回訪問時には自動的にその値が入力されることになります。ある特定のデータに関しては、この機能を無効にしたほうが適切かもしれません。</dd> - <dt><a href="/ja/CSS/Privacy_and_the_:visited_selector" title="ja/CSS/Privacy and the :visited selector">プライバシーと :visited セレクター</a></dt> + <dt><a href="/ja/CSS/Privacy_and_the_:visited_selector">プライバシーと :visited セレクター</a></dt> <dd>この記事では悪質なサイトがユーザーの閲覧履歴を取得できないようにするために <code>getComputedStyle()</code> メソッドに加えられた変更について議論しています。</dd> <dt><a href="https://www.owasp.org/index.php/Password_Storage_Cheat_Sheet">安全なアルゴリズムを使用したパスワードのハッシュ</a> (OWASP)</dt> <dd>プレーンテキストでパスワードを格納すると、攻撃者がサイトのユーザーの正確なパスワードを知り、漏洩させることにつながり、ユーザーを危険にさらすことになります。古く安全ではないハッシュアルゴリズム (md5 など) を使用すると、同じ問題が浮上します。メッセージダイジェストアルゴリズム (md5 や sha) ではなくパスワード専用のハッシュアルゴリズム (Argon2, PBKDF2, scrypt, bcrypt など) を使用するようにしてください。この記事はパスワードを格納するときに使用することができるベストプラクティスのショーケースです。</dd> @@ -28,10 +28,10 @@ translation_of: Web/Security/Securing_your_site <h2 id="コンテンツセキュリティ">コンテンツセキュリティ</h2> <dl> - <dt><a href="/ja/docs/Web/Security/Securing_your_site/Configuring_server_MIME_types" title="ja/docs/Web/Security/Securing_your_site/Configuring_server_MIME_types">サーバーの MIME タイプを正しく設定する</a></dt> + <dt><a href="/ja/docs/Web/Security/Securing_your_site/Configuring_server_MIME_types">サーバーの MIME タイプを正しく設定する</a></dt> <dd>MIME タイプを正しく設定しないと、幾つかの潜在的なセキュリティ上の問題が発生します。この記事ではそのうちのいくつかを紹介し、サーバーで MIME タイプを正しく設定する方法を示します。</dd> <dt><a href="/ja/docs/Web/Security/HTTP_Strict_Transport_Security">HTTP Strict Transport Security</a></dt> - <dd><code>Strict-Transport-Security:</code> <a href="/ja/HTTP" title="ja/HTTP">HTTP</a> ヘッダーを使うと、そのサイトが HTTPS でのみアクセスされるべきであるということを示すことができます。</dd> + <dd><code>Strict-Transport-Security:</code> <a href="/ja/HTTP">HTTP</a> ヘッダーを使うと、そのサイトが HTTPS でのみアクセスされるべきであるということを示すことができます。</dd> <dt><a href="/ja/docs/Web/HTTP/CORS">HTTP アクセス制御</a></dt> <dd>Cross-Origin Resource Sharing 標準はどのコンテンツが他のドメインから読み込まれるかを示す方法を提供します。この仕組みによりあなたのサイトが意図せず使われることを防いだり、明示的に使用を許可できます。</dd> <dt><a href="/ja/docs/Web/Security/CSP">Content Security Policy</a></dt> diff --git a/files/ja/web/svg/attribute/stroke-linecap/index.html b/files/ja/web/svg/attribute/stroke-linecap/index.html index f6aeccd337..f35c5842e7 100644 --- a/files/ja/web/svg/attribute/stroke-linecap/index.html +++ b/files/ja/web/svg/attribute/stroke-linecap/index.html @@ -7,7 +7,7 @@ tags: - SVG Attribute translation_of: Web/SVG/Attribute/stroke-linecap --- -<p>« <a href="/ja/docs/Web/SVG/Attribute" title="ja/docs/Web/SVG/Attribute">SVG 属性リファレンスホーム</a></p> +<p>« <a href="/ja/docs/Web/SVG/Attribute">SVG 属性リファレンスホーム</a></p> <p><code>stroke-linecap</code> 要素は線を引いた時の開いている部分パスの終端の形状を指定します。</p> @@ -68,6 +68,6 @@ translation_of: Web/SVG/Attribute/stroke-linecap <p>以下の要素で <code>stroke-linecap</code> を使うことができます</p> <ul> - <li><a href="/ja/docs/Web/SVG/Element#Shape" title="ja/docs/Web/SVG/Element#Shape">Shape 要素</a> »</li> - <li><a href="/ja/docs/Web/SVG/Element#TextContent" title="ja/docs/Web/SVG/Element#TextContent">Text content 要素</a> »</li> + <li><a href="/ja/docs/Web/SVG/Element#Shape">Shape 要素</a> »</li> + <li><a href="/ja/docs/Web/SVG/Element#TextContent">Text content 要素</a> »</li> </ul> diff --git a/files/ja/web/svg/attribute/stroke-linejoin/index.html b/files/ja/web/svg/attribute/stroke-linejoin/index.html index 3f72274f37..9c11e91b5e 100644 --- a/files/ja/web/svg/attribute/stroke-linejoin/index.html +++ b/files/ja/web/svg/attribute/stroke-linejoin/index.html @@ -7,7 +7,7 @@ tags: - SVG Attribute translation_of: Web/SVG/Attribute/stroke-linejoin --- -<p>« <a href="/ja/docs/Web/SVG/Attribute" title="ja/SVG/Attribute">SVG 属性リファレンスホーム</a></p> +<p>« <a href="/ja/docs/Web/SVG/Attribute">SVG 属性リファレンスホーム</a></p> <p><code>stroke-linejoin</code> 属性は線を引いた時のパスの曲がりまたは基本的な輪郭の形状を指定します。</p> @@ -73,8 +73,8 @@ translation_of: Web/SVG/Attribute/stroke-linejoin <p>以下の要素で <code>stroke-linejoin</code> 属性を使うことができます</p> <ul> - <li><a href="/ja/SVG/Element#Shape" title="ja/SVG/Element#Shape">Shape 要素</a> »</li> - <li><a href="/ja/SVG/Element#TextContent" title="ja/SVG/Element#TextContent">Text content 要素</a> »</li> + <li><a href="/ja/SVG/Element#Shape">Shape 要素</a> »</li> + <li><a href="/ja/SVG/Element#TextContent">Text content 要素</a> »</li> </ul> <p> </p> diff --git a/files/ja/web/svg/compatibility_sources/index.html b/files/ja/web/svg/compatibility_sources/index.html index 062a2f701d..f8f78b7a30 100644 --- a/files/ja/web/svg/compatibility_sources/index.html +++ b/files/ja/web/svg/compatibility_sources/index.html @@ -8,7 +8,7 @@ translation_of: Web/SVG/Compatibility_sources <p>以下の情報源が SVG 要素と属性の互換性の確認に活用できます。</p> <ul> - <li><a href="/ja/docs/SVG_in_Firefox" title="ja/docs/SVG_in_Firefox">https://wiki.developer.mozilla.org/ja/docs/SVG_in_Firefox</a> Firefoxに対する改編履歴あり</li> + <li><a href="/ja/docs/SVG_in_Firefox">https://developer.mozilla.org/ja/docs/SVG_in_Firefox</a> Firefoxに対する改編履歴あり</li> <li><a class="external" href="http://www.webkit.org/projects/svg/status.xml">http://www.webkit.org/projects/svg/status.xml</a> WebKit, Safari, Chrome 向けの<a class="external" href="http://wayback.archive.org/web/*/http://www.webkit.org/projects/svg/status.xml">記録書庫</a></li> <li>Opera 9 以降向けの追加情報は <a class="external" href="http://www.opera.com/docs/specs/opera9/svg/">http://www.opera.com/docs/specs/opera9/svg/</a> 、 Opera 8向けは <a class="external" href="http://www.opera.com/docs/specs/opera8/">http://www.opera.com/docs/specs/opera8/</a></li> <li><a class="external" href="http://blogs.msdn.com/b/ie/archive/2010/03/18/svg-in-ie9-roadmap.aspx">http://blogs.msdn.com/b/ie/archive/2010/03/18/svg-in-ie9-roadmap.aspx</a> IE9 向けの対応状況へのヒント</li> diff --git a/files/ja/web/svg/element/animatecolor/index.html b/files/ja/web/svg/element/animatecolor/index.html index 8c5927ffe4..1fbecd53f6 100644 --- a/files/ja/web/svg/element/animatecolor/index.html +++ b/files/ja/web/svg/element/animatecolor/index.html @@ -31,14 +31,14 @@ translation_of: Web/SVG/Element/animateColor <h3 id="グローバル属性">グローバル属性</h3> <ul> - <li><a href="/ja/docs/Web/SVG/Attribute#ConditionalProcessing" title="ja/Web/SVG/Attribute#ConditionalProcessing">条件処理属性</a> »</li> - <li><a href="/ja/docs/Web/SVG/Attribute#Core" title="ja/Web/SVG/Attribute#Core">コア属性</a> »</li> - <li><a href="/ja/docs/Web/SVG/Attribute#AnimationEvent" title="ja/Web/SVG/Attribute#AnimationEvent">アニメーションイベント属性</a> »</li> - <li><a href="/ja/docs/Web/SVG/Attribute#XLink" title="ja/Web/SVG/Attribute#XLink">Xlink属性</a> »</li> - <li><a href="/ja/docs/Web/SVG/Attribute#AnimationAttributeTarget" title="ja/Web/SVG/Attribute#AnimationAttributeTarget">Animation attribute target attributes</a> »</li> - <li><a href="/ja/docs/Web/SVG/Attribute#AnimationTiming" title="ja/Web/SVG/Attribute#AnimationTiming">アニメーションタイミング属性</a> »</li> - <li><a href="/ja/docs/Web/SVG/Attribute#AnimationValue" title="ja/Web/SVG/Attribute#AnimationValue">Animation value attributes</a> »</li> - <li><a href="/ja/docs/Web/SVG/Attribute#AnimationAddition" title="ja/Web/SVG/Attribute#AnimationAddition">Animation addition attributes</a> »</li> + <li><a href="/ja/docs/Web/SVG/Attribute#ConditionalProcessing">条件処理属性</a> »</li> + <li><a href="/ja/docs/Web/SVG/Attribute#Core">コア属性</a> »</li> + <li><a href="/ja/docs/Web/SVG/Attribute#AnimationEvent">アニメーションイベント属性</a> »</li> + <li><a href="/ja/docs/Web/SVG/Attribute#XLink">Xlink属性</a> »</li> + <li><a href="/ja/docs/Web/SVG/Attribute#AnimationAttributeTarget">Animation attribute target attributes</a> »</li> + <li><a href="/ja/docs/Web/SVG/Attribute#AnimationTiming">アニメーションタイミング属性</a> »</li> + <li><a href="/ja/docs/Web/SVG/Attribute#AnimationValue">Animation value attributes</a> »</li> + <li><a href="/ja/docs/Web/SVG/Attribute#AnimationAddition">Animation addition attributes</a> »</li> <li>{{ SVGAttr("externalResourcesRequired") }}</li> </ul> diff --git a/files/ja/web/svg/element/animatetransform/index.html b/files/ja/web/svg/element/animatetransform/index.html index 0113d15dbf..5cef265bb3 100644 --- a/files/ja/web/svg/element/animatetransform/index.html +++ b/files/ja/web/svg/element/animatetransform/index.html @@ -42,14 +42,14 @@ translation_of: Web/SVG/Element/animateTransform <h3 id="グローバル属性">グローバル属性</h3> <ul> - <li><a href="/ja/docs/Web/SVG/Attribute#ConditionalProccessing" title="ja/Web/SVG/Attribute#ConditionalProccessing">条件処理属性</a> »</li> + <li><a href="/ja/docs/Web/SVG/Attribute#ConditionalProccessing">条件処理属性</a> »</li> <li><a href="/ja/docs/Web/SVG/Attribute#Core" title="en/SVG/Attribute#Core">コア属性</a> »</li> - <li><a href="/ja/docs/Web/SVG/Attribute#AnimationEvent" title="ja/Web/SVG/Attribute#AnimationEvent">アニメーションイベント属性</a> »</li> - <li><a href="/ja/docs/Web/SVG/Attribute#XLink" title="ja/Web/SVG/Attribute#XLink">Xlink属性</a> »</li> - <li><a href="/ja/docs/Web/SVG/Attribute#AnimationAttributeTarget" title="ja/Web/SVG/Attribute#AnimationAttributeTarget">Animation attribute target attributes</a> »</li> + <li><a href="/ja/docs/Web/SVG/Attribute#AnimationEvent">アニメーションイベント属性</a> »</li> + <li><a href="/ja/docs/Web/SVG/Attribute#XLink">Xlink属性</a> »</li> + <li><a href="/ja/docs/Web/SVG/Attribute#AnimationAttributeTarget">Animation attribute target attributes</a> »</li> <li><a href="/ja/docs/Web/SVG/Attribute#AnimationTiming" title="en/SVG/Attribute#AnimationTiming">アニメーションタイミング属性</a> »</li> - <li><a href="/ja/docs/Web/SVG/Attribute#AnimationValue" title="ja/Web/SVG/Attribute#AnimationValue">Animation value attributes</a> »</li> - <li><a href="/ja/docs/Web/SVG/Attribute#AnimationAddition" title="ja/Web/SVG/Attribute#AnimationAddition">Animation addition attributes</a> »</li> + <li><a href="/ja/docs/Web/SVG/Attribute#AnimationValue">Animation value attributes</a> »</li> + <li><a href="/ja/docs/Web/SVG/Attribute#AnimationAddition">Animation addition attributes</a> »</li> <li>{{ SVGAttr("externalResourcesRequired") }}</li> </ul> diff --git a/files/ja/web/svg/element/lineargradient/index.html b/files/ja/web/svg/element/lineargradient/index.html index 123c6809c3..41aac08a01 100644 --- a/files/ja/web/svg/element/lineargradient/index.html +++ b/files/ja/web/svg/element/lineargradient/index.html @@ -26,9 +26,9 @@ translation_of: Web/SVG/Element/linearGradient <h3 id="グローバル属性">グローバル属性</h3> <ul> - <li><a href="/ja/Web/SVG/Attribute#Core" title="ja/Web/SVG/Attribute#Core">コア属性</a> »</li> - <li><a href="/ja/Web/SVG/Attribute#Presentation" title="ja/Web/SVG/Attribute#Presentation">プレゼンテーション属性</a> »</li> - <li><a href="/ja/Web/SVG/Attribute#XLink" title="ja/Web/SVG/Attribute#XLink">Xlink属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#Core">コア属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#Presentation">プレゼンテーション属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#XLink">Xlink属性</a> »</li> <li>{{ SVGAttr("class") }}</li> <li>{{ SVGAttr("style") }}</li> <li>{{ SVGAttr("externalResourcesRequired") }}</li> diff --git a/files/ja/web/svg/element/metadata/index.html b/files/ja/web/svg/element/metadata/index.html index 8925ae75ed..10d943d20b 100644 --- a/files/ja/web/svg/element/metadata/index.html +++ b/files/ja/web/svg/element/metadata/index.html @@ -22,7 +22,7 @@ translation_of: Web/SVG/Element/metadata <h3 id="グローバル属性">グローバル属性</h3> <ul> - <li><a href="/ja/Web/SVG/Attribute#Core" title="ja/Web/SVG/Attribute#Core">コア属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#Core">コア属性</a> »</li> </ul> <h3 id="専用属性">専用属性</h3> diff --git a/files/ja/web/svg/element/radialgradient/index.html b/files/ja/web/svg/element/radialgradient/index.html index b617afb4fb..d948931e6c 100644 --- a/files/ja/web/svg/element/radialgradient/index.html +++ b/files/ja/web/svg/element/radialgradient/index.html @@ -20,9 +20,9 @@ translation_of: Web/SVG/Element/radialGradient <h3 id="グローバル属性">グローバル属性</h3> <ul> - <li><a href="/ja/Web/SVG/Attribute#Core" title="ja/Web/SVG/Attribute#Core">コア属性</a> »</li> - <li><a href="/ja/Web/SVG/Attribute#Presentation" title="ja/Web/SVG/Attribute#Presentation">プレゼンテーション属性</a> »</li> - <li><a href="/ja/Web/SVG/Attribute#XLink" title="ja/Web/SVG/Attribute#XLink">Xlink属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#Core">コア属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#Presentation">プレゼンテーション属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#XLink">Xlink属性</a> »</li> <li>{{ SVGAttr("class") }}</li> <li>{{ SVGAttr("style") }}</li> <li>{{ SVGAttr("externalResourcesRequired") }}</li> diff --git a/files/ja/web/svg/element/rect/index.html b/files/ja/web/svg/element/rect/index.html index 2a6e95ee9e..c4ad070e21 100644 --- a/files/ja/web/svg/element/rect/index.html +++ b/files/ja/web/svg/element/rect/index.html @@ -29,10 +29,10 @@ translation_of: Web/SVG/Element/rect <h3 id="グローバル属性">グローバル属性</h3> <ul> - <li><a href="/ja/Web/SVG/Attribute#ConditionalProcessing" title="ja/Web/SVG/Attribute#ConditionalProccessing">条件処理属性</a> »</li> - <li><a href="/ja/Web/SVG/Attribute#Core" title="ja/Web/SVG/Attribute#Core">コア属性</a> »</li> - <li><a href="/ja/Web/SVG/Attribute#GraphicalEvent" title="ja/Web/SVG/Attribute#GraphicalEvent">グラフィカルイベント属性</a> »</li> - <li><a href="/ja/Web/SVG/Attribute#Presentation" title="ja/Web/SVG/Attribute#Presentation">プレゼンテーション属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#ConditionalProcessing">条件処理属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#Core">コア属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#GraphicalEvent">グラフィカルイベント属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#Presentation">プレゼンテーション属性</a> »</li> <li>{{ SVGAttr("class") }}</li> <li>{{ SVGAttr("style") }}</li> <li>{{ SVGAttr("externalResourcesRequired") }}</li> diff --git a/files/ja/web/svg/element/set/index.html b/files/ja/web/svg/element/set/index.html index 0f2373d15b..ff85e944c3 100644 --- a/files/ja/web/svg/element/set/index.html +++ b/files/ja/web/svg/element/set/index.html @@ -25,12 +25,12 @@ translation_of: Web/SVG/Element/set <h3 id="グローバル属性">グローバル属性</h3> <ul> - <li><a href="/ja/Web/SVG/Attribute#ConditionalProcessing" title="ja/Web/SVG/Attribute#ConditionalProccessing">条件処理属性</a> »</li> - <li><a href="/ja/Web/SVG/Attribute#Core" title="ja/Web/SVG/Attribute#Core">コア属性</a> »</li> - <li><a href="/ja/Web/SVG/Attribute#AnimationEvent" title="ja/Web/SVG/Attribute#AnimationEvent">アニメーションイベント属性</a> »</li> - <li><a href="/ja/Web/SVG/Attribute#XLink" title="ja/Web/SVG/Attribute#XLink">Xlink属性</a> »</li> - <li><a href="/ja/Web/SVG/Attribute#AnimationAttributeTarget" title="ja/Web/SVG/Attribute#AnimationAttributeTarget">Animation attribute target attributes</a> »</li> - <li><a href="/ja/Web/SVG/Attribute#AnimationTiming" title="ja/Web/SVG/Attribute#AnimationTiming">アニメーションタイミング属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#ConditionalProcessing">条件処理属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#Core">コア属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#AnimationEvent">アニメーションイベント属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#XLink">Xlink属性</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#AnimationAttributeTarget">Animation attribute target attributes</a> »</li> + <li><a href="/ja/Web/SVG/Attribute#AnimationTiming">アニメーションタイミング属性</a> »</li> <li>{{ SVGAttr("externalResourcesRequired") }}</li> </ul> diff --git a/files/ja/web/svg/svg_animation_with_smil/index.html b/files/ja/web/svg/svg_animation_with_smil/index.html index 4961bed4e2..0d70f03fe8 100644 --- a/files/ja/web/svg/svg_animation_with_smil/index.html +++ b/files/ja/web/svg/svg_animation_with_smil/index.html @@ -3,7 +3,7 @@ title: SVG animation with SMIL slug: Web/SVG/SVG_animation_with_SMIL translation_of: Web/SVG/SVG_animation_with_SMIL --- -<p>Firefox 4 より、<a class="external" href="http://www.w3.org/TR/REC-smil">Synchronized Multimedia Integration Language</a> (SMIL) を用いた <a href="/ja/SVG" title="ja/SVG">SVG</a> のアニメーションをサポートしています。SMIL では以下のようなことができます:</p> +<p>Firefox 4 より、<a class="external" href="http://www.w3.org/TR/REC-smil">Synchronized Multimedia Integration Language</a> (SMIL) を用いた <a href="/ja/SVG">SVG</a> のアニメーションをサポートしています。SMIL では以下のようなことができます:</p> <ul> <li>要素の数値属性 (x, y など) のアニメーション</li> diff --git a/files/ja/web/svg/tutorial/basic_shapes/index.html b/files/ja/web/svg/tutorial/basic_shapes/index.html index 2b87124f8a..9ad6201924 100644 --- a/files/ja/web/svg/tutorial/basic_shapes/index.html +++ b/files/ja/web/svg/tutorial/basic_shapes/index.html @@ -29,47 +29,47 @@ translation_of: Web/SVG/Tutorial/Basic_Shapes </pre> <div class="note"><strong>注意:</strong> <code>stroke</code>、<code>stroke-width</code> および <code>fill</code> の各属性は後のチュートリアルで説明します。</div> <h3 id="Rectangles" name="Rectangles">長方形</h3> -<p><a href="/ja/SVG/Element/rect" title="ja/SVG/Element/rect">rect</a> 要素は、おそらくあなたの予想とまったく同じで、スクリーンに長方形を描画します。この要素にはスクリーン上の位置や形状を操作する、6 種類の基本的な属性があります。前出の画像には 2 つの rect 要素があり、それは少し冗長になっています。右側の長方形は rx および ry 属性があり、これは角を丸くします。これらを設定しない場合、初期値は 0 になります。</p> +<p><a href="/ja/SVG/Element/rect">rect</a> 要素は、おそらくあなたの予想とまったく同じで、スクリーンに長方形を描画します。この要素にはスクリーン上の位置や形状を操作する、6 種類の基本的な属性があります。前出の画像には 2 つの rect 要素があり、それは少し冗長になっています。右側の長方形は rx および ry 属性があり、これは角を丸くします。これらを設定しない場合、初期値は 0 になります。</p> <pre class="eval"> <rect x="10" y="10" width="30" height="30"/> <rect x="60" y="10" rx="10" ry="10" width="30" height="30"/> </pre> <dl> <dt>x</dt> <dd>長方形の左上の角の位置を示す、X 座標です。</dd> <dt>y</dt> <dd>長方形の左上の角の位置を示す、Y 座標です。</dd> <dt>width</dt> <dd>長方形の幅です。</dd> <dt>height</dt> <dd>長方形の高さです。</dd> <dt>rx</dt> <dd>長方形の角の、X 軸方向の半径です。</dd> <dt>ry</dt> <dd>長方形の角の、Y 軸方向の半径です。</dd> </dl> <h3 id="Circle" name="Circle">円</h3> -<p>おそらくあなたの推測どおりで、<a href="/ja/SVG/Element/circle" title="ja/SVG/Element/circle">circle</a> 要素はスクリーンに円を描画します。ここで適用できる属性は 3 種類です。</p> +<p>おそらくあなたの推測どおりで、<a href="/ja/SVG/Element/circle">circle</a> 要素はスクリーンに円を描画します。ここで適用できる属性は 3 種類です。</p> <pre class="eval"> <circle cx="25" cy="75" r="20"/> </pre> <dl> <dt>r</dt> <dd>円の半径です。</dd> <dt>cx</dt> <dd>円の中心の位置を示す、X 座標です。</dd> <dt>cy</dt> <dd>円の中心の位置を示す、Y 座標です。</dd> </dl> <h3 id="Ellipse" name="Ellipse">楕円</h3> -<p><a href="/ja/SVG/Element/ellipse" title="ja/SVG/Element/ellipse">ellipse</a> は、実は circle 要素のより一般的な形であり、円の X 方向および Y 方向の半径 (数学者は一般的に長半径および短半径と呼びます) を分けて調節することができます。</p> +<p><a href="/ja/SVG/Element/ellipse">ellipse</a> は、実は circle 要素のより一般的な形であり、円の X 方向および Y 方向の半径 (数学者は一般的に長半径および短半径と呼びます) を分けて調節することができます。</p> <pre class="eval"> <ellipse cx="75" cy="75" rx="20" ry="5"/> </pre> <dl> <dt>rx</dt> <dd>楕円の X 軸方向の半径です。</dd> <dt>ry</dt> <dd>楕円の Y 軸方向の半径です。</dd> <dt>cx</dt> <dd>楕円の中心の位置を示す、X 座標です。</dd> <dt>cy</dt> <dd>楕円の中心の座標を示す、Y 座標です。</dd> </dl> <h3 id="Line" name="Line">直線</h3> -<p><a href="/ja/SVG/Element/line" title="ja/SVG/Element/line">line</a> は直線を描画します。これは線の始点と終点になる 2 つの点を示す属性を持ちます。</p> +<p><a href="/ja/SVG/Element/line">line</a> は直線を描画します。これは線の始点と終点になる 2 つの点を示す属性を持ちます。</p> <pre class="eval"> <line x1="10" x2="50" y1="110" y2="150"/> </pre> <dl> <dt>x1</dt> <dd>点 1 の X 座標です。</dd> <dt>y1</dt> <dd>点 1 の Y 座標です。</dd> <dt>x2</dt> <dd>点 2 の X 座標です。</dd> <dt>y2</dt> <dd>点 2 の Y 座標です。</dd> </dl> <h3 id="Polyline" name="Polyline">ポリライン</h3> -<p><a href="/ja/SVG/Element/polyline" title="ja/SVG/Element/polyline">polyline</a> は、連結された直線のグループです。リストがとても長くなるため、すべての点は 1 つの属性に収められます:</p> +<p><a href="/ja/SVG/Element/polyline">polyline</a> は、連結された直線のグループです。リストがとても長くなるため、すべての点は 1 つの属性に収められます:</p> <pre class="eval"> <polyline points="60 110, 65 120, 70 115, 75 130, 80 125, 85 140, 90 135, 95 150, 100 145"/> </pre> <dl> <dt>points</dt> <dd>点のリストで、各々の数値は空白、カンマ、<abbr title="End of line">EOL</abbr>、またはラインフィード文字で区切ります。各々の点は X 座標と Y 座標の 2 つの値を持たなければなりません。従って (0,0), (1,1) (2,2) のリストはこのように記述します: "0 0, 1 1, 2 2"。</dd> </dl> <h3 id="Polygon" name="Polygon">多角形</h3> -<p><a href="/ja/SVG/Element/polygon" title="ja/SVG/Element/polygon">polygon</a> は、点のリストを結ぶ直線の断片を連結して構成される点がポリラインとよく似ています。しかし polygon では、終端で線のパスが自動的に最初の点に戻ることで、閉じた図形を作成します。長方形は多角形の一種であるので、より柔軟性が必要である場合は <code><rect/></code> 要素を作成するために polygon を用いることができることに留意してください。</p> +<p><a href="/ja/SVG/Element/polygon">polygon</a> は、点のリストを結ぶ直線の断片を連結して構成される点がポリラインとよく似ています。しかし polygon では、終端で線のパスが自動的に最初の点に戻ることで、閉じた図形を作成します。長方形は多角形の一種であるので、より柔軟性が必要である場合は <code><rect/></code> 要素を作成するために polygon を用いることができることに留意してください。</p> <pre class="eval"> <polygon points="50 160, 55 180, 70 180, 60 190, 65 205, 50 195, 35 205, 40 190, 30 180, 45 180"/> </pre> <dl> <dt>points</dt> <dd>点のリストで、各々の数値は空白、カンマ、<abbr title="End of line">EOL</abbr>、またはラインフィード文字で区切ります。各々の点は X 座標と Y 座標の 2 つの値を持たなければなりません。従って (0,0), (1,1) (2,2) のリストはこのように記述します: "0 0, 1 1, 2 2"。パスを閉じるように描画するため、最後の直線は (2,2) から (0,0) に描画されます。</dd> </dl> <h3 id="Path" name="Path">パス</h3> -<p><a href="/ja/SVG/Element/path" title="ja/SVG/Element/path">path</a> は SVG で使用できる図形の中でもっとも一般的なものでしょう。path 要素を用いて長方形 (角を丸めることもできます)、円、楕円、ポリライン、多角形を描画することができます。基本的には他の図形、ベジェ曲線、二次曲線などのいずれかになります。以上の理由からパスについてはこのチュートリアルの<a href="/ja/SVG/Tutorial/Paths" title="ja/SVG/Tutorial/Paths">次のセクション</a>に独立していますが、 ここではその図形をコントロールするただ一つの属性があることを示します。</p> +<p><a href="/ja/SVG/Element/path">path</a> は SVG で使用できる図形の中でもっとも一般的なものでしょう。path 要素を用いて長方形 (角を丸めることもできます)、円、楕円、ポリライン、多角形を描画することができます。基本的には他の図形、ベジェ曲線、二次曲線などのいずれかになります。以上の理由からパスについてはこのチュートリアルの<a href="/ja/SVG/Tutorial/Paths">次のセクション</a>に独立していますが、 ここではその図形をコントロールするただ一つの属性があることを示します。</p> <pre class="eval"> <path d="M 20 230 Q 40 205, 50 230 T 90230"/> </pre> -<dl> <dt>d</dt> <dd>点のリストと、パスの描画方法に関する情報です。詳しくは <a href="/ja/SVG/Tutorial/Paths" title="ja/SVG/Tutorial/Paths">Paths</a> をご覧ください。</dd> +<dl> <dt>d</dt> <dd>点のリストと、パスの描画方法に関する情報です。詳しくは <a href="/ja/SVG/Tutorial/Paths">Paths</a> をご覧ください。</dd> </dl> <p>{{ PreviousNext("SVG/Tutorial/Positions", "SVG/Tutorial/Paths") }}</p> <p><span class="comment">Interwiki Languages Links</span></p> diff --git a/files/ja/web/svg/tutorial/patterns/index.html b/files/ja/web/svg/tutorial/patterns/index.html index e0b7fcd4fb..a79fe98e90 100644 --- a/files/ja/web/svg/tutorial/patterns/index.html +++ b/files/ja/web/svg/tutorial/patterns/index.html @@ -8,7 +8,7 @@ translation_of: Web/SVG/Tutorial/Patterns --- <p>{{ PreviousNext("SVG/Tutorial/Gradients", "SVG/Tutorial/Texts") }}</p> -<p>私見では、パターンは SVG で用いる中でわかりにくい塗りつぶし方のひとつです。とはいえとても強力であるので、パターンには説明および少なくとも基礎的な部分は把握するだけの価値があります。グラデーションと同様に、<a href="/ja/SVG/Element/pattern" title="ja/SVG/Element/pattern"><code><pattern></code></a> 要素は SVG ファイルの <code><defs></code> セクションに置かなければなりません。</p> +<p>私見では、パターンは SVG で用いる中でわかりにくい塗りつぶし方のひとつです。とはいえとても強力であるので、パターンには説明および少なくとも基礎的な部分は把握するだけの価値があります。グラデーションと同様に、<a href="/ja/SVG/Element/pattern"><code><pattern></code></a> 要素は SVG ファイルの <code><defs></code> セクションに置かなければなりません。</p> <p><img alt="" class="internal" src="/@api/deki/files/350/=SVG_Pattern_Example.png" style="float: right;"></p> |