From 95aca4b4d8fa62815d4bd412fff1a364f842814a Mon Sep 17 00:00:00 2001 From: Ryan Johnson Date: Thu, 29 Apr 2021 16:16:42 -0700 Subject: remove retired locales (#699) --- files/it/web/api/canvas_api/index.html | 74 -- files/it/web/api/canvas_api/tutorial/index.html | 56 -- .../api/canvasrenderingcontext2d/canvas/index.html | 101 --- .../canvasrenderingcontext2d/fillstyle/index.html | 209 ------ .../it/web/api/canvasrenderingcontext2d/index.html | 448 ------------- .../ispointinpath/index.html | 208 ------ files/it/web/api/closeevent/index.html | 197 ------ files/it/web/api/console/index.html | 294 -------- files/it/web/api/console/log/index.html | 88 --- files/it/web/api/console/table/index.html | 143 ---- files/it/web/api/crypto/index.html | 68 -- files/it/web/api/crypto/subtle/index.html | 52 -- files/it/web/api/datatransfer/getdata/index.html | 161 ----- files/it/web/api/datatransfer/index.html | 183 ----- files/it/web/api/document/anchors/index.html | 31 - files/it/web/api/document/applets/index.html | 25 - files/it/web/api/document/body/index.html | 88 --- files/it/web/api/document/characterset/index.html | 32 - files/it/web/api/document/close/index.html | 27 - files/it/web/api/document/createelement/index.html | 139 ---- files/it/web/api/document/createrange/index.html | 30 - files/it/web/api/document/defaultview/index.html | 27 - files/it/web/api/document/doctype/index.html | 27 - .../it/web/api/document/documentelement/index.html | 68 -- files/it/web/api/document/forms/index.html | 128 ---- .../it/web/api/document/getelementbyid/index.html | 149 ----- .../api/document/getelementsbyclassname/index.html | 82 --- .../web/api/document/getelementsbyname/index.html | 97 --- .../api/document/getelementsbytagname/index.html | 116 ---- files/it/web/api/document/head/index.html | 84 --- files/it/web/api/document/height/index.html | 35 - files/it/web/api/document/images/index.html | 52 -- files/it/web/api/document/importnode/index.html | 45 -- files/it/web/api/document/index.html | 308 --------- files/it/web/api/document/lastmodified/index.html | 31 - files/it/web/api/document/links/index.html | 100 --- files/it/web/api/document/open/index.html | 46 -- files/it/web/api/document/queryselector/index.html | 121 ---- .../web/api/document/queryselectorall/index.html | 180 ----- files/it/web/api/document/referrer/index.html | 23 - files/it/web/api/document/stylesheets/index.html | 45 -- files/it/web/api/document/title/index.html | 32 - files/it/web/api/document/url/index.html | 29 - files/it/web/api/document/width/index.html | 32 - files/it/web/api/document/write/index.html | 74 -- files/it/web/api/document/writeln/index.html | 34 - files/it/web/api/document_object_model/index.html | 435 ------------ .../document_object_model/introduction/index.html | 258 ------- .../index.html | 46 -- files/it/web/api/domstring/index.html | 56 -- files/it/web/api/domtokenlist/index.html | 115 ---- files/it/web/api/domtokenlist/item/index.html | 67 -- files/it/web/api/element/attributes/index.html | 120 ---- files/it/web/api/element/classlist/index.html | 288 -------- files/it/web/api/element/classname/index.html | 84 --- files/it/web/api/element/clientheight/index.html | 36 - files/it/web/api/element/closest/index.html | 147 ---- files/it/web/api/element/getattribute/index.html | 48 -- .../api/element/getelementsbytagname/index.html | 80 --- files/it/web/api/element/hasattribute/index.html | 75 --- files/it/web/api/element/hasattributes/index.html | 28 - files/it/web/api/element/index.html | 475 ------------- files/it/web/api/element/innerhtml/index.html | 213 ------ .../web/api/element/insertadjacenthtml/index.html | 102 --- files/it/web/api/element/namespaceuri/index.html | 31 - files/it/web/api/element/prefix/index.html | 27 - files/it/web/api/element/queryselector/index.html | 131 ---- .../it/web/api/element/queryselectorall/index.html | 182 ----- .../it/web/api/element/removeattribute/index.html | 57 -- .../web/api/element/requestfullscreen/index.html | 110 --- files/it/web/api/element/scrollheight/index.html | 170 ----- files/it/web/api/element/scrolltop/index.html | 83 --- files/it/web/api/element/setattribute/index.html | 83 --- files/it/web/api/element/tagname/index.html | 72 -- .../it/web/api/element/toggleattribute/index.html | 104 --- files/it/web/api/event/bubbles/index.html | 31 - files/it/web/api/event/cancelable/index.html | 23 - files/it/web/api/event/currenttarget/index.html | 99 --- files/it/web/api/event/eventphase/index.html | 19 - files/it/web/api/event/index.html | 240 ------- files/it/web/api/event/preventdefault/index.html | 176 ----- files/it/web/api/event/stoppropagation/index.html | 60 -- files/it/web/api/event/timestamp/index.html | 45 -- files/it/web/api/event/type/index.html | 50 -- .../api/eventtarget/addeventlistener/index.html | 695 ------------------- files/it/web/api/fetch_api/index.html | 170 ----- files/it/web/api/file/index.html | 101 --- .../using_files_from_web_applications/index.html | 506 -------------- files/it/web/api/geolocation/index.html | 133 ---- .../web/api/geolocation/watchposition/index.html | 166 ----- files/it/web/api/geolocation_api/index.html | 322 --------- files/it/web/api/geolocationposition/index.html | 126 ---- files/it/web/api/globaleventhandlers/index.html | 714 -------------------- .../api/globaleventhandlers/onresize/index.html | 77 --- files/it/web/api/htmlcanvaselement/index.html | 245 ------- .../it/web/api/htmlcanvaselement/toblob/index.html | 262 -------- files/it/web/api/htmlcollection/index.html | 101 --- files/it/web/api/htmlcollection/item/index.html | 50 -- files/it/web/api/htmlelement/index.html | 481 ------------- .../it/web/api/htmlelement/offsetheight/index.html | 123 ---- .../api/htmlformelement/acceptcharset/index.html | 22 - files/it/web/api/htmlformelement/action/index.html | 30 - .../it/web/api/htmlformelement/elements/index.html | 34 - .../it/web/api/htmlformelement/enctype/index.html | 28 - files/it/web/api/htmlformelement/index.html | 125 ---- files/it/web/api/htmlformelement/length/index.html | 26 - files/it/web/api/htmlformelement/method/index.html | 28 - files/it/web/api/htmlformelement/name/index.html | 35 - files/it/web/api/htmlformelement/reset/index.html | 28 - files/it/web/api/htmlformelement/submit/index.html | 30 - files/it/web/api/htmlformelement/target/index.html | 24 - files/it/web/api/htmliframeelement/index.html | 455 ------------- files/it/web/api/htmlunknownelement/index.html | 58 -- files/it/web/api/index.html | 17 - files/it/web/api/indexeddb_api/index.html | 243 ------- files/it/web/api/keyboardevent/charcode/index.html | 50 -- files/it/web/api/keyboardevent/keycode/index.html | 50 -- files/it/web/api/keyboardevent/which/index.html | 61 -- files/it/web/api/mouseevent/altkey/index.html | 48 -- files/it/web/api/mouseevent/button/index.html | 59 -- files/it/web/api/mouseevent/ctrlkey/index.html | 46 -- files/it/web/api/mouseevent/metakey/index.html | 32 - files/it/web/api/mouseevent/shiftkey/index.html | 47 -- files/it/web/api/mutationobserver/index.html | 102 --- .../it/web/api/navigator/cookieenabled/index.html | 83 --- files/it/web/api/navigator/credentials/index.html | 57 -- files/it/web/api/navigator/index.html | 119 ---- .../web/api/navigatorconcurrenthardware/index.html | 56 -- files/it/web/api/node/appendchild/index.html | 99 --- files/it/web/api/node/childnodes/index.html | 100 --- files/it/web/api/node/firstchild/index.html | 91 --- files/it/web/api/node/index.html | 368 ---------- files/it/web/api/node/lastchild/index.html | 59 -- files/it/web/api/node/nextsibling/index.html | 101 --- files/it/web/api/node/nodename/index.html | 117 ---- files/it/web/api/node/nodetype/index.html | 179 ----- files/it/web/api/node/nodevalue/index.html | 76 --- files/it/web/api/node/parentnode/index.html | 62 -- files/it/web/api/node/previoussibling/index.html | 81 --- files/it/web/api/node/textcontent/index.html | 139 ---- files/it/web/api/nodelist/foreach/index.html | 125 ---- files/it/web/api/nodelist/index.html | 124 ---- files/it/web/api/notification/dir/index.html | 73 -- files/it/web/api/notification/index.html | 496 -------------- files/it/web/api/parentnode/index.html | 90 --- files/it/web/api/performance/index.html | 135 ---- files/it/web/api/performance/now/index.html | 104 --- files/it/web/api/plugin/index.html | 64 -- files/it/web/api/range/clonecontents/index.html | 27 - files/it/web/api/range/clonerange/index.html | 28 - files/it/web/api/range/collapse/index.html | 36 - files/it/web/api/range/collapsed/index.html | 33 - .../api/range/commonancestorcontainer/index.html | 31 - .../web/api/range/compareboundarypoints/index.html | 54 -- files/it/web/api/range/comparepoint/index.html | 37 - .../api/range/createcontextualfragment/index.html | 37 - files/it/web/api/range/deletecontents/index.html | 25 - files/it/web/api/range/detach/index.html | 28 - files/it/web/api/range/endcontainer/index.html | 29 - files/it/web/api/range/endoffset/index.html | 29 - files/it/web/api/range/extractcontents/index.html | 27 - files/it/web/api/range/index.html | 150 ----- files/it/web/api/range/insertnode/index.html | 38 -- files/it/web/api/range/ispointinrange/index.html | 31 - files/it/web/api/range/selectnode/index.html | 35 - .../it/web/api/range/selectnodecontents/index.html | 37 - files/it/web/api/range/setend/index.html | 38 -- files/it/web/api/range/setendafter/index.html | 35 - files/it/web/api/range/setendbefore/index.html | 35 - files/it/web/api/range/setstart/index.html | 38 -- files/it/web/api/range/setstartafter/index.html | 35 - files/it/web/api/range/setstartbefore/index.html | 35 - files/it/web/api/range/startcontainer/index.html | 29 - files/it/web/api/range/startoffset/index.html | 29 - files/it/web/api/range/surroundcontents/index.html | 36 - files/it/web/api/range/tostring/index.html | 28 - files/it/web/api/selection/addrange/index.html | 39 -- files/it/web/api/selection/anchornode/index.html | 21 - files/it/web/api/selection/anchoroffset/index.html | 21 - files/it/web/api/selection/collapse/index.html | 44 -- .../it/web/api/selection/collapsetoend/index.html | 19 - .../web/api/selection/collapsetostart/index.html | 14 - files/it/web/api/selection/containsnode/index.html | 47 -- .../api/selection/deletefromdocument/index.html | 28 - files/it/web/api/selection/extend/index.html | 39 -- files/it/web/api/selection/focusnode/index.html | 21 - files/it/web/api/selection/focusoffset/index.html | 21 - files/it/web/api/selection/getrangeat/index.html | 37 - files/it/web/api/selection/index.html | 102 --- files/it/web/api/selection/iscollapsed/index.html | 24 - files/it/web/api/selection/rangecount/index.html | 19 - .../web/api/selection/removeallranges/index.html | 19 - files/it/web/api/selection/removerange/index.html | 38 -- .../web/api/selection/selectallchildren/index.html | 39 -- files/it/web/api/selection/tostring/index.html | 27 - files/it/web/api/storage/clear/index.html | 126 ---- files/it/web/api/storage/getitem/index.html | 144 ---- files/it/web/api/storage/index.html | 161 ----- files/it/web/api/storage/setitem/index.html | 133 ---- files/it/web/api/uievent/ischar/index.html | 31 - files/it/web/api/uievent/layerx/index.html | 103 --- files/it/web/api/uievent/layery/index.html | 103 --- files/it/web/api/uievent/pagex/index.html | 99 --- files/it/web/api/uievent/pagey/index.html | 99 --- files/it/web/api/uievent/view/index.html | 23 - files/it/web/api/webgl_api/index.html | 254 ------- files/it/web/api/websocket/index.html | 148 ---- files/it/web/api/websocket/websocket/index.html | 48 -- files/it/web/api/websockets_api/index.html | 180 ----- .../index.html | 185 ----- files/it/web/api/window/alert/index.html | 36 - files/it/web/api/window/back/index.html | 27 - files/it/web/api/window/blur/index.html | 26 - files/it/web/api/window/close/index.html | 72 -- files/it/web/api/window/closed/index.html | 66 -- files/it/web/api/window/confirm/index.html | 47 -- files/it/web/api/window/crypto/index.html | 90 --- files/it/web/api/window/defaultstatus/index.html | 38 -- .../web/api/window/devicemotion_event/index.html | 97 --- files/it/web/api/window/document/index.html | 39 -- .../api/window/domcontentloaded_event/index.html | 76 --- files/it/web/api/window/find/index.html | 33 - files/it/web/api/window/focus/index.html | 26 - files/it/web/api/window/forward/index.html | 22 - files/it/web/api/window/getselection/index.html | 46 -- files/it/web/api/window/history/index.html | 37 - files/it/web/api/window/home/index.html | 24 - files/it/web/api/window/index.html | 686 ------------------- files/it/web/api/window/load_event/index.html | 124 ---- files/it/web/api/window/localstorage/index.html | 138 ---- files/it/web/api/window/locationbar/index.html | 43 -- files/it/web/api/window/matchmedia/index.html | 91 --- files/it/web/api/window/moveby/index.html | 36 - files/it/web/api/window/moveto/index.html | 37 - files/it/web/api/window/name/index.html | 23 - files/it/web/api/window/opener/index.html | 24 - .../api/window/orientationchange_event/index.html | 66 -- files/it/web/api/window/print/index.html | 17 - files/it/web/api/window/prompt/index.html | 51 -- .../api/window/requestanimationframe/index.html | 115 ---- files/it/web/api/window/resizeby/index.html | 35 - files/it/web/api/window/resizeto/index.html | 39 -- files/it/web/api/window/sessionstorage/index.html | 138 ---- files/it/web/api/window/sidebar/index.html | 56 -- files/it/web/api/window/sizetocontent/index.html | 15 - files/it/web/api/window/status/index.html | 26 - files/it/web/api/window/statusbar/index.html | 32 - files/it/web/api/window/stop/index.html | 17 - files/it/web/api/window/top/index.html | 87 --- .../clearinterval/index.html | 49 -- .../api/windoworworkerglobalscope/fetch/index.html | 167 ----- .../web/api/windoworworkerglobalscope/index.html | 115 ---- files/it/web/api/worker/index.html | 107 --- files/it/web/api/xmlhttprequest/index.html | 173 ----- .../xmlhttprequest/onreadystatechange/index.html | 119 ---- files/it/web/api/xmlhttprequest/open/index.html | 115 ---- .../web/api/xmlhttprequest/readystate/index.html | 152 ----- .../xmlhttprequest/using_xmlhttprequest/index.html | 742 --------------------- .../api/xmlhttprequest/xmlhttprequest/index.html | 50 -- 259 files changed, 26026 deletions(-) delete mode 100644 files/it/web/api/canvas_api/index.html delete mode 100644 files/it/web/api/canvas_api/tutorial/index.html delete mode 100644 files/it/web/api/canvasrenderingcontext2d/canvas/index.html delete mode 100644 files/it/web/api/canvasrenderingcontext2d/fillstyle/index.html delete mode 100644 files/it/web/api/canvasrenderingcontext2d/index.html delete mode 100644 files/it/web/api/canvasrenderingcontext2d/ispointinpath/index.html delete mode 100644 files/it/web/api/closeevent/index.html delete mode 100644 files/it/web/api/console/index.html delete mode 100644 files/it/web/api/console/log/index.html delete mode 100644 files/it/web/api/console/table/index.html delete mode 100644 files/it/web/api/crypto/index.html delete mode 100644 files/it/web/api/crypto/subtle/index.html delete mode 100644 files/it/web/api/datatransfer/getdata/index.html delete mode 100644 files/it/web/api/datatransfer/index.html delete mode 100644 files/it/web/api/document/anchors/index.html delete mode 100644 files/it/web/api/document/applets/index.html delete mode 100644 files/it/web/api/document/body/index.html delete mode 100644 files/it/web/api/document/characterset/index.html delete mode 100644 files/it/web/api/document/close/index.html delete mode 100644 files/it/web/api/document/createelement/index.html delete mode 100644 files/it/web/api/document/createrange/index.html delete mode 100644 files/it/web/api/document/defaultview/index.html delete mode 100644 files/it/web/api/document/doctype/index.html delete mode 100644 files/it/web/api/document/documentelement/index.html delete mode 100644 files/it/web/api/document/forms/index.html delete mode 100644 files/it/web/api/document/getelementbyid/index.html delete mode 100644 files/it/web/api/document/getelementsbyclassname/index.html delete mode 100644 files/it/web/api/document/getelementsbyname/index.html delete mode 100644 files/it/web/api/document/getelementsbytagname/index.html delete mode 100644 files/it/web/api/document/head/index.html delete mode 100644 files/it/web/api/document/height/index.html delete mode 100644 files/it/web/api/document/images/index.html delete mode 100644 files/it/web/api/document/importnode/index.html delete mode 100644 files/it/web/api/document/index.html delete mode 100644 files/it/web/api/document/lastmodified/index.html delete mode 100644 files/it/web/api/document/links/index.html delete mode 100644 files/it/web/api/document/open/index.html delete mode 100644 files/it/web/api/document/queryselector/index.html delete mode 100644 files/it/web/api/document/queryselectorall/index.html delete mode 100644 files/it/web/api/document/referrer/index.html delete mode 100644 files/it/web/api/document/stylesheets/index.html delete mode 100644 files/it/web/api/document/title/index.html delete mode 100644 files/it/web/api/document/url/index.html delete mode 100644 files/it/web/api/document/width/index.html delete mode 100644 files/it/web/api/document/write/index.html delete mode 100644 files/it/web/api/document/writeln/index.html delete mode 100644 files/it/web/api/document_object_model/index.html delete mode 100644 files/it/web/api/document_object_model/introduction/index.html delete mode 100644 files/it/web/api/document_object_model/locating_dom_elements_using_selectors/index.html delete mode 100644 files/it/web/api/domstring/index.html delete mode 100644 files/it/web/api/domtokenlist/index.html delete mode 100644 files/it/web/api/domtokenlist/item/index.html delete mode 100644 files/it/web/api/element/attributes/index.html delete mode 100644 files/it/web/api/element/classlist/index.html delete mode 100644 files/it/web/api/element/classname/index.html delete mode 100644 files/it/web/api/element/clientheight/index.html delete mode 100644 files/it/web/api/element/closest/index.html delete mode 100644 files/it/web/api/element/getattribute/index.html delete mode 100644 files/it/web/api/element/getelementsbytagname/index.html delete mode 100644 files/it/web/api/element/hasattribute/index.html delete mode 100644 files/it/web/api/element/hasattributes/index.html delete mode 100644 files/it/web/api/element/index.html delete mode 100644 files/it/web/api/element/innerhtml/index.html delete mode 100644 files/it/web/api/element/insertadjacenthtml/index.html delete mode 100644 files/it/web/api/element/namespaceuri/index.html delete mode 100644 files/it/web/api/element/prefix/index.html delete mode 100644 files/it/web/api/element/queryselector/index.html delete mode 100644 files/it/web/api/element/queryselectorall/index.html delete mode 100644 files/it/web/api/element/removeattribute/index.html delete mode 100644 files/it/web/api/element/requestfullscreen/index.html delete mode 100644 files/it/web/api/element/scrollheight/index.html delete mode 100644 files/it/web/api/element/scrolltop/index.html delete mode 100644 files/it/web/api/element/setattribute/index.html delete mode 100644 files/it/web/api/element/tagname/index.html delete mode 100644 files/it/web/api/element/toggleattribute/index.html delete mode 100644 files/it/web/api/event/bubbles/index.html delete mode 100644 files/it/web/api/event/cancelable/index.html delete mode 100644 files/it/web/api/event/currenttarget/index.html delete mode 100644 files/it/web/api/event/eventphase/index.html delete mode 100644 files/it/web/api/event/index.html delete mode 100644 files/it/web/api/event/preventdefault/index.html delete mode 100644 files/it/web/api/event/stoppropagation/index.html delete mode 100644 files/it/web/api/event/timestamp/index.html delete mode 100644 files/it/web/api/event/type/index.html delete mode 100644 files/it/web/api/eventtarget/addeventlistener/index.html delete mode 100644 files/it/web/api/fetch_api/index.html delete mode 100644 files/it/web/api/file/index.html delete mode 100644 files/it/web/api/file/using_files_from_web_applications/index.html delete mode 100644 files/it/web/api/geolocation/index.html delete mode 100644 files/it/web/api/geolocation/watchposition/index.html delete mode 100644 files/it/web/api/geolocation_api/index.html delete mode 100644 files/it/web/api/geolocationposition/index.html delete mode 100644 files/it/web/api/globaleventhandlers/index.html delete mode 100644 files/it/web/api/globaleventhandlers/onresize/index.html delete mode 100644 files/it/web/api/htmlcanvaselement/index.html delete mode 100644 files/it/web/api/htmlcanvaselement/toblob/index.html delete mode 100644 files/it/web/api/htmlcollection/index.html delete mode 100644 files/it/web/api/htmlcollection/item/index.html delete mode 100644 files/it/web/api/htmlelement/index.html delete mode 100644 files/it/web/api/htmlelement/offsetheight/index.html delete mode 100644 files/it/web/api/htmlformelement/acceptcharset/index.html delete mode 100644 files/it/web/api/htmlformelement/action/index.html delete mode 100644 files/it/web/api/htmlformelement/elements/index.html delete mode 100644 files/it/web/api/htmlformelement/enctype/index.html delete mode 100644 files/it/web/api/htmlformelement/index.html delete mode 100644 files/it/web/api/htmlformelement/length/index.html delete mode 100644 files/it/web/api/htmlformelement/method/index.html delete mode 100644 files/it/web/api/htmlformelement/name/index.html delete mode 100644 files/it/web/api/htmlformelement/reset/index.html delete mode 100644 files/it/web/api/htmlformelement/submit/index.html delete mode 100644 files/it/web/api/htmlformelement/target/index.html delete mode 100644 files/it/web/api/htmliframeelement/index.html delete mode 100644 files/it/web/api/htmlunknownelement/index.html delete mode 100644 files/it/web/api/index.html delete mode 100644 files/it/web/api/indexeddb_api/index.html delete mode 100644 files/it/web/api/keyboardevent/charcode/index.html delete mode 100644 files/it/web/api/keyboardevent/keycode/index.html delete mode 100644 files/it/web/api/keyboardevent/which/index.html delete mode 100644 files/it/web/api/mouseevent/altkey/index.html delete mode 100644 files/it/web/api/mouseevent/button/index.html delete mode 100644 files/it/web/api/mouseevent/ctrlkey/index.html delete mode 100644 files/it/web/api/mouseevent/metakey/index.html delete mode 100644 files/it/web/api/mouseevent/shiftkey/index.html delete mode 100644 files/it/web/api/mutationobserver/index.html delete mode 100644 files/it/web/api/navigator/cookieenabled/index.html delete mode 100644 files/it/web/api/navigator/credentials/index.html delete mode 100644 files/it/web/api/navigator/index.html delete mode 100644 files/it/web/api/navigatorconcurrenthardware/index.html delete mode 100644 files/it/web/api/node/appendchild/index.html delete mode 100644 files/it/web/api/node/childnodes/index.html delete mode 100644 files/it/web/api/node/firstchild/index.html delete mode 100644 files/it/web/api/node/index.html delete mode 100644 files/it/web/api/node/lastchild/index.html delete mode 100644 files/it/web/api/node/nextsibling/index.html delete mode 100644 files/it/web/api/node/nodename/index.html delete mode 100644 files/it/web/api/node/nodetype/index.html delete mode 100644 files/it/web/api/node/nodevalue/index.html delete mode 100644 files/it/web/api/node/parentnode/index.html delete mode 100644 files/it/web/api/node/previoussibling/index.html delete mode 100644 files/it/web/api/node/textcontent/index.html delete mode 100644 files/it/web/api/nodelist/foreach/index.html delete mode 100644 files/it/web/api/nodelist/index.html delete mode 100644 files/it/web/api/notification/dir/index.html delete mode 100644 files/it/web/api/notification/index.html delete mode 100644 files/it/web/api/parentnode/index.html delete mode 100644 files/it/web/api/performance/index.html delete mode 100644 files/it/web/api/performance/now/index.html delete mode 100644 files/it/web/api/plugin/index.html delete mode 100644 files/it/web/api/range/clonecontents/index.html delete mode 100644 files/it/web/api/range/clonerange/index.html delete mode 100644 files/it/web/api/range/collapse/index.html delete mode 100644 files/it/web/api/range/collapsed/index.html delete mode 100644 files/it/web/api/range/commonancestorcontainer/index.html delete mode 100644 files/it/web/api/range/compareboundarypoints/index.html delete mode 100644 files/it/web/api/range/comparepoint/index.html delete mode 100644 files/it/web/api/range/createcontextualfragment/index.html delete mode 100644 files/it/web/api/range/deletecontents/index.html delete mode 100644 files/it/web/api/range/detach/index.html delete mode 100644 files/it/web/api/range/endcontainer/index.html delete mode 100644 files/it/web/api/range/endoffset/index.html delete mode 100644 files/it/web/api/range/extractcontents/index.html delete mode 100644 files/it/web/api/range/index.html delete mode 100644 files/it/web/api/range/insertnode/index.html delete mode 100644 files/it/web/api/range/ispointinrange/index.html delete mode 100644 files/it/web/api/range/selectnode/index.html delete mode 100644 files/it/web/api/range/selectnodecontents/index.html delete mode 100644 files/it/web/api/range/setend/index.html delete mode 100644 files/it/web/api/range/setendafter/index.html delete mode 100644 files/it/web/api/range/setendbefore/index.html delete mode 100644 files/it/web/api/range/setstart/index.html delete mode 100644 files/it/web/api/range/setstartafter/index.html delete mode 100644 files/it/web/api/range/setstartbefore/index.html delete mode 100644 files/it/web/api/range/startcontainer/index.html delete mode 100644 files/it/web/api/range/startoffset/index.html delete mode 100644 files/it/web/api/range/surroundcontents/index.html delete mode 100644 files/it/web/api/range/tostring/index.html delete mode 100644 files/it/web/api/selection/addrange/index.html delete mode 100644 files/it/web/api/selection/anchornode/index.html delete mode 100644 files/it/web/api/selection/anchoroffset/index.html delete mode 100644 files/it/web/api/selection/collapse/index.html delete mode 100644 files/it/web/api/selection/collapsetoend/index.html delete mode 100644 files/it/web/api/selection/collapsetostart/index.html delete mode 100644 files/it/web/api/selection/containsnode/index.html delete mode 100644 files/it/web/api/selection/deletefromdocument/index.html delete mode 100644 files/it/web/api/selection/extend/index.html delete mode 100644 files/it/web/api/selection/focusnode/index.html delete mode 100644 files/it/web/api/selection/focusoffset/index.html delete mode 100644 files/it/web/api/selection/getrangeat/index.html delete mode 100644 files/it/web/api/selection/index.html delete mode 100644 files/it/web/api/selection/iscollapsed/index.html delete mode 100644 files/it/web/api/selection/rangecount/index.html delete mode 100644 files/it/web/api/selection/removeallranges/index.html delete mode 100644 files/it/web/api/selection/removerange/index.html delete mode 100644 files/it/web/api/selection/selectallchildren/index.html delete mode 100644 files/it/web/api/selection/tostring/index.html delete mode 100644 files/it/web/api/storage/clear/index.html delete mode 100644 files/it/web/api/storage/getitem/index.html delete mode 100644 files/it/web/api/storage/index.html delete mode 100644 files/it/web/api/storage/setitem/index.html delete mode 100644 files/it/web/api/uievent/ischar/index.html delete mode 100644 files/it/web/api/uievent/layerx/index.html delete mode 100644 files/it/web/api/uievent/layery/index.html delete mode 100644 files/it/web/api/uievent/pagex/index.html delete mode 100644 files/it/web/api/uievent/pagey/index.html delete mode 100644 files/it/web/api/uievent/view/index.html delete mode 100644 files/it/web/api/webgl_api/index.html delete mode 100644 files/it/web/api/websocket/index.html delete mode 100644 files/it/web/api/websocket/websocket/index.html delete mode 100644 files/it/web/api/websockets_api/index.html delete mode 100644 files/it/web/api/websockets_api/writing_websocket_client_applications/index.html delete mode 100644 files/it/web/api/window/alert/index.html delete mode 100644 files/it/web/api/window/back/index.html delete mode 100644 files/it/web/api/window/blur/index.html delete mode 100644 files/it/web/api/window/close/index.html delete mode 100644 files/it/web/api/window/closed/index.html delete mode 100644 files/it/web/api/window/confirm/index.html delete mode 100644 files/it/web/api/window/crypto/index.html delete mode 100644 files/it/web/api/window/defaultstatus/index.html delete mode 100644 files/it/web/api/window/devicemotion_event/index.html delete mode 100644 files/it/web/api/window/document/index.html delete mode 100644 files/it/web/api/window/domcontentloaded_event/index.html delete mode 100644 files/it/web/api/window/find/index.html delete mode 100644 files/it/web/api/window/focus/index.html delete mode 100644 files/it/web/api/window/forward/index.html delete mode 100644 files/it/web/api/window/getselection/index.html delete mode 100644 files/it/web/api/window/history/index.html delete mode 100644 files/it/web/api/window/home/index.html delete mode 100644 files/it/web/api/window/index.html delete mode 100644 files/it/web/api/window/load_event/index.html delete mode 100644 files/it/web/api/window/localstorage/index.html delete mode 100644 files/it/web/api/window/locationbar/index.html delete mode 100644 files/it/web/api/window/matchmedia/index.html delete mode 100644 files/it/web/api/window/moveby/index.html delete mode 100644 files/it/web/api/window/moveto/index.html delete mode 100644 files/it/web/api/window/name/index.html delete mode 100644 files/it/web/api/window/opener/index.html delete mode 100644 files/it/web/api/window/orientationchange_event/index.html delete mode 100644 files/it/web/api/window/print/index.html delete mode 100644 files/it/web/api/window/prompt/index.html delete mode 100644 files/it/web/api/window/requestanimationframe/index.html delete mode 100644 files/it/web/api/window/resizeby/index.html delete mode 100644 files/it/web/api/window/resizeto/index.html delete mode 100644 files/it/web/api/window/sessionstorage/index.html delete mode 100644 files/it/web/api/window/sidebar/index.html delete mode 100644 files/it/web/api/window/sizetocontent/index.html delete mode 100644 files/it/web/api/window/status/index.html delete mode 100644 files/it/web/api/window/statusbar/index.html delete mode 100644 files/it/web/api/window/stop/index.html delete mode 100644 files/it/web/api/window/top/index.html delete mode 100644 files/it/web/api/windoworworkerglobalscope/clearinterval/index.html delete mode 100644 files/it/web/api/windoworworkerglobalscope/fetch/index.html delete mode 100644 files/it/web/api/windoworworkerglobalscope/index.html delete mode 100644 files/it/web/api/worker/index.html delete mode 100644 files/it/web/api/xmlhttprequest/index.html delete mode 100644 files/it/web/api/xmlhttprequest/onreadystatechange/index.html delete mode 100644 files/it/web/api/xmlhttprequest/open/index.html delete mode 100644 files/it/web/api/xmlhttprequest/readystate/index.html delete mode 100644 files/it/web/api/xmlhttprequest/using_xmlhttprequest/index.html delete mode 100644 files/it/web/api/xmlhttprequest/xmlhttprequest/index.html (limited to 'files/it/web/api') diff --git a/files/it/web/api/canvas_api/index.html b/files/it/web/api/canvas_api/index.html deleted file mode 100644 index 17a61b52e3..0000000000 --- a/files/it/web/api/canvas_api/index.html +++ /dev/null @@ -1,74 +0,0 @@ ---- -title: Canvas -slug: Web/API/Canvas_API -translation_of: Web/API/Canvas_API -original_slug: Web/HTML/Canvas ---- -

Aggiunto con HTML5, HTML {{ HTMLElement("canvas") }} è un elemento che può essere usato per disegnare elementi grafici tramite script (di solito JavaScript). Per esempio, può essere usato per disegnare grafici, creare composizioni fotografiche, creare animazioni e perfino realizzare elvaborazioni video in tempo reale.

- -

Le applicazioni Mozilla supportano <canvas> a partire da Gecko 1.8 (cioè Firefox 1.5). L'elemento è stato originariamente introdotto da Apple per OS X Dashboard e Safari. Internet Explorer supporta <canvas> dalla versione 9; per versioni precedenti di IE, una pagina può aggiungere il supporto per <canvas> includendo lo script del progetto Explorer Canvas di Google. Anche Google Chrome e Opera 9 supportano <canvas>.

- -

L'elemento <canvas> è utilizzato anche da WebGL per la grafica 3D con accellerazione hardware nelle pagine web.

- - - - - - - - -
-

Documentazione

- -
-
Specifiche
-
L'elemento <canvas> è parte delle specifiche 1.0 della WhatWG per le applicazioni  Web, anche conosciute come HTML5.
-
Esecitazione sui canvas
-
Un'esercitazione completa che copre sia l'utilizzo base  che le caratteristiche avanzate di <canvas>.
-
Frammenti di codice: Canvas
-
Qualche frammento di codice per gli sviluppatori di estensioni che coinvolge <canvas>.
-
Esempi di canvas
-
Alcune dimostraioni sui <canvas>.
-
Disegnare oggetti DOM in un canvas
-
Come disegnare contenuto DOM, come elementi HTML, in un canvas.
-
Un semplice raycaster
-
Una demo di animazione ray-tracing utilizzando il canvas.
-
Interfacce dei Canvas nel DOM
-
Interfacce dei Canvas nel DOM implementate in Gecko.
-
- -

Vedi tutto...

- 		-

Comunità

- -

Guarda i forum di Mozilla...{{DiscussionList("dev-tech-html","mozilla.dev.tech.html")}}
- Canvas-Developers Yahoo Group

- -

Risorse

- - - -

Librerie

- -
    -
  • libCanvas è un potente e leggero framework per canvas
    • -
  • Processing.js implementzione del linguaggio di visualizzazione Processing
    • -
  • EaselJS è una libreria con un'API simile a Flash
    • -
  • PlotKit è una libreria per la creazione di grafici e diagrammi
    • -
  • Rekapi è un'API per le animazioni Canvas basata sui keyframe
    • -
  • PhiloGL è un framework WebGL per la visualizzazione di dati, programmazione creativa e lo sviluppo di giochi.
    • -
  • JavaScript InfoVis Toolkit crea visualizzazioni di dati interattive per il Web con Canvas 2D
    • -
  • Frame-Engine è un framework per lo sviluppo di applicazioni e giochi
    • -
- - - - -
- -
{{ HTML5ArticleTOC() }}
diff --git a/files/it/web/api/canvas_api/tutorial/index.html b/files/it/web/api/canvas_api/tutorial/index.html deleted file mode 100644 index 9e3fe00f2e..0000000000 --- a/files/it/web/api/canvas_api/tutorial/index.html +++ /dev/null @@ -1,56 +0,0 @@ ---- -title: Tutorial sulle Canvas -slug: Web/API/Canvas_API/Tutorial -tags: - - Canvas tutorial - - HTML:Canvas -translation_of: Web/API/Canvas_API/Tutorial -original_slug: Tutorial_sulle_Canvas ---- -
-

<canvas> è un nuovo elemento HTML che può essere utilizzato per disegnare elementi grafici utilizzando lo scripting (di solito JavaScript). Per esempio può essere utilizzato per disegnare grafici, fare composizioni di fotografie o semplici (e non così semplici) animazioni. L'immagine a destra mostra alcuni esempi di implementazioni di <canvas> che vedremo più avanti in questo tutorial.

-
- -

Questo tutorial descrive come usare l'elemento <canvas> per disegnare grafica 2D, cominciando dagli apetti più elementari. Gli esempi forniti vi forniranno un'idea di ciò che è possibile fare con canvas nonché il codice di alcuni snippet come ispirazione per lo sviluppo dei vostri contenuti originali.

- -

<canvas> è stato introdotto originariamente da Apple per il Mac OS X Dashboard e solo implementato da Safari. Anche il browser basato sulla 1.8 Gecko, come ad esempio Firefox 1.5, supporta questo elemento. L'elemento <canvas> è anche parte delle specifiche WhatWG Web applications 1.0 conosciute come HTML 5

- -

In questo tutorial proveremo a descrivere l'utilizzo dell'elemento <canvas> nelle pagine HTML. Gli esempi forniti dovrebbero darvi dei chiarimenti di cosa tu puoi fare con <canvas> e come può essere utilizzato per iniziare a costruire le tue implementazioni.

- -

Prima di iniziare

- -

Utilizzare l'elemento <canvas> non è molto difficile, ma richiede una conoscenza di base di HTML e JavaScript.

- -

Sebbene l'elemento <canvas> non sia supportato da alcuni vecchi browser dovrebbe essere supportato dalle versioni recenti di tutti i principali browser. La dimensione predefinita del canvas (tela) è di 300px × 150 px (altezza x larghezza). E' possibile personalizzare le dimensioni ricorrendo alle proprietà height e width dei fogli CSS. Nei seguenti esempi ricorreremo a codice javascript (javascript context object) per generare la grafica al volo.

- -

In questo tutorial

- - - -

Vedi anche

- - - -
{{ Next("Web/API/Canvas_API/Tutorial/Basic_usage") }}
- -

{{ languages( { "fr": "fr/Tutoriel_canvas", "ja": "ja/Canvas_tutorial", "ko": "ko/Canvas_tutorial", "pl": "pl/Przewodnik_po_canvas", "zh-cn": "cn/Canvas_tutorial", "ru": "ru/\u041e\u0431\u0443\u0447\u0435\u043d\u0438\u0435_canvas" } ) }}

diff --git a/files/it/web/api/canvasrenderingcontext2d/canvas/index.html b/files/it/web/api/canvasrenderingcontext2d/canvas/index.html deleted file mode 100644 index bb453e4419..0000000000 --- a/files/it/web/api/canvasrenderingcontext2d/canvas/index.html +++ /dev/null @@ -1,101 +0,0 @@ ---- -title: CanvasRenderingContext2D.canvas -slug: Web/API/CanvasRenderingContext2D/canvas -translation_of: Web/API/CanvasRenderingContext2D/canvas ---- -
{{APIRef}}
- -

La proprietà CanvasRenderingContext2D.canvas è un riferimento di sola lettura verso il canvas {{domxref("HTMLCanvasElement")}} che contiene il context corrente. Può essere {{jsxref("null")}} se non vi è un elemento {{HTMLElement("canvas")}} associato.

- -

Sintassi

- -
ctx.canvas;
- -

Esempi

- -

Dato il seguente elmento  {{HTMLElement("canvas")}}:

- -
<canvas id="canvas"></canvas>
-
- -

È possibile ottenere un riferimento all'elemento canvas da cui è ottenuto questo CanvasRenderingContext2D utilizzando la property canvas:

- -
var canvas = document.getElementById("canvas");
-var ctx = canvas.getContext("2d");
-ctx.canvas // HTMLCanvasElement
-
- -

Specifiche

- - - - - - - - - - - - - - -
SpecificaStatoCommenti
{{SpecName('HTML WHATWG', "scripting.html#dom-context-2d-canvas", "CanvasRenderingContext2D.canvas")}}{{Spec2('HTML WHATWG')}} 
- -

Compatibilità Browser

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - -
CaratteristicaChromeFirefox (Gecko)Internet ExplorerOperaSafari
Supporto base{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - - - -
CaratteristicaAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Supporto base{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -

Vedi anche

- - diff --git a/files/it/web/api/canvasrenderingcontext2d/fillstyle/index.html b/files/it/web/api/canvasrenderingcontext2d/fillstyle/index.html deleted file mode 100644 index 2f905a5241..0000000000 --- a/files/it/web/api/canvasrenderingcontext2d/fillstyle/index.html +++ /dev/null @@ -1,209 +0,0 @@ ---- -title: CanvasRenderingContext2D.fillStyle -slug: Web/API/CanvasRenderingContext2D/fillStyle -tags: - - API - - CamvasRenderingContext2D - - Canvas - - Proprietà - - Riferimento -translation_of: Web/API/CanvasRenderingContext2D/fillStyle ---- -
{{APIRef}}
- -

La proprietà CanvasRenderingContext2D.fillStyle delle Canvas 2D API specifica il colore o lo stile da usare all'interno delle forme. Il colore preimpostato è #000 (nero).

- -

Vedi anche i capitoli Applicare stili e colori nel Canvas Tutorial.

- -

Sintassi

- -
ctx.fillStyle = color;
-ctx.fillStyle = gradient;
-ctx.fillStyle = pattern;
-
- -

Opzioni

- -
-
color
-
Una {{domxref("DOMString")}} letta come valore CSS {{cssxref("<color>")}}.
-
gradient
-
Un oggetto {{domxref("CanvasGradient")}} (gradiente lineare o radiale).
-
pattern
-
Un oggetto {{domxref("CanvasPattern")}} (immagine ripetuta).
-
- -

Esempi

- -

Usare la proprietà fillStyle per impostare un colore diverso

- -

In questa semplice porzione di codice viene usata la proprietù fillStyle per impostare un colore diverso.

- -

HTML

- -
<canvas id="canvas"></canvas>
-
- -

JavaScript

- -
var canvas = document.getElementById("canvas");
-var ctx = canvas.getContext("2d");
-
-ctx.fillStyle = "blue";
-ctx.fillRect(10, 10, 100, 100);
-
- -

Modifica il codice qui sotto e vedi i cambiamenti in tempo reale nel canvas:

- - - -

{{ EmbedLiveSample('Playable_code', 700, 360) }}

- -

Un esempio di fillStyle con i cicli for

- -

In questo esempio, useremo due cicli for per disegnare una griglia di rettangoli, ognuno di un colore differente. Il risultato finale dovrebbe assomigliare allo screenshot. Niente di particolarmente spettacolare. Usiamo due variabili i e j per generare un colore RGB unico per ogni quadrato, questo modificando soltanto i valori del rosso e del verde. Il canale del blu ha un valore fisso. Modificando i canali, puoi generare ogni tipo di palette. Aumentando le ripetizioni del ciclo, puoi ottenere qualcosa di assomigliante alle palette usate da Photoshop.

- - - -
var ctx = document.getElementById('canvas').getContext('2d');
-for (var i=0;i<6;i++){
-  for (var j=0;j<6;j++){
-    ctx.fillStyle = 'rgb(' + Math.floor(255-42.5*i) + ',' +
-                     Math.floor(255-42.5*j) + ',0)';
-    ctx.fillRect(j*25,i*25,25,25);
-  }
-}
-
- -

Il risultato assomiglia a questo:

- -

{{EmbedLiveSample("Un_esempio_di_fillStyle_con_i_cicli_for", 160, 160, "https://mdn.mozillademos.org/files/5417/Canvas_fillstyle.png")}}

- -

Specifiche

- - - - - - - - - - - - - - -
SpecificheStatoCommento
{{SpecName('HTML WHATWG', "scripting.html#dom-context-2d-fillstyle", "CanvasRenderingContext2D.fillStyle")}}{{Spec2('HTML WHATWG')}} 
- -

Compatibilità dei Browser

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - -
CaratteristicaChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - - - -
CaratteristicaAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- - - - - -

Vedi anche

- - diff --git a/files/it/web/api/canvasrenderingcontext2d/index.html b/files/it/web/api/canvasrenderingcontext2d/index.html deleted file mode 100644 index e6b2eb7167..0000000000 --- a/files/it/web/api/canvasrenderingcontext2d/index.html +++ /dev/null @@ -1,448 +0,0 @@ ---- -title: CanvasRenderingContext2D -slug: Web/API/CanvasRenderingContext2D -tags: - - API - - Canvas - - CanvasRenderingContext2D - - Games - - Graphics - - NeedsTranslation - - Reference - - TopicStub -translation_of: Web/API/CanvasRenderingContext2D ---- -
{{APIRef}}
- -The CanvasRenderingContext2D interface provides the 2D rendering context for the drawing surface of a {{ HTMLElement("canvas") }} element. - -

To get an object of this interface, call {{domxref("HTMLCanvasElement.getContext()", "getContext()")}} on a <canvas>, supplying "2d" as the argument:

- -
var canvas = document.getElementById('mycanvas');
-var ctx = canvas.getContext('2d');
-
- -

Once you have the 2D rendering context for a canvas, you can draw within it. For example:

- -
ctx.fillStyle = "rgb(200,0,0)";
-ctx.fillRect(10, 10, 55, 50);
-
- -

See the properties and methods in the sidebar and below. The canvas tutorial has more information, examples, and resources as well.

- -

Drawing rectangles

- -

There are three methods that immediately draw rectangles to the bitmap.

- -
-
{{domxref("CanvasRenderingContext2D.clearRect()")}}
-
Sets all pixels in the rectangle defined by starting point (x, y) and size (width, height) to transparent black, erasing any previously drawn content.
-
{{domxref("CanvasRenderingContext2D.fillRect()")}}
-
Draws a filled rectangle at (x, y) position whose size is determined by width and height.
-
{{domxref("CanvasRenderingContext2D.strokeRect()")}}
-
Paints a rectangle which has a starting point at (x, y) and has a w width and an h height onto the canvas, using the current stroke style.
-
- -

Drawing text

- -

The following methods are provided for drawing text. See also the {{domxref("TextMetrics")}} object for text properties.

- -
-
{{domxref("CanvasRenderingContext2D.fillText()")}}
-
Draws (fills) a given text at the given (x,y) position.
-
{{domxref("CanvasRenderingContext2D.strokeText()")}}
-
Draws (strokes) a given text at the given (x, y) position.
-
{{domxref("CanvasRenderingContext2D.measureText()")}}
-
Returns a {{domxref("TextMetrics")}} object.
-
- -

Line styles

- -

The following methods and properties control how lines are drawn.

- -
-
{{domxref("CanvasRenderingContext2D.lineWidth")}}
-
Width of lines. Default 1.0
-
{{domxref("CanvasRenderingContext2D.lineCap")}}
-
Type of endings on the end of lines. Possible values: butt (default), round, square.
-
{{domxref("CanvasRenderingContext2D.lineJoin")}}
-
Defines the type of corners where two lines meet. Possible values: round, bevel, miter (default).
-
{{domxref("CanvasRenderingContext2D.miterLimit")}}
-
Miter limit ratio. Default 10.
-
{{domxref("CanvasRenderingContext2D.getLineDash()")}}
-
Returns the current line dash pattern array containing an even number of non-negative numbers.
-
{{domxref("CanvasRenderingContext2D.setLineDash()")}}
-
Sets the current line dash pattern.
-
{{domxref("CanvasRenderingContext2D.lineDashOffset")}}
-
Specifies where to start a dash array on a line.
-
- -

Text styles

- -

The following properties control how text is laid out.

- -
-
{{domxref("CanvasRenderingContext2D.font")}}
-
Font setting. Default value 10px sans-serif.
-
{{domxref("CanvasRenderingContext2D.textAlign")}}
-
Text alignment setting. Possible values: start (default), end, left, right or center.
-
{{domxref("CanvasRenderingContext2D.textBaseline")}}
-
Baseline alignment setting. Possible values: top, hanging, middle, alphabetic (default), ideographic, bottom.
-
{{domxref("CanvasRenderingContext2D.direction")}}
-
Directionality. Possible values: ltr, rtl, inherit (default).
-
- -

Fill and stroke styles

- -

Fill styling is used for colors and styles inside shapes and stroke styling is used for the lines around shapes.

- -
-
{{domxref("CanvasRenderingContext2D.fillStyle")}}
-
Color or style to use inside shapes. Default #000 (black).
-
{{domxref("CanvasRenderingContext2D.strokeStyle")}}
-
Color or style to use for the lines around shapes. Default #000 (black).
-
- -

Gradients and patterns

- -
-
{{domxref("CanvasRenderingContext2D.createLinearGradient()")}}
-
Creates a linear gradient along the line given by the coordinates represented by the parameters.
-
{{domxref("CanvasRenderingContext2D.createRadialGradient()")}}
-
Creates a radial gradient along the line given by the coordinates represented by the parameters.
-
{{domxref("CanvasRenderingContext2D.createPattern()")}}
-
Creates a pattern using the specified image (a {{domxref("CanvasImageSource")}}). It repeats the source in the directions specified by the repetition argument. This method returns a {{domxref("CanvasPattern")}}.
-
- -

Shadows

- -
-
{{domxref("CanvasRenderingContext2D.shadowBlur")}}
-
Specifies the blurring effect. Default 0
-
{{domxref("CanvasRenderingContext2D.shadowColor")}}
-
Color of the shadow. Default fully-transparent black.
-
{{domxref("CanvasRenderingContext2D.shadowOffsetX")}}
-
Horizontal distance the shadow will be offset. Default 0.
-
{{domxref("CanvasRenderingContext2D.shadowOffsetY")}}
-
Vertical distance the shadow will be offset. Default 0.
-
- -

Paths

- -

The following methods can be used to manipulate paths of objects.

- -
-
{{domxref("CanvasRenderingContext2D.beginPath()")}}
-
Starts a new path by emptying the list of sub-paths. Call this method when you want to create a new path.
-
{{domxref("CanvasRenderingContext2D.closePath()")}}
-
Causes the point of the pen to move back to the start of the current sub-path. It tries to draw a straight line from the current point to the start. If the shape has already been closed or has only one point, this function does nothing.
-
{{domxref("CanvasRenderingContext2D.moveTo()")}}
-
Moves the starting point of a new sub-path to the (x, y) coordinates.
-
{{domxref("CanvasRenderingContext2D.lineTo()")}}
-
Connects the last point in the subpath to the x, y coordinates with a straight line.
-
{{domxref("CanvasRenderingContext2D.bezierCurveTo()")}}
-
Adds a cubic Bézier curve to the path. It requires three points. The first two points are control points and the third one is the end point. The starting point is the last point in the current path, which can be changed using moveTo() before creating the Bézier curve.
-
{{domxref("CanvasRenderingContext2D.quadraticCurveTo()")}}
-
Adds a quadratic Bézier curve to the current path.
-
{{domxref("CanvasRenderingContext2D.arc()")}}
-
Adds an arc to the path which is centered at (x, y) position with radius r starting at startAngle and ending at endAngle going in the given direction by anticlockwise (defaulting to clockwise).
-
{{domxref("CanvasRenderingContext2D.arcTo()")}}
-
Adds an arc to the path with the given control points and radius, connected to the previous point by a straight line.
-
{{domxref("CanvasRenderingContext2D.ellipse()")}} {{experimental_inline}}
-
Adds an ellipse to the path which is centered at (x, y) position with the radii radiusX and radiusY starting at startAngle and ending at endAngle going in the given direction by anticlockwise (defaulting to clockwise).
-
{{domxref("CanvasRenderingContext2D.rect()")}}
-
Creates a path for a rectangle at position (x, y) with a size that is determined by width and height.
-
- -

Drawing paths

- -
-
{{domxref("CanvasRenderingContext2D.fill()")}}
-
Fills the subpaths with the current fill style.
-
{{domxref("CanvasRenderingContext2D.stroke()")}}
-
Strokes the subpaths with the current stroke style.
-
{{domxref("CanvasRenderingContext2D.drawFocusIfNeeded()")}}
-
If a given element is focused, this method draws a focus ring around the current path.
-
{{domxref("CanvasRenderingContext2D.scrollPathIntoView()")}}
-
Scrolls the current path or a given path into the view.
-
{{domxref("CanvasRenderingContext2D.clip()")}}
-
Creates a clipping path from the current sub-paths. Everything drawn after clip() is called appears inside the clipping path only. For an example, see Clipping paths in the Canvas tutorial.
-
{{domxref("CanvasRenderingContext2D.isPointInPath()")}}
-
Reports whether or not the specified point is contained in the current path.
-
{{domxref("CanvasRenderingContext2D.isPointInStroke()")}}
-
Reports whether or not the specified point is inside the area contained by the stroking of a path.
-
- -

Transformations

- -

Objects in the CanvasRenderingContext2D rendering context have a current transformation matrix and methods to manipulate it. The transformation matrix is applied when creating the current default path, painting text, shapes and {{domxref("Path2D")}} objects. The methods listed below remain for historical and compatibility reasons as {{domxref("SVGMatrix")}} objects are used in most parts of the API nowadays and will be used in the future instead.

- -
-
{{domxref("CanvasRenderingContext2D.currentTransform")}}
-
Current transformation matrix ({{domxref("SVGMatrix")}} object).
-
{{domxref("CanvasRenderingContext2D.rotate()")}}
-
Adds a rotation to the transformation matrix. The angle argument represents a clockwise rotation angle and is expressed in radians.
-
{{domxref("CanvasRenderingContext2D.scale()")}}
-
Adds a scaling transformation to the canvas units by x horizontally and by y vertically.
-
{{domxref("CanvasRenderingContext2D.translate()")}}
-
Adds a translation transformation by moving the canvas and its origin x horzontally and y vertically on the grid.
-
{{domxref("CanvasRenderingContext2D.transform()")}}
-
Multiplies the current transformation matrix with the matrix described by its arguments.
-
{{domxref("CanvasRenderingContext2D.setTransform()")}}
-
Resets the current transform to the identity matrix, and then invokes the transform() method with the same arguments.
-
{{domxref("CanvasRenderingContext2D.resetTransform()")}} {{experimental_inline}}
-
Resets the current transform by the identity matrix.
-
- -

Compositing

- -
-
{{domxref("CanvasRenderingContext2D.globalAlpha")}}
-
Alpha value that is applied to shapes and images before they are composited onto the canvas. Default 1.0 (opaque).
-
{{domxref("CanvasRenderingContext2D.globalCompositeOperation")}}
-
With globalAlpha applied this sets how shapes and images are drawn onto the existing bitmap.
-
- -

Drawing images

- -
-
{{domxref("CanvasRenderingContext2D.drawImage()")}}
-
Draws the specified image. This method is available in multiple formats, providing a great deal of flexibility in its use.
-
- -

Pixel manipulation

- -

See also the {{domxref("ImageData")}} object.

- -
-
{{domxref("CanvasRenderingContext2D.createImageData()")}}
-
Creates a new, blank {{domxref("ImageData")}} object with the specified dimensions. All of the pixels in the new object are transparent black.
-
{{domxref("CanvasRenderingContext2D.getImageData()")}}
-
Returns an {{domxref("ImageData")}} object representing the underlying pixel data for the area of the canvas denoted by the rectangle which starts at (sx, sy) and has an sw width and sh height.
-
{{domxref("CanvasRenderingContext2D.putImageData()")}}
-
Paints data from the given {{domxref("ImageData")}} object onto the bitmap. If a dirty rectangle is provided, only the pixels from that rectangle are painted.
-
- -

Image smoothing

- -
-
{{domxref("CanvasRenderingContext2D.imageSmoothingEnabled")}} {{experimental_inline}}
-
Image smoothing mode; if disabled, images will not be smoothed if scaled.
-
- -

The canvas state

- -

The CanvasRenderingContext2D rendering context contains a variety of drawing style states (attributes for line styles, fill styles, shadow styles, text styles). The following methods help you to work with that state:

- -
-
{{domxref("CanvasRenderingContext2D.save()")}}
-
Saves the current drawing style state using a stack so you can revert any change you make to it using restore().
-
{{domxref("CanvasRenderingContext2D.restore()")}}
-
Restores the drawing style state to the last element on the 'state stack' saved by save().
-
{{domxref("CanvasRenderingContext2D.canvas")}}
-
A read-only back-reference to the {{domxref("HTMLCanvasElement")}}. Might be {{jsxref("null")}} if it is not associated with a {{HTMLElement("canvas")}} element.
-
- -

Hit regions

- -
-
{{domxref("CanvasRenderingContext2D.addHitRegion()")}} {{experimental_inline}}
-
Adds a hit region to the canvas.
-
{{domxref("CanvasRenderingContext2D.removeHitRegion()")}} {{experimental_inline}}
-
Removes the hit region with the specified id from the canvas.
-
{{domxref("CanvasRenderingContext2D.clearHitRegions()")}} {{experimental_inline}}
-
Removes all hit regions from the canvas.
-
- -

Non-standard APIs

- - - -

Most of these APIs are deprecated and will be removed in the future.

- -
-
{{non-standard_inline}} CanvasRenderingContext2D.clearShadow()
-
Removes all shadow settings like {{domxref("CanvasRenderingContext2D.shadowColor")}} and {{domxref("CanvasRenderingContext2D.shadowBlur")}}.
-
{{non-standard_inline}} CanvasRenderingContext2D.drawImageFromRect()
-
This is redundant with an equivalent overload of drawImage.
-
{{non-standard_inline}} CanvasRenderingContext2D.setAlpha()
-
Use {{domxref("CanvasRenderingContext2D.globalAlpha")}} instead.
-
{{non-standard_inline}} CanvasRenderingContext2D.setCompositeOperation()
-
Use {{domxref("CanvasRenderingContext2D.globalCompositeOperation")}} instead.
-
{{non-standard_inline}} CanvasRenderingContext2D.setLineWidth()
-
Use {{domxref("CanvasRenderingContext2D.lineWidth")}} instead.
-
{{non-standard_inline}} CanvasRenderingContext2D.setLineJoin()
-
Use {{domxref("CanvasRenderingContext2D.lineJoin")}} instead.
-
{{non-standard_inline}} CanvasRenderingContext2D.setLineCap()
-
Use {{domxref("CanvasRenderingContext2D.lineCap")}} instead.
-
{{non-standard_inline}} CanvasRenderingContext2D.setMiterLimit()
-
Use {{domxref("CanvasRenderingContext2D.miterLimit")}} instead.
-
{{non-standard_inline}} CanvasRenderingContext2D.setStrokeColor()
-
Use {{domxref("CanvasRenderingContext2D.strokeStyle")}} instead.
-
{{non-standard_inline}} CanvasRenderingContext2D.setFillColor()
-
Use {{domxref("CanvasRenderingContext2D.fillStyle")}} instead.
-
{{non-standard_inline}} CanvasRenderingContext2D.setShadow()
-
Use {{domxref("CanvasRenderingContext2D.shadowColor")}} and {{domxref("CanvasRenderingContext2D.shadowBlur")}} instead.
-
{{non-standard_inline}} CanvasRenderingContext2D.webkitLineDash
-
Use {{domxref("CanvasRenderingContext2D.getLineDash()")}} and {{domxref("CanvasRenderingContext2D.setLineDash()")}} instead.
-
{{non-standard_inline}} CanvasRenderingContext2D.webkitLineDashOffset
-
Use {{domxref("CanvasRenderingContext2D.lineDashOffset")}} instead.
-
{{non-standard_inline}} CanvasRenderingContext2D.webkitImageSmoothingEnabled
-
Use {{domxref("CanvasRenderingContext2D.imageSmoothingEnabled")}} instead.
-
- - - -
-
{{non-standard_inline}} CanvasRenderingContext2D.getContextAttributes()
-
Inspired by the same WebGLRenderingContext method it returns an Canvas2DContextAttributes object that contains the attributes "storage" to indicate which storage is used ("persistent" by default) and the attribute "alpha" (true by default) to indicate that transparency is used in the canvas.
-
{{non-standard_inline}} CanvasRenderingContext2D.isContextLost()
-
Inspired by the same WebGLRenderingContext method it returns true if the Canvas context has been lost, or false if not.
-
- -

WebKit only

- -
-
{{non-standard_inline}} CanvasRenderingContext2D.webkitBackingStorePixelRatio
-
The backing store size in relation to the canvas element. See High DPI Canvas.
-
{{non-standard_inline}} CanvasRenderingContext2D.webkitGetImageDataHD
-
Intended for HD backing stores, but removed from canvas specifications.
-
{{non-standard_inline}} CanvasRenderingContext2D.webkitPutImageDataHD
-
Intended for HD backing stores, but removed from canvas specifications.
-
- -
-
- -

Gecko only

- -
-
{{non-standard_inline}} {{domxref("CanvasRenderingContext2D.filter")}}
-
CSS and SVG filters as Canvas APIs. Likely to be standardized in a new version of the specification.
-
- -

Prefixed APIs

- -
-
{{non-standard_inline}} CanvasRenderingContext2D.mozCurrentTransform
-
Sets or gets the current transformation matrix, see {{domxref("CanvasRenderingContext2D.currentTransform")}}.  {{ gecko_minversion_inline("7.0") }}
-
{{non-standard_inline}} CanvasRenderingContext2D.mozCurrentTransformInverse
-
Sets or gets the current inversed transformation matrix.  {{ gecko_minversion_inline("7.0") }}
-
{{non-standard_inline}} CanvasRenderingContext2D.mozFillRule
-
The fill rule to use. This must be one of evenodd or nonzero (default).
-
{{non-standard_inline}} CanvasRenderingContext2D.mozImageSmoothingEnabled
-
See {{domxref("CanvasRenderingContext2D.imageSmoothingEnabled")}}.
-
{{non-standard_inline}} {{deprecated_inline}} CanvasRenderingContext2D.mozDash
-
An array which specifies the lengths of alternating dashes and gaps {{ gecko_minversion_inline("7.0") }}. Use {{domxref("CanvasRenderingContext2D.getLineDash()")}} and {{domxref("CanvasRenderingContext2D.setLineDash()")}} instead.
-
{{non-standard_inline}} {{deprecated_inline}} CanvasRenderingContext2D.mozDashOffset
-
Specifies where to start a dash array on a line. {{ gecko_minversion_inline("7.0") }}. Use {{domxref("CanvasRenderingContext2D.lineDashOffset")}} instead.
-
{{non-standard_inline}} {{deprecated_inline}} CanvasRenderingContext2D.mozTextStyle
-
Introduced in in Gecko 1.9, deprecated in favor of the {{domxref("CanvasRenderingContext2D.font")}} property.
-
{{non-standard_inline}} {{obsolete_inline}} CanvasRenderingContext2D.mozDrawText()
-
This method was introduced in Gecko 1.9 and is removed starting with Gecko 7.0. Use {{domxref("CanvasRenderingContext2D.strokeText()")}} or {{domxref("CanvasRenderingContext2D.fillText()")}} instead.
-
{{non-standard_inline}} {{obsolete_inline}} CanvasRenderingContext2D.mozMeasureText()
-
This method was introduced in Gecko 1.9 and is unimplemented starting with Gecko 7.0. Use {{domxref("CanvasRenderingContext2D.measureText()")}} instead.
-
{{non-standard_inline}} {{obsolete_inline}} CanvasRenderingContext2D.mozPathText()
-
This method was introduced in Gecko 1.9 and is removed starting with Gecko 7.0.
-
{{non-standard_inline}} {{obsolete_inline}} CanvasRenderingContext2D.mozTextAlongPath()
-
This method was introduced in Gecko 1.9 and is removed starting with Gecko 7.0.
-
- -

Internal APIs (chrome-context only)

- -
-
{{non-standard_inline}} {{domxref("CanvasRenderingContext2D.asyncDrawXULElement()")}}
-
Renders a region of a XUL element into the canvas.
-
{{non-standard_inline}} {{domxref("CanvasRenderingContext2D.drawWindow()")}}
-
Renders a region of a window into the canvas. The contents of the window's viewport are rendered, ignoring viewport clipping and scrolling.
-
{{non-standard_inline}} CanvasRenderingContext2D.demote()
-
This causes a context that is currently using a hardware-accelerated backend to fallback to a software one. All state should be preserved.
-
- -

Internet Explorer

- -
-
{{non-standard_inline}} CanvasRenderingContext2D.msFillRule
-
The fill rule to use. This must be one of evenodd or nonzero (default).
-
- -

Specifications

- - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('HTML WHATWG', "scripting.html#2dcontext:canvasrenderingcontext2d", "CanvasRenderingContext2D")}}{{Spec2('HTML WHATWG')}} 
- -

Browser compatibility

- -
{{CompatibilityTable}}
- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatChrome("1")}}{{CompatGeckoDesktop("1.8")}}{{CompatIE("9")}}{{CompatOpera("9")}}{{CompatSafari("2")}}
-
- -
- - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
-
- -

Compatibility notes

- - - -

See also

- - diff --git a/files/it/web/api/canvasrenderingcontext2d/ispointinpath/index.html b/files/it/web/api/canvasrenderingcontext2d/ispointinpath/index.html deleted file mode 100644 index cf3bdee573..0000000000 --- a/files/it/web/api/canvasrenderingcontext2d/ispointinpath/index.html +++ /dev/null @@ -1,208 +0,0 @@ ---- -title: CanvasRenderingContext2D.isPointInPath() -slug: Web/API/CanvasRenderingContext2D/isPointInPath -translation_of: Web/API/CanvasRenderingContext2D/isPointInPath ---- -
{{APIRef}}
- -

Il metodo CanvasRenderingContext2D.isPointInPath() delle API Canvas 2D controlla se un punto specificato cade all'interno del path corrente.

- -

Sintassi

- -
boolean ctx.isPointInPath(x, y);
-boolean ctx.isPointInPath(x, y, algorithmo);
-
-boolean ctx.isPointInPath(path, x, y);
-boolean ctx.isPointInPath(path, x, y, algoritmo);
-
- -

Parametri

- -
-
x
-
La coordinata X del punto da controllare
-
y
-
La coordinata Y del punto da controllare
-
Algoritmo
-
La'lgoritmo con cui viene verificato se il punto cade all'interno del path.
- Valori possibili: -
    -
  • "nonzero": La regola non-zero ,  valore predefinito.
    • -
  • "evenodd": La regola even-odd .
    • -
-
-
path
-
Il {{domxref("Path2D")}} path da usare come path corrente.
-
- -

Restituisce

- -
-
{{jsxref("Boolean")}}
-
-

Un Boolean, che sarà true (vero) se il punto cade all'interno della forma, altrimenti restitiusce false (falso).

-
-
- -

Esempi

- -

Uso del metodo isPointInPath

- -

Questa è una semplice snippet che usa il metodo isPointInPath per controllare se un punto cade o no sulla forma corrente.

- -

HTML

- -
<canvas id="canvas"></canvas>
-
- -

JavaScript

- -
var canvas = document.getElementById("canvas");
-var ctx = canvas.getContext("2d");
-
-ctx.rect(10, 10, 100, 100);
-ctx.stroke();
-console.log(ctx.isPointInPath(10, 10)); // true
-
- -

Modifica il codice qui sotto, e guarda live come cambia il canvas: per guardare i log apri la tua console

- - - -

{{ EmbedLiveSample('Playable_code', 700, 360) }}

- -

Specifiche

- - - - - - - - - - - - - - -
SpecificaStatoCommenti
{{SpecName('HTML WHATWG', "scripting.html#dom-context-2d-ispointinpath", "CanvasRenderingContext2D.isPointInPath")}}{{Spec2('HTML WHATWG')}} 
- -

Compatibilità Browser

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - -
CaratteristicaChromeFirefox (Gecko)Internet ExplorerOperaSafari
Supporto base{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
Parametro path{{ CompatVersionUnknown() }}{{ CompatGeckoDesktop(31) }}{{ CompatNo }}{{ CompatVersionUnknown() }}{{ CompatNo }}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
CaratteristicaAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Supporto base{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
Parametro path{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatGeckoMobile(31) }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
-
- -

Note di compatibilità

- - - -

Vedi anche

- - diff --git a/files/it/web/api/closeevent/index.html b/files/it/web/api/closeevent/index.html deleted file mode 100644 index 4d534f6858..0000000000 --- a/files/it/web/api/closeevent/index.html +++ /dev/null @@ -1,197 +0,0 @@ ---- -title: CloseEvent -slug: Web/API/CloseEvent -translation_of: Web/API/CloseEvent ---- -

{{APIRef("Websockets API")}}

- -

Un evento di tipo CloseEvent viene inviato al client tramite WebSockets in fase di chiusura della connessione. Questo viene ricevuto dal listener registrato sull'attributo onclose dell'oggetto di tipo WebSocket.

- -

Costruttore

- -
-
{{domxref("CloseEvent.CloseEvent", "CloseEvent()")}}
-
Crea un nuovo CloseEvent.
-
- -

Proprietà

- -
-
{{domxref("CloseEvent.code")}} {{readOnlyInline}}
-
Restituisce un unsigned short che contiene il codice di chiusura inviato dal server. Questi sono i valori ammessi. - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Status codeNameDescription
0–999 Riservati e non usati.
1000CLOSE_NORMALChiusura normale; la connessione si è conclusa normalmente, qualsiasi fosse il suo scopo.
1001CLOSE_GOING_AWAYL'endpoint se ne è andato, o per un errore del server oppure perché la pagina che ha aperto la connessione non è più attiva.
1002CLOSE_PROTOCOL_ERRORL'endpoint ha terminato la connessione per un errore di protocollo.
1003CLOSE_UNSUPPORTEDLa connessione è stata terminata perché l'endpoint ha ricevuto dei dati che non può accettare (per esempio, dati binari a fronte di un endpoint che consuma solo testo).
1004 Riservato. In futuro potrebbe esserne rivelato l'uso.
1005CLOSE_NO_STATUSRiservato. Indica che non è stato ricevuto nessuno stato di chiusura sebbene fosse atteso.
1006CLOSE_ABNORMALRiservato. Usato per indicare che la connessione è stata chiusa in modo anomalo (cioè, cioè senza l'invio del frame di chiusura) dove invece era atteso un codice di chiusura.
1007 L'endpoint ha terminato la connessione perché ha ricevuto un messaggio con dati inconsistenti (per esempio, dati non-UTF-8 all'interno di un messaggio testuale).
1008 L'endpoint ha terminato la connessione perché ha ricevuto un messaggio che viola la sua politica. E' un codice generico, quando 1003 e 1009 non sono adatti.
1009CLOSE_TOO_LARGEL'endpoint ha terminato la connessione perché ha ricevuto un frame di dati troppo grande.
1010 Il client ha terminato la connessione perché era attesa una negoziazione di una o più "estensioni" del protocollo che però non è avvenuta.
1011 Il server ha terminato la connessione perché ha incontrato una condizione inattesa che gli ha impedito di completare la richiesta.
1012–1014 Riservati per usi futuri dallo standard WebSocket.
1015 Riservato. Indica che la connessione è stata chiusa a causa di un fallimento dell'handshake TLS (per esempio, il certificato del server non può essere verificato).
1016–1999 Riservati per usi futuri dallo standard WebSocket.
2000–2999 Riservati per estensioni WebSocket.
3000–3999 Disponibili per librerie e framework. Meglio non usarli nelle applicazioni.
4000–4999 Disponibili per essere utilizzati dalle applicazioni.
-
-
{{domxref("CloseEvent.reason")}} {{readOnlyInline}}
-
Restituisce un {{ domxref("DOMString") }} che indica la ragione per cui il server ha chiuso la connessione. Questo dipende dal particolare server e sotto-protocollo.
-
{{domxref("CloseEvent.wasClean")}} {{readOnlyInline}}
-
Restituisce un {{jsxref("Boolean")}} che indica se la connessione è stata chiusa senza problemi o meno.
-
- -

 

- -

Compatibilità con i browser

- -

 

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{ CompatUnknown() }}{{ CompatGeckoDesktop("8.0") }} [1][2]{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{ CompatUnknown() }}{{ CompatGeckoMobile("8.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
-
- -

[1] Prima di Gecko 8.0 {{ geckoRelease("8.0") }}, Gecko inviava l'evento WebSocket {{event("close")}} come semplice evento. Il supporto al CloseEvent è stato implementato in Gecko 8.0.

- -

[2] Prima di Gecko 12.0 {{ geckoRelease("12.0") }}, Gecko restituiva il codice di chiusura CLOSE_NORMAL anche quando il canale veniva chiuso a causa di un errore inatteso, o anche a causa di un errore non coperto dalla specifica. Adesso viene restituito CLOSE_GOING_AWAY.

- -

Vedi anche

- - - -

 

diff --git a/files/it/web/api/console/index.html b/files/it/web/api/console/index.html deleted file mode 100644 index 61521af0f3..0000000000 --- a/files/it/web/api/console/index.html +++ /dev/null @@ -1,294 +0,0 @@ ---- -title: Console -slug: Web/API/Console -tags: - - API - - Debugging - - Interface - - NeedsTranslation - - Reference - - TopicStub - - console - - web console -translation_of: Web/API/Console ---- -
{{APIRef("Console API")}}
- -

The Console object provides access to the browser's debugging console (e.g. the Web Console in Firefox). The specifics of how it works varies from browser to browser, but there is a de facto set of features that are typically provided.

- -

The Console object can be accessed from any global object. {{domxref("Window")}} on browsing scopes and {{domxref("WorkerGlobalScope")}} as specific variants in workers via the property console. It's exposed as {{domxref("Window.console")}}, and can be referenced as simply console. For example:

- -
console.log("Failed to open the specified link")
- -

This page documents the {{anch("Methods")}} available on the Console object and gives a few {{anch("Usage")}} examples.

- -

{{AvailableInWorkers}}

- -

Methods

- -
-
{{domxref("Console.assert()")}}
-
Log a message and stack trace to console if the first argument is false.
-
{{domxref("Console.clear()")}}
-
Clear the console.
-
{{domxref("Console.count()")}}
-
Log the number of times this line has been called with the given label.
-
{{domxref("Console.countReset()")}}
-
Resets the value of the counter with the given label.
-
{{domxref("Console.debug()")}}
-
Outputs a message to the console with the log level "debug". -
Note: Starting with Chromium 58 this method only appears in Chromium browser consoles when level "Verbose" is selected.
-
-
{{domxref("Console.dir()")}}
-
Displays an interactive listing of the properties of a specified JavaScript object. This listing lets you use disclosure triangles to examine the contents of child objects.
-
{{domxref("Console.dirxml()")}}
-
-

Displays an XML/HTML Element representation of the specified object if possible or the JavaScript Object view if it is not possible.

-
-
{{domxref("Console.error()")}}
-
Outputs an error message. You may use string substitution and additional arguments with this method.
-
{{domxref("Console.exception()")}} {{Non-standard_inline}} {{deprecated_inline}}
-
An alias for error().
-
{{domxref("Console.group()")}}
-
Creates a new inline group, indenting all following output by another level. To move back out a level, call groupEnd().
-
{{domxref("Console.groupCollapsed()")}}
-
Creates a new inline group, indenting all following output by another level. However, unlike group() this starts with the inline group collapsed requiring the use of a disclosure button to expand it. To move back out a level, call groupEnd().
-
{{domxref("Console.groupEnd()")}}
-
Exits the current inline group.
-
{{domxref("Console.info()")}}
-
Informative logging of information. You may use string substitution and additional arguments with this method.
-
{{domxref("Console.log()")}}
-
For general output of logging information. You may use string substitution and additional arguments with this method.
-
{{domxref("Console.profile()")}} {{Non-standard_inline}}
-
Starts the browser's built-in profiler (for example, the Firefox performance tool). You can specify an optional name for the profile.
-
{{domxref("Console.profileEnd()")}} {{Non-standard_inline}}
-
Stops the profiler. You can see the resulting profile in the browser's performance tool (for example, the Firefox performance tool).
-
{{domxref("Console.table()")}}
-
Displays tabular data as a table.
-
{{domxref("Console.time()")}}
-
Starts a timer with a name specified as an input parameter. Up to 10,000 simultaneous timers can run on a given page.
-
{{domxref("Console.timeEnd()")}}
-
Stops the specified timer and logs the elapsed time in seconds since it started.
-
{{domxref("Console.timeLog()")}}
-
Logs the value of the specified timer to the console.
-
{{domxref("Console.timeStamp()")}} {{Non-standard_inline}}
-
Adds a marker to the browser's Timeline or Waterfall tool.
-
{{domxref("Console.trace()")}}
-
Outputs a stack trace.
-
{{domxref("Console.warn()")}}
-
Outputs a warning message. You may use string substitution and additional arguments with this method.
-
- -

Usage

- -

Outputting text to the console

- -

The most frequently-used feature of the console is logging of text and other data. There are four categories of output you can generate, using the {{domxref("console.log()")}}, {{domxref("console.info()")}}, {{domxref("console.warn()")}}, and {{domxref("console.error()")}} methods respectively. Each of these results in output styled differently in the log, and you can use the filtering controls provided by your browser to only view the kinds of output that interest you.

- -

There are two ways to use each of the output methods; you can simply pass in a list of objects whose string representations get concatenated into one string, then output to the console, or you can pass in a string containing zero or more substitution strings followed by a list of objects to replace them.

- -

Outputting a single object

- -

The simplest way to use the logging methods is to output a single object:

- -
var someObject = { str: "Some text", id: 5 };
-console.log(someObject);
-
- -

The output looks something like this:

- -
[09:27:13.475] ({str:"Some text", id:5})
- -

Outputting multiple objects

- -

You can also output multiple objects by simply listing them when calling the logging method, like this:

- -
var car = "Dodge Charger";
-var someObject = { str: "Some text", id: 5 };
-console.info("My first car was a", car, ". The object is:", someObject);
- -

This output will look like this:

- -
[09:28:22.711] My first car was a Dodge Charger . The object is: ({str:"Some text", id:5})
-
- -

Using string substitutions

- -

Gecko 9.0 {{geckoRelease("9.0")}} introduced support for string substitutions. When passing a string to one of the console object's methods that accepts a string, you may use these substitution strings:

- - - - - - - - - - - - - - - - - - - - - - - - -
Substitution stringDescription
%o or %OOutputs a JavaScript object. Clicking the object name opens more information about it in the inspector.
%d or %iOutputs an integer. Number formatting is supported, for example  console.log("Foo %.2d", 1.1) will output the number as two significant figures with a leading 0: Foo 01
%sOutputs a string.
%fOutputs a floating-point value. Formatting is supported, for example  console.log("Foo %.2f", 1.1) will output the number to 2 decimal places: Foo 1.10
- -
-

Note: Precision formatting doesn't work in Chrome

-
- -

Each of these pulls the next argument after the format string off the parameter list. For example:

- -
for (var i=0; i<5; i++) {
-  console.log("Hello, %s. You've called me %d times.", "Bob", i+1);
-}
-
- -

The output looks like this:

- -
[13:14:13.481] Hello, Bob. You've called me 1 times.
-[13:14:13.483] Hello, Bob. You've called me 2 times.
-[13:14:13.485] Hello, Bob. You've called me 3 times.
-[13:14:13.487] Hello, Bob. You've called me 4 times.
-[13:14:13.488] Hello, Bob. You've called me 5 times.
-
- -

Styling console output

- -

You can use the %c directive to apply a CSS style to console output:

- -
console.log("This is %cMy stylish message", "color: yellow; font-style: italic; background-color: blue;padding: 2px");
- -
The text before the directive will not be affected, but the text after the directive will be styled using the CSS declarations in the parameter.
- -
 
- -
- -
 
- -
-

Note: Quite a few CSS properties are supported by this styling; you should experiment and see which ones prove useful.

-
- -
 
- -
{{h3_gecko_minversion("Using groups in the console", "9.0")}}
- -

You can use nested groups to help organize your output by visually combining related material. To create a new nested block, call console.group(). The console.groupCollapsed() method is similar but creates the new block collapsed, requiring the use of a disclosure button to open it for reading.

- -
Note: Collapsed groups are not supported yet in Gecko; the groupCollapsed() method is the same as group() at this time.
- -

To exit the current group, simply call console.groupEnd(). For example, given this code:

- -
console.log("This is the outer level");
-console.group();
-console.log("Level 2");
-console.group();
-console.log("Level 3");
-console.warn("More of level 3");
-console.groupEnd();
-console.log("Back to level 2");
-console.groupEnd();
-console.debug("Back to the outer level");
-
- -

The output looks like this:

- -

nesting.png

- -
{{h3_gecko_minversion("Timers", "10.0")}}
- -

In order to calculate the duration of a specific operation, Gecko 10 introduced the support of timers in the console object. To start a timer, call the console.time() method, giving it a name as the only parameter. To stop the timer, and to get the elapsed time in milliseconds, just call the console.timeEnd() method, again passing the timer's name as the parameter. Up to 10,000 timers can run simultaneously on a given page.

- -

For example, given this code:

- -
console.time("answer time");
-alert("Click to continue");
-console.timeLog("answer time");
-alert("Do a bunch of other stuff...");
-console.timeEnd("answer time");
-
- -

Will log the time needed by the user to dismiss the alert box, log the time to the console, wait for the user to dismiss the second alert, and then log the ending time to the console:

- -

timerresult.png

- -

Notice that the timer's name is displayed both when the timer is started and when it's stopped.

- -
Note: It's important to note that if you're using this to log the timing for network traffic, the timer will report the total time for the transaction, while the time listed in the network panel is just the amount of time required for the header. If you have response body logging enabled, the time listed for the response header and body combined should match what you see in the console output.
- -

Stack traces

- -

The console object also supports outputting a stack trace; this will show you the call path taken to reach the point at which you call {{domxref("console.trace()")}}. Given code like this:

- -
function foo() {
-  function bar() {
-    console.trace();
-  }
-  bar();
-}
-
-foo();
-
- -

The output in the console looks something like this:

- -

- -

Specifications

- - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('Console API')}}{{Spec2('Console API')}}Initial definition.
- -

Browser compatibility

- - - -

{{Compat("api.Console")}}

- -

Notes

- - - -

See also

- - - -

Other implementations

- - diff --git a/files/it/web/api/console/log/index.html b/files/it/web/api/console/log/index.html deleted file mode 100644 index 4229185824..0000000000 --- a/files/it/web/api/console/log/index.html +++ /dev/null @@ -1,88 +0,0 @@ ---- -title: console.log() -slug: Web/API/Console/log -translation_of: Web/API/Console/log ---- -
{{APIRef("Console API")}}
- -

Il metodo  log() di {{domxref("Console")}} stampa un messaggio sulla web console. Il messaggio può essere una semplice stringa (opzionalmente, anche con valori sostituibili), o può essere uno qualsiasi o più oggetti JavaScript.

- -

{{AvailableInWorkers}}

- -

Sintassi

- -
console.log(obj1 [, obj2, ..., objN]);
-console.log(msg [, subst1, ..., substN]);
-
- -

Parametri

- -
-
obj1 ... objN
-
Una lista di oggetti JavaScript da stampare. La rappresentazione sotto forma di stringa di ciascuno di questi oggetti sarà messa in coda nell'ordine presentato e stampata. Perfavore fai attenzione che se tu stampi degli oggetti nelle ultime versioni si Chrome e Firefox quello che otterrai sarà un riferimento all'oggetto, che non necessariamente è il 'valore' dell'oggetto nel momento della chiamata di console.log(), ma è il valore dell'oggetto al momento in cui tu apri la console.
-
msg
-
Una stringa JavaScript contenente zero o più stringhe da sostituire.
-
subst1 ... substN
-
Oggetti JavaScript con i quali verranno sostituite le stringhe da sostituire in msg. Questo ti offre controlli aggiuntivi sul formato dell'output
-
- -

Vedi Stampare del testo sulla Console nella documentazione di {{domxref("console")}} per maggiori dettagli.

- -

Differenza tra log() e dir()

- -

Ti potresti esser chiesto qual è la differenza tra {{domxref("console.dir()")}} e console.log().

- -

Un'altra utile differenza esiste in Chrome quando invii elementi DOM alla console.

- -

- -

Nota bene:

- - - -

Specificamente, console.log offre un trattamento speciale agli elementi del DOM, mentre console.dir non lo fa. Ė spesso utile quando si prova a vedere la rappresentazione completa degli oggetti JS del DOM.

- -

Ulteriori informazioni si possono trovare sulle Chrome Console API reference su questa e altre funzioni.

- -

Registrare (loggare) gli oggetti

- -

Non usare console.log(obj), usa console.log(JSON.parse(JSON.stringify(obj))).

- -

In questo modo sarai sicuro di visulizzare il valore di obj al momento in cui lo stai registrando (loggando). Altrimenti, svariati browser offrono una vista live che aggiorna costantemente i valori non appena cambiano. Potrebbe non essere quel che cerchi.

- -

Specifiche

- - - - - - - - - - - - - - - - -
SpecificheStatoCommento
{{SpecName("Console API", "#log", "console.log()")}}{{Spec2("Console API")}}Definizione iniziale
- -

Compatibilità con i browser

- - - -

{{Compat("api.Console.log")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/console/table/index.html b/files/it/web/api/console/table/index.html deleted file mode 100644 index d2ae5bbce2..0000000000 --- a/files/it/web/api/console/table/index.html +++ /dev/null @@ -1,143 +0,0 @@ ---- -title: Console.table() -slug: Web/API/Console/table -translation_of: Web/API/Console/table ---- -
 {{APIRef("Console API")}}
- -

Visualizza dati tabulari come una tabella.

- -

Questa funzione richiede un argomento obbligatorio data, che deve essere un array di oggetti, ed un parametro opzionale columns.

- -

La funzione visualizza data come una tabella ed ogni elemento dell'array (o ogni sua proprietà numerabile se data è un oggetto) sarà una riga della tabella.

- -

La prima colonna della tabella rappresenta l'etichetta (index). Se data è un array allora il valore sarà il suo indice nell'array. Se, invece, data è un oggetto, il suo valore sarà il nome della proprietà. Nota che (in Firefox) console.table limita a 1000 la visualizzazione delle righe (la prima riga contiene i nomi delle etichette).

- -

{{AvailableInWorkers}}

- -

Collezioni di tipi di primitive

- -

L'argomento data può essere un array o un oggetto.

- -
// array di stringhe
-
-console.table(["apples", "oranges", "bananas"]);
- -

- -
// un oggetto le cui proprietà sono stringhe
-
-function Person(firstName, lastName) {
-  this.firstName = firstName;
-  this.lastName = lastName;
-}
-
-var me = new Person("John", "Smith");
-
-console.table(me);
- -

- -

Collezioni di tipi composti

- -

Se l'elemento nell'array o le proprietà nell'oggetto sono a loro volta array o oggetti, allora i loro elementi o proprietà sono enumerati nella riga, uno per colonna:

- -
// un array di arrays
-
-var people = [["John", "Smith"], ["Jane", "Doe"], ["Emily", "Jones"]]
-console.table(people);
- -

Table displaying array of arrays

- -
// un array di oggetti
-
-function Person(firstName, lastName) {
-  this.firstName = firstName;
-  this.lastName = lastName;
-}
-
-var john = new Person("John", "Smith");
-var jane = new Person("Jane", "Doe");
-var emily = new Person("Emily", "Jones");
-
-console.table([john, jane, emily]);
- -

Nota che se l'array contiene oggetti, allora le colonne sono etichettate con il nome della proprietà.

- -

Table displaying array of objects

- -
// un oggetto le cui proprietà sono oggetti
-
-var family = {};
-
-family.mother = new Person("Jane", "Smith");
-family.father = new Person("John", "Smith");
-family.daughter = new Person("Emily", "Smith");
-
-console.table(family);
- -

Table displaying object of objects

- -

Restringimento delle colonne visualizzate

- -

Di default, console.table() visualizza la lista di elementi in ogni riga. Puoi usare il parametro opzionale columns per selezionare un sottoinsieme delle colonne da visualizzare:

- -
// un array di oggetti, visualizzando solo firstName
-
-function Person(firstName, lastName) {
-  this.firstName = firstName;
-  this.lastName = lastName;
-}
-
-var john = new Person("John", "Smith");
-var jane = new Person("Jane", "Doe");
-var emily = new Person("Emily", "Jones");
-
-console.table([john, jane, emily], ["firstName"]);
- -

Table displaying array of objects with filtered output

- -

Ordinamento delle colonne

- -

Puoi ordinare la tabella in base ad una particolare colonna cliccando sulla sua etichetta.

- -

Sintassi

- -
console.table(data [, columns]);
-
- -

Parametri

- -
-
data
-
Il dato da visualizzare. Deve essere un oggetto o un array.
-
columns
-
Un array contenente i nomi delle colonne da includere nell'output.
-
- -

Specifiche

- - - - - - - - - - - - - - - - -
SpecificheStatoCommenti
{{SpecName("Console API", "#table", "console.table()")}}{{Spec2("Console API")}}Initial definition
- -

Compatibilità dei browser

- -
- - -

{{Compat("api.Console.table")}}

-
diff --git a/files/it/web/api/crypto/index.html b/files/it/web/api/crypto/index.html deleted file mode 100644 index 0add9721d2..0000000000 --- a/files/it/web/api/crypto/index.html +++ /dev/null @@ -1,68 +0,0 @@ ---- -title: Crypto -slug: Web/API/Crypto -tags: - - API - - Interface - - NeedsTranslation - - Reference - - TopicStub - - Web Crypto API -translation_of: Web/API/Crypto ---- -

{{APIRef("Web Crypto API")}}

- -

The Crypto interface represents basic cryptography features available in the current context. It allows access to a cryptographically strong random number generator and to cryptographic primitives.

- -

An object with this interface is available on Web context via the {{domxref("Window.crypto")}} property.

- -

Properties

- -

This interface implements properties defined on {{domxref("RandomSource")}}.

- -
-
{{domxref("Crypto.subtle")}} {{experimental_inline}}{{readOnlyInline}}
-
Returns a {{domxref("SubtleCrypto")}} object providing access to common cryptographic primitives, like hashing, signing, encryption or decryption.
-
- -

Methods

- -

This interface implements methods defined on {{domxref("RandomSource")}}.

- -
-
{{domxref("Crypto.getRandomValues()")}}
-
Fills the passed {{ jsxref("TypedArray") }} with cryptographically sound random values.
-
- -

Specifications

- - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName("Web Crypto API", "#crypto-interface", "Crypto")}}{{Spec2("Web Crypto API")}}Initial definition
- -

Browser Compatibility

- -
- - -

{{Compat("api.Crypto")}}

-
- -

See Also

- - diff --git a/files/it/web/api/crypto/subtle/index.html b/files/it/web/api/crypto/subtle/index.html deleted file mode 100644 index ae850ea329..0000000000 --- a/files/it/web/api/crypto/subtle/index.html +++ /dev/null @@ -1,52 +0,0 @@ ---- -title: Crypto.subtle -slug: Web/API/Crypto/subtle -tags: - - API - - Crittografia - - D - - Proprietà - - Riferimenti - - Sola lettura - - Web Crypto API -translation_of: Web/API/Crypto/subtle ---- -

{{APIRef("Web Crypto API")}}

- -

La proprietà in sola lettura Crypto.subtle restituisce un oggetto {{domxref("SubtleCrypto")}}, rendendo disponibili le funzioni crittografiche.

- -

Syntax

- -
var crypto = crypto.subtle;
- -

Specifications

- - - - - - - - - - - - - - -
SpecificationStatusComment
{{ SpecName('Web Crypto API', '#dfn-Crypto', 'Crypto.subtle') }}{{ Spec2('Web Crypto API') }}Definizione iniziale.
- -

Browser compatibility

- - - -

{{Compat("api.Crypto.subtle")}}

- -

See also

- - diff --git a/files/it/web/api/datatransfer/getdata/index.html b/files/it/web/api/datatransfer/getdata/index.html deleted file mode 100644 index 635da432ed..0000000000 --- a/files/it/web/api/datatransfer/getdata/index.html +++ /dev/null @@ -1,161 +0,0 @@ ---- -title: DataTransfer.getData() -slug: Web/API/DataTransfer/getData -translation_of: Web/API/DataTransfer/getData ---- -
-

 

-{{APIRef("HTML DOM")}}
- -

Il metodo DataTransfer.getData() recupera i dati del trascinamento  (come {{domxref("DOMString")}}) per il data type specificato. Se l'operazione di trascinamento non include dati, questo metodo restituisce una stringa vuota.

- -

Esempi di tipi di data types sono text/plain e text/uri-list.

- -

Sintassi

- -
DOMString dataTransfer.getData(format);
-
- -

Argomenti

- -
-
formato
-
Una {{domxref("DOMString")}} rappresentante il  tipo di dato da recuperare.
-
- -

Valore restituito

- -
-
{{domxref("DOMString")}}
-
Una {{domxref("DOMString")}} rappresentante i dati trascinati per il formato specificato. Se l'operazione di trascinamento non ha dati o l'operazione non ha dati per il formato specificato, questo metodo restituisce una stringa vuota.
-
- -

Esempio

- -

Questo esempio mostra l'uso dell'oggetto {{domxref("DataTransfer")}} e dei metodi {{domxref("DataTransfer.getData()","getData()")}} e {{domxref("DataTransfer.setData()","setData()")}} .

- -

HTML

- -
<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)">
-    <span id="drag" draggable="true" ondragstart="drag(event)">drag me to the other box</span>
-</div>
-<div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
-
- -

CSS

- -
#div1, #div2 {
-    width:100px;
-    height:50px;
-    padding:10px;
-    border:1px solid #aaaaaa;
-}
-
- -

JavaScript

- -
function allowDrop(allowdropevent) {
-    allowdropevent.target.style.color = 'blue';
-    allowdropevent.preventDefault();
-}
-
-function drag(dragevent) {
-    dragevent.dataTransfer.setData("text", dragevent.target.id);
-    dragevent.target.style.color = 'green';
-}
-
-function drop(dropevent) {
-    dropevent.preventDefault();
-    var data = dropevent.dataTransfer.getData("text");
-    dropevent.target.appendChild(document.getElementById(data));
-    document.getElementById("drag").style.color = 'black';
-}
-
- -

Result

- -

{{ EmbedLiveSample('Esempio', 600, '', '', 'Web/API/DataTransfer/getData') }}

- -

Specifiche

- - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName("HTML WHATWG", "interaction.html#dom-datatransfer-getdata", "getData()")}}{{Spec2("HTML WHATWG")}} 
{{SpecName("HTML5.1", "editing.html#dom-datatransfer-getdata", "getData()")}}{{Spec2("HTML5.1")}}definizione iniziale
- -

Compatibilità dei browser

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support43.5{{CompatGeckoDesktop(10)}} [1]123.1
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidAndroid WebviewChrome for AndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari Mobile
Basic support{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatGeckoMobile(10)}}[1]{{CompatNo}}{{CompatIE("10")}}{{CompatNo}}{{CompatNo}}
-
- -

[1] in versioni di Firefox precedenti alla 49, questo metodo restituisce sempre una lista vuota se il tipo mime non è in una white list.

- -

Vedere anche

- -

{{page("/en-US/docs/Web/API/DataTransfer", "See also")}}

diff --git a/files/it/web/api/datatransfer/index.html b/files/it/web/api/datatransfer/index.html deleted file mode 100644 index a821dabb6a..0000000000 --- a/files/it/web/api/datatransfer/index.html +++ /dev/null @@ -1,183 +0,0 @@ ---- -title: DataTransfer -slug: Web/API/DataTransfer -tags: - - API - - NeedsMarkupWork - - NeedsTranslation - - Reference - - TopicStub - - Web Development - - drag and drop -translation_of: Web/API/DataTransfer ---- -
{{APIRef("HTML Drag and Drop API")}}
- -

The DataTransfer object is used to hold the data that is being dragged during a drag and drop operation. It may hold one or more data items, each of one or more data types. For more information about drag and drop, see HTML Drag and Drop API.

- -

This object is available from the {{domxref("DragEvent.dataTransfer","dataTransfer")}} property of all {{domxref("DragEvent","drag events")}}. It cannot be created separately (i.e. there is no constructor for this object).

- -

Properties

- -

Standard properties

- -
-
{{domxref("DataTransfer.dropEffect")}}
-
Gets the type of drag-and-drop operation currently selected or sets the operation to a new type. The value must be none copy link or move.
-
{{domxref("DataTransfer.effectAllowed")}}
-
Provides all of the types of operations that are possible. Must be one of none, copy, copyLink, copyMove, link, linkMove, move, all or uninitialized.
-
{{domxref("DataTransfer.files")}}
-
Contains a list of all the local files available on the data transfer. If the drag operation doesn't involve dragging files, this property is an empty list.
-
{{domxref("DataTransfer.items")}} {{readonlyInline}}
-
Gives a {{domxref("DataTransferItemList")}} object which is a list of all of the drag data.
-
{{domxref("DataTransfer.types")}} {{readonlyInline}}
-
An array of {{domxref("DOMString","string")}} giving the formats that were set in the {{event("dragstart")}} event.
-
- -

Gecko properties

- -

{{SeeCompatTable}}

- -
Note: All of the properties in this section are Gecko-specific.
- -
-
{{domxref("DataTransfer.mozCursor")}}
-
Gives the drag cursor's state. This is primarily used to control the cursor during tab drags.
-
{{domxref("DataTransfer.mozItemCount")}} {{readonlyInline}}
-
Gives the number of items in the drag operation.
-
{{domxref("DataTransfer.mozSourceNode")}} {{readonlyInline}}
-
The {{ domxref("Node") }} over which the mouse cursor was located when the button was pressed to initiate the drag operation. This value is null for external drags or if the caller can't access the node.
-
{{domxref("DataTransfer.mozUserCancelled")}} {{readonlyInline}}
-
This property applies only to the dragend event, and is true if the user canceled the drag operation by pressing escape. It will be false in all other cases, including if the drag failed for any other reason, for instance due to a drop over an invalid location.
-
- -

Methods

- -

Standard methods

- -
-
{{domxref("DataTransfer.clearData()")}}
-
Remove the data associated with a given type. The type argument is optional. If the type is empty or not specified, the data associated with all types is removed. If data for the specified type does not exist, or the data transfer contains no data, this method will have no effect.
-
{{domxref("DataTransfer.getData()")}}
-
Retrieves the data for a given type, or an empty string if data for that type does not exist or the data transfer contains no data.
-
{{domxref("DataTransfer.setData()")}}
-
Set the data for a given type. If data for the type does not exist, it is added at the end, such that the last item in the types list will be the new format. If data for the type already exists, the existing data is replaced in the same position.
-
{{domxref("DataTransfer.setDragImage()")}}
-
Set the image to be used for dragging if a custom one is desired.
-
- -

Gecko methods

- -

{{SeeCompatTable}}

- -
Note: All of the methods in this section are Gecko-specific.
- -
-
{{domxref("DataTransfer.addElement()")}}
-
Sets the drag source to the given element.
-
{{domxref("DataTransfer.mozClearDataAt()")}}
-
Removes the data associated with the given format for an item at the specified index. The index is in the range from zero to the number of items minus one.
-
{{domxref("DataTransfer.mozGetDataAt()")}}
-
Retrieves the data associated with the given format for an item at the specified index, or null if it does not exist. The index should be in the range from zero to the number of items minus one.
-
{{domxref("DataTransfer.mozSetDataAt()")}}
-
A data transfer may store multiple items, each at a given zero-based index. mozSetDataAt() may only be called with an index argument less than mozItemCount in which case an existing item is modified, or equal to mozItemCount in which case a new item is added, and the mozItemCount is incremented by one.
-
{{domxref("DataTransfer.mozTypesAt()")}}
-
Holds a list of the format types of the data that is stored for an item at the specified index. If the index is not in the range from 0 to the number of items minus one, an empty string list is returned.
-
- -

Example

- -

Every method and property listed in this document has its own reference page and each reference page either directly includes an example of the interface or has a link to an example.

- -

Specifications

- - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('HTML WHATWG', 'interaction.html#datatransfer','DataTransfer')}}{{Spec2('HTML WHATWG')}}mozCursor, mozItemCount, mozSourceNode, mozUserCancelled, addElement(), mozClearDataAt(), mozGetDataAt(), mozSetDataAt() and mozTypesAt are Gecko specific.
{{SpecName('HTML5.1', 'editing.html#the-datatransfer-interface','DataTransfer')}}{{Spec2('HTML5.1')}}Not included in W3C HTML5 {{Spec2('HTML5 W3C')}}
- -

Browser compatibility

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support43.5 [2]10 [1] [2]123.1 [2]
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidAndroid WebviewChrome for AndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari Mobile
Basic support{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatIE("10")}}{{CompatNo}}{{CompatNo}}
-
- -

[1]Partial support refers to not supporting {{domxref("DataTransfer.setDragImage()")}} [CanIUse.com]

- -

[2]Does not support {{domxref("DataTransfer.items")}} property

- -

See also

- - diff --git a/files/it/web/api/document/anchors/index.html b/files/it/web/api/document/anchors/index.html deleted file mode 100644 index 2b7261420d..0000000000 --- a/files/it/web/api/document/anchors/index.html +++ /dev/null @@ -1,31 +0,0 @@ ---- -title: document.anchors -slug: Web/API/Document/anchors -translation_of: Web/API/Document/anchors ---- -
{{APIRef("DOM")}}
- -

anchors restituisce un Array contenente tutte le ancore presenti nel documento.

- -

Sintassi

- -
nodeList = document.anchors
-
- -

Esempio

- -
if ( document.anchors.length >= 5 ) {
-    dump("Ho trovato troppe ancore");
-    window.location = "http://www.google.com";
-}
-
- -

Note

- -

Per ragioni di compatibilità all'indietro, l'array restituito contiene solo le ancore che hanno un attributo name e non quelle che hanno solo l'attributo id.

- -

Specifiche

- -

DOM Level 2 HTML: anchors

- -

{{ languages( { "ja": "ja/DOM/document.anchors", "pl": "pl/DOM/document.anchors" } ) }}

diff --git a/files/it/web/api/document/applets/index.html b/files/it/web/api/document/applets/index.html deleted file mode 100644 index 47328fbe65..0000000000 --- a/files/it/web/api/document/applets/index.html +++ /dev/null @@ -1,25 +0,0 @@ ---- -title: document.applets -slug: Web/API/Document/applets -translation_of: Web/API/Document/applets ---- -
{{APIRef("DOM")}}
- -

applets restituisce un array contenente le applet presenti nel documento.

- -

Sintassi

- -
nodeList = document.applets
-
- -

Esempio

- -
// ( voglio la seconda applet )
-la_mia_applet_java = document.applets[1];
-
- -

Specifiche

- -

DOM Level 2 HTML: applets

- -

{{ languages( { "pl": "pl/DOM/document.applets" } ) }}

diff --git a/files/it/web/api/document/body/index.html b/files/it/web/api/document/body/index.html deleted file mode 100644 index e13f8e1400..0000000000 --- a/files/it/web/api/document/body/index.html +++ /dev/null @@ -1,88 +0,0 @@ ---- -title: Document.body -slug: Web/API/Document/body -tags: - - API - - DOM - - HTML DOM - - Proprietà - - Referenza -translation_of: Web/API/Document/body ---- -
{{APIRef("DOM")}}
- -

La proprietà Document.body rappresenta il nodo {{HTMLElement("body")}} o {{HTMLElement("frameset")}} del documento corrente, o null se non esiste alcun elemento di questo tipo.

- -

Sintassi

- -
var objRef = document.body;
-document.body = objRef;
- -

Esempio

- -
// Dato questo HTML: <body id="oldBodyElement"></body>
-alert(document.body.id); // "oldBodyElement"
-
-var aNewBodyElement = document.createElement("body");
-
-aNewBodyElement.id = "newBodyElement";
-document.body = aNewBodyElement;
-alert(document.body.id); // "newBodyElement"
-
- -

Appunti

- -

document.body è l'elemento che contiene il contenuto per il documento. Nei documenti con contenuto <body> restituisce l'elemento <body>, e nei documenti frameset, restituisce l'elemento <frameset> più esterno.

- -

Anche se body è settabile, l'impostazione di un nuovo corpo su un documento rimuoverà efficacemente tutti i figli attuali dell'elemento <body>.

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('HTML WHATWG','dom.html#dom-document-body','Document.body')}}{{Spec2('HTML WHATWG')}} 
{{SpecName('HTML5.1','dom.html#dom-document-body','Document.body')}}{{Spec2('HTML5.1')}} 
{{SpecName('HTML5 W3C','dom.html#dom-document-body','Document.body')}}{{Spec2('HTML5 W3C')}} 
{{SpecName('DOM2 HTML','html.html#ID-56360201','Document.body')}}{{Spec2('DOM2 HTML')}} 
{{SpecName('DOM1','level-one-html.html#attribute-body','Document.body')}}{{Spec2('DOM1')}}Definizione iniziale.
- -

Compatibilità con i browser

- - - -
{{Compat("api.Document.body")}}
- -

Vedi anche

- - diff --git a/files/it/web/api/document/characterset/index.html b/files/it/web/api/document/characterset/index.html deleted file mode 100644 index e2062ac971..0000000000 --- a/files/it/web/api/document/characterset/index.html +++ /dev/null @@ -1,32 +0,0 @@ ---- -title: document.characterSet -slug: Web/API/Document/characterSet -translation_of: Web/API/Document/characterSet ---- -
{{APIRef("DOM")}}
- -

Restituisce la codifica dei caratteri utilizzata per il documento corrente.

- -

Sintassi

- -
stringa = document.characterSet
-
- -

Esempio

- -
<button onclick="alert(document.characterSet);"
->Mostra il set di caratteri</button>
-// restituisce il set di caratteri, come "ISO-8859-1" o "UTF-8"
-
- -

Note

- -

La codifica dei caratteri è il set di caratteri utilizzato per visualizzare il documento, che potrebbe essere differente dalla codifica specificata nella pagina (l'utente può reimpostare la codifica da utilizzare).

- -

Per un elenco completo delle codifiche, si veda: http://www.iana.org/assignments/character-sets.

- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

- -

{{ languages( { "pl": "pl/DOM/document.characterSet" } ) }}

diff --git a/files/it/web/api/document/close/index.html b/files/it/web/api/document/close/index.html deleted file mode 100644 index bc86c7bacc..0000000000 --- a/files/it/web/api/document/close/index.html +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: document.close -slug: Web/API/Document/close -translation_of: Web/API/Document/close ---- -
{{APIRef("DOM")}}
- -

document.close() termina la scrittura su un documento che è stato aperto con document.open().

- -

Sintassi

- -
document.close();
-
- -

Esempio

- -
// apro un documento per scrivervi sopra;
-// scrivo il contenuto sul documento;
-// chiudo il documento.
-document.open();
-document.write("<p>Testo da inserire...</p>");
-document.close();
-
- -

Specifiche

- -

DOM Level 2 HTML: close() Method

diff --git a/files/it/web/api/document/createelement/index.html b/files/it/web/api/document/createelement/index.html deleted file mode 100644 index 649ba72fb3..0000000000 --- a/files/it/web/api/document/createelement/index.html +++ /dev/null @@ -1,139 +0,0 @@ ---- -title: Document.createElement() -slug: Web/API/Document/createElement -tags: - - API - - DOM - - Document - - Referenza - - createElement - - metodo -translation_of: Web/API/Document/createElement ---- -
{{APIRef("DOM")}}
- -

In un documento HTML, il metodo document.createElement() crea l'elemento HTML specificato da tagName o un {{domxref("HTMLUnknownElement")}} se tagName non viene riconosciuto.

- -
-

Note: In un documento XUL, crea l'elemento XUL specificato. In altri documenti, crea un elemento con un URI namespace null.

-
- -

Sintassi

- -
var element = document.createElement(tagName[, options]);
-
- -

Parametri

- -
-
tagName
-
Una stringa che specifica il tipo di elemento da creare. Il {{domxref("Node.nodeName", "nodeName")}} dell'elemento creato viene inizializzato con il valore di tagName. Non utilizzare nomi qualificati (come "html:a") con questo metodo. Quando chiamato su un documento HTML, createElement() converte tagName in minuscolo prima di creare l'elemento. In Firefox, Opera e Chrome, createElement(null) funziona come createElement("null").
-
options{{optional_inline}}
-
Un oggetto ElementCreationOptions opzionale contenente una singola proprietà denominata is, il cui valore è il nome del tag per un elemento personalizzato precedentemente definito utilizzando customElements.define(). Vedi {{anch("Esempio di componente Web")}} per ulteriori dettagli.
-
- -

Valore di ritorno

- -

Il nuovo {{domxref("Element")}}.

- -

Esempi

- -

Esempio basilare

- -

Questo crea un nuovo <div> e lo inserisce prima dell'elemento con l'ID "div1".

- -

HTML

- -
<!DOCTYPE html>
-<html>
-<head>
-  <title>||Lavorare con gli elementi||</title>
-</head>
-<body>
-  <div id="div1">Il testo sopra è stato creato dinamicamente.</div>
-</body>
-</html>
-
- -

JavaScript

- -
document.body.onload = addElement;
-
-function addElement() {
-  // crea un nuovo elemento div
-  var newDiv = document.createElement("div");
-  // ed assegnargli un contenuto
-  var newContent = document.createTextNode("Hi there and greetings!");
-  // aggiungi il nodo di testo al div appena creato
-  newDiv.appendChild(newContent);
-
-  // aggiungi l'elemento appena creato e il suo contenuto nel DOM
-  var currentDiv = document.getElementById("div1");
-  document.body.insertBefore(newDiv, currentDiv);
-}
- -

{{EmbedLiveSample("Esempio_basilare", 500, 50)}}

- -

Esempio di componente Web

- -

Il seguente frammento di esempio è tratto dal nostro esempio di componente di espansione list-web (vedi anche live). In questo caso, il nostro elemento personalizzato estende {{domxref("HTMLUListElement")}}, che rappresenta l'elemento {{htmlelement("ul")}}.

- -
// Crea una classe per l'elemento
-class ExpandingList extends HTMLUListElement {
-  constructor() {
-    // Chiama sempre super prima nel costruttore
-    super();
-
-    // definizione del costruttore lasciata fuori per brevità
-    ...
-  }
-}
-
-// Definisce il nuovo elemento
-customElements.define('expanding-list', ExpandingList, { extends: "ul" });
- -

Se volessimo creare un'istanza di questo elemento a livello di codice, utilizzeremmo una chiamata seguendo le linee seguenti:

- -
let expandingList = document.createElement('ul', { is : 'expanding-list' })
- -

Al nuovo elemento verrà assegnato un attributo is il cui valore è il nome del tag dell'elemento personalizzato.

- -
-

Note: Per la retrocompatibilità con le versioni precedenti della specifica Elementi personalizzati, alcuni browser ti permetteranno di passare una stringa qui invece di un oggetto, dove il valore della stringa è il nome del tag dell'elemento personalizzato.

-
- -

Specifiche

- - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', "#dom-document-createelement", "Document.createElement")}}{{Spec2('DOM WHATWG')}} 
- -

Compatibilità con i browser

- - - -

{{Compat("api.Document.createElement")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/document/createrange/index.html b/files/it/web/api/document/createrange/index.html deleted file mode 100644 index 6c78f471f3..0000000000 --- a/files/it/web/api/document/createrange/index.html +++ /dev/null @@ -1,30 +0,0 @@ ---- -title: document.createRange -slug: Web/API/Document/createRange -translation_of: Web/API/Document/createRange ---- -
{{APIRef("DOM")}}
- -

Restituisce un nuovo oggetto Range.

- -

Sintassi

- -
range = document.createRange();
-
- -

range è l'oggetto range creato.

- -

Esempio

- -
var range = document.createRange();
-range.setStart(startNode, startOffset);
-range.setEnd(endNode, endOffset);
-
- -

Note

- -

Una volta che un Range è stato creato, occorre impostare il punto iniziale e quello finale prima di poter utilizzare la maggior parte dei suoi metodi.

- -

Specifiche

- -

DOM Level 2 Range: DocumentRange.createRange

diff --git a/files/it/web/api/document/defaultview/index.html b/files/it/web/api/document/defaultview/index.html deleted file mode 100644 index 46f9ef20c0..0000000000 --- a/files/it/web/api/document/defaultview/index.html +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: document.defaultView -slug: Web/API/Document/defaultView -translation_of: Web/API/Document/defaultView ---- -
{{APIRef("DOM")}}
- -

document.defaultView restituisce un riferimento all'AbstractView predefinita del documento, oppure null se non ne esiste una.

- -

Sintassi

- -
var vista = document.defaultView;
-
- -

Questa proprietà è di sola lettura.

- -

Note

- -

document.defaultView fa parte dell'interfaccia DocumentView del DOM Level 2.

- -

document.defaultView generalmente è un riferimento all'oggetto window del documento, però questo non è definito nella specifica è non può essere dato per scontato in ogni tipo di ambiente, o più precisamente in ogni browser.

- -

Specifiche

- -

DOM Level 2 defaultView

- -

{{ languages( { "pl": "pl/DOM/document.defaultView" } ) }}

diff --git a/files/it/web/api/document/doctype/index.html b/files/it/web/api/document/doctype/index.html deleted file mode 100644 index e9393d19b6..0000000000 --- a/files/it/web/api/document/doctype/index.html +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: document.doctype -slug: Web/API/Document/doctype -translation_of: Web/API/Document/doctype ---- -
{{APIRef("DOM")}}
- -

Restituisce la dichiarazione di tipo di documento (DTD) associata al documento corrente. L'oggetto restituito implementa l'interfaccia DocumentType.

- -

Sintassi

- -
doctype = document.doctype
-
- -

doctype è un proprietà di sola lettura

- -

Note

- -

Questa proprietà restituisce null se non vi è alcun DTD associato al documento corrente.

- -

Lo standard DOM level 2 non permette modifiche alla DTD.

- -

Specifiche

- -

DOM Level 2 Core: doctype

- -

{{ languages( { "pl": "pl/DOM/document.doctype" } ) }}

diff --git a/files/it/web/api/document/documentelement/index.html b/files/it/web/api/document/documentelement/index.html deleted file mode 100644 index e48895b7a0..0000000000 --- a/files/it/web/api/document/documentelement/index.html +++ /dev/null @@ -1,68 +0,0 @@ ---- -title: Document.documentElement -slug: Web/API/Document/documentElement -translation_of: Web/API/Document/documentElement ---- -
{{ApiRef("DOM")}}
- -

Document.documentElement ritorna l'{{domxref("Element")}} che è l'elemento principale di {{domxref("document")}} (per esempio, l'elemento {{HTMLElement("html")}} per i documenti HTML).

- -

Sintassi

- -
var element = document.documentElement;
-
- -

Esempio

- -
var rootElement = document.documentElement;
-var firstTier = rootElement.childNodes;
-
-// firstTier è la NodeList dei figli diretti dell'elemento root
-for (var i = 0; i < firstTier.length; i++) {
-   // fare qualcosa con ogni child diretto dell'elemento radice
-   // come firstTier[i]
-}
- -

Appunti

- -

Per qualsiasi documento HTML non vuoto, document.documentElement sarà sempre un elemento {{HTMLElement("html")}}. Per qualsiasi documento XML non vuoto, document.documentElement sarà sempre qualunque elemento sia l'elemento radice del documento.

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG','#dom-document-documentelement','Document.documentElement')}}{{Spec2('DOM WHATWG')}} 
{{SpecName('DOM4','#dom-document-documentelement','Document.documentElement')}}{{Spec2('DOM4')}} 
{{SpecName('DOM3 Core','core.html#ID-87CD092','Document.documentElement')}}{{Spec2('DOM3 Core')}} 
{{SpecName('DOM2 Core','core.html#ID-87CD092','Document.documentElement')}}{{Spec2('DOM2 Core')}} 
- -

Compatibilità con i browser

- - - -

{{Compat("api.Document.documentElement")}}

diff --git a/files/it/web/api/document/forms/index.html b/files/it/web/api/document/forms/index.html deleted file mode 100644 index cda3146a42..0000000000 --- a/files/it/web/api/document/forms/index.html +++ /dev/null @@ -1,128 +0,0 @@ ---- -title: Document.forms -slug: Web/API/Document/forms -tags: - - API - - DOM - - Document - - Forms - - HTML DOM - - HTML forms - - Proprietà - - Referenza -translation_of: Web/API/Document/forms ---- -

La proprietà di sola lettura forms dell'interfaccia {{domxref("Document")}} restituisce una {{domxref("HTMLCollection")}} che elenca tutti gli elementi {{HTMLElement("form")}} contenuti nel documento.

- -
-

Note: Allo stesso modo, è possibile accedere a un elenco di elementi di input utente di un modulo utilizzando la proprietà {{domxref("HTMLFormElement.elements")}}.

-
- -

Sintassi

- -
collection = document.forms;
- -

Valore

- -

Un oggetto {{domxref("HTMLCollection")}} che elenca tutti i form del documento. Ogni elemento della collezione è un {{domxref("HTMLFormElement")}} che rappresenta un singolo elemento <form>.

- -

Se il documento non ha moduli, la raccolta restituita è vuota, con una lunghezza pari a zero.

- -

Esempi

- -

Ottenere informazioni sul modulo

- -
<!DOCTYPE html>
-<html lang="en">
-
-<head>
-<title>document.forms example</title>
-</head>
-
-<body>
-
-<form id="robby">
-  <input type="button" onclick="alert(document.forms[0].id);" value="robby's form" />
-</form>
-
-<form id="dave">
-  <input type="button" onclick="alert(document.forms[1].id);" value="dave's form" />
-</form>
-
-<form id="paul">
-  <input type="button" onclick="alert(document.forms[2].id);" value="paul's form" />
-</form>
-
-</body>
-</html>
-
- -

Ottenere un elemento all'interno di un modulo

- -
var selectForm = document.forms[index];
-var selectFormElement = document.forms[index].elements[index];
-
- -

Accesso al modulo con nome

- -
<!DOCTYPE html>
-<html lang="en">
-<head>
-  <title>document.forms example</title>
-</head>
-
-<body>
-
-<form name="login">
-  <input name="email" type="email">
-  <input name="password" type="password">
-  <button type="submit">Log in</button>
-</form>
-
-<script>
-  var loginForm = document.forms.login; // Or document.forms['login']
-  loginForm.elements.email.placeholder = 'test@example.com';
-  loginForm.elements.password.placeholder = 'password';
-</script>
-</body>
-</html>
-
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('HTML WHATWG', '#dom-document-forms', 'Document.forms')}}{{ Spec2('HTML WHATWG') }} 
{{SpecName('DOM2 HTML', 'html.html#ID-1689064', 'Document.forms')}}{{ Spec2('DOM2 Events') }}Definizione iniziale.
- -

Compatibilità con i browser

- - - -

{{Compat("api.Document.forms")}}

- -

Vedi anche

- - - -
{{APIRef("DOM")}}
diff --git a/files/it/web/api/document/getelementbyid/index.html b/files/it/web/api/document/getelementbyid/index.html deleted file mode 100644 index bdcfac73a5..0000000000 --- a/files/it/web/api/document/getelementbyid/index.html +++ /dev/null @@ -1,149 +0,0 @@ ---- -title: Document.getElementById() -slug: Web/API/Document/getElementById -tags: - - API - - DOM - - Document - - Elementi - - Referenza - - Web - - getElementById - - id - - metodo -translation_of: Web/API/Document/getElementById ---- -
{{ ApiRef("DOM") }}
- -

Il metodo {{domxref("Document")}} getElementById() restituisce un oggetto {{domxref("Element")}} che rappresenta l'elemento la cui proprietà {{domxref("Element.id", "id")}} corrisponde alla stringa specificata. Poiché gli ID degli elementi devono essere univoci se specificati, sono un modo utile per accedere rapidamente a un elemento specifico.

- -

Se hai bisogno di accedere a un elemento che non ha un ID, puoi usare {{domxref("Document.querySelector", "querySelector()")}} per trovare l'elemento usando un qualsiasi {{Glossary("CSS selector", "selettore")}}.

- -

Sintassi

- -
var element = document.getElementById(id);
-
- -

Parametri

- -
-
id
-
L'ID dell'elemento da localizzare. L'ID è una stringa sensibile al maiuscolo/minuscolo, che è univoca all'interno del documento; solo un elemento può avere un dato ID.
-
- -

Valore di ritorno

- -

Un oggetto {{domxref("Element")}} che descrive l'oggetto elemento DOM che corrisponde all'ID specificato o null se nel documento non è stato trovato alcun elemento corrispondente.

- -

Esempio

- -

HTML

- -
<html>
-<head>
-  <title>getElementById example</title>
-</head>
-<body>
-  <p id="para">text here</p>
-  <button onclick="changeColor('blue');">blue</button>
-  <button onclick="changeColor('red');">red</button>
-</body>
-</html>
- -

JavaScript

- -
function changeColor(newColor) {
-  var elem = document.getElementById('para');
-  elem.style.color = newColor;
-}
- -

Risultato

- -

{{ EmbedLiveSample('Esempio', 250, 100) }}

- -

Note di utilizzo

- -

La maiuscola di "Id" nel nome di questo metodo deve essere corretta affinché il codice funzioni; getElementByID() non è valido e non funzionerà, per quanto naturale possa sembrare.

- -

A differenza di altri metodi di ricerca degli elementi come {{domxref("Document.querySelector()")}} e {{domxref("Document.querySelectorAll()")}}, getElementById() è disponibile solo come metodo per l'oggetto globale document, e non è disponibile come metodo su tutti gli oggetti elemento nel DOM. Poiché gli ID devono essere univoci nell'intero documento, non sono necessarie versioni "locali" della funzione.

- -

Esempio

- -
<!DOCTYPE html>
-<html>
-<head>
-    <meta charset="UTF-8">
-    <title>Document</title>
-</head>
-<body>
-    <div id="parent-id">
-        <p>hello word1</p>
-        <p id="test1">hello word2</p>
-        <p>hello word3</p>
-        <p>hello word4</p>
-    </div>
-    <script>
-        var parentDOM = document.getElementById('parent-id');
-        var test1 = parentDOM.getElementById('test1');
-        // throw error
-        // Uncaught TypeError: parentDOM.getElementById is not a function
-    </script>
-</body>
-</html>
- -

Se non ci sono elementi con l'id fornito, questa funzione restituisce null. Nota che il parametro id è case-sensitive, quindi document.getElementById("Main") restituirà null invece dell'elemento <div id="main"> perché "M" e "m" sono diversi per gli scopi di questo metodo.

- -

Gli elementi non presenti nel documento non vengono cercati da getElementById(). Quando crei un elemento ed assegni un ID ad esso, devi inserire l'elemento nell'albero del documento con {{domxref("Node.insertBefore()")}} o un metodo simile prima di poterlo ottenere con getElementById():

- -
var element = document.createElement('div');
-element.id = 'testqq';
-var el = document.getElementById('testqq'); // el sarà nullo!
-
- -

Documenti non HTML. L'implementazione del DOM deve avere informazioni che indicano quali attributi sono di tipo ID. Gli attributi con il nome "id" non sono di tipo ID a meno che non siano definiti nella DTD del documento. L'attributo id è definito come di tipo ID nei casi comuni di XHTML, XUL, e altri. Si prevede che le implementazioni che non sanno se gli attributi siano di tipo ID o non restituiscano null.

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM1','level-one-html.html#method-getElementById','getElementById')}}{{Spec2('DOM1')}}Definizione iniziale per l'interfaccia
{{SpecName('DOM2 Core','core.html#ID-getElBId','getElementById')}}{{Spec2('DOM2 Core')}}Sostituisce DOM 1
{{SpecName('DOM3 Core','core.html#ID-getElBId','getElementById')}}{{Spec2('DOM3 Core')}}Sostituisce DOM 2
{{SpecName('DOM WHATWG','#interface-nonelementparentnode','getElementById')}}{{Spec2('DOM WHATWG')}}Intende rimpiazzare DOM 3
- -

Compatibilità con i browser

- - - -

{{Compat("api.Document.getElementById")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/document/getelementsbyclassname/index.html b/files/it/web/api/document/getelementsbyclassname/index.html deleted file mode 100644 index c752bd665d..0000000000 --- a/files/it/web/api/document/getelementsbyclassname/index.html +++ /dev/null @@ -1,82 +0,0 @@ ---- -title: Document.getElementsByClassName() -slug: Web/API/Document/getElementsByClassName -translation_of: Web/API/Document/getElementsByClassName ---- -

{{APIRef("DOM")}}

- -

Il metodo getElementsByClassName dell'interfaccia {{domxref("Document")}} restituisce un array-like object di tutti gli elementi figli che hanno le classi specificate. Quando viene richiamato sull'oggetto {{domxref("document")}}, viene eseguita la ricerca del documento completo, incluso il nodo radice. Puoi anche usare {{domxref("Element.getElementsByClassName", "getElementsByClassName()")}} su qualsiasi elemento; restituirà solo gli elementi che sono discendenti dell'elemento radice specificato con le classi fornite.

- -

Sintassi

- -
var elementi = document.getElementsByClassName(nomi); // oppure:
-var elementi = rootElement.getElementsByClassName(nomi);
- - - -

Esempi

- -

Ottenere tutti gli elementi che hanno una come classe 'test':

- -
document.getElementsByClassName('test')
- -

Ottenere tutti gli elementi che hanno entrambe le classi 'red' e 'test':

- -
document.getElementsByClassName('red test')
- -

Ottenere tutti gli elementi che hanno una classe di 'test', all'interno di un elemento che ha l'ID di 'main':

- -
document.getElementById('main').getElementsByClassName('test')
- -

Ottenere il primo elemento con classe 'test' o indefinito se non ci sono elementi corrispondenti:

- -
document.getElementsByClassName('test')[0]
-
- -

Possiamo anche utilizzare il metodo Array.prototype su qualsiasi {{domxref("HTMLCollection")}} passando la HTMLCollection come il valore this. Qui troveremo tutti gli elementi div che hanno come classe 'test':

- -
var testElements = document.getElementsByClassName('test');
-var testDivs = Array.prototype.filter.call(testElements, function(testElement){
-    return testElement.nodeName === 'DIV';
-});
- -

Ottenere il primo elemento la cui classe è 'test'

- -

Questo è il metodo di operazione più comunemente usato.

- -
<html>
-<body>
-    <div id="parent-id">
-        <p>hello world 1</p>
-        <p class="test">hello world 2</p>
-        <p>hello world 3</p>
-        <p>hello world 4</p>
-    </div>
-
-    <script>
-        var parentDOM = document.getElementById("parent-id");
-
-        var test = parentDOM.getElementsByClassName("test"); // una lista di elementi corrispondenti, *non* l'elemento stesso
-        console.log(test); //HTMLCollection[1]
-
-        var testTarget = parentDOM.getElementsByClassName("test")[0]; // il primo elemento, come volevamo
-        console.log(testTarget); //<p class="test">hello world 2</p>
-    </script>
-</body>
-</html>
- -

Compatibilità con i browser

- - - -

{{Compat("api.Document.getElementsByClassName")}}

- -

Specifiche

- - diff --git a/files/it/web/api/document/getelementsbyname/index.html b/files/it/web/api/document/getelementsbyname/index.html deleted file mode 100644 index f39fdf8ef7..0000000000 --- a/files/it/web/api/document/getelementsbyname/index.html +++ /dev/null @@ -1,97 +0,0 @@ ---- -title: Document.getElementsByName() -slug: Web/API/Document/getElementsByName -tags: - - API - - DOM - - Document - - HTML - - Referenza - - metodo -translation_of: Web/API/Document/getElementsByName ---- -
{{APIRef("DOM")}}
- -

Il metodo getElementsByName() dell'oggetto {{domxref("Document")}} ritorna una raccolta di elementi {{domxref("NodeList")}} con un determinato {{domxref("element.name","name")}} nel documento.

- -

Sintassi

- -
var elements = document.getElementsByName(name);
-
- - - -

Esempio

- -
<!DOCTYPE html>
-<html lang="en">
-<title>Example: using document.getElementsByName</title>
-
-<input type="hidden" name="up">
-<input type="hidden" name="down">
-
-<script>
-  var up_names = document.getElementsByName("up");
-  console.log(up_names[0].tagName); // ritorna "INPUT"
-</script>
-</html>
-
- -

Appunti

- -

L'attributo {{domxref("element.name","name")}} può essere applicato solo nei documenti (X)HTML.

- -

La raccolta {{domxref("NodeList")}} restituita contiene tutti gli elementi con il parametro name dato, come {{htmlelement("meta")}}, {{htmlelement("object")}}, e persino elementi che non supportano affatto l'attributo name.

- -
-

Il metodo getElementsByName funziona in modo diverso in IE10 e versioni precedenti. Lì, getElementsByName() restituisce anche gli elementi che hanno un attributo id con il valore specificato. Fai attenzione a non usare la stessa stringa sia di un name che di un id.

-
- -
-

Il metodo getElementsByName funziona in modo diverso in IE. Lì, getElementsByName() non restituisce tutti gli elementi che potrebbero non avere un attributo name (come <span>).

-
- -
-

Sia IE che Edge restituiscono una {{domxref("HTMLCollection")}}, non una {{domxref("NodeList")}}

-
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('HTML WHATWG', '#dom-document-getelementsbyname', "Document.getElementsByName()")}}{{ Spec2('HTML WHATWG') }} 
{{SpecName("DOM2 HTML", "html.html#ID-71555259", "Document.getElementsByName()")}}{{Spec2("DOM2 HTML")}}Definizione iniziale
- -

Compatibilità con i browser

- - - -

{{Compat("api.Document.getElementsByName")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/document/getelementsbytagname/index.html b/files/it/web/api/document/getelementsbytagname/index.html deleted file mode 100644 index e5ad9540fb..0000000000 --- a/files/it/web/api/document/getelementsbytagname/index.html +++ /dev/null @@ -1,116 +0,0 @@ ---- -title: Document.getElementsByTagName() -slug: Web/API/Document/getElementsByTagName -tags: - - API - - DOM - - Referenza - - metodo -translation_of: Web/API/Document/getElementsByTagName ---- -
{{APIRef("DOM")}}
- -

Il metodo getElementsByTagName dell'interfaccia {{domxref("Document")}} ritorna una {{domxref("HTMLCollection")}} di elementi con il tag specificato. Viene cercato il documento completo, incluso il nodo radice. L'HTMLCollection è dinamica, il che significa che si aggiorna automaticamente per rimanere sincronizzato con l'albero del DOM senza dover chiamare di nuovo document.getElementsByTagName().

- -

Sintassi

- -
var elementi = document.getElementsByTagName(nome);
- - - -
Le ultime specifiche W3C dicono che gli elementi sono una HTMLCollection; tuttavia, questo metodo restituisce una {{domxref("NodeList")}} nei browser WebKit. Vedi {{bug(14869)}} per i dettagli.
- -

Esempio

- -

Nell'esempio seguente, getElementsByTagName() inizia da un particolare elemento padre e ricerca dall'alto verso il basso ricorsivamente attraverso il DOM da quell'elemento padre, una raccolta di tutti i discendenti che corrispondono al parametro nome del tag. Questo documento mostra sia document.getElementsByTagName() che l'identico funzionale {{domxref("Element.getElementsByTagName()")}}, che avvia la ricerca su un elemento specifico all'interno dell'albero del DOM.

- -

Facendo click sui pulsanti viene utilizzato getElementsByTagName() per contare gli elementi del paragrafo discendente di un particolare genitore (il documento stesso o uno dei due elementi {{HTMLElement("div")}}).

- -
<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8" />
-  <title>esempio di getElementsByTagName</title>
-  <script>
-    function getAllParaElems() {
-      var allParas = document.getElementsByTagName('p');
-      var num = allParas.length;
-      alert('Ci sono ' + num + ' paragrafi in questo documento');
-    }
-
-    function div1ParaElems() {
-      var div1 = document.getElementById('div1');
-      var div1Paras = div1.getElementsByTagName('p');
-      var num = div1Paras.length;
-      alert('Ci sono ' + num + ' paragrafi in #div1');
-    }
-
-    function div2ParaElems() {
-      var div2 = document.getElementById('div2');
-      var div2Paras = div2.getElementsByTagName('p');
-      var num = div2Paras.length;
-      alert('Ci sono ' + num + ' paragrafi in #div2');
-    }
-  </script>
-</head>
-<body style="border: solid green 3px">
-  <p>Qualche testo esterno</p>
-  <p>Qualche testo esterno</p>
-
-  <div id="div1" style="border: solid blue 3px">
-    <p>Qualche testo div1</p>
-    <p>Qualche testo div1</p>
-    <p>Qualche testo div1</p>
-
-    <div id="div2" style="border: solid red 3px">
-      <p>Qualche testo div2</p>
-      <p>Qualche testo div2</p>
-    </div>
-  </div>
-
-  <p>Qualche testo esterno/p>
-  <p>Qualche testo esterno</p>
-
-  <button onclick="getAllParaElems();">
-    mostra tutti gli elementi p nel documento</button><br />
-
-  <button onclick="div1ParaElems();">
-    mostra tutti gli elementi p nell'elemento div1</button><br />
-
-  <button onclick="div2ParaElems();">
-   mostra tutti gli elementi p nell'elemento div2</button>
-
-</body>
-</html>
-
- -

Note

- -

Quando chiamato su un documento HTML, getElementsByTagName() converte in minuscolo il suo argomento prima di procedere. Ciò non è desiderabile quando si cerca di far corrispondere gli elementi SVG di camelCase in una sottostruttura in un documento HTML. {{Domxref("document.getElementsByTagNameNS()")}} è utile in questo caso. Vedi anche {{Bug(499656)}}.

- -

document.getElementsByTagName() è simile a {{domxref("Element.getElementsByTagName()")}}, ad eccezione del fatto che la sua ricerca comprende l'intero documento.

- -

Specifiche

- - - -

Compatibilità con i browser

- - - -

{{Compat("api.Document.getElementsByTagName")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/document/head/index.html b/files/it/web/api/document/head/index.html deleted file mode 100644 index 941a533431..0000000000 --- a/files/it/web/api/document/head/index.html +++ /dev/null @@ -1,84 +0,0 @@ ---- -title: Document.head -slug: Web/API/Document/head -tags: - - API - - Document - - HTML DOM - - Proprietà - - Referenza -translation_of: Web/API/Document/head ---- -
{{APIRef("DOM")}}
- -

La proprietà head di sola lettura dell'interfaccia {{domxref("Document")}} restituisce l'elemento {{HTMLElement("head")}} del documento corrente.

- -

Sintassi

- -
var objRef = document.head;
-
- -

Valore

- -

Un {{domxref("HTMLHeadElement")}}.

- -

Esempio

- -
<!doctype html>
-<head id="my-document-head">
-  <title>Esempio: usare document.head</title>
-</head>
-
-<script>
-  var theHead = document.head;
-
-  console.log(theHead.id); // "my-document-head";
-
-  console.log( theHead === document.querySelector("head") ); // true
-</script>
-
- -

Appunti

- -

document.head è di sola lettura. Cercare di assegnare un valore a questa proprietà fallirà silenziosamente o, in Strict Mode, genera un {{jsxref("TypeError")}} .

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('HTML5.1','dom.html#dom-document-head','Document.head')}}{{Spec2('HTML5.1')}} 
{{SpecName('HTML5 W3C','dom.html#dom-document-head','Document.head')}}{{Spec2('HTML5 W3C')}} 
{{SpecName('HTML WHATWG','dom.html#dom-document-head','Document.head')}}{{Spec2('HTML WHATWG')}}Definizione iniziale.
- -

Compatibilità con i browser

- - - -

{{Compat("api.Document.head")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/document/height/index.html b/files/it/web/api/document/height/index.html deleted file mode 100644 index ee517b6c39..0000000000 --- a/files/it/web/api/document/height/index.html +++ /dev/null @@ -1,35 +0,0 @@ ---- -title: document.height -slug: Web/API/Document/height -translation_of: Web/API/Document/height ---- -
{{APIRef("DOM")}}
- -

Restituisce l'altezza in pixel dell'elemento body del documento corrente.

- -

Syntax

- -
height_value = document.height
-
- -

Parametri

- - - -

Esempio

- -
// visualizza l'altezza del documento
-alert(document.height);
-
- -

Note

- -

Si veda document.width.

- -

Specifiche

- -

DOM Level 0. Non è parte di uno standard.

- -

{{ languages( { "pl": "pl/DOM/document.height" } ) }}

diff --git a/files/it/web/api/document/images/index.html b/files/it/web/api/document/images/index.html deleted file mode 100644 index abe27b2a11..0000000000 --- a/files/it/web/api/document/images/index.html +++ /dev/null @@ -1,52 +0,0 @@ ---- -title: Document.images -slug: Web/API/Document/images -translation_of: Web/API/Document/images ---- -
{{APIRef("DOM")}}
- -

document.images restituisce una collezione delle immagini nel documento HTML corrente.

- -

Sintassi

- -
var htmlCollection = document.images;
- -

Esempio

- -
var ilist = document.images;
-
-for(var i = 0; i < ilist.length; i++) {
-    if(ilist[i].src == "banner.gif") {
-        // found the banner
-    }
-}
- -

Note

- -

document.images.length – proprietà che restituisce il numero di immagini della pagina.

- -

document.images è parte del DOM HTML, e funziona solo per documenti HTML.

- -

Specifiche tecniche

- - - - - - - - - - - - - - - - - - - - - -
Specifiche tecnicheStatoCommento
{{SpecName('HTML WHATWG', '#dom-document-images', 'Document.images')}}{{ Spec2('HTML WHATWG') }} 
{{SpecName('DOM2 HTML', 'html.html#ID-90379117', 'Document.images')}}{{ Spec2('DOM2 Events') }}Initial definition.
diff --git a/files/it/web/api/document/importnode/index.html b/files/it/web/api/document/importnode/index.html deleted file mode 100644 index 354db3c0c8..0000000000 --- a/files/it/web/api/document/importnode/index.html +++ /dev/null @@ -1,45 +0,0 @@ ---- -title: document.importNode -slug: Web/API/Document/importNode -translation_of: Web/API/Document/importNode ---- -
{{APIRef("DOM")}}
- -

Restituisce un clone di un nodo preso da un documento esterno.

- -

Sintassi

- -
nodo =
-document.importNode(
-nodoEsterno,
-bool)
-
- - - -

Esempio

- -
var iframe = document.getElementsByTagName("iframe")[0];
-var vecchioNodo = iframe.contentDocument.getElementById("mioNodo");
-var nuovoNodo = document.importNode(vecchioNodo,true);
-document.getElementById("contenitore").appendChild(nuovoNodo);
-
- -

Note

- -

Il nodo non viene rimosso dal documento originale. Il nodo importato è un clone dell'originale. I nodi presi dai documenti esterni devono essere importati prima di poter essere inseriti nel documento corrente.

- -

http://www.w3.org/DOM/faq.html#ownerdoc

- -

Specifiche

- -

DOM Level 2 Core: Document.importNode

- -

{{ languages( { "fr": "fr/DOM/document.importNode" } ) }}

diff --git a/files/it/web/api/document/index.html b/files/it/web/api/document/index.html deleted file mode 100644 index 108f317cc3..0000000000 --- a/files/it/web/api/document/index.html +++ /dev/null @@ -1,308 +0,0 @@ ---- -title: Document -slug: Web/API/Document -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - SezioneIncompleta - - Tutte_le_categorie -translation_of: Web/API/Document ---- -

{{ ApiRef("DOM") }}

- -

Introduzione

- -

L'oggetto document fornisce un modo generico di rappresentare documenti HTML, XHTML, e XML. Implementa l'interfaccia DOM Core document.

- -

In aggiunta all'interfaccia generalizzata DOM core document, i documenti HTML implementano pure l'interfaccia DOM HTMLDocument, che è un'interfaccia più specializzata per interagire con i documenti HTML (contiene ad esempio document.cookie). In questa pagina, le proprietà e i metodi che fanno parte di questa interfaccia più specializzata sono seguite da un asterisco.

- -

L'oggetto document è contenuto nell'oggetto window e può contenere un numero qualsiasi di elementi.

- -

L'interfaccia di document fornisce accesso a informazioni come il tipo di documento, i plugin e le applet, e fornisce metodi per creare e manipolare i suoi nodi figli.

- -

Proprietà

- -
-
document.alinkColor*{{ Deprecated_inline() }}
-
Restituisce o setta il colore dei link attivi nel corpo del documento.
-
- -
-
document.anchors*
-
Restituisce una collezione delle ancore presenti nel documento.
-
- -
-
document.applets*
-
Restituisce una collezione delle applet presenti nel documento.
-
- -
-
document.bgColor*{{ Deprecated_inline() }}
-
Restituisce/setta il colore di sfondo dell'elemento body del documento.
-
- -
-
document.body*
-
Restituisce il nodo BODY del documento.
-
- -
-
document.characterSet
-
Restituisce il set di caratteri usato nel documento.
-
- -
-
document.compatMode*
-
Indica se il documento viene letto dal browser in modalità standard o in modalità compatibile.
-
- -
-
document.cookie*
-
Restituisce una stringa contenente la lista dei cookie(separati da un punto e virgola) usati dal documento o setta un singolo cookie.
-
- -
-
document.contentWindow*
-
Restituisce l'oggetto window in cui è contenuto il documento.
-
- -
-
document.defaultView
-
Restituisce un riferimento all'oggetto window.
-
- -
-
document.designMode
-
Restituisce/setta lo stato di attivazione del Rich Text Editor di firefox, Midas.
-
- -
-
document.doctype
-
Restituisce la Dichiarazione del Tipo di Documento(DTD) del documento corrente.
-
- -
-
document.documentElement
-
Restituisce l'elemento che è figlio diretto di document, cioè nella maggior parte dei casi l'elemento HTML.
-
- -
-
document.domain*
-
Restituisce il dominio del documento corrente.
-
- -
-
document.embeds*
-
Restituisce una lista degli elementi object contenuti nel documento.
-
- -
-
document.fgColor*{{ Deprecated_inline() }}
-
Restituisce/setta il colore di default per il testo del documento corrente.
-
- -
-
document.firstChild
-
Restituisce il primo nodo figlio di document. (Guarda anche firstChild presente nell'intefaccia element).
-
- -
-
document.forms*
-
Restituisce una collezione degli elementi FORM contenuti nel documento.
-
- -
-
document.height*
-
Restituisce/setta l'altezza del documento corrente.
-
- -
-
document.images*
-
Restituisce una collezione delle immagini contenute nel documento corrente.
-
- -
-
document.implementation*
-
Restituisce l'implementazione DOM associata al documento corrente.
-
- -
-
document.lastModified*
-
Restituisce la data in cui il documento è stato modificato l'ultima volta.
-
- -
-
document.linkColor*{{ Deprecated_inline() }}
-
Restituisce/setta il colore dei collegamenti nel documento.
-
- -
-
document.links*
-
Restituisce una collezione dei collegamenti presenti nel documento.
-
- -
-
document.location*
-
Restituisce l'URI del documento corrente.
-
- -
-
document.namespaceURI
-
Restituisce lo spazio dei nomi XML del documento corrente.
-
- -
-
document.plugins*
-
Restituisce una lista dei plugin disponibili.
-
- -
-
document.referrer*
-
Restituisce l'URI della pagina che ha portato al documento corrente.
-
- -
-
document.styleSheets*
-
Restituisce una collezione degli oggetti stylesheet presenti nel documento corrente.
-
- -
-
document.title*
-
Restituisce il titolo del documento corrente.
-
- -
-
document.URL
-
Restituisce una stringa che rappresenta l'URI del documento corrente.
-
- -
-
document.vlinkColor*{{ Deprecated_inline() }}
-
Restituisce/setta il colore dei collegamenti visitati.
-
- -
-
document.width*
-
Restituisce la larghezza del documento corrente.
-
- -

Metodi

- -
-
document.clear {{ Deprecated_inline() }}
-
Cancella i contenuti del documento.
-
- -
-
document.close
-
Chiude lo stream per la scrittura del documento.
-
- -
-
document.createAttribute
-
Crea (e restituisce) un nuovo nodo attributo.
-
- -
-
document.createDocumentFragment
-
Crea un frammento.
-
- -
-
document.createElement*
-
Crea un elemento a partire dal nome di tag dato. Non funziona con documenti xml.
-
- -
-
document.createElementNS
-
Crea un elmento col nome di tag e l'URI per lo spazio dei nomi dati.
-
- -
-
document.createTextNode
-
Crea un nodo testuale.
-
- -
-
document.createEvent
-
Crea un oggetto di classe Event.
-
- -
-
document.createRange
-
Crea un oggetto di classe Range.
-
- -
-
document.execCommand
-
Esegue un comando Midas.
-
- -
-
document.evaluate
-
Valuta una espressione XPath.
-
- -
-
document.getElementById
-
Restituisce un riferimento a oggetto per l'elemento che ha il dato id.
-
- -
-
document.getElementsByName
-
Restituisce una collezione di elementi con il dato attributo name.
-
- -
-
document.getElementsByTagName
-
Restituisce una collezione degli elementi con il dato nome di tag.
-
- -
-
document.importNode
-
Restituisce un clone di un nodo preso da un documento esterno.
-
- -
-
document.loadOverlay
-
Carica un overlay XUL dinamicamente. Funziona solo con i documenti XUL.
-
- -
-
document.open
-
Apre uno stream di documento per la scrittura.
-
- -
-
document.queryCommandEnabled
-
Restituisce true se il comando Midas può essere eseguito sul range corrente.
-
- -
-
document.queryCommandIndeterm
-
Restituisce true se il comando Midas è in uno stato indeterminato per il range corrente.
-
- -
-
document.queryCommandState
-
Restituisce true se il comando Midas è stato eseguito sul range corrente.
-
- -
-
document.queryCommandValue
-
Restituisce il valore corrente del range corrente per il comando Midas.
-
- -
-
document.write*
-
Scrive del codice all'interno del documento.Non funziona con i documenti xml.
-
- -
-
document.writeln
-
Scrive una linea di codice all'interno del documento. Non funziona con i documenti xml.
-
- -

{{ languages( { "fr": "fr/DOM/document", "pl": "pl/DOM/document", "en": "en/DOM/document" } ) }}

diff --git a/files/it/web/api/document/lastmodified/index.html b/files/it/web/api/document/lastmodified/index.html deleted file mode 100644 index 4e56851ee4..0000000000 --- a/files/it/web/api/document/lastmodified/index.html +++ /dev/null @@ -1,31 +0,0 @@ ---- -title: document.lastModified -slug: Web/API/Document/lastModified -translation_of: Web/API/Document/lastModified ---- -
{{APIRef("DOM")}}
- -

Restituisce una stringa contenente la data e l'ora dell'utlima modifica apportata al documento corrente.

- -

Sintassi

- -
stringa = document.lastModified
-
- -

Esempio

- -
dump(document.lastModified);
-// restituisce: Tuesday, July 10, 2001 10:19:42
-
- -

Note

- -

Si noti che essendo una stringa, lastModified non può essere utilizzata facilmente per le comparazioni tra le date di modifica di un altro documento.

- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

- -

MSDN: proprietà lastModified

- -

{{ languages( { "pl": "pl/DOM/document.lastModified" } ) }}

diff --git a/files/it/web/api/document/links/index.html b/files/it/web/api/document/links/index.html deleted file mode 100644 index fff02b997f..0000000000 --- a/files/it/web/api/document/links/index.html +++ /dev/null @@ -1,100 +0,0 @@ ---- -title: document.links -slug: Web/API/Document/links -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Document/links ---- -
-

{{ APIRef("DOM") }}

- -

La proprietà links restituisce una collezione di tutti gli elementi {{HTMLElement("area")}} e di tutti gli elementi {{HTMLElement("a")}} in un documento con un valore per l'attributo href .

- -

Sintassi

- -
nodeList = document.links
- -

Esempio

- -
var links = document.links;
-for(var i = 0; i < links.length; i++) {
-  var linkHref = document.createTextNode(links[i].href);
-  var lineBreak = document.createElement("br");
-  document.body.appendChild(linkHref);
-  document.body.appendChild(lineBreak);
-}
- -

Specifiche tecniche

- - - - - - - - - - - - - - - - - - - -
Specifiche tecnicheStatoCommento
{{SpecName('HTML WHATWG', '#dom-document-links', 'Document.links')}}{{ Spec2('HTML WHATWG') }} 
{{SpecName("DOM2 HTML", "html.html#ID-7068919", "document.links")}}{{Spec2("DOM2 HTML")}}Definizione iniziale
- -

Compatibilità browser

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
-
- -
- - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
-
-
diff --git a/files/it/web/api/document/open/index.html b/files/it/web/api/document/open/index.html deleted file mode 100644 index 7f4c1eb77a..0000000000 --- a/files/it/web/api/document/open/index.html +++ /dev/null @@ -1,46 +0,0 @@ ---- -title: document.open -slug: Web/API/Document/open -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Document/open ---- -
{{APIRef("DOM")}}
- -

Il metodo document.open() apre un documento in scrittura (document.write()).

- -

Sintassi

- -
document.open();
-
- -

Esempio

- -
// In questo esempio, i contenuti del documento
-// vengono sovrascritti quando il documento
-// viene reinizializzato con open().
-document.write("<html><p>eliminami</p></html>");
-document.open();
-// il documento è vuoto
-
- -

Note

- -

Se un documento esiste, questo metodo lo svuota (si veda l'esempio sopra).

- -

Inoltre document.open() viene chiamato implicitamente quando si chiama document.write() dopo che la pagina è stata caricata, nonostante ciò non sia richiesto dalle specifiche del W3C.

- -

Non confondere questo metodo con window.open(). document.open() permette di sovrascrivere il documento corrente o aggiungere testo allo stesso, mentre window.open fornisce un modo per apreire una finestra, lasciando intatto il documento. Poiché window è l'oggetto globale, scrivere solamente open(...) fa la stessa cosa

- -

Puoi chiudere il documento aperto usando document.close().

- -

Specificazioni

- -

DOM Level 2 HTML: open() Method

- -
 
- -

{{ languages( { "fr": "fr/DOM/document.open", "ja": "ja/DOM/document.open", "pl": "pl/DOM/document.open" } ) }}

diff --git a/files/it/web/api/document/queryselector/index.html b/files/it/web/api/document/queryselector/index.html deleted file mode 100644 index 6d8000818d..0000000000 --- a/files/it/web/api/document/queryselector/index.html +++ /dev/null @@ -1,121 +0,0 @@ ---- -title: Document.querySelector() -slug: Web/API/Document/querySelector -translation_of: Web/API/Document/querySelector ---- -
{{ApiRef("DOM")}}
- -

Il metodo {{domxref("Document")}} querySelector() ritorna il primo {{domxref("Element")}} all'interno del documento che corrisponde al selettore specificato o al gruppo di selettori. Se non vengono trovate corrispondenze, viene restituito null.

- -
-

Note: Il matching viene eseguito utilizzando il deep-pre-order traversal dei nodi del documento partendo dal primo elemento nel markup del documento e iterando attraverso i nodi sequenziali per ordine del numero di nodi figli.

-
- -

Sintassi

- -
element = document.querySelector(selectors);
-
- -

Parametri

- -
-
selectors
-
Una {{domxref("DOMString")}} contenente uno o più selettori da trovare. Questa stringa deve essere una stringa di selettore CSS valida; se non lo è, viene generata un'eccezione SYNTAX_ERR. Vedi Individuazione degli elementi DOM mediante selettori per ulteriori informazioni sui selettori e su come gestirli.
-
- -
-

Note: I caratteri che non fanno parte della sintassi CSS standard devono essere sottoposti a escape utilizzando un carattere backslash. Poiché JavaScript utilizza anche l'escape di backslash, prestare particolare attenzione quando si scrivono stringhe letterali utilizzando questi caratteri. Vedi {{anch("Escaping special characters")}} per maggiori informazioni.

-
- -

Valore di ritorno

- -

Un oggetto {{domxref ("Element")}} che rappresenta il primo elemento nel documento che corrisponde al set specificato di CSS selectors, o null viene restituito se non ci sono corrispondenze.

- -

Se hai bisogno di un elenco di tutti gli elementi che corrispondono ai selettori specificati, dovresti usare {{domxref("Document.querySelectorAll", "querySelectorAll()")}}.

- -

Eccezioni

- -
-
SYNTAX_ERR
-
La sintassi dei selettori specificati non è valida.
-
- -

Note di utilizzo

- -

Se il selettore specificato corrisponde a un ID erroneamente utilizzato più di una volta nel documento, viene restituito il primo elemento con quell'ID.

- -

Gli pseudo-elementi CSS non restituiranno mai alcun elemento, come specificato nelle API dei selettori.

- -

Escaping caratteri speciali

- - - -

Per eseguire la corrispondenza con un ID o selettori che non seguono la sintassi CSS standard (ad esempio utilizzando due punti o uno spazio in modo inappropriato), è necessario eseguire l'escape del carattere con un backslash ("\"). Poiché il backslash è anche un carattere di escape in JavaScript, se si immette una stringa letterale, è necessario eseguire l'escape due volte (una per la stringa JavaScript e un'altra per querySelector ()):

- -
<div id="foo\bar"></div>
-<div id="foo:bar"></div>
-
-<script>
-  console.log('#foo\bar');               // "#fooar" (\b è il carattere di controllo backspace)
-  document.querySelector('#foo\bar');    // Non corrisponde a nulla
-
-  console.log('#foo\\bar');              // "#foo\bar"
-  console.log('#foo\\\\bar');            // "#foo\\bar"
-  document.querySelector('#foo\\\\bar'); // Seleziona il primo div
-
-  document.querySelector('#foo:bar');    // Non corrisponde a nulla
-  document.querySelector('#foo\\:bar');  // Seleziona il secondo div
- -

Esempi

- -

Trovare il primo elemento che corrisponde a una classe

- -

In questo esempio, viene restituito il primo elemento del documento con la classe "myclass":

- -
var el = document.querySelector(".myclass");
-
- -

Un selettore più complesso

- -

I selettori possono anche essere molto potenti, come dimostrato nel seguente esempio. Qui, il primo elemento {{HTMLElement("input")}} con il nome "login" (<input name="login"/>) situato all'interno di un {{HTMLElement("div")}} la cui classe è "user-panel main" (<div class="user-panel main">) nel documento viene restituito:

- -
var el = document.querySelector("div.user-panel.main input[name='login']");
-
- -

Specifiche

- - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName("Selectors API Level 2", "#interface-definitions", "document.querySelector()")}}{{Spec2("Selectors API Level 2")}}
{{SpecName("Selectors API Level 1", "#interface-definitions", "document.querySelector()")}}{{Spec2("Selectors API Level 1")}}Definizione iniziale
- -

Compatibilità con i browser

- - - -
{{Compat("api.Document.querySelector")}}
- -

Vedi anche

- - diff --git a/files/it/web/api/document/queryselectorall/index.html b/files/it/web/api/document/queryselectorall/index.html deleted file mode 100644 index a8e614ce9e..0000000000 --- a/files/it/web/api/document/queryselectorall/index.html +++ /dev/null @@ -1,180 +0,0 @@ ---- -title: Document.querySelectorAll() -slug: Web/API/Document/querySelectorAll -tags: - - API - - Cercare elementi - - Document - - Localizzare Elementi - - Referenza - - Selettori - - Selettori CSS - - Selezionare Elementi - - Trovare elementi - - metodo - - querySelectorAll -translation_of: Web/API/Document/querySelectorAll ---- -
{{APIRef("DOM")}}
- -

Il metodo {{domxref("Document")}} querySelectorAll() ritorna una {{domxref("NodeList")}} statica (non dinamica) che rappresenta un elenco di elementi del documento che corrispondono al gruppo specificato di selettori.

- -
-

Note: This method is implemented based on the {{domxref("ParentNode")}} mixin's {{domxref("ParentNode.querySelectorAll", "querySelectorAll()")}} method.

-
- -

Sintassi

- -
elementList = parentNode.querySelectorAll(selectors);
-
- -

Parametri

- -
-
selectors
-
Una {{domxref("DOMString")}} contenente uno o più selettori con cui confrontarsi. Questa stringa deve contenere dei selettori CSS validi; se non lo sono, viene generata un'eccezione SyntaxError. Vedi Individuazione degli elementi DOM mediante selettori per ulteriori informazioni sull'uso dei selettori per cercare gli elementi. È possibile specificare più selettori separandoli utilizzando le virgole.
-
- -
-

Note: I caratteri che non fanno parte della sintassi CSS standard devono essere sottoposti a escape utilizzando un carattere backslash. Poiché JavaScript utilizza anche l'escape di backslash, è necessario prestare particolare attenzione quando si scrivono stringhe letterali utilizzando questi caratteri. Vedi {{anch("Escaping special characters")}} per maggiori informazioni.

-
- -

Valore di ritorno

- -

Una {{domxref("NodeList")}} non dinamica contenente un oggetto {{domxref("Element")}} per ogni elemento che corrisponde ad almeno uno dei selettori specificati o una {{domxref("NodeList")}} vuota in caso di assenza di corrispondenze.

- -
-

Note: Se i selectors specificati includono uno pseudo-elemento CSS, l'elenco restituito è sempre vuoto.

-
- -

Eccezioni

- -
-
SyntaxError
-
La sintassi della stringa selectors specificata non è valida.
-
- -

Esempi

- -

Ottenere un elenco di elementi

- -

Per ottenere una {{domxref("NodeList")}} di tutti gli elementi {{HTMLElement("p")}} nel documento:

- -
var matches = document.querySelectorAll("p");
- -

Questo esempio restituisce un elenco di tutti gli elementi {{HTMLElement("div")}} all'interno del documento con la classe "note" o "alert":

- -
var matches = document.querySelectorAll("div.note, div.alert");
-
- -

Qui, otteniamo un elenco di elementi <p> il cui elemento padre immediato è un {{domxref("div")}} con la classe "highlighted" e che si trovano all'interno di un contenitore il cui ID è "test".

- -
var container = document.querySelector("#test");
-var matches = container.querySelectorAll("div.highlighted > p");
- -

Questo esempio utilizza un selettore tramite attributo per restituire un elenco degli elementi {{domxref("iframe")}} nel documento che contengono un attributo denominato "data-src":

- -
var matches = document.querySelectorAll("iframe[data-src]");
- -

Qui, un selettore di attributo viene utilizzato per restituire un elenco degli elementi di elenco contenuti in un elenco il cui ID è "userlist" con l'attributo "data-active" il cui valore è "1":

- -
var container = document.querySelector("#userlist");
-var matches = container.querySelectorAll("li[data-active='1']");
- -

Accedere ai risultati

- -

Una volta che viene restituita la {{domxref("NodeList")}} degli elementi corrispondenti, è possibile esaminarla come qualsiasi array. Se l'array è vuoto (ovvero la sua proprietà length è 0), non è stato trovato alcun elemento.

- -

Altrimenti, puoi semplicemente usare la notazione array standard per accedere ai contenuti della lista. È possibile utilizzare qualsiasi istruzione di loop comune, come ad esempio:

- -
var highlightedItems = userList.querySelectorAll(".highlighted");
-
-highlightedItems.forEach(function(userItem) {
-  deleteUser(userItem);
-});
- -

Note dell'utente

- -

querySelectorAll() si comporta in modo diverso rispetto alle più comuni librerie DOM JavaScript, il che potrebbe portare a risultati imprevisti.

- -

HTML

- -

Considera questo HTML, con i suoi tre blocchi {{HTMLElement("div")}} nidificati.

- -
<div class="outer">
-  <div class="select">
-    <div class="inner">
-    </div>
-  </div>
-</div>
- -

JavaScript

- -
var select = document.querySelector('.select');
-var inner = select.querySelectorAll('.outer .inner');
-inner.length; // 1, not 0!
-
- -

In questo esempio, quando si seleziona ".outer .inner" nel contesto <div> con la classe "select", si trova ancora l'elemento con la classe ".inner" anche se .outer non è un discendente dell'elemento base su cui viene eseguita la ricerca (".select"). Per impostazione predefinita, querySelectorAll() verifica solo che l'ultimo elemento nel selettore si trovi all'interno dell'ambito di ricerca.

- -

La pseudo-classe {{cssxref(":scope")}} ripristina il comportamento previsto, trova solo i selettori corrispondenti sui discendenti dell'elemento base:

- -
var select = document.querySelector('.select');
-var inner = select.querySelectorAll(':scope .outer .inner');
-inner.length; // 0
-
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName("DOM WHATWG", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}{{Spec2("DOM WHATWG")}}Standard di vita
{{SpecName("Selectors API Level 2", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}{{Spec2("Selectors API Level 2")}}Nessun cambiamento
{{SpecName("DOM4", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}{{Spec2("DOM4")}}Definizione iniziale
{{SpecName("Selectors API Level 1", "#interface-definitions", "document.querySelector()")}}{{Spec2("Selectors API Level 1")}}Definizione originale
- -

Compatibilità con i browser

- -
- - -

{{Compat("api.Document.querySelectorAll")}}

-
- -

Vedi anche

- - diff --git a/files/it/web/api/document/referrer/index.html b/files/it/web/api/document/referrer/index.html deleted file mode 100644 index 8cefd3c9ac..0000000000 --- a/files/it/web/api/document/referrer/index.html +++ /dev/null @@ -1,23 +0,0 @@ ---- -title: document.referrer -slug: Web/API/Document/referrer -translation_of: Web/API/Document/referrer ---- -
{{APIRef("DOM")}}
- -

Restituisce l'URI della pagina che l'utente ha visitato e che conteneva il link al documento corrente.

- -

Sintassi

- -
stringa = document.referrer
-
- -

Note

- -

Il valore è una stringa vuota se l'utente si è recato alla pagina corrente digitando l'indirizzo direttamente o attraverso un bookmark. Siccome questa proprietà restituisce solo una stringa, non fornisce un accesso al DOM della pagina a cui si riferisce.

- -

Specifiche

- -

DOM Level 2: referrer

- -

{{ languages( { "pl": "pl/DOM/document.referrer" } ) }}

diff --git a/files/it/web/api/document/stylesheets/index.html b/files/it/web/api/document/stylesheets/index.html deleted file mode 100644 index 36e27c66c6..0000000000 --- a/files/it/web/api/document/stylesheets/index.html +++ /dev/null @@ -1,45 +0,0 @@ ---- -title: document.styleSheets -slug: Web/API/Document/styleSheets -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/DocumentOrShadowRoot/styleSheets -translation_of_original: Web/API/Document/styleSheets -original_slug: Web/API/DocumentOrShadowRoot/styleSheets ---- -

{{APIRef("DOM")}}

- -

Restituisce una lista di oggetti stylesheet per i fogli stile esplicitamente linkati o inclusi nel documento.

- -

Proprietà

- -

styleSheetList.length - restituisce il numero di oggetti stylesheet contenuti nell'oggetto.

- -

Sintassi

- -
styleSheetList =
-document.styleSheets
-
- -

L'oggetto restituito è di tipo StyleSheetList.

- -

E' una collezione ordinata di oggetti stylesheet. - styleSheetList - .item( - - indice - ) o semplicemente - styleSheetList - {{ mediawiki.external(' - - indice - ') }} restituisce un singolo oggetto stylesheet indicato dall'indice (indice comincia da 0).

- -

Specifiche

- -

DOM Level 2 Style: styleSheets

- -

{{ languages( { "ja": "ja/DOM/document.styleSheets", "pl": "pl/DOM/document.styleSheets" } ) }}

diff --git a/files/it/web/api/document/title/index.html b/files/it/web/api/document/title/index.html deleted file mode 100644 index 5e93fa8318..0000000000 --- a/files/it/web/api/document/title/index.html +++ /dev/null @@ -1,32 +0,0 @@ ---- -title: document.title -slug: Web/API/Document/title -translation_of: Web/API/Document/title ---- -

{{APIRef("DOM")}}document.title restituisce il titolo del documento.

- -

Sintassi

- -
sTitle = document.title
-
- -

Parametri

- - - -

Esempio

- -
<html>
-  <title>Ciao mondo!</title>
-  <body>
-...
-// document.title restituisce "Ciao mondo!"
-
- -

Specifiche

- -

DOM Level 2: title

- -

{{ languages( { "pl": "pl/DOM/document.title" } ) }}

diff --git a/files/it/web/api/document/url/index.html b/files/it/web/api/document/url/index.html deleted file mode 100644 index e3a04cf953..0000000000 --- a/files/it/web/api/document/url/index.html +++ /dev/null @@ -1,29 +0,0 @@ ---- -title: document.URL -slug: Web/API/Document/URL -translation_of: Web/API/Document/URL ---- -
{{APIRef("DOM")}}
- -

Restituisce l'URL del documento corrente.

- -

Sintassi

- -
stringa = document.URL
-
- -

Esempio

- -
var currentURL = document.URL;
-alert(currentURL);
-
- -

Notesù

- -

URL è un sostituto della proprietà non standard document.location.href. Tuttavia document.URL è di sola lettura, diversamente da document.location.href.

- -

Specifiche

- -

DOM Level 2 HTML: URL

- -

{{ languages( { "ja": "ja/DOM/document.URL", "pl": "pl/DOM/document.URL" } ) }}

diff --git a/files/it/web/api/document/width/index.html b/files/it/web/api/document/width/index.html deleted file mode 100644 index 82756dbbc7..0000000000 --- a/files/it/web/api/document/width/index.html +++ /dev/null @@ -1,32 +0,0 @@ ---- -title: document.width -slug: Web/API/Document/width -translation_of: Web/API/Document/width ---- -
{{APIRef("DOM")}}
- -

Restituisce la larghezza in pixel dell'elemento body del documento corrente.

- -

Non supportato da IE.

- -

Sintassi

- -
pixels = document.width;
-
- -

Esempio

- -
function init() {
-  alert("La larghezza del documento è di " + document.width + " pixel.");
-}
-
- -

Note

- -

Si veda document.height.

- -

Specifiche

- -

DOM Level 0. Non è parte di uno standard.

- -

{{ languages( { "pl": "pl/DOM/document.width" } ) }}

diff --git a/files/it/web/api/document/write/index.html b/files/it/web/api/document/write/index.html deleted file mode 100644 index 0337177181..0000000000 --- a/files/it/web/api/document/write/index.html +++ /dev/null @@ -1,74 +0,0 @@ ---- -title: Document.write() -slug: Web/API/Document/write -translation_of: Web/API/Document/write ---- -

{{ ApiRef("DOM") }}

- -

Riassunto

- -

Scrive una stringa di testo in un flusso di documento aperto da document.open().

- -

Sintassi

- -
document.write(markup);
-
- - - -

Example

- -
<html>
-
-<head>
-<title>write example</title>
-
-<script type="text/javascript">
-
-function newContent()
-{
-alert("load new content");
-document.open();
-document.write("<h1>Out with the old - in with the new!</h1>");
-document.close();
-}
-
-</script>
-</head>
-
-<body onload="newContent();">
-<p>Some original document content.</p>
-</body>
-</html>
-
- -

Note

- -

La scrittura di un documento che è gia stato caricato senza document.open() eseguirà automaticamente document.open. Una volta che hai finito di scrivere, si consiglia di chiamare document.close(), per dire al browser di completare il caricamento della pagina. Il testo che si scrive viene analizzato nel modello struttura del documento. Nell'esempio precedente, l'h1 diventa nodo del documento.

- -

Se il document.write() viene incorporato direttamente nel codice HTML, allora non chiamerà il document.open(). Per esempio:

- -
 <div>
-  <script type="text/javascript">
-    document.write("<h1>Main title</h1>")
-  </script>
- </div>
-
- -
Nota: document.write (come document.writeln) non lavora in documenti XHTML (si otterrà "Operazione non ammessa" (NS_ERROR_DOM_NOT_SUPPORTED_ERR) nella console). Questo è il caso se l'apertura di un file locale con estensione .xhtml, o per qualsiasi documento servito con un tipo MIME application/xhtml+xml . Ulteriori informazioni sono disponibili nel W3C XHTML FAQ.
- -

Specificazioni

- - - -

Vedi anche

- - diff --git a/files/it/web/api/document/writeln/index.html b/files/it/web/api/document/writeln/index.html deleted file mode 100644 index 080eb49c4e..0000000000 --- a/files/it/web/api/document/writeln/index.html +++ /dev/null @@ -1,34 +0,0 @@ ---- -title: Document.writeln() -slug: Web/API/Document/writeln -translation_of: Web/API/Document/writeln ---- -

{{ ApiRef("DOM") }}

- -

Scrive una stringa di testo seguita da un carattere di accapo nel documento.

- -

Sintassi

- -
document.writeln(riga);
-
- -

Parametri

- - - -

Esempio

- -
document.writeln("<p>inserisci una password:</p>");
-
- -

Note

- -

document.writeln è uguale a document.write, in più aggiunge una nuova riga.

- -
Nota: document.writeln (come document.write) non funziona nei documenti XHTML (restituisce un errore "Operation is not supported" (Operazione non supportata) (NS_ERROR_DOM_NOT_SUPPORTED_ERR) sulla console degli errori). Questo può capitare per esempio aprendo un file locale con estensione .xhtml o qualsiasi documento da un server che abbia MIME type application/xhtml+xml. Altre informazioni sono disponibili nelle W3C XHTML FAQ.
- -

Specifiche

- -

writeln

diff --git a/files/it/web/api/document_object_model/index.html b/files/it/web/api/document_object_model/index.html deleted file mode 100644 index c1877f3642..0000000000 --- a/files/it/web/api/document_object_model/index.html +++ /dev/null @@ -1,435 +0,0 @@ ---- -title: Document Object Model (DOM) -slug: Web/API/Document_Object_Model -tags: - - API - - DOM - - DOM Reference - - Intermediate - - Reference -translation_of: Web/API/Document_Object_Model ---- -
{{DefaultAPISidebar("DOM")}}
- -

Il Document Object Model (DOM) rappresenta una pagina web come un documento con un albero logico di oggetti.

- -

Ogni ramo dell'albero termina in un nodo, e ogni nodo contiene oggetti. Il modello DOM collega le pagine web agli script o ai linguaggi di programmazione. Usualmente significa usare JavaScript, anche se modellare documenti HTML, SVG o XML come oggetti non è parte del linguaggio JavaScript.

- -

I metodi del DOM permettono un accesso programmatico all'albero; tramite i metodi e le proprietà del DOM è possibile modificare la struttura del documento stesso, lo stile e/o il contenuto.

- -

I nodi possono avere degli eventi aggangiati ad essi e quando un evento viene scatenato, l'handler dell'evento viene eseguito.

- -

E' disponibile una introduzione al DOM.

- -

Interfacce DOM

- -
- -
- -

Interfacce DOM obsolete {{obsolete_inline}}

- -

The Document Object Model has been highly simplified. To achieve this, the following interfaces present in the different DOM level 3 or earlier specification have been removed. It is still not very clear whether some may be reintroduced or not, but for the time being they have to be considered as obsolete and should be avoided:

- -
- -
- -

HTML interfaces

- -

A document containing HTML is described using the {{domxref("HTMLDocument")}} interface. Note that the HTML specification also extends the {{domxref("Document")}} interface.

- -

An HTMLDocument object also gives access to various features of browsers like the tab or the window, in which a page is drawn using the {{domxref("Window")}} interface, the {{domxref("window.style", "Style")}} associated to it (usually CSS), the history of the browser relative to the context, {{domxref("window.history", "History")}}. Eventually, {{domxref("Selection")}} is done on the document.

- -

HTML element interfaces

- -
- -
- -

Other interfaces

- -
- -
- -

Obsolete HTML interfaces {{obsolete_inline}}

- -
- -
- -

SVG interfaces

- -

SVG element interfaces

- -
- -
- -

SVG data type interfaces

- -

Here are the DOM API for data types used in the definitions of SVG properties and attributes.

- -
-

Note: Starting in {{Gecko("5.0")}}, the following SVG-related DOM interfaces representing lists of objects are now indexable and can be accessed ; in addition, they have a length property indicating the number of items in the lists: {{domxref("SVGLengthList")}}, {{domxref("SVGNumberList")}}, {{domxref("SVGPathSegList")}}, and {{domxref("SVGPointList")}}.

-
- -

Static type

- -
- -
- -

Animated type

- -
- -
- - - -
- -
- -

Other SVG interfaces

- -
- -
- -

See also

- - diff --git a/files/it/web/api/document_object_model/introduction/index.html b/files/it/web/api/document_object_model/introduction/index.html deleted file mode 100644 index a3495f7665..0000000000 --- a/files/it/web/api/document_object_model/introduction/index.html +++ /dev/null @@ -1,258 +0,0 @@ ---- -title: Introduzione al DOM -slug: Web/API/Document_Object_Model/Introduction -tags: - - Beginner - - DOM - - Guida - - HTML DOM - - Introduzione - - Principianti - - Tutorial -translation_of: Web/API/Document_Object_Model/Introduction -original_slug: Web/API/Document_Object_Model/Introduzione ---- -

Il Document Object Model (DOM) è la rappresentazione degli oggetti che comprendono la struttura e il contenuto di un documento sul web. In questa guida, introdurremo brevemente il DOM. Vedremo come il DOM rappresenta un documento {{Glossary("HTML")}} o {{Glossary("XML")}} in memoria e come puoi usare le APIs per creare contenuti web e applicazioni.

- -

Che cos'è il DOM?

- -

Il Document Object Model (DOM) è una interfaccia di programmazione per documenti HTML e XML. Rappresenta la pagina in modo che i programmi possano modificare la struttura, lo stile e il contenuto del documento. Il DOM rappresenta il documento come nodi e oggetti. In questo modo, i linguaggi di programmazione possono connettersi alla pagina.

- -

La pagina web è un documento. Questo documento può essere visualizzato nella finestra del browser o come sorgente HTML. Ma è lo stesso documento in entrambi i casi. Il Document Obkect Model (DOM) rappresenta come entrambi i documenti possono essere manipolati. Il DOM è una rappresentazione ad oggetti della pagina web, che può essere modificata con linguaggi di scripting come JavaScript.

- -

Gli standard W3C DOM e WHATWG DOM sono implementati nei più moderni browsers. Molti browsers estendono lo standard, pertanto è necessario prestare attenzione quando li si utilizza sul Web in cui è possibile accedere ai documenti da vari browser con DOM diversi.

- -

Per esempio, lo standard DOM specifica che il metodo getElementsByTagName usato qui sotto, dovrebbe ritornare una lista di tutti gli elementi <p> nel documento.

- -
const paragrafi = document.getElementsByTagName("p");
-// paragrafi[0] è il primo <p> elemento
-// paragrafi[1] è il secondo <p> elemento, etc.
-alert(paragrafi[0].nodeName);
-
- -

Tutte le proprietà, metodi ed eventi disponibili per la manipolazione e la creazione di pagine web sono organizzate in oggetti (per esempio, l'oggetto document che rappresenta il documento stesso, l'oggetto table che implementa la speciale interfaccia DOM {{domxref("HTMLTableElement")}} per accedere alle tabelle HTML, e così via). Questa documentazione fornisce una documentazione oggetto per oggetto al DOM.

- -

Il DOM moderno è costruito utilizzando APIs multiple che lavorano insieme. Il DOM principale definisce gli oggetti che descrivono, fondamentalmente, un documento e gli oggetti al suo interno. Questo viene ampliato come richiesto da altre API che aggiungono nuove funzionalità e capacità al DOM. Ad esempio, l'HTML DOM API aggiunge il supporto per la rappresentazione di documenti HTML nel DOM principale.

- -

DOM e JavaScript

- -

Il breve esempio qui sotto, come quasi tutti gli esempi in questo riferimento, è {{glossary("JavaScript")}}. Che significa che è scrittp in JavaScript ma usa il DOM per accedere al documenti ed ai suoi elementi. Il DOM non è un linguaggio di programmazione, ma senza di esso, il linguaggio JavaScript non potrebbe avere nessun modello o conoscenza sulla pagina web HTML o XML e le loro componenti (ad es. elementi). Ogni elemento nel documento - il documento nel suo insieme, la testata, le tabelle all'interno del documento, le intestazioni delle tabelle, il testo all'interno della cella della tabella - è parte del document object model per quel documento, che può essere accessibile e manipolato usanto il DOM e linguaggi di scripting come Java.

- -

Agli inizi, JavaScript e il DOM 

- -

All'inizio, JavaScript e DOM erano strettamente intrecciati, ma alla fine si sono evoluti in entità separate. Il contenuto della pagina è memorizzato nel DOM e può essere consultato e manipolato tramite JavaScript, in modo da poter scrivere questa equazione approssimativa:

- -

API = DOM + JavaScript

- -

Il DOM è stato progettato per essere indipendente da qualsiasi particolare linguaggio di programmazione, rendendo la rappresentazione strutturale del documento disponibile da un'unica API coerente. Sebbene ci concentriamo esclusivamente su JavaScript in questa documentazione di riferimento, le implementazioni del DOM possono essere costruite per qualsiasi linguaggio, come dimostra questo esempio di Python:

- -
# Esempio DOM in Python
-import xml.dom.minidom as m
-doc = m.parse(r"C:\Projects\Py\chap1.xml")
-doc.nodeName # DOM property of document object
-p_list = doc.getElementsByTagName("para")
-
- -

Per ulteriori informazioni su quali tecnologie sono coinvolte nella scrittura di JavaScript sul Web, vedere JavaScript technologies overview.

- -

Accedere al DOM

- -

Tu non devi fare niente di speciale per avere accesso al DOM. Browser differenti hanno differenti implementazione del DOM, e le loro implementazioni variano in base alla conformazione dello standard DOM (il soggetto che tenta di 

- -

Non devi fare nulla di speciale per iniziare a utilizzare il DOM. Browser diversi hanno implementazioni diverse del DOM e queste implementazioni presentano vari gradi di conformità allo standard DOM effettivo (un argomento che cerchiamo di evitare in questa documentazione), ma ogni browser Web utilizza alcuni modelli di oggetti per rendere accessibili le pagine Web tramite JavaScript .

- -

Quando crei uno script, indipendentemente dal fatto che sia in linea in un elemento <script> o incluso nella pagina Web mediante un'istruzione di caricamento degli script, puoi immediatamente iniziare a utilizzare l'API {{domxref ("document")}} o {{domxref("Window", "window")}} per manipolare il documento stesso o per ottenere i figli di quel documento, che sono i vari elementi nella pagina web. La tua programmazione DOM potrebbe essere qualcosa di semplice come la seguente, che visualizza un messaggio di avviso utilizzando la funzione {{domxref("window.alert", "alert()")}} dalla funzione {{domxref("Window", "window")}} oppure può utilizzare metodi DOM più sofisticati per creare effettivamente nuovi contenuti, come nell'esempio più lungo di seguito.

- -
<body onload="window.alert('Benvenuto nella mia pagina web!');">
-
- -

Un altro esempio. Questa funzione crea un nuovo elemento H1, gli aggiunge del testo (all'elemento) e, infine, aggiunge l'H1 all'albero di questo documento.

- -
<html>
-  <head>
-    <script>
-       // esegui questa funzione quando la pagina è stata caricata
-       window.onload = function() {
-
-         // crea un paio di elementi in una pagina HTML altrimenti vuota
-         const heading = document.createElement("h1");
-         const heading_text = document.createTextNode("Big Head!");
-         heading.appendChild(heading_text);
-         document.body.appendChild(heading);
-      }
-    </script>
-  </head>
-  <body>
-  </body>
-</html>
-
- -

Tipi di dati fondamentali

- -

Questo riferimento cerca di descrivere i vari oggetti e tipi in termini semplici. Tuttavia, ci sono diversi tipi di dati che vengono trasmessi all'API di cui dovresti essere a conoscenza.

- -
-

Nota: poiché la stragrande maggioranza del codice che utilizza il DOM ruota attorno alla manipolazione di documenti HTML, è comune fare riferimento ai nodi nel DOM come elementi anche se, a rigor di termini, non tutti i nodi sono un elemento.

-
- -

La tabella seguente descrive brevemente questi tipi di dati.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Tipi di dati (Interfaccia)Descrizione
{{domxref("Document")}} -

Quando un membro restituisce un oggetto di tipo documento (ad esempio, la proprietà ownerDocument di un elemento restituisce il document a cui appartiene), questo oggetto è l'oggetto del documento radice stesso. Il capitolo DOM document Reference descrive l'oggetto del documento.

-
{{domxref("Node")}}Ogni oggetto situato all'interno di un documento è un nodo di qualche tipo. In un documento HTML, un oggetto può essere un nodo elemento ma anche un nodo testo o nodo attributo.
{{domxref("Element")}}Il tipo element è basado sul node. Si riferisce a un elemento o un nodo di tipo element restituito da un membro dell'API DOM. Anziché dire, ad esempio, che il metodo{{domxref("document.createElement()")}} restituisce un riferimento a un oggetto a un node, diciamo solo che questo metodo restituisce l'element che è stato appena creato nel DOM. Gli oggetti element implementano l'interfaccia DOM Element e anche l'interfaccia Node più basilare, entrambe incluse in questo riferimento. In un documento HTML, gli elementi sono ulteriormente migliorati dall'interfaccia {{domxref("HTMLElement")}} dell'API DOM HTML e da altre interfacce che descrivono le capacità di tipi specifici di elementi (ad esempio {{domxref("HTMLTableElement")}} per {{HTMLElement("table")}} elements).
{{domxref("NodeList")}}Una nodeList è un array di elementi, simili al tipo ritornanto dal metodo.{{domxref("document.getElementsByTagName()")}}. Gli elementi nel nodeList sono accessibili, da indice, tramite due opzioni: -
    -
  • list.item(1)
    • -
  • list[1]
    • -
- Questi due sono equivalenti. Nel primo, item() è un singolo metodo dell'oggetto nodeList. Quest'ultimo utilizza la tipica sintassi dell'array per recuperare il secondo elemento nell'elenco.
{{domxref("Attribute")}}Quando un attribute viene restituito da un membro (ad es. con il metodo createAttribute()), si ha un riferimento a un oggetto che espone un'interfaccia speciale (sebbene piccola) per gli attributi. Gli attributi sono nodi nel DOM proprio come gli elementi, anche se raramente li puoi usare come tali.
{{domxref("NamedNodeMap")}}Un namedNodeMap è simile a un array ma è possibile accedere agli elementi in base al nome o all'indice, sebbene quest'ultimo caso sia solo una comodità per l'enumerazione, poiché non sono in un ordine particolare nell'elenco. Un namedNodeMap ha un metodo item() per questo scopo e puoi anche aggiungere e rimuovere elementi da una namedNodeMap.
- -

Ci sono anche alcune considerazioni terminologiche comuni da tenere a mente. È comune fare riferimento a qualsiasi nodo {{domxref ("Attribute")}} semplicemente come un attribute, ad esempio, e fare riferimento a un array di nodi DOM come nodeList. Troverai questi termini e altri da introdurre e utilizzare in tutta la documentazione.

- -

interfaccia DOM

- -

Questa guida riguarda gli oggetti e le cose reali che puoi usare per manipolare la gerarchia DOM. Ci sono molti punti in cui capire come questi lavori possono essere fonte di confusione. Ad esempio, l'oggetto che rappresenta l'elemento del modulo HTML ottiene la sua proprietà name dall'interfaccia HTMLFormElement ma la sua proprietà className dall'interfaccia HTMLElement. In entrambi i casi, la proprietà desiderata è semplicemente nell'oggetto modulo.
-
- Ma la relazione tra gli oggetti e le interfacce che implementano nel DOM può essere confusa, e quindi questa sezione tenta di dire qualcosa sulle interfacce effettive nella specifica DOM e su come sono rese disponibili.

- -

Interfacce ed oggetti

- -

Molti oggetti prendono in prestito da diverse interfacce. L'oggetto tabella, ad esempio, implementa un'interfaccia specializzata {{domxref("HTMLTableElement")}}, che include metodi come createCaption e insertRow. Ma poiché è anche un elemento HTML, la table implementa l'interfaccia Element descritta nel capitolo DOM {{domxref ("Element")}}. E infine, poiché un elemento HTML è anche, per quanto riguarda il DOM, un nodo nella struttura ad albero dei nodi che compongono il modello a oggetti per una pagina HTML o XML, l'oggetto table implementa anche l'interfaccia Node di base, da quale Element deriva.

- -

Quando si ottiene un riferimento a un oggetto table, come nell'esempio seguente, si utilizzano abitualmente tutte e tre queste interfacce in modo intercambiabile sull'oggetto, forse senza saperlo.

- -
const table = document.getElementById("table");
-const tableAttrs = table.attributes; // Node/Element interface
-for (let i = 0; i < tableAttrs.length; i++) {
-  // HTMLTableElement interface: border attribute
-  if(tableAttrs[i].nodeName.toLowerCase() == "border")
-    table.border = "1";
-}
-// HTMLTableElement interface: summary attribute
-table.summary = "note: increased border";
-
- -

Principali interfacce nel DOM

- -

Questa sezione elenca alcune delle interfacce più comunemente utilizzate nel DOM. L'idea non è di descrivere cosa fanno queste API qui, ma di darti un'idea del tipo di metodi e proprietà che vedrai molto spesso mentre usi il DOM. Queste API comuni sono usate negli esempi più lunghi nel capitolo DOM Examples alla fine di questo libro.

- -

Gli oggetti document e window sono gli oggetti le cui interfacce si utilizzano generalmente più spesso nella programmazione DOM. In termini semplici, l'oggetto window rappresenta qualcosa di simile al browser e l'oggetto document è la radice del documento stesso. L'Element eredita dall'interfaccia del Node generico e insieme queste due interfacce forniscono molti dei metodi e delle proprietà che usi sui singoli elementi. Questi elementi possono anche avere interfacce specifiche per gestire il tipo di dati contenuti in tali elementi, come nell'esempio dell'oggetto tabella nella sezione precedente.

- -

Di seguito è riportato un breve elenco di API comuni negli script di pagine Web e XML che utilizzano DOM.

- - - -

Test dell'API DOM

- -

Questo documento fornisce esempi per ogni interfaccia che è possibile utilizzare nel proprio sviluppo Web. In alcuni casi, gli esempi sono pagine HTML complete, con l'accesso DOM in un elemento <script>, l'interfaccia (ad es. Pulsanti) necessaria per accendere lo script in un modulo e gli elementi HTML su cui opera il DOM elencati come bene. In questo caso, puoi tagliare e incollare l'esempio in un nuovo documento HTML, salvarlo ed eseguire l'esempio dal browser.

- -

Ci sono alcuni casi, tuttavia, quando gli esempi sono più concisi. Per eseguire esempi che dimostrano solo la relazione di base dell'interfaccia con gli elementi HTML, è possibile impostare una pagina di prova in cui è possibile accedere facilmente alle interfacce dagli script. La seguente pagina Web molto semplice fornisce un elemento <script> nell'intestazione in cui è possibile inserire funzioni che testano l'interfaccia, alcuni elementi HTML con attributi che è possibile recuperare, impostare o altrimenti manipolare e l'interfaccia utente Web necessaria per chiama quelle funzioni dal browser.

- -

Puoi utilizzare questa pagina di prova o crearne una simile per testare le interfacce DOM che ti interessano e vedere come funzionano sulla piattaforma del browser. È possibile aggiornare il contenuto della funzione test() secondo necessità, creare più pulsanti o aggiungere elementi se necessario.

- -
<html>
-<head>
-  <title>DOM Tests</title>
-  <script>
-    function setBodyAttr(attr, value) {
-      if (document.body) document.body[attr] = value;
-      else throw new Error("no support");
-    }
-  </script>
-</head>
-<body>
-  <div style="margin: .5in; height: 400px;">
-    <p><b><tt>text</tt></b></p>
-    <form>
-      <select onChange="setBodyAttr('text',
-        this.options[this.selectedIndex].value);">
-        <option value="black">black</option>
-        <option value="red">red</option>
-      </select>
-      <p><b><tt>bgColor</tt></b></p>
-      <select onChange="setBodyAttr('bgColor',
-        this.options[this.selectedIndex].value);">
-        <option value="white">white</option>
-        <option value="lightgrey">gray</option>
-      </select>
-      <p><b><tt>link</tt></b></p>
-      <select onChange="setBodyAttr('link',
-        this.options[this.selectedIndex].value);">
-        <option value="blue">blue</option>
-        <option value="green">green</option>
-      </select>
-      <small>
-        <a href="http://some.website.tld/page.html" id="sample">
-          (sample link)
-        </a>
-      </small><br />
-      <input type="button" value="version" onclick="ver()" />
-    </form>
-  </div>
-</body>
-</html>
-
- -

Per testare molte interfacce in una singola pagina —ad esempio una "suite" di proprietà che influisce sui colori di una pagina Web— è possibile creare una pagina di test simile con un'intera console di pulsanti, campi di testo e altri elementi HTML. La schermata seguente ti dà un'idea di come le interfacce possono essere raggruppate per il test.

- -
-
Figure 0.1 Esempio DOM Test Page
-Image:DOM_Ref_Introduction_to_the_DOM.gif
- -

In questo esempio, i menu drop-down, aggiornano dinamicamente tali aspetti accessibili della pagina Web come il colore di sfondo (bgColor), il colore dei collegamenti ipertestuali (aLink) e il colore del testo (text). Tuttavia, progettate le vostre pagine di test e testare le interfacce mentre le implementate è una parte importante dell'apprendimento dell'uso efficace del DOM.

- - - - - -
{{DefaultAPISidebar("DOM")}}
diff --git a/files/it/web/api/document_object_model/locating_dom_elements_using_selectors/index.html b/files/it/web/api/document_object_model/locating_dom_elements_using_selectors/index.html deleted file mode 100644 index 7e82547d5d..0000000000 --- a/files/it/web/api/document_object_model/locating_dom_elements_using_selectors/index.html +++ /dev/null @@ -1,46 +0,0 @@ ---- -title: Individuazione degli elementi DOM mediante selettori -slug: Web/API/Document_Object_Model/Locating_DOM_elements_using_selectors -translation_of: Web/API/Document_object_model/Locating_DOM_elements_using_selectors ---- -

L'API dei selettori fornisce metodi che consentono di recuperare in modo rapido e semplice i nodi {{domxref("Element")}} dal DOM confrontando una serie di selettori. Questo è molto più rapido rispetto alle tecniche passate, in cui era necessario, ad esempio, utilizzare un loop nel codice JavaScript per individuare gli elementi specifici che dovevi trovare.

- -

L'interfaccia NodeSelector

- -

Questa specifica aggiunge due nuovi metodi a qualsiasi oggetto che implementa le interfacce {{domxref("Document")}}, {{domxref("DocumentFragment")}}, o {{domxref("Element")}}:

- -
-
querySelector
-
Restituisce il primo nodo {{domxref("Element")}} corrispondente nella sottostruttura del nodo. Se non viene trovato alcun nodo corrispondente, viene restituito null.
-
querySelectorAll
-
Restituisce una {{domxref("NodeList")}} contenente tutti i nodi Element corrispondenti all'interno della sottostruttura del nodo o una NodeList vuota se non vengono trovate corrispondenze.
-
- -
Note: La {{domxref("NodeList")}} restituita da {{domxref("Element.querySelectorAll()", "querySelectorAll()")}} non è dinamica, il che significa che le modifiche nel DOM non si riflettono nella collezione. Questo è diverso dagli altri metodi di DOM querying che restituiscono gli elenchi dei nodi dinamici.
- -

È possibile trovare esempi e dettagli leggendo la documentazione per i metodi {{domxref("Element.querySelector()")}} e {{domxref("Element.querySelectorAll()")}}, nonché nell'articolo Code snippets for querySelector.

- -

Selettori

- -

I metodi di selezione accettano uno o più selettori separati da virgola per determinare quale elemento o elementi devono essere restituiti. Ad esempio, per selezionare tutti gli elementi paragrafo (p)  in un documento la cui classe CSS è warning o note, è possibile effettuare le seguenti operazioni:

- -
var special = document.querySelectorAll("p.warning, p.note");
- -

Puoi anche effettuare una query per ID. Per esempio:

- -
var el = document.querySelector("#main, #basic, #exclamation");
- -

Dopo aver eseguito il codice sopra, el contiene il primo elemento nel documento il cui ID è uno di main, basic, o exclamation.

- -

Puoi usare qualsiasi selettore CSS con i metodi querySelector() e querySelectorAll().

- -

Vedi anche

- - diff --git a/files/it/web/api/domstring/index.html b/files/it/web/api/domstring/index.html deleted file mode 100644 index 625d5762d3..0000000000 --- a/files/it/web/api/domstring/index.html +++ /dev/null @@ -1,56 +0,0 @@ ---- -title: DOMString -slug: Web/API/DOMString -tags: - - API - - DOM - - Referenza - - String -translation_of: Web/API/DOMString ---- -
{{APIRef("DOM")}}
- -

DOMString è una stringa UTF-16. Poiché JavaScript utilizza già tali stringhe, DOMString viene mappato direttamente su {{jsxref("String")}}.

- -

Passare {{jsxref("null")}} ad un metodo o parametro che accetta una DOMString tipicamente si trasforma in "null".

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('WebIDL', '#idl-DOMString', 'DOMString')}}{{Spec2('WebIDL')}}Riformulazione della definizione per rimuovere casi di bordo strani.
{{SpecName('DOM3 Core', 'core.html#DOMString', 'DOMString')}}{{Spec2('DOM3 Core')}}Nessun cambiamento da {{SpecName('DOM2 Core')}}.
{{SpecName('DOM2 Core', 'core.html#ID-C74D1578', 'DOMString')}}{{Spec2('DOM2 Core')}}Nessun cambiamento da {{SpecName('DOM1')}}.
{{SpecName('DOM1', 'level-one-core.html#ID-C74D1578', 'DOMString')}}{{Spec2('DOM1')}}Definizione iniziale.
- -

Vedi anche

- - diff --git a/files/it/web/api/domtokenlist/index.html b/files/it/web/api/domtokenlist/index.html deleted file mode 100644 index dab0967959..0000000000 --- a/files/it/web/api/domtokenlist/index.html +++ /dev/null @@ -1,115 +0,0 @@ ---- -title: DOMTokenList -slug: Web/API/DOMTokenList -tags: - - API - - DOM - - DOMTokenList - - Interfaccia - - Referenza -translation_of: Web/API/DOMTokenList ---- -
{{APIRef("DOM")}}
- -

L'interfaccia DOMTokenList rappresenta un insieme di token separati dallo spazio. Tale insieme viene restituito da {{domxref("Element.classList")}}, {{domxref("HTMLLinkElement.relList")}}, {{domxref("HTMLAnchorElement.relList")}}, {{domxref("HTMLAreaElement.relList")}}, {{domxref("HTMLIframeElement.sandbox")}}, o {{domxref("HTMLOutputElement.htmlFor")}}. Viene indicizzato a partire da 0 come con gli JavaScript {{jsxref("Array")}} oggetti. DOMTokenList è sempre case-sensitive.

- -

Proprietà

- -
-
{{domxref("DOMTokenList.length")}} {{ReadOnlyInline}}
-
È un integer che rappresenta il numero di oggetti memorizzati nell'oggetto.
-
{{domxref("DOMTokenList.value")}}
-
Il valore della lista come una {{domxref("DOMString")}}.
-
- -

Metodi

- -
-
{{domxref("DOMTokenList.item()")}}
-
Restituisce un elemento nell'elenco per il suo indice (restituisce undefined se il numero è maggiore o uguale alla lunghezza dell'elenco).
-
{{domxref("DOMTokenList.contains()")}}
-
Restituisce true se la lista contiene il token dato, altrimenti false.
-
{{domxref("DOMTokenList.add()")}}
-
Aggiunge il token indicato alla lista.
-
{{domxref("DOMTokenList.remove()")}}
-
Rimuove il token specificato dall'elenco.
-
{{domxref("DOMTokenList.replace()")}}
-
Sostituisce un token esistente con un nuovo token.
-
{{domxref("DOMTokenList.supports()")}}
-
Restituisce true se un determinato token si trova nei token supportati dell'attributo associato.
-
{{domxref("DOMTokenList.toggle()")}}
-
Rimuove un determinato token dall'elenco e restituisce false. Se il token non esiste viene aggiunto e la funzione restituisce true.
-
{{domxref("DOMTokenList.entries()")}}
-
Restituisce un {{jsxref("Iteration_protocols","iterator")}} consentendoti di passare attraverso tutte le coppie chiave/valore contenute in questo oggetto.
-
{{domxref("DOMTokenList.forEach()")}}
-
Esegue una funzione fornita una volta per elemento DOMTokenList.
-
{{domxref("DOMTokenList.keys()")}}
-
Restituisce un {{jsxref("Iteration_protocols", "iterator")}} consentendo di esaminare tutte le chiavi delle coppie chiave/valore contenute in questo oggetto.
-
{{domxref("DOMTokenList.values()")}}
-
Restituisce un {{jsxref("Iteration_protocols", "iterator")}} consentendo di esaminare tutti i valori delle coppie chiave/valore contenute in questo oggetto.
-
- -

Esempi

- -

Nel seguente semplice esempio, recuperiamo l'elenco di classi impostato su un elemento {{htmlelement("p")}} come una DOMTokenList usando {{domxref("Element.classList")}}, aggiungi una classe usando {{domxref("DOMTokenList.add()")}}, quindi aggiorna il {{domxref("Node.textContent")}} di <p> per uguagliare DOMTokenList.

- -

Innanzitutto, l'HTML:

- -
<p class="a b c"></p>
- -

Ora JavaScript:

- -
var para = document.querySelector("p");
-var classes = para.classList;
-para.classList.add("d");
-para.textContent = 'paragraph classList is "' + classes + '"';
- -

L'output è simile a questo:

- -

{{ EmbedLiveSample('Esempi', '100%', 60) }}

- -

Taglio di spazi bianchi e rimozione di duplicati

- -

I metodi che modificano DOMTokenList (come {{domxref("DOMTokenList.add()")}}) tagliano automaticamente gli spazi bianchi in eccesso e rimuovono i valori duplicati dall'elenco. Per esempio:

- -
<span class="    d   d e f"></span>
- -
var span = document.querySelector("span");
-var classes = span.classList;
-span.classList.add("x");
-span.textContent = 'span classList is "' + classes + '"';
- -

L'output è simile a questo:

- -

{{ EmbedLiveSample('Trimming_of_whitespace_and_removal_of_duplicates', '100%', 60) }}

- -

Specificazioni

- - - - - - - - - - - - - - - - -
SpecificazioneStatoCommento
{{SpecName("DOM WHATWG", "#interface-domtokenlist", "DOMTokenList")}}{{Spec2("DOM WHATWG")}}Initial definition
- -

Compatibilità con i browser

- - - -

{{Compat("api.DOMTokenList")}}

- -

Guarda anche

- - diff --git a/files/it/web/api/domtokenlist/item/index.html b/files/it/web/api/domtokenlist/item/index.html deleted file mode 100644 index c81eedcbc9..0000000000 --- a/files/it/web/api/domtokenlist/item/index.html +++ /dev/null @@ -1,67 +0,0 @@ ---- -title: DOMTokenList.item() -slug: Web/API/DOMTokenList/item -translation_of: Web/API/DOMTokenList/item ---- -

{{APIRef("DOM")}}

- -

Il metodo item() dell'interfaccia {{domxref("DOMTokenList")}} restituisce un elemento nell'elenco per il suo indice.

- -

Sintassi

- -
tokenList.item(index);
- -

Parametri

- -
-
index
-
Una {{domxref("DOMString")}} che rappresenta l'indice dell'elemento che si desidera restituire.
-
- -

Valore di ritorno

- -

Una {{domxref("DOMString")}} che rappresenta l'elemento restituito. Restituisce undefined se il numero è maggiore o uguale alla lunghezza della lista.

- -

Esempi

- -

Nel seguente esempio recuperiamo l'elenco di classi impostate su un elemento {{htmlelement("span")}} come DOMTokenList usando {{domxref("Element.classList")}}. Quindi recuperiamo l'ultimo elemento nell'elenco usando item(length-1) e lo scriviamo nel <span>'s {{domxref("Node.textContent")}}.

- -

Innanzitutto, l'HTML:

- -
<span class="a b c"></span>
- -

Ora JavaScript:

- -
var span = document.querySelector("span");
-var classes = span.classList;
-var item = classes.item(classes.length-1);
-span.textContent = item;
- -

L'output è simile a questo:

- -

{{ EmbedLiveSample('Examples', '100%', 60) }}

- -

Specifiche

- - - - - - - - - - - - - - -
SpecificazioneStatoCommento
{{SpecName('DOM WHATWG','#dom-domtokenlist-item','item()')}}{{Spec2('DOM WHATWG')}}Definizione iniziale
- -

Compatibilità con i Browser

- -
- - -

{{Compat("api.DOMTokenList.item")}}

-
diff --git a/files/it/web/api/element/attributes/index.html b/files/it/web/api/element/attributes/index.html deleted file mode 100644 index 5bd14f3e4b..0000000000 --- a/files/it/web/api/element/attributes/index.html +++ /dev/null @@ -1,120 +0,0 @@ ---- -title: Element.attributes -slug: Web/API/Element/attributes -tags: - - API - - Attributi - - DOM - - Element - - Proprietà - - Referenza -translation_of: Web/API/Element/attributes ---- -

{{ APIRef("DOM") }}

- -

La proprietà Element.attributes restituisce una raccolta in tempo reale di tutti i nodi di attributo registrati nel nodo specificato. È una {{domxref("NamedNodeMap")}}, non un Array, quindi non ha metodi predefiniti degli {{jsxref("Array")}} e non ha i metodi {{domxref("Attr")}} dei nodi che possono differire tra i browser. Per essere più specifici, attributes è una coppia chiave/valore di stringhe che rappresenta qualsiasi informazione riguardante quell'attributo.

- -

Sintassi

- -
var attr = element.attributes;
-
- -

Esempio

- -

Esempi basilari

- -
// Ottenere il primo elemento <p> nel documento
-var para = document.getElementsByTagName("p")[0];
-var atts = para.attributes;
- -

Enumerazione degli attributi degli elementi

- -

L'indicizzazione numerica è utile per passare attraverso tutti gli attributi di un elemento.
- L'esempio seguente esegue i nodi dell'attributo per l'elemento nel documento con id "paragraph" e stampa il valore di ciascun attributo.

- -
<!DOCTYPE html>
-
-<html>
-
- <head>
-  <title>Attributes example</title>
-  <script type="text/javascript">
-   function listAttributes() {
-     var paragraph = document.getElementById("paragraph");
-     var result = document.getElementById("result");
-
-     // First, let's verify that the paragraph has some attributes
-     if (paragraph.hasAttributes()) {
-       var attrs = paragraph.attributes;
-       var output = "";
-       for(var i = attrs.length - 1; i >= 0; i--) {
-         output += attrs[i].name + "->" + attrs[i].value;
-       }
-       result.value = output;
-     } else {
-       result.value = "No attributes to show";
-     }
-   }
-  </script>
- </head>
-
-<body>
- <p id="paragraph" style="color: green;">Sample Paragraph</p>
- <form action="">
-  <p>
-    <input type="button" value="Show first attribute name and value"
-      onclick="listAttributes();">
-    <input id="result" type="text" value="">
-  </p>
- </form>
-</body>
-</html>
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', '#dom-element-attributes', 'Element.attributes')}}{{Spec2('DOM WHATWG')}}Da {{SpecName('DOM3 Core')}}, spostato da {{domxref("Node")}} a {{domxref("Element")}}
{{SpecName('DOM3 Core', 'core.html#ID-84CF096', 'Element.attributes')}}{{Spec2('DOM3 Core')}}Nessun cambiamento da {{SpecName('DOM2 Core')}}
{{SpecName('DOM2 Core', 'core.html#ID-84CF096', 'Element.attributes')}}{{Spec2('DOM2 Core')}}Nessun cambiamento da {{SpecName('DOM1')}}
{{SpecName('DOM1', 'level-one-core.html#ID-84CF096', 'Element.attributes')}}{{Spec2('DOM1')}}Definizione iniziale.
- -

Compatibilità con i browser

- - - -

{{Compat("api.Element.attributes")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/element/classlist/index.html b/files/it/web/api/element/classlist/index.html deleted file mode 100644 index 3d86fa8400..0000000000 --- a/files/it/web/api/element/classlist/index.html +++ /dev/null @@ -1,288 +0,0 @@ ---- -title: Element.classList -slug: Web/API/Element/classList -tags: - - API - - DOM - - Element - - Proprietà - - Read-only - - Referenza -translation_of: Web/API/Element/classList ---- -
{{APIRef("DOM")}}
- -

La proprietà Element.classList di sola lettura restituisce una raccolta {{domxref("DOMTokenList")}} dinamica delle classi dell'elemento.

- -

L'utilizzo di classList è una comoda alternativa all'accesso all'elenco di classi di un elemento come stringa delimitata dallo spazio tramite {{domxref("element.className")}}.

- -

Sintassi

- -
const elementClasses = elementNodeReference.classList;
-
- -

elementClasses è una {{domxref("DOMTokenList")}} che rappresenta l'attributo class di elementNodeReference. Se l'attributo class non è stato impostato o è vuoto elementClasses.length ritorna 0. element.classList è di sola lettura, sebbene sia possibile modificarlo utilizzando i metodi add() e remove().

- -

Metodi

- -
-
add( String [, String [, ...]] )
-
Aggiunge le classi specificate. Se queste classi esistono già nell'attributo class dell'elemento, vengono ignorate.
-
remove( String [, String [, ...]] )
-
-

Rimuove le classi specificate.

- -
Nota: La rimozione di una classe inesistente NON genera un errore.
-
-
item( Number )
-
Restituisce il valore della classe per indice nella collezione.
-
toggle( String [, force] )
-
Quando è presente un solo argomento: aggiunge/rimuove il valore della classe; ad esempio, se la classe esiste, la rimuove e restituisce false, altrimenti, la aggiunge e restituisce true.
-
- Quando è presente un secondo argomento: Se il secondo argomento restituisce true, aggiunge la classe specificata; se restituisce false, la rimuove.
-
contains( String )
-
Verifica se il valore di classe specificato esiste nell'attributo class dell'elemento.
-
replace( vecchiaClasse, nuovaClasse )
-
Sostituisce una classe esistente con una nuova classe.
-
- -

Esempi

- -
const div = document.createElement('div');
-div.className = 'foo';
-
-// il nostro stato iniziale: <div class="foo"></div>
-console.log(div.outerHTML);
-
-// usare l'API classList per rimuovere e aggiungere classi
-div.classList.remove("foo");
-div.classList.add("anotherclass");
-
-// <div class="anotherclass"></div>
-console.log(div.outerHTML);
-
-// se visible è impostato rimuovilo, altrimenti aggiungilo
-div.classList.toggle("visible");
-
-// aggiungi/rimuovi visible, a seconda del test condizionale, i meno di 10
-div.classList.toggle("visible", i < 10 );
-
-console.log(div.classList.contains("foo"));
-
-// aggiungere o rimuovere più classi
-div.classList.add("foo", "bar", "baz");
-div.classList.remove("foo", "bar", "baz");
-
-// aggiungere o rimuovere più classi utilizzando la spread syntax
-const cls = ["foo", "bar"];
-div.classList.add(...cls);
-div.classList.remove(...cls);
-
-// sostituire la classe "foo" con la classe "bar"
-div.classList.replace("foo", "bar");
- -
-

Le versioni di Firefox precedenti alla 26 non implementano l'uso di diversi argomenti nei metodi add/remove/toggle. Vedi https://bugzilla.mozilla.org/show_bug.cgi?id=814014

-
- -
-
- -

Polyfill

- -

L'evento legacy onpropertychange può essere utilizzato per creare un mockup dinamico di classList dinamico grazie alla proprietà Element.prototype.className che attiva l'evento specificato una volta modificato.

- -

Il seguente polyfill sia per classList che per DOMTokenList garantisce la piena conformità (copertura) per tutti i metodi e le proprietà standard di Element.prototype.classList per i browser IE10-IE11 oltre ad un comportamento quasi conforme per IE 6-9. Controlla:

- -
// 1. String.prototype.trim polyfill
-if (!"".trim) String.prototype.trim = function(){ return this.replace(/^[\s]+|[\s]+$/g, ''); };
-(function(window){"use strict"; // prevent global namespace pollution
-if(!window.DOMException) (DOMException = function(reason){this.message = reason}).prototype = new Error;
-var wsRE = /[\11\12\14\15\40]/, wsIndex = 0, checkIfValidClassListEntry = function(O, V) {
-  if (V === "") throw new DOMException(
-    "Failed to execute '" + O + "' on 'DOMTokenList': The token provided must not be empty." );
-  if((wsIndex=V.search(wsRE))!==-1) throw new DOMException("Failed to execute '"+O+"' on 'DOMTokenList': " +
-    "The token provided ('"+V[wsIndex]+"') contains HTML space characters, which are not valid in tokens.");
-}
-// 2. Implement the barebones DOMTokenList livelyness polyfill
-if (typeof DOMTokenList !== "function") (function(window){
-    var document = window.document, Object = window.Object, hasOwnProp = Object.prototype.hasOwnProperty;
-    var defineProperty = Object.defineProperty, allowTokenListConstruction = 0, skipPropChange = 0;
-    function DOMTokenList(){
-        if (!allowTokenListConstruction) throw TypeError("Illegal constructor"); // internally let it through
-    }
-    DOMTokenList.prototype.toString = DOMTokenList.prototype.toLocaleString = function(){return this.value};
-    DOMTokenList.prototype.add = function(){
-        a: for(var v=0, argLen=arguments.length,val="",ele=this[" uCL"],proto=ele[" uCLp"]; v!==argLen; ++v) {
-            val = arguments[v] + "", checkIfValidClassListEntry("add", val);
-            for (var i=0, Len=proto.length, resStr=val; i !== Len; ++i)
-                if (this[i] === val) continue a; else resStr += " " + this[i];
-            this[Len] = val, proto.length += 1, proto.value = resStr;
-        }
-        skipPropChange = 1, ele.className = proto.value, skipPropChange = 0;
-    };
-    DOMTokenList.prototype.remove = function(){
-        for (var v=0, argLen=arguments.length,val="",ele=this[" uCL"],proto=ele[" uCLp"]; v !== argLen; ++v) {
-            val = arguments[v] + "", checkIfValidClassListEntry("remove", val);
-            for (var i=0, Len=proto.length, resStr="", is=0; i !== Len; ++i)
-                if(is){ this[i-1]=this[i] }else{ if(this[i] !== val){ resStr+=this[i]+" "; }else{ is=1; } }
-            if (!is) continue;
-            delete this[Len], proto.length -= 1, proto.value = resStr;
-        }
-        skipPropChange = 1, ele.className = proto.value, skipPropChange = 0;
-    };
-    window.DOMTokenList = DOMTokenList;
-    function whenPropChanges(){
-        var evt = window.event, prop = evt.propertyName;
-        if ( !skipPropChange && (prop==="className" || (prop==="classList" && !defineProperty)) ) {
-            var target = evt.srcElement, protoObjProto = target[" uCLp"], strval = "" + target[prop];
-            var tokens=strval.trim().split(wsRE), resTokenList=target[prop==="classList"?" uCL":"classList"];
-            var oldLen = protoObjProto.length;
-            a: for(var cI = 0, cLen = protoObjProto.length = tokens.length, sub = 0; cI !== cLen; ++cI){
-                for(var innerI=0; innerI!==cI; ++innerI) if(tokens[innerI]===tokens[cI]) {sub++; continue a;}
-                resTokenList[cI-sub] = tokens[cI];
-            }
-            for (var i=cLen-sub; i < oldLen; ++i) delete resTokenList[i]; //remove trailing indexs
-            if(prop !== "classList") return;
-            skipPropChange = 1, target.classList = resTokenList, target.className = strval;
-            skipPropChange = 0, resTokenList.length = tokens.length - sub;
-        }
-    }
-    function polyfillClassList(ele){
-        if (!ele || !("innerHTML" in ele)) throw TypeError("Illegal invocation");
-        ele.detachEvent( "onpropertychange", whenPropChanges ); // prevent duplicate handler infinite loop
-        allowTokenListConstruction = 1;
-        try{ function protoObj(){} protoObj.prototype = new DOMTokenList(); }
-        finally { allowTokenListConstruction = 0 }
-        var protoObjProto = protoObj.prototype, resTokenList = new protoObj();
-        a: for(var toks=ele.className.trim().split(wsRE), cI=0, cLen=toks.length, sub=0; cI !== cLen; ++cI){
-            for (var innerI=0; innerI !== cI; ++innerI) if (toks[innerI] === toks[cI]) { sub++; continue a; }
-            this[cI-sub] = toks[cI];
-        }
-        protoObjProto.length = cLen-sub, protoObjProto.value = ele.className, protoObjProto[" uCL"] = ele;
-        if (defineProperty) { defineProperty(ele, "classList", { // IE8 & IE9 allow defineProperty on the DOM
-            enumerable:   1, get: function(){return resTokenList},
-            configurable: 0, set: function(newVal){
-                skipPropChange = 1, ele.className = protoObjProto.value = (newVal += ""), skipPropChange = 0;
-                var toks = newVal.trim().split(wsRE), oldLen = protoObjProto.length;
-                a: for(var cI = 0, cLen = protoObjProto.length = toks.length, sub = 0; cI !== cLen; ++cI){
-                    for(var innerI=0; innerI!==cI; ++innerI) if(toks[innerI]===toks[cI]) {sub++; continue a;}
-                    resTokenList[cI-sub] = toks[cI];
-                }
-                for (var i=cLen-sub; i < oldLen; ++i) delete resTokenList[i]; //remove trailing indexs
-            }
-        }); defineProperty(ele, " uCLp", { // for accessing the hidden prototype
-            enumerable: 0, configurable: 0, writeable: 0, value: protoObj.prototype
-        }); defineProperty(protoObjProto, " uCL", {
-            enumerable: 0, configurable: 0, writeable: 0, value: ele
-        }); } else { ele.classList=resTokenList, ele[" uCL"]=resTokenList, ele[" uCLp"]=protoObj.prototype; }
-        ele.attachEvent( "onpropertychange", whenPropChanges );
-    }
-    try { // Much faster & cleaner version for IE8 & IE9:
-        // Should work in IE8 because Element.prototype instanceof Node is true according to the specs
-        window.Object.defineProperty(window.Element.prototype, "classList", {
-            enumerable: 1,   get: function(val){
-                                 if (!hasOwnProp.call(this, "classList")) polyfillClassList(this);
-                                 return this.classList;
-                             },
-            configurable: 0, set: function(val){this.className = val}
-        });
-    } catch(e) { // Less performant fallback for older browsers (IE 6-8):
-        window[" uCL"] = polyfillClassList;
-        // the below code ensures polyfillClassList is applied to all current and future elements in the doc.
-        document.documentElement.firstChild.appendChild(document.createElement('style')).styleSheet.cssText=(
-            '_*{x-uCLp:expression(!this.hasOwnProperty("classList")&&window[" uCL"](this))}' + //  IE6
-            '[class]{x-uCLp/**/:expression(!this.hasOwnProperty("classList")&&window[" uCL"](this))}' //IE7-8
-        );
-    }
-})(window);
-// 3. Patch in unsupported methods in DOMTokenList
-(function(DOMTokenListProto, testClass){
-    if (!DOMTokenListProto.item) DOMTokenListProto.item = function(i){
-        function NullCheck(n) {return n===void 0 ? null : n} return NullCheck(this[i]);
-    };
-    if (!DOMTokenListProto.toggle || testClass.toggle("a",0)!==false) DOMTokenListProto.toggle=function(val){
-        if (arguments.length > 1) return (this[arguments[1] ? "add" : "remove"](val), !!arguments[1]);
-        var oldValue = this.value;
-        return (this.remove(oldValue), oldValue === this.value && (this.add(val), true) /*|| false*/);
-    };
-    if (!DOMTokenListProto.replace || typeof testClass.replace("a", "b") !== "boolean")
-        DOMTokenListProto.replace = function(oldToken, newToken){
-            checkIfValidClassListEntry("replace", oldToken), checkIfValidClassListEntry("replace", newToken);
-            var oldValue = this.value;
-            return (this.remove(oldToken), this.value !== oldValue && (this.add(newToken), true));
-        };
-    if (!DOMTokenListProto.contains) DOMTokenListProto.contains = function(value){
-        for (var i=0,Len=this.length; i !== Len; ++i) if (this[i] === value) return true;
-        return false;
-    };
-    if (!DOMTokenListProto.forEach) DOMTokenListProto.forEach = function(f){
-        if (arguments.length === 1) for (var i = 0, Len = this.length; i !== Len; ++i) f( this[i], i, this);
-        else for (var i=0,Len=this.length,tArg=arguments[1]; i !== Len; ++i) f.call(tArg, this[i], i, this);
-    };
-    if (!DOMTokenListProto.entries) DOMTokenListProto.entries = function(){
-        var nextIndex = 0, that = this;
-        return {next: function() {
-            return nextIndex<that.length ? {value: [nextIndex, that[nextIndex]], done: false} : {done: true};
-        }};
-    };
-    if (!DOMTokenListProto.values) DOMTokenListProto.values = function(){
-        var nextIndex = 0, that = this;
-        return {next: function() {
-            return nextIndex<that.length ? {value: that[nextIndex], done: false} : {done: true};
-        }};
-    };
-    if (!DOMTokenListProto.keys) DOMTokenListProto.keys = function(){
-        var nextIndex = 0, that = this;
-        return {next: function() {
-            return nextIndex<that.length ? {value: nextIndex, done: false} : {done: true};
-        }};
-    };
-})(window.DOMTokenList.prototype, window.document.createElement("div").classList);
-})(window);
-
- -

Avvertenze

- -

Il polyfill ha funzionalità limitate. Al momento non è in grado di eseguire il polyfill fuori dagli elementi del documento (ad esempio elementi creati da document.createElement prima di essere appesi su un nodo padre) in IE6-7.

- -

Tuttavia, dovrebbe funzionare bene in IE9. Una discrepanza maggiore tra la versione polyfilled di classList e le specifiche W3 è che per IE6-8, non esiste un modo per creare un oggetto immutabile (un oggetto le cui proprietà non possono essere modificate direttamente). In IE9, tuttavia, è possibile estendere il prototipo, congelando l'oggetto visibile e sovrascrivendo i metodi di proprietà native. Tuttavia, tali azioni non funzionerebbero in IE6-IE8 e, in IE9, rallenterebbero le prestazioni dell'intera pagina Web fino alla scansione di una lumaca, rendendo queste modifiche completamente impraticabili per questo polyfill.

- -

Una nota minore è che in IE6-7, questo polyfill usa la proprietà window[" uCL"] sull'oggetto window per comunicare con le espressioni CSS, la proprietà css x-uCLp su tutti gli elementi e la proprietà element[" uCL"] su tutti gli elementi per consentire la raccolta di garbadge e migliorare le prestazioni. In tutti i browser polyfilled (IE6-9), una proprietà aggiuntiva element[" uCLp"] viene aggiunta all'elemento per garantire la prototipazione conforme agli standard e una proprietà DOMTokenList[" uCL"] viene aggiunta ad ogni oggetto element["classList"] per garantire che la DOMTokenList sia limitata al proprio elemento.

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName("DOM WHATWG", "#dom-element-classlist", "Element.classList")}}{{Spec2("DOM WHATWG")}}Definizione iniziale
{{SpecName("DOM4", "#dom-element-classlist", "Element.classList")}}{{Spec2("DOM4")}}
- -

Compatibilità con i browser

- - - -

{{Compat("api.Element.classList")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/element/classname/index.html b/files/it/web/api/element/classname/index.html deleted file mode 100644 index ca463f5f75..0000000000 --- a/files/it/web/api/element/classname/index.html +++ /dev/null @@ -1,84 +0,0 @@ ---- -title: Element.className -slug: Web/API/Element/className -tags: - - API - - DOM - - Gecko - - Proprietà - - Referenza -translation_of: Web/API/Element/className ---- -
{{APIRef("DOM")}}
- -

La proprietà className dell'interfaccia {{domxref("Element")}} ottiene e imposta il valore dell'attributo class dell'elemento specificato.

- -

Sintassi

- -
var cName = elementNodeReference.className;
-elementNodeReference.className = cName;
- - - -

Esempio

- -
let el = document.getElementById('item');
-
-if (el.className === 'active'){
-  el.className = 'inactive';
-} else {
-  el.className = 'active';
-}
- -

Appunti

- -

Il nome className viene utilizzato per questa proprietà anziché class a causa di conflitti con la parola chiave "class" in molti linguaggi che vengono utilizzati per manipolare il DOM.

- -

className può anche essere un'istanza di {{domxref("SVGAnimatedString")}} se element è un {{domxref("SVGElement")}}. È meglio ottenere/impostare className di un elemento usando {{domxref("Element.getAttribute")}} e {{domxref("Element.setAttribute")}} se si ha a che fare con elementi SVG. Tuttavia, tieni presente che {{domxref("Element.getAttribute")}} ritorna null anzichè "" se element ha un attributo class vuoto.

- -
elm.setAttribute('class', elm.getAttribute('class'))
- -
-

class è un Attributo HTML, mentre className è una proprietà del DOM.

-
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName("DOM WHATWG", "#dom-element-classname", "element.className")}}{{Spec2("DOM WHATWG")}} 
{{SpecName("DOM4", "#dom-element-classname", "element.className")}}{{Spec2("DOM4")}} 
{{SpecName("DOM2 HTML", "html.html#ID-95362176", "element.className")}}{{Spec2("DOM2 HTML")}}Definizione iniziale
- -

Compatibilità con i browser

- - - -

{{Compat("api.Element.className")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/element/clientheight/index.html b/files/it/web/api/element/clientheight/index.html deleted file mode 100644 index 167dd00ca3..0000000000 --- a/files/it/web/api/element/clientheight/index.html +++ /dev/null @@ -1,36 +0,0 @@ ---- -title: element.clientHeight -slug: Web/API/Element/clientHeight -translation_of: Web/API/Element/clientHeight ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce l'altezza interna di un elemento in pixel, incluso il padding, ed esclusi il bordo, il margine e l'altezza della barra di scorrimento orizzontale.

-

clientHeight può essere calcolato come CSS height + CSS padding - altezza della barra di scorrimento orizzontale(se presente).

-

Sintassi e valori

-
var altezza = elemento.clientHeight;
-
-

altezza è un numero intero che rappresenta l'altezza in pixel di elemento.

-

clientHeight è di sola lettura.

-

Esempio

-
-
-

padding-top

-

Gentle, individualistic and very loyal, Birman cats fall between Siamese and Persian in character. If you admire cats that are non aggressive, that enjoy being with humans and tend to be on the quiet side, you may well find that Birman cats are just the felines for you.

-

Image:BirmanCat.jpgAll Birmans have colorpointed features, dark coloration of the face, ears, legs and tail.

-

Cat image and text coming from http://www.best-cat-art.com/

-

padding-bottom

-
- LeftTopRightBottommargin-topmargin-bottomborder-topborder-bottom
-

Image:clientHeight.png

-

Specifiche

-

Non fa parte di nessuna specifica W3C.

-

Note

-

clientHeight è una proprietà non standard, introdotta dal modello a oggetti di Internet Explorer.

-

Riferimenti

- -

{{ languages( { "fr": "fr/DOM/element.clientHeight", "pl": "pl/DOM/element.clientHeight", "en": "en/DOM/element.clientHeight" } ) }}

diff --git a/files/it/web/api/element/closest/index.html b/files/it/web/api/element/closest/index.html deleted file mode 100644 index cded9f95bb..0000000000 --- a/files/it/web/api/element/closest/index.html +++ /dev/null @@ -1,147 +0,0 @@ ---- -title: Element.closest() -slug: Web/API/Element/closest -tags: - - API - - DOM - - Element - - Method - - Reference -translation_of: Web/API/Element/closest ---- -

{{APIRef('Shadow DOM')}}

- -
Il metodo closest() dell'interfaccia {{domxref("Element")}} restituisce l'antenato più vicino dell'elemento corrente (o l'elemento corrente stesso) che corrisponde ai selettori dati in un parametro. Se nessun elemento di questo tipo esiste, restituisce null.
- -

Sintassi

- -
var closestElement = element.closest(selectors);
-
- -

Parametri

- - - -

Valore del risultato

- - - -

Eccezioni

- - - -

Esempio

- -

HTML

- -
<article>
-  <div id="div-01">Here is div-01
-    <div id="div-02">Here is div-02
-      <div id="div-03">Here is div-03</div>
-    </div>
-  </div>
-</article>
- -

JavaScript

- -
var el = document.getElementById('div-03');
-
-var r1 = el.closest("#div-02");
-// returns the element with the id=div-02
-
-var r2 = el.closest("div div");
-// restituisce l'antenato più vicino che è un div in div, qui è div-03 stesso
-
-var r3 = el.closest("article > div");
-// restituisce l'antenato più vicino che è un div e ha un articolo genitore, qui è div-01
-
-var r4 = el.closest(":not(div)");
-// restituisce l'antenato più vicino che non è un div, qui è l'articolo più esterno
- -

Polyfill

- -

Per i browser che non supportano Element.closest(),  ma supportano il supporto per element.matches() (o un equivalente prefissato, ovvero IE9 +), esiste un polyfill:

- -
if (!Element.prototype.matches) {
-  Element.prototype.matches = Element.prototype.msMatchesSelector ||
-                              Element.prototype.webkitMatchesSelector;
-}
-
-if (!Element.prototype.closest) {
-  Element.prototype.closest = function(s) {
-    var el = this;
-
-    do {
-      if (el.matches(s)) return el;
-      el = el.parentElement || el.parentNode;
-    } while (el !== null && el.nodeType === 1);
-    return null;
-  };
-}
- -

Tuttavia, se davvero si richiede il supporto per IE 8, il seguente polyfill farà il lavoro molto lentamente, ma alla fine. Tuttavia, supporta solo i selettori CSS 2.1 in IE 8 e può causare gravi ritardi nei siti Web di produzione.

- -
if (window.Element && !Element.prototype.closest) {
-  Element.prototype.closest =
-  function(s) {
-    var matches = (this.document || this.ownerDocument).querySelectorAll(s),
-        i,
-        el = this;
-    do {
-      i = matches.length;
-      while (--i >= 0 && matches.item(i) !== el) {};
-    } while ((i < 0) && (el = el.parentElement));
-    return el;
-  };
-}
-
- -

Specifiche

- - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', '#dom-element-closest', 'Element.closest()')}}{{Spec2('DOM WHATWG')}}Definizione iniziale.
- -

Compatibilità con i browser

- -
- - -

{{Compat("api.Element.closest")}}

- -

Note di compatibilità

- - -
- -

Vedi anche

- - diff --git a/files/it/web/api/element/getattribute/index.html b/files/it/web/api/element/getattribute/index.html deleted file mode 100644 index e10427e5bd..0000000000 --- a/files/it/web/api/element/getattribute/index.html +++ /dev/null @@ -1,48 +0,0 @@ ---- -title: Element.getAttribute() -slug: Web/API/Element/getAttribute -translation_of: Web/API/Element/getAttribute ---- -
{{APIRef("DOM")}}
- -

getAttribute() restituisce il valore di un attributo specificato sull'elemento. Se l'attributo specificato non esiste, il valore restituito sarà null o "" (la stringa vuota); vedi {{Anch("Appunti")}} per maggiori dettagli.

- -

Sintassi

- -
var attributo = element.getAttribute(attributeName);
-
- -

dove

- - - -

Esempio

- -
let div1 = document.getElementById('div1');
-let align = div1.getAttribute('align');
-
-alert(align); // Mostra il valore di "align" per l'elemento con id="div1"
- -

Appunti

- -

Quando viene chiamato su un elemento HTML in un DOM contrassegnato come un documento HTML, getAttribute() converte in minuscolo il suo argomento prima di procedere.

- -

Essenzialmente tutti i browser Web (Firefox, Internet Explorer, versioni recenti di Opera, Safari, Konqueror e iCab, come elenco non esaustivo) restituiscono null quando l'attributo specificato non è presente sull'elemento specificato e questo è quello che l'attuale bozza della specifica DOM specifica. La vecchia specifica del DOM 3 Core, d'altra parte, dice che il valore di ritorno corretto in questo caso è in realtà la stringa vuota, e alcune implementazioni DOM implementano questo comportamento. L'implementazione di getAttribute in XUL (Gecko) segue effettivamente la specifica DOM 3 Core e restituisce una stringa vuota. Di conseguenza, dovresti usare {{domxref("element.hasAttribute()")}} per verificare l'esistenza di un attributo prima di chiamare getAttribute() se è possibile che l'attributo richiesto non esista sull'elemento specificato.

- -

Compatibilità con i browser

- -
- - -

{{Compat("api.Element.getAttribute")}}

-
- -

Specifiche

- - diff --git a/files/it/web/api/element/getelementsbytagname/index.html b/files/it/web/api/element/getelementsbytagname/index.html deleted file mode 100644 index 9239135259..0000000000 --- a/files/it/web/api/element/getelementsbytagname/index.html +++ /dev/null @@ -1,80 +0,0 @@ ---- -title: Element.getElementsByTagName() -slug: Web/API/Element/getElementsByTagName -tags: - - API - - DOM - - Element - - Method - - Referenza -translation_of: Web/API/Element/getElementsByTagName ---- -
{{ APIRef("DOM") }}
- -

Il metodo Element.getElementsByTagName() ritorna una {{domxref("HTMLCollection")}} dinamica di elementi con il tag name specificato. Vengono cercati tutti i discendenti dell'elemento specificato, ma non l'elemento stesso. L'elenco restituito è dinamico, il che significa che si aggiorna automaticamente con l'albero del DOM. Pertanto, non è necessario chiamare Element.getElementsByTagName() con lo stesso elemento e gli stessi argomenti ripetutamente se il DOM cambia tra le chiamate.

- -

Quando viene chiamato su un elemento HTML in un documento HTML, getElementsByTagName converte in minuscolo l'argomento prima di cercarlo. Ciò non è desiderabile quando si cerca di abbinare elementi SVG camel-cased (come <linearGradient>) in un documento HTML. Invece, usa {{ domxref("Element.getElementsByTagNameNS()") }}, che preserva la conversione in minuscolo del nome del tag.

- -

Element.getElementsByTagName è simile a {{domxref("Document.getElementsByTagName()")}}, tranne per il fatto che cerca solo elementi discendenti dell'elemento specificato.

- -

Sintassi

- -
elements = element.getElementsByTagName(tagName)
- - - -

Esempio

- -
// Controlla lo stato di ogni cella in una tabella
-const table = document.getElementById('forecast-table');
-const cells = table.getElementsByTagName('td');
-
-for (let cell of cells) {
-  let status = cell.getAttribute('data-status');
-  if (status === 'open') {
-    // Prendi i dati
-  }
-}
-
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', '#dom-element-getelementsbytagname', 'Element.getElementsByTagName()')}}{{Spec2('DOM WHATWG')}}Modificato il valore di ritorno da {{domxref("NodeList")}} a {{domxref("HTMLCollection")}}
{{SpecName('DOM3 Core', 'core.html#ID-1938918D', 'Element.getElementsByTagName()')}}{{Spec2('DOM3 Core')}}Nessun cambiamento da {{SpecName('DOM2 Core')}}
{{SpecName('DOM2 Core', 'core.html#ID-1938918D', 'Element.getElementsByTagName()')}}{{Spec2('DOM2 Core')}}Nessun cambiamento da {{SpecName('DOM1')}}
{{SpecName('DOM1', 'level-one-core.html#ID-1938918D', 'Element.getElementsByTagName()')}}{{Spec2('DOM1')}}Definizione iniziale
- -

Compatibilità con i browser

- - - -

{{Compat("api.Element.getElementsByTagName")}}

diff --git a/files/it/web/api/element/hasattribute/index.html b/files/it/web/api/element/hasattribute/index.html deleted file mode 100644 index 4cd6d2a9d2..0000000000 --- a/files/it/web/api/element/hasattribute/index.html +++ /dev/null @@ -1,75 +0,0 @@ ---- -title: Element.hasAttribute() -slug: Web/API/Element/hasAttribute -translation_of: Web/API/Element/hasAttribute ---- -
{{APIRef("DOM")}}
- -

Il metodo Element.hasAttribute() restituisce un valore booleano che indica se l'elemento specificato ha o meno l'attributo specificato.

- -

Sintassi

- -
var risultato = element.hasAttribute(name);
-
- -
-
risultato
-
detiene il valore di ritorno true o false.
-
name
-
è una stringa che rappresenta il nome dell'attributo.
-
- -

Esempio

- -
var foo = document.getElementById("foo");
-if (foo.hasAttribute("bar")) {
-    // fare qualcosa
-}
-
- -

Polyfill

- -
;(function(prototype) {
-    prototype.hasAttribute = prototype.hasAttribute || function(name) {
-        return !!(this.attributes[name] &&
-                  this.attributes[name].specified);
-    }
-})(Element.prototype);
-
- -

Appunti

- -
{{DOMAttributeMethods}}
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', '#dom-element-hasattribute', 'Element.hasAttribute()')}}{{Spec2('DOM WHATWG')}}Da {{SpecName('DOM3 Core')}}, spostato da {{domxref("Node")}} a {{domxref("Element")}}
{{SpecName('DOM3 Core', 'core.html#ID-ElHasAttr', 'Element.hasAttribute()')}}{{Spec2('DOM3 Core')}}Nessun cambiamento da {{SpecName('DOM2 Core')}}
{{SpecName('DOM2 Core', 'core.html#ID-ElHasAttr', 'Element.hasAttribute()')}}{{Spec2('DOM2 Core')}}Definizione iniziale.
- -

Compatibilità con i browser

- - - -

{{Compat("api.Element.hasAttribute")}}

diff --git a/files/it/web/api/element/hasattributes/index.html b/files/it/web/api/element/hasattributes/index.html deleted file mode 100644 index ca408ca96d..0000000000 --- a/files/it/web/api/element/hasattributes/index.html +++ /dev/null @@ -1,28 +0,0 @@ ---- -title: element.hasAttributes -slug: Web/API/Element/hasAttributes -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Element/hasAttributes ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce un valore booleano: true se l'elemento ha un qualunque numero di attributi, altrimenti false.

-

Sintassi

-

- - bool - = element.hasAttributes()

-

Esempio

-
t1 = document.getElementById("tabella-dati");
-if (t1.hasAttributes()) {
-    // fai qualcosa con
-    // t1.attributes
-}
-
-

Specifiche

-

hasAttributes

-

{{ languages( { "en": "en/DOM/element.hasAttributes", "fr": "fr/DOM/element.hasAttributes", "pl": "pl/DOM/element.hasAttributes" } ) }}

diff --git a/files/it/web/api/element/index.html b/files/it/web/api/element/index.html deleted file mode 100644 index f518252bc7..0000000000 --- a/files/it/web/api/element/index.html +++ /dev/null @@ -1,475 +0,0 @@ ---- -title: Element -slug: Web/API/Element -tags: - - API - - DOM - - Element - - Interface - - Referenza - - Referenza del DOM - - Web API -translation_of: Web/API/Element ---- -
{{APIRef("DOM")}}
- -

Element è la classe base più generale da cui ereditano tutti gli oggetti in un {{DOMxRef("Document")}}. Ha solo metodi e proprietà comuni a tutti i tipi di elementi. Classi più specifiche ereditano da Element. Ad esempio, l'interfaccia {{DOMxRef("HTMLElement")}} è l'interfaccia di base per gli elementi HTML, mentre l'interfaccia {{DOMxRef("SVGElement")}} è la base per tutti gli elementi SVG. La maggior parte delle funzionalità è specificata più in basso nella gerarchia delle classi.

- -

Le lingue al di fuori del regno della piattaforma Web, come XUL attraverso l'interfaccia XULElement, implementano anche  Element.

- -

{{InheritanceDiagram}}

- -

Proprietà

- -

Eredita le proprietà dalla sua interfaccia genitore, {{DOMxRef("Node")}}, e per estensione l'interfaccia genitore, {{DOMxRef("EventTarget")}}. Implementa le proprietà di {{DOMxRef("ParentNode")}}, {{DOMxRef("ChildNode")}}, {{DOMxRef("NonDocumentTypeChildNode")}}, e {{DOMxRef("Animatable")}}.

- -
-
{{DOMxRef("Element.attributes")}} {{readOnlyInline}}
-
Restituisce un oggetto {{DOMxRef("NamedNodeMap")}} contenente gli attributi assegnati dell'elemento HTML corrispondente.
-
{{DOMxRef("Element.classList")}} {{readOnlyInline}}
-
Ritorna un oggetto {{DOMxRef("DOMTokenList")}} contenente la lista delle classi dell'elemento.
-
{{DOMxRef("Element.className")}}
-
È una {{DOMxRef("DOMString")}} che rappresenta la classe dell'elemento.
-
{{DOMxRef("Element.clientHeight")}} {{readOnlyInline}}
-
Ritorna un {{jsxref("Number")}} che rappresenta l'altezza interna dell'elemento.
-
{{DOMxRef("Element.clientLeft")}} {{readOnlyInline}}
-
Ritorna un {{jsxref("Number")}} che rappresenta la larghezza del bordo sinistro dell'elemento.
-
{{DOMxRef("Element.clientTop")}} {{readOnlyInline}}
-
Restituisce un {{jsxref("Number")}} che rappresenta la larghezza del bordo superiore dell'elemento.
-
{{DOMxRef("Element.clientWidth")}} {{readOnlyInline}}
-
Restituisce un {{jsxref("Number")}} che rappresenta la larghezza interna dell'elemento.
-
{{DOMxRef("Element.computedName")}} {{readOnlyInline}}
-
Returns a {{DOMxRef("DOMString")}} containing the label exposed to accessibility.
-
{{DOMxRef("Element.computedRole")}} {{readOnlyInline}}
-
Returns a {{DOMxRef("DOMString")}} containing the ARIA role that has been applied to a particular element. 
-
{{DOMxRef("Element.id")}}
-
Is a {{DOMxRef("DOMString")}} representing the id of the element.
-
{{DOMxRef("Element.innerHTML")}}
-
Is a {{DOMxRef("DOMString")}} representing the markup of the element's content.
-
{{DOMxRef("Element.localName")}} {{readOnlyInline}}
-
A {{DOMxRef("DOMString")}} representing the local part of the qualified name of the element.
-
{{DOMxRef("Element.namespaceURI")}} {{readonlyInline}}
-
The namespace URI of the element, or null if it is no namespace. -
-

Note: In Firefox 3.5 and earlier, HTML elements are in no namespace. In later versions, HTML elements are in the http://www.w3.org/1999/xhtml namespace in both HTML and XML trees. {{ gecko_minversion_inline("1.9.2")}}

-
-
-
{{DOMxRef("NonDocumentTypeChildNode.nextElementSibling")}} {{readOnlyInline}}
-
Is an {{DOMxRef("Element")}}, the element immediately following the given one in the tree, or null if there's no sibling node.
-
{{DOMxRef("Element.outerHTML")}}
-
Is a {{DOMxRef("DOMString")}} representing the markup of the element including its content. When used as a setter, replaces the element with nodes parsed from the given string.
-
{{DOMxRef("Element.prefix")}} {{readOnlyInline}}
-
A {{DOMxRef("DOMString")}} representing the namespace prefix of the element, or null if no prefix is specified.
-
{{DOMxRef("NonDocumentTypeChildNode.previousElementSibling")}} {{readOnlyInline}}
-
Is a {{DOMxRef("Element")}}, the element immediately preceding the given one in the tree, or null if there is no sibling element.
-
{{DOMxRef("Element.scrollHeight")}} {{readOnlyInline}}
-
Returns a {{jsxref("Number")}} representing the scroll view height of an element.
-
{{DOMxRef("Element.scrollLeft")}}
-
Is a {{jsxref("Number")}} representing the left scroll offset of the element.
-
{{DOMxRef("Element.scrollLeftMax")}} {{Non-standard_Inline}} {{readOnlyInline}}
-
Returns a {{jsxref("Number")}} representing the maximum left scroll offset possible for the element.
-
{{DOMxRef("Element.scrollTop")}}
-
A {{jsxref("Number")}} representing number of pixels the top of the document is scrolled vertically.
-
{{DOMxRef("Element.scrollTopMax")}} {{Non-standard_Inline}} {{readOnlyInline}}
-
Returns a {{jsxref("Number")}} representing the maximum top scroll offset possible for the element.
-
{{DOMxRef("Element.scrollWidth")}} {{readOnlyInline}}
-
Returns a {{jsxref("Number")}} representing the scroll view width of the element.
-
{{DOMxRef("Element.shadowRoot")}}{{readOnlyInline}}
-
Returns the open shadow root that is hosted by the element, or null if no open shadow root is present.
-
{{DOMxRef("Element.openOrClosedShadowRoot")}} {{Non-standard_Inline}}{{readOnlyInline}}
-
Returns the shadow root that is hosted by the element, regardless if its open or closed. Available only to WebExtensions.
-
{{DOMxRef("Element.slot")}} {{Experimental_Inline}}
-
Returns the name of the shadow DOM slot the element is inserted in.
-
{{DOMxRef("Element.tabStop")}} {{Non-standard_Inline}}
-
Is a {{jsxref("Boolean")}} indicating if the element can receive input focus via the tab key.
-
{{DOMxRef("Element.tagName")}} {{readOnlyInline}}
-
Returns a {{jsxref("String")}} with the name of the tag for the given element.
-
{{DOMxRef("Element.undoManager")}} {{Experimental_Inline}} {{readOnlyInline}}
-
Returns the {{DOMxRef("UndoManager")}} associated with the element.
-
{{DOMxRef("Element.undoScope")}} {{Experimental_Inline}}
-
Is a {{jsxref("Boolean")}} indicating if the element is an undo scope host, or not.
-
- -
-

Note: DOM Level 3 defined namespaceURI, localName and prefix on the {{DOMxRef("Node")}} interface. In DOM4 they were moved to Element.

- -

This change is implemented in Chrome since version 46.0 and Firefox since version 48.0.

-
- -

Proprietà incluse da Slotable

- -

L'interfaccia Element include la seguente proprietà, definita nel  mixin {{DOMxRef("Slotable")}}.

- -
-
{{DOMxRef("Slotable.assignedSlot")}}{{readonlyInline}}
-
Restituisce un {{DOMxRef("HTMLSlotElement")}} che rappresenta lo {{htmlelement("slot")}} in cui è inserito il nodo.
-
- -

Gestori di eventi

- -
-
{{domxref("Element.onfullscreenchange")}}
-
Un gestore di eventi per l'evento {{event("fullscreenchange")}} che viene inviato quando l'elemento entra o esce dalla modalità a schermo intero. Questo può essere usato per guardare sia le transizioni attese con successo, ma anche per osservare cambiamenti inaspettati, come quando l'app è in background.
-
{{domxref("Element.onfullscreenerror")}}
-
Un gestore di eventi per l'evento {{event("fullscreenerror")}} che viene inviato quando si verifica un errore durante il tentativo di passare alla modalità a schermo intero.
-
- -

Gestori di eventi obsoleti

- -
-
{{DOMxRef("Element.onwheel")}}
-
Restituisce il codice di gestione degli eventi per l'evento {{Event("wheel")}}. Questo è ora implementato su {{DOMxRef("GlobalEventHandlers.onwheel", "GlobalEventHandlers")}}.
-
- -

Metodi

- -

Inherits methods from its parents {{DOMxRef("Node")}}, and its own parent, {{DOMxRef("EventTarget")}}, and implements those of {{DOMxRef("ParentNode")}}, {{DOMxRef("ChildNode")}}, {{DOMxRef("NonDocumentTypeChildNode")}}, and {{DOMxRef("Animatable")}}.

- -
-
{{DOMxRef("EventTarget.addEventListener()")}}
-
Registers an event handler to a specific event type on the element.
-
{{DOMxRef("Element.attachShadow()")}}
-
Attatches a shadow DOM tree to the specified element and returns a reference to its {{DOMxRef("ShadowRoot")}}.
-
{{DOMxRef("Element.animate()")}} {{Experimental_Inline}}
-
A shortcut method to create and run an animation on an element. Returns the created Animation object instance.
-
{{DOMxRef("Element.closest()")}} {{Experimental_Inline}}
-
Returns the {{DOMxRef("Element")}} which is the closest ancestor of the current element (or the current element itself) which matches the selectors given in parameter.
-
{{DOMxRef("Element.createShadowRoot()")}} {{Non-standard_Inline}} {{Deprecated_Inline}}
-
Creates a shadow DOM on on the element, turning it into a shadow host. Returns a {{DOMxRef("ShadowRoot")}}.
-
{{DOMxRef("Element.computedStyleMap()")}} {{Experimental_Inline}}
-
Returns a {{DOMxRef("StylePropertyMapReadOnly")}} interface which provides a read-only representation of a CSS declaration block that is an alternative to {{DOMxRef("CSSStyleDeclaration")}}.
-
{{DOMxRef("EventTarget.dispatchEvent()")}}
-
Dispatches an event to this node in the DOM and returns a {{jsxref("Boolean")}} that indicates whether no handler canceled the event.
-
{{DOMxRef("Element.getAnimations()")}} {{Experimental_Inline}}
-
Returns an array of Animation objects currently active on the element.
-
{{DOMxRef("Element.getAttribute()")}}
-
Retrieves the value of the named attribute from the current node and returns it as an {{jsxref("Object")}}.
-
{{DOMxRef("Element.getAttributeNames()")}}
-
Returns an array of attribute names from the current element.
-
{{DOMxRef("Element.getAttributeNS()")}}
-
Retrieves the value of the attribute with the specified name and namespace, from the current node and returns it as an {{jsxref("Object")}}.
-
{{DOMxRef("Element.getAttributeNode()")}} {{Obsolete_Inline}}
-
Retrieves the node representation of the named attribute from the current node and returns it as an {{DOMxRef("Attr")}}.
-
{{DOMxRef("Element.getAttributeNodeNS()")}} {{Obsolete_Inline}}
-
Retrieves the node representation of the attribute with the specified name and namespace, from the current node and returns it as an {{DOMxRef("Attr")}}.
-
{{DOMxRef("Element.getBoundingClientRect()")}}
-
Returns the size of an element and its position relative to the viewport.
-
{{DOMxRef("Element.getClientRects()")}}
-
Returns a collection of rectangles that indicate the bounding rectangles for each line of text in a client.
-
{{DOMxRef("Element.getElementsByClassName()")}}
-
Returns a live {{DOMxRef("HTMLCollection")}} that contains all descendants of the current element that possess the list of classes given in the parameter.
-
{{DOMxRef("Element.getElementsByTagName()")}}
-
Returns a live {{DOMxRef("HTMLCollection")}} containing all descendant elements, of a particular tag name, from the current element.
-
{{DOMxRef("Element.getElementsByTagNameNS()")}}
-
Returns a live {{DOMxRef("HTMLCollection")}} containing all descendant elements, of a particular tag name and namespace, from the current element.
-
{{DOMxRef("Element.hasAttribute()")}}
-
Returns a {{jsxref("Boolean")}} indicating if the element has the specified attribute or not.
-
{{DOMxRef("Element.hasAttributeNS()")}}
-
Returns a {{jsxref("Boolean")}} indicating if the element has the specified attribute, in the specified namespace, or not.
-
{{DOMxRef("Element.hasAttributes()")}}
-
Returns a {{jsxref("Boolean")}} indicating if the element has one or more HTML attributes present.
-
{{DOMxRef("Element.hasPointerCapture()")}}
-
Indicates whether the element on which it is invoked has pointer capture for the pointer identified by the given pointer ID.
-
{{DOMxRef("Element.insertAdjacentElement()")}}
-
Inserts a given element node at a given position relative to the element it is invoked upon.
-
{{DOMxRef("Element.insertAdjacentHTML()")}}
-
Parses the text as HTML or XML and inserts the resulting nodes into the tree in the position given.
-
{{DOMxRef("Element.insertAdjacentText()")}}
-
Inserts a given text node at a given position relative to the element it is invoked upon.
-
{{DOMxRef("Element.matches()")}} {{Experimental_Inline}}
-
Returns a {{jsxref("Boolean")}} indicating whether or not the element would be selected by the specified selector string.
-
{{DOMxRef("Element.querySelector()")}}
-
Returns the first {{DOMxRef("Node")}} which matches the specified selector string relative to the element.
-
{{DOMxRef("Element.querySelectorAll()")}}
-
Returns a {{DOMxRef("NodeList")}} of nodes which match the specified selector string relative to the element.
-
{{DOMxRef("Element.releasePointerCapture()")}}
-
Releases (stops) pointer capture that was previously set for a specific {{DOMxRef("PointerEvent","pointer event")}}.
-
{{DOMxRef("ChildNode.remove()")}} {{Experimental_Inline}}
-
Removes the element from the children list of its parent.
-
{{DOMxRef("Element.removeAttribute()")}}
-
Removes the named attribute from the current node.
-
{{DOMxRef("Element.removeAttributeNS()")}}
-
Removes the attribute with the specified name and namespace, from the current node.
-
{{DOMxRef("Element.removeAttributeNode()")}} {{Obsolete_Inline}}
-
Removes the node representation of the named attribute from the current node.
-
{{DOMxRef("EventTarget.removeEventListener()")}}
-
Removes an event listener from the element.
-
{{DOMxRef("Element.requestFullscreen()")}} {{Experimental_Inline}}
-
Asynchronously asks the browser to make the element full-screen.
-
{{DOMxRef("Element.requestPointerLock()")}} {{Experimental_Inline}}
-
Allows to asynchronously ask for the pointer to be locked on the given element.
-
- -
-
{{domxref("Element.scroll()")}}
-
Scrolls to a particular set of coordinates inside a given element.
-
{{domxref("Element.scrollBy()")}}
-
Scrolls an element by the given amount.
-
{{DOMxRef("Element.scrollIntoView()")}} {{Experimental_Inline}}
-
Scrolls the page until the element gets into the view.
-
{{domxref("Element.scrollTo()")}}
-
Scrolls to a particular set of coordinates inside a given element.
-
{{DOMxRef("Element.setAttribute()")}}
-
Sets the value of a named attribute of the current node.
-
{{DOMxRef("Element.setAttributeNS()")}}
-
Sets the value of the attribute with the specified name and namespace, from the current node.
-
{{DOMxRef("Element.setAttributeNode()")}} {{Obsolete_Inline}}
-
Sets the node representation of the named attribute from the current node.
-
{{DOMxRef("Element.setAttributeNodeNS()")}} {{Obsolete_Inline}}
-
Sets the node representation of the attribute with the specified name and namespace, from the current node.
-
{{DOMxRef("Element.setCapture()")}} {{Non-standard_Inline}}
-
Sets up mouse event capture, redirecting all mouse events to this element.
-
{{DOMxRef("Element.setPointerCapture()")}}
-
Designates a specific element as the capture target of future pointer events.
-
{{DOMxRef("Element.toggleAttribute()")}}
-
Toggles a boolean attribute, removing it if it is present and adding it if it is not present, on the specified element.
-
- -

Events

- -

Listen to these events using addEventListener() or by assigning an event listener to the oneventname property of this interface.

- -
-
{{domxref("Element/cancel_event", "cancel")}}
-
Fires on a {{HTMLElement("dialog")}} when the user instructs the browser that they wish to dismiss the current open dialog. For example, the browser might fire this event when the user presses the Esc key or clicks a "Close dialog" button which is part of the browser's UI.
- Also available via the {{domxref("GlobalEventHandlers/oncancel", "oncancel")}} property.
-
error
-
Fired when when a resource failed to load, or can't be used. For example, if a script has an execution error or an image can't be found or is invalid.
- Also available via the {{domxref("GlobalEventHandlers/onerror", "onerror")}} property.
-
{{domxref("Element/scroll_event", "scroll")}}
-
Fired when the document view or an element has been scrolled.
- Also available via the {{DOMxRef("GlobalEventHandlers.onscroll", "onscroll")}} property.
-
{{domxref("Element/select_event", "select")}}
-
Fired when some text has been selected.
- Also available via the {{DOMxRef("GlobalEventHandlers.onselect", "onselect")}} property.
-
{{domxref("Element/show_event", "show")}}
-
Fired when a contextmenu event was fired on/bubbled to an element that has a contextmenu attribute.
- Also available via the {{DOMxRef("GlobalEventHandlers.onshow", "onshow")}} property.
-
{{domxref("Element/wheel_event","wheel")}}
-
Fired when the user rotates a wheel button on a pointing device (typically a mouse).
- Also available via the {{DOMxRef("GlobalEventHandlers.onwheel", "onwheel")}}
-
- -

Clipboard events

- -
-
{{domxref("Element/copy_event", "copy")}}
-
Fired when the user initiates a copy action through the browser's user interface.
- Also available via the {{domxref("HTMLElement/oncopy", "oncopy")}} property.
-
{{domxref("Element/cut_event", "cut")}}
-
Fired when the user initiates a cut action through the browser's user interface.
- Also available via the {{domxref("HTMLElement/oncut", "oncut")}} property.
-
{{domxref("Element/paste_event", "paste")}}
-
Fired when the user initiates a paste action through the browser's user interface.
- Also available via the {{domxref("HTMLElement/onpaste", "onpaste")}} property.
-
- -

Composition events

- -
-
{{domxref("Element/compositionend_event", "compositionend")}}
-
Fired when a text composition system such as an {{glossary("input method editor")}} completes or cancels the current composition session.
-
{{domxref("Element/compositionstart_event", "compositionstart")}}
-
Fired when a text composition system such as an {{glossary("input method editor")}} starts a new composition session.
-
{{domxref("Element/compositionupdate_event", "compositionupdate")}}
-
Fired when a new character is received in the context of a text composition session controlled by a text composition system such as an {{glossary("input method editor")}}.
-
- -

Focus events

- -
-
{{domxref("Element/blur_event", "blur")}}
-
Fired when an element has lost focus.
- Also available via the {{domxref("GlobalEventHandlers/onblur", "onblur")}} property.
-
{{domxref("Element/focus_event", "focus")}}
-
Fired when an element has gained focus.
- Also available via the {{domxref("GlobalEventHandlers/onfocus", "onfocus")}} property
-
{{domxref("Element/focusin_event", "focusin")}}
-
Fired when an element is about to gain focus.
-
{{domxref("Element/focusout_event", "focusout")}}
-
Fired when an element is about to lose focus.
-
- -

Fullscreen events

- -
-
{{domxref("Element/fullscreenchange_event", "fullscreenchange")}}
-
Sent to a {{domxref("Document")}} or {{domxref("Element")}} when it transitions into or out of full-screen mode.
- Also available via the {{domxref("Element.onfullscreenchange", "onfullscreenchange")}}  property.
-
{{domxref("Element/fullscreenerror_event", "fullscreenerror")}}
-
Sent to a Document or Element if an error occurs while attempting to switch it into or out of full-screen mode.
- Also available via the {{domxref("Document.onfullscreenerror", "onfullscreenerror")}} property.
-
- -

Mouse events

- -
-
{{domxref("Element/Activate_event", "Activate")}}
-
Occurs when an element is activated, for instance, through a mouse click or a keypress.
- Also available via the {{domxref("ServiceWorkerGlobalScope/onactivate", "onactivate")}} property.
-
{{domxref("Element/auxclick_event", "auxclick")}}
-
Fired when a non-primary pointing device button (e.g., any mouse button other than the left button) has been pressed and released on an element.
- Also available via the {{domxref("GlobalEventHandlers/onauxclick", "onauxclick")}} property.
-
{{domxref("Element/click_event", "click")}}
-
Fired when a pointing device button (e.g., a mouse's primary button) is pressed and released on a single element.
- Also available via the {{domxref("GlobalEventHandlers/onclick", "onclick")}} property.
-
{{domxref("Element/contextmenu_event", "contextmenu")}}
-
Fired when the user attempts to open a context menu.
- Also available via the {{domxref("GlobalEventHandlers/oncontextmenu", "oncontextmenu")}} property.
-
{{domxref("Element/dblclick_event", "dblclick")}}
-
Fired when a pointing device button (e.g., a mouse's primary button) is clicked twice on a single element.
- Also available via the {{domxref("GlobalEventHandlers/ondblclick", "ondblclick")}} property.
-
{{domxref("Element/mousedown_event", "mousedown")}}
-
Fired when a pointing device button is pressed on an element.
- Also available via the {{domxref("GlobalEventHandlers/onmousedown", "onmousedown")}} property.
-
{{domxref("Element/mouseenter_event", "mouseenter")}}
-
Fired when a pointing device (usually a mouse) is moved over the element that has the listener attached.
- Also available via the {{domxref("GlobalEventHandlers/onmouseenter", "onmouseenter")}} property.
-
{{domxref("Element/mouseleave_event", "mouseleave")}}
-
Fired when the pointer of a pointing device (usually a mouse) is moved out of an element that has the listener attached to it.
- Also available via the {{domxref("GlobalEventHandlers/onmouseleave", "onmouseleave")}} property.
-
{{domxref("Element/mousemove_event", "mousemove")}}
-
Fired when a pointing device (usually a mouse) is moved while over an element.
- Also available via the {{domxref("GlobalEventHandlers/onmousemove", "onmousemove")}} property.
-
{{domxref("Element/mouseout_event", "mouseout")}}
-
Fired when a pointing device (usually a mouse) is moved off the element to which the listener is attached or off one of its children.
- Also available via the {{domxref("GlobalEventHandlers/onmouseout", "onmouseout")}} property.
-
{{domxref("Element/mouseover_event", "mouseover")}}
-
Fired when a pointing device is moved onto the element to which the listener is attached or onto one of its children.
- Also available via the {{domxref("GlobalEventHandlers/onmouseover", "onmouseover")}} property.
-
{{domxref("Element/mouseup_event", "mouseup")}}
-
Fired when a pointing device button is released on an element.
- Also available via the {{domxref("GlobalEventHandlers/onmouseup", "onmouseup")}} property.
-
{{domxref("Element/webkitmouseforcechanged_event", "webkitmouseforcechanged")}}
-
Fired each time the amount of pressure changes on the trackpadtouchscreen.
-
{{domxref("Element/webkitmouseforcedown_event", "webkitmouseforcedown")}}
-
Fired after the mousedown event as soon as sufficient pressure has been applied to qualify as a "force click".
-
{{domxref("Element/webkitmouseforcewillbegin_event", "webkitmouseforcewillbegin")}}
-
Fired before the {{domxref("Element/mousedown_event", "mousedown")}} event.
-
{{domxref("Element/webkitmouseforceup_event", "webkitmouseforceup")}}
-
Fired after the {{domxref("Element/webkitmouseforcedown_event", "webkitmouseforcedown")}} event as soon as the pressure has been reduced sufficiently to end the "force click".
-
- -

Touch events

- -
-
{{domxref("Element/touchcancel_event", "touchcancel")}}
-
Fired when one or more touch points have been disrupted in an implementation-specific manner (for example, too many touch points are created).
- Also available via the {{domxref("GlobalEventHandlers/ontouchcancel", "ontouchcancel")}} property.
-
{{domxref("Element/touchend_event", "touchend")}}
-
Fired when one or more touch points are removed from the touch surface.
- Also available via the {{domxref("GlobalEventHandlers/ontouchend", "ontouchend")}} property
-
{{domxref("Element/touchmove_event", "touchmove")}}
-
Fired when one or more touch points are moved along the touch surface.
- Also available via the {{domxref("GlobalEventHandlers/ontouchmove", "ontouchmove")}} property
-
{{domxref("Element/touchstart_event", "touchstart")}}
-
Fired when one or more touch points are placed on the touch surface.
- Also available via the {{domxref("GlobalEventHandlers/ontouchstart", "ontouchstart")}} property
-
- -
-
 
-
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName("Web Animations", '', '')}}{{Spec2("Web Animations")}}Aggiunto il metodo getAnimations().
{{SpecName('Undo Manager', '', 'Element')}}{{Spec2('Undo Manager')}}Aggiunge le proprietà undoScope e undoManager.
{{SpecName('Pointer Events 2', '#extensions-to-the-element-interface', 'Element')}}{{Spec2('Pointer Events 2')}}Aggiunti i seguenti gestori di eventi: ongotpointercapture and onlostpointercapture.
- Aggiunti i seguenti metodi: setPointerCapture() e releasePointerCapture().
{{SpecName('Pointer Events', '#extensions-to-the-element-interface', 'Element')}}{{Spec2('Pointer Events')}}Aggiunti i seguenti gestori di eventi: ongotpointercapture e onlostpointercapture.
- Aggiunti i seguenti metodi: setPointerCapture() e releasePointerCapture().
{{SpecName('Selectors API Level 1', '#interface-definitions', 'Element')}}{{Spec2('Selectors API Level 1')}}Aggiunti i seguenti metodi: querySelector() e querySelectorAll().
{{SpecName('Pointer Lock', 'index.html#element-interface', 'Element')}}{{Spec2('Pointer Lock')}}Aggiunto il metodo requestPointerLock().
{{SpecName('Fullscreen', '#api', 'Element')}}{{Spec2('Fullscreen')}}Aggiunto il metodo requestFullscreen().
{{SpecName('DOM Parsing', '#extensions-to-the-element-interface', 'Element')}}{{Spec2('DOM Parsing')}}Aggiunte le seguenti proprietà: innerHTML, e outerHTML.
- Aggiunti i seguenti metodi: insertAdjacentHTML().
{{SpecName('CSSOM View', '#extensions-to-the-element-interface', 'Element')}}{{Spec2('CSSOM View')}}Aggiunte le seguenti proprietà: scrollTop, scrollLeft, scrollWidth, scrollHeight, clientTop, clientLeft, clientWidth, and clientHeight.
- Aggiunti i seguenti metodi: getClientRects(), getBoundingClientRect(), scroll(), scrollBy(), scrollTo() and scrollIntoView().
{{SpecName('Element Traversal', '#ecmascript-bindings', 'Element')}}{{Spec2('Element Traversal')}}Aggiunta ereditarietà dell'interfaccia {{DOMxRef("ElementTraversal")}}.
{{SpecName('DOM WHATWG', '#interface-element', 'Element')}}{{Spec2('DOM WHATWG')}}Aggiunti i seguenti metodi: closest(), insertAdjacentElement() and insertAdjacentText().
- Spostato hasAttributes() dall'interfaccia Node a questa.
{{SpecName("DOM4", "#interface-element", "Element")}}{{Spec2("DOM4")}}Rimossi i seguenti metodi: setIdAttribute(), setIdAttributeNS(), and setIdAttributeNode().
- Modificato il valore di ritorno di getElementsByTagName() e getElementsByTagNameNS().
- Rimossa la proprietà schemaTypeInfo.
{{SpecName('DOM3 Core', 'core.html#ID-745549614', 'Element')}}{{Spec2('DOM3 Core')}}Aggiunti i seguenti metodi: setIdAttribute(), setIdAttributeNS(), and setIdAttributeNode(). Questi metodi non sono mai stati implementati e sono stati rimossi nelle specifiche successive.
- Aggiunta la proprietà schemaTypeInfo. Questa proprietà non è mai stata implementata ed è stata rimossa nelle specifiche successive.
{{SpecName('DOM2 Core', 'core.html#ID-745549614', 'Element')}}{{Spec2('DOM2 Core')}}Il metodo normalize() è stato spostato su {{DOMxRef("Node")}}.
{{SpecName('DOM1', 'level-one-core.html#ID-745549614', 'Element')}}{{Spec2('DOM1')}}Definizione iniziale.
- -

Compatibilità con i browser

- - - -

{{Compat("api.Element")}}

diff --git a/files/it/web/api/element/innerhtml/index.html b/files/it/web/api/element/innerhtml/index.html deleted file mode 100644 index 6fbdb3c47b..0000000000 --- a/files/it/web/api/element/innerhtml/index.html +++ /dev/null @@ -1,213 +0,0 @@ ---- -title: Element.innerHTML -slug: Web/API/Element/innerHTML -tags: - - API - - DOM - - DOM Parsing - - Element - - Parsing HTML - - Proprietà - - Referenza - - innerHTML -translation_of: Web/API/Element/innerHTML ---- -
{{APIRef("DOM")}}
- -

La proprietà {{domxref("Element")}} innerHTML ottiene o imposta il markup HTML o XML contenuto all'interno dell'elemento.

- -
Note: Se un {{HTMLElement("div")}}, {{HTMLElement("span")}}, o {{HTMLElement("noembed")}} ha un nodo di testo figlio che include i caratteri (&), (<), o (>), innerHTML restituisce questi caratteri come entità HTML "&amp;", "&lt;" e "&gt;" rispettivamente. Usa {{domxref("Node.textContent")}} per ottenere una copia non elaborata del contenuto di questi nodi di testo.
- -

Per inserire l'HTML nel documento invece di sostituire il contenuto di un elemento, utilizza il metodo {{domxref("Element.insertAdjacentHTML", "insertAdjacentHTML()")}}.

- -

Sintassi

- -
const content = element.innerHTML;
-
-element.innerHTML = htmlString;
-
- -

Valore

- -

Una {{domxref("DOMString")}} contenente la serializzazione HTML dei discendenti dell'elemento. L'impostazione del valore di innerHTML rimuove tutti i discendenti dell'elemento e li sostituisce con i nodi creati analizzando l'HTML fornito nella stringa htmlString.

- -

Eccezioni

- -
-
SyntaxError
-
È stato effettuato un tentativo di impostare il valore di innerHTML utilizzando una stringa che non è HTML correttamente formato.
-
NoModificationAllowedError
-
È stato effettuato un tentativo di inserire l'HTML in un nodo il cui padre è {{domxref("Document")}}.
-
- -

Note di utilizzo

- -

La proprietà innerHTML può essere utilizzata per esaminare il codice sorgente HTML corrente della pagina, comprese le eventuali modifiche apportate da quando la pagina è stata inizialmente caricata.

- -

Leggere i contenuti HTML di un elemento

- -

La lettura di innerHTML fa sì che l'user agent serializzi il fragment HTML o XML composto dai discendenti di elment. La stringa risultante viene restituita.

- -
let contents = myElement.innerHTML;
- -

Questo ti permette di guardare il markup HTML dei nodi di contenuto dell'elemento.

- -
-

Note: Il fragment HTML o XML restituito viene generato in base al contenuto corrente dell'elemento, pertanto è probabile che la marcatura e la formattazione del frammento restituito non corrispondano al markup della pagina originale.

-
- -

Sostituzione del contenuto di un elemento

- -

L'impostazione del valore di innerHTML consente di sostituire facilmente i contenuti esistenti di un elemento con nuovi contenuti.

- -

Ad esempio, è possibile cancellare l'intero contenuto di un documento cancellando il contenuto dell'attributo {{domxref("Document.body", "body")}} del documento:

- -
document.body.innerHTML = "";
- -

Questo esempio recupera l'attuale markup HTML del documento e sostituisce i caratteri "<" con l'entità HTML "&lt;", convertendo in tal modo l'HTML in testo non elaborato. Questo è quindi avvolto in un elemento {{HTMLElement("pre")}} element. Quindi il valore di innerHTML viene modificato in questa nuova stringa. Di conseguenza, il contenuto del documento viene sostituito con una visualizzazione dell'intero codice sorgente della pagina.

- -
document.documentElement.innerHTML = "<pre>" +
-         document.documentElement.innerHTML.replace(/</g,"&lt;") +
-            "</pre>";
- -

Dettagli operativi

- -

Cosa succede esattamente quando imposti il valore di innerHTML? In questo modo, l'user agent deve seguire questi passaggi:

- -
    -
  1. Il valore specificato viene analizzato come HTML o XML (in base al tipo di documento), risultando in un oggetto {{domxref("DocumentFragment")}} che rappresenta il nuovo set di nodi del DOM per i nuovi elementi.
    2. -
  2. Se l'elemento il cui contenuto viene sostituito è un elemento {{HTMLElement("template")}} l'attributo <template> dell'elemento {{domxref("HTMLTemplateElement.content", "content")}} viene sostituito con il nuovo DocumentFragment creato nel passaggio 1.
    3. -
  3. Per tutti gli altri elementi, i contenuti dell'elemento vengono sostituiti con i nodi nel nuovo DocumentFragment.
    4. -
- -

Considerazioni sulla sicurezza

- -

Non è raro vedere innerHTML utilizzato per inserire del testo in una pagina web. C'è la possibilità che questo diventi un vettore di attacco su un sito, creando un potenziale rischio per la sicurezza.

- -
const name = "John";
-// supponiamo che 'el' sia un elemento DOM HTML
-el.innerHTML = name; // innocuo in questo caso
-
-// ...
-
-name = "<script>alert('Sono John in una noiosa allerta!')</script>";
-el.innerHTML = name; // innocuo in questo caso
- -

Sebbene possa sembrare un attacco {{interwiki("wikipedia", "cross-site scripting")}} il risultato è innocuo. HTML5 specifica che un tag {{HTMLElement("script")}} inserito con innerHTML non deve essere eseguito.

- -

Tuttavia, ci sono modi per eseguire JavaScript senza utilizzare gli elementi {{HTMLElement("script")}}, quindi c'è ancora un rischio per la sicurezza ogni volta che utilizzi innerHTML per impostare le stringhe su cui non si ha il controllo. Per esempio:

- -
const name = "<img src='x' onerror='alert(1)'>";
-el.innerHTML = name; // mostra l'alert
- -

Per questo motivo, si consiglia di non utilizzare innerHTML quando si inserisce testo normale; invece, usa {{domxref("Node.textContent")}}. Questo non analizza il contenuto passato come HTML, ma invece lo inserisce come testo non elaborato.

- -
-

Warning: Se il tuo progetto è uno che subirà alcuna forma di revisione della sicurezza, utilizzando innerHTML molto probabilmente il tuo codice verrà rifiutato. Ad esempio, se utilizzi innerHTML in un'estensione del browser e si invia l'estensione a addons.mozilla.org, non verrà passato il processo di revisione automatica.

-
- -

Esempio

- -

In questo esempio viene utilizzato innerHTML per creare un meccanismo per la registrazione dei messaggi in una casella in una pagina Web.

- -

JavaScript

- -
function log(msg) {
-  var logElem = document.querySelector(".log");
-
-  var time = new Date();
-  var timeStr = time.toLocaleTimeString();
-  logElem.innerHTML += timeStr + ": " + msg + "<br/>";
-}
-
-log("Registrazione degli eventi del mouse in questo contenitore...");
-
- -

La funzione log() crea l'output del log ottenendo l'ora corrente da un oggetto {{jsxref("Date")}} utilizzando {{jsxref("Date.toLocaleTimeString", "toLocaleTimeString()")}}, e creando una stringa con il timestamp e il testo del messaggio. Quindi il messaggio viene aggiunto al box con classe "log".

- -

Aggiungiamo un secondo metodo che registra le informazioni sugli eventi basati su {{domxref("MouseEvent")}} (come ad esempio {{event("mousedown")}}, {{event("click")}}, e {{event("mouseenter")}}):

- -
function logEvent(event) {
-  var msg = "Event <strong>" + event.type + "</strong> at <em>" +
-            event.clientX + ", " + event.clientY + "</em>";
-  log(msg);
-}
- -

Quindi usiamo questo come gestore di eventi per un numero di eventi del mouse sulla casella che contiene il nostro registro:

- -
var boxElem = document.querySelector(".box");
-
-boxElem.addEventListener("mousedown", logEvent);
-boxElem.addEventListener("mouseup", logEvent);
-boxElem.addEventListener("click", logEvent);
-boxElem.addEventListener("mouseenter", logEvent);
-boxElem.addEventListener("mouseleave", logEvent);
- -

HTML

- -

L'HTML è abbastanza semplice per il nostro esempio.

- -
<div class="box">
-  <div><strong>Log:</strong></div>
-  <div class="log"></div>
-</div>
- -

Il {{HTMLElement("div")}} con la classe "box" è solo un contenitore per scopi di layout, presentando il contenuto con una scatola attorno ad esso. Il <div> la cui classe è "log" è il contenitore per il testo del log stesso.

- -

CSS

- -

I seguenti stili CSS del nostro contenuto di esempio.

- -
.box {
-  width: 600px;
-  height: 300px;
-  border: 1px solid black;
-  padding: 2px 4px;
-  overflow-y: scroll;
-  overflow-x: auto;
-}
-
-.log {
-  margin-top: 8px;
-  font-family: monospace;
-}
- -

Risultato

- -

Il contenuto risultante assomiglia a questo. È possibile visualizzare l'output nel registro spostando il mouse dentro e fuori dalla scatola, facendo click su di esso e così via.

- -

{{EmbedLiveSample("Esempio", 640, 350)}}

- -

Specifiche

- - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM Parsing', '#dom-element-innerhtml', 'Element.innerHTML')}}{{Spec2('DOM Parsing')}}Definizione iniziale
- -

Compatibilità con i browser

- - - -

{{Compat("api.Element.innerHTML")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/element/insertadjacenthtml/index.html b/files/it/web/api/element/insertadjacenthtml/index.html deleted file mode 100644 index f69fbb1daf..0000000000 --- a/files/it/web/api/element/insertadjacenthtml/index.html +++ /dev/null @@ -1,102 +0,0 @@ ---- -title: Element.insertAdjacentHTML() -slug: Web/API/Element/insertAdjacentHTML -tags: - - API - - Cambiare il DOM - - DOM - - Element - - HTML - - Inserire elementi - - Inserire nodi - - Referenza - - insertAdjacentHTML - - metodo -translation_of: Web/API/Element/insertAdjacentHTML ---- -
{{APIRef("DOM")}}
- -

Il metodo insertAdjacentHTML() dell'interfaccia {{domxref("Element")}} analizza il testo specificato come HTML o XML e inserisce i nodi risultanti nell'albero DOM in una posizione specificata. Non esegue il reparse dell'elemento su cui viene utilizzato, e quindi non corrompe gli elementi esistenti all'interno di quell'elemento. Questo evita il passaggio extra della serializzazione, rendendolo molto più veloce della manipolazione diretta di {{domxref("Element.innerHTML", "innerHTML")}}.

- -

Sintassi

- -
element.insertAdjacentHTML(position, text);
- -

Parametri

- -
-
position
-
Una {{domxref("DOMString")}} che rappresenta la posizione relativa ad element; deve essere una delle seguenti stringhe: -
    -
  • 'beforebegin': Davanti ad element stesso.
    • -
  • 'afterbegin': Appena dentro element, prima del suo primo figlio.
    • -
  • 'beforeend': Appena dentro element, prima del suo ultimo figlio.
    • -
  • 'afterend': Dopo ad element stesso.
    • -
-
-
text
-
La stringa da analizzare come HTML o XML e inserita nell'albero.
-
- -

Visualizzazione dei nomi delle posizioni

- -
<!-- beforebegin -->
-<p>
-  <!-- afterbegin -->
-  foo
-  <!-- beforeend -->
-</p>
-<!-- afterend -->
- -
Note: Le posizioni beforebegin e afterend funzionano solo se il nodo si trova nell'albero del DOM e ha un elemento padre.
- -

Esempio

- -
// <div id="one">one</div>
-var d1 = document.getElementById('one');
-d1.insertAdjacentHTML('afterend', '<div id="two">two</div>');
-
-// A questo punto, la nuova struttura è:
-// <div id="one">one</div><div id="two">two</div>
- -

Note

- -

Considerazioni sulla sicurezza

- -

Quando si inserisce HTML in una pagina utilizzando insertAdjacentHTML(), fare attenzione a non utilizzare l'input dell'utente che non è stato analizzato.

- -

Non è consigliabile utilizzare  insertAdjacentHTML() quando si inserisce testo normale; usa invece la proprietà {{domxref("Node.textContent")}} o il metodo {{domxref("Element.insertAdjacentText()")}}. Questo non interpreta il contenuto passato come HTML, ma invece lo inserisce come testo non elaborato.

- -

Specifiche

- - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM Parsing', '#widl-Element-insertAdjacentHTML-void-DOMString-position-DOMString-text', 'Element.insertAdjacentHTML()')}}{{ Spec2('DOM Parsing') }} 
- -

Compatibilità con i browser

- - - -

{{Compat("api.Element.insertAdjacentHTML")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/element/namespaceuri/index.html b/files/it/web/api/element/namespaceuri/index.html deleted file mode 100644 index 1dad4c71d7..0000000000 --- a/files/it/web/api/element/namespaceuri/index.html +++ /dev/null @@ -1,31 +0,0 @@ ---- -title: document.namespaceURI -slug: Web/API/Element/namespaceURI -translation_of: Web/API/Node/namespaceURI -translation_of_original: Web/API/Document/namespaceURI -original_slug: Web/API/Node/namespaceURI ---- -
{{APIRef("DOM")}}
- -

namespaceURI restituisce lo spazio dei nomi XML del documento corrente.

- -

Sintassi

- -
NSURI = document.namespaceURI
-
- -

Parametri

- - - -

Note

- -

Il DOM di per sè non supporta la validazione del namespace. Spetta all'applicazione DOM effettuare la necessaria validazione. Si noti inoltre che il prefisso del namespace, una volta associato a un nodo particolare, non può più cambiare.

- -

Specifiche

- -

DOM Level 2 Core: namespaceURI

- -

{{ languages( { "fr": "fr/DOM/document.namespaceURI", "pl": "pl/DOM/document.namespaceURI" } ) }}

diff --git a/files/it/web/api/element/prefix/index.html b/files/it/web/api/element/prefix/index.html deleted file mode 100644 index c7ee67ac36..0000000000 --- a/files/it/web/api/element/prefix/index.html +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: element.prefix -slug: Web/API/Element/prefix -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Node/prefix -original_slug: Web/API/Node/prefix ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce il namespace del nodo, oppure null se il nodo non ha alcun prefisso.

-

Sintassi

-
stringa = element.prefix
-element.prefix =stringa
-
-

Esempi

-

Il seguente esempio produce il messaggio "x".

-
<x:div onclick="alert(this.prefix)"/>
-
-

Note

-

Questa proprietà funziona solo quando si utilizza un interprete in grado di gestire i namespace, per esempio quando un documento viene presentato con il tipo mime XML. Non funziona invece con i documenti HTML.

-

Specifiche

-

Node.prefix (introdotto in DOM2).

-

{{ languages( { "en": "en/DOM/element.prefix", "ja": "ja/DOM/element.prefix", "pl": "pl/DOM/element.prefix" } ) }}

diff --git a/files/it/web/api/element/queryselector/index.html b/files/it/web/api/element/queryselector/index.html deleted file mode 100644 index f6455563d9..0000000000 --- a/files/it/web/api/element/queryselector/index.html +++ /dev/null @@ -1,131 +0,0 @@ ---- -title: Element.querySelector() -slug: Web/API/Element/querySelector -translation_of: Web/API/Element/querySelector ---- -
{{APIRef("DOM")}}
- -

Il metodo querySelector() dell'interfaccia {{domxref("Element")}} restituisce il primo elemento discendente dell'elemento su cui è invocato corrispondente al gruppo specificato di selettori.

- -

Sintassi

- -
var element = baseElement.querySelector(selectors);
-
- -

Parameters

- -
-
selectors
-
Un gruppo di selettori per abbinare gli elementi discendenti di {{domxref ("Element")}} baseElement contro; questa deve essere una sintassi CSS valida o si verificherà un SyntaxError. Viene restituito il primo elemento trovato che corrisponde a questo gruppo di selettori.
-
- -

Valore di ritorno

- -

Il primo elemento discendente di baseElement che corrisponde al gruppo specificato di selectors. L'intera gerarchia di elementi viene considerata durante la corrispondenza, inclusi quelli esterni all'insieme di elementi, incluso baseElement e i suoi discendenti; in altre parole, selectors viene prima applicato all'intero documento, non a baseElement, per generare un elenco iniziale di elementi potenziali. Gli elementi risultanti vengono quindi esaminati per vedere se sono discendenti di baseElement. La prima corrispondenza di questi elementi rimanenti viene restituita dal metodo querySelector().

- -

Se non vengono trovate corrispondenze, il valore restituito è null.

- -

Eccezioni

- -
-
SyntaxError
-
I selectors specificati non sono validi.
-
- -

Esempi

- -

Consideriamo alcuni esempi.

- -

Trova un elemento specifico con valori specifici di un attributo

- -

In questo primo esempio, viene restituito il primo elemento {{HTMLElement("style")}} che non ha né il tipo né il tipo "text/css" nel corpo del documento HTML:

- -
var el = document.body.querySelector("style[type='text/css'], style:not([type])");
-
- -

L'intera gerarchia conta

- -

Questo esempio dimostra che la gerarchia dell'intero documento è considerata quando si applicano i selectors, in modo che i livelli al di fuori di baseElement specificato siano ancora considerati quando si localizzano le corrispondenze.

- -

HTML

- -
<div>
-  <h5>Original content</h5>
-  <p>
-    inside paragraph
-    <span>inside span</span>
-    inside paragraph
-  </p>
-</div>
-<div>
-  <h5>Output</h5>
-  <div id="output"></div>
-</div>
- -

JavaScript

- -
var baseElement = document.querySelector("p");
-document.getElementById("output").innerHTML =
-  (baseElement.querySelector("div span").innerHTML);
- -

Risultato

- -

Il risultato è simile a questo:

- -

{{ EmbedLiveSample("L'intera_gerarchia_conta", 600, 160) }}

- -

Nota come il selettore "div span" corrisponda ancora correttamente all'elemento {{HTMLElement("span")}} anche se il
- i nodi figli di baseElement non includono l'elemento {{domxref("div")}} (fa ancora parte del selettore specificato).

- -

More examples

- -

Vedi {{domxref("Document.querySelector()")}} per ulteriori esempi del formato corretto per i selectors.

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG','#dom-parentnode-queryselectorall','querySelector()')}}{{Spec2('DOM WHATWG')}}
{{SpecName('Selectors API Level 2','#queryselectorall','querySelectorAll()')}}{{Spec2('Selectors API Level 2')}}
{{SpecName('Selectors API Level 1','#queryselectorall','querySelectorAll()')}}{{Spec2('Selectors API Level 1')}}
- -

Compatibilità con i browser

- - - -

{{Compat("api.Element.querySelector")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/element/queryselectorall/index.html b/files/it/web/api/element/queryselectorall/index.html deleted file mode 100644 index 696b449cb6..0000000000 --- a/files/it/web/api/element/queryselectorall/index.html +++ /dev/null @@ -1,182 +0,0 @@ ---- -title: Element.querySelectorAll() -slug: Web/API/Element/querySelectorAll -tags: - - API - - CSS Selectors - - DOM - - Element - - Finding Elements - - Method - - Referenza - - Searching Elements - - Selecting Elements - - Selectors - - querySelector -translation_of: Web/API/Element/querySelectorAll ---- -
{{APIRef("DOM")}}
- -

Il metodo {{domxref("Element")}} querySelectorAll() restituisce una {{domxref("NodeList")}} statica (non dinamica) che rappresenta un elenco di elementi corrispondenti al gruppo specificato di selettori che sono i discendenti dell'elemento su cui è stato chiamato il metodo.

- -
-

Note: This method is implemented based on the {{domxref("ParentNode")}} mixin's {{domxref("ParentNode.querySelectorAll", "querySelectorAll()")}} method.

-
- -

Sintassi

- -
elementList = parentNode.querySelectorAll(selectors);
-
- -

Parametri

- -
-
selectors
-
Una {{domxref("DOMString")}} contenente uno o più selettori con cui confrontarsi. Questa stringa deve essere una stringa di un CSS selector valido; se non lo è, viene generata un'eccezione SyntaxError. Vedi Individuazione degli elementi DOM mediante selettori per ulteriori informazioni sull'uso dei selettori per identificare gli elementi. È possibile specificare più selettori separandoli utilizzando le virgole.
-
- -
-

Note: I caratteri che non fanno parte della sintassi CSS standard devono essere sottoposti a escape utilizzando un carattere backslash. Poiché JavaScript utilizza anche l'escape del backspace, è necessario prestare particolare attenzione quando si scrivono stringhe letterali utilizzando questi caratteri. Vedi {{anch("Escaping special characters")}} per maggiori informazioni.

-
- -

Valore di ritorno

- -

Una {{domxref("NodeList")}} non dinamica contenente un oggetto {{domxref("Element")}} per ciascun nodo discendente che corrisponde ad almeno uno dei selettori specificati.

- -
-

Note: Se i selectors specificati includono un CSS pseudo-element, l'elenco restituito è sempre vuoto.

-
- -

Exceptions

- -
-
SyntaxError
-
La sintassi della stringa selectors specificata non è valida.
-
- -

Esempi

- -

Ottenere un elenco di risultati

- -

Per ottenere una {{domxref("NodeList")}} di tutti gli elementi {{HTMLElement("p")}} contenuti nell'elemento "myBox":

- -
var matches = myBox.querySelectorAll("p");
- -

Questo esempio restituisce un elenco di tutti gli elementi {{HTMLElement("div")}} di "myBox" con la classe "note" o "alert":

- -
var matches = myBox.querySelectorAll("div.note, div.alert");
-
- -

Qui, otteniamo un elenco degli elementi <p> del documento il cui elemento padre immediato è un {{domxref("div")}} con la classe "highlighted" e che si trovano all'interno di un contenitore il cui ID è "test".

- -
var container = document.querySelector("#test");
-var matches = container.querySelectorAll("div.highlighted > p");
- -

Questo esempio usa un attribute selector per restituire una lista degli elementi {{domxref("iframe")}} nel documento che contengono un attributo chiamato "data-src":

- -
var matches = document.querySelectorAll("iframe[data-src]");
- -

Qui, un selettore di attributo viene utilizzato per restituire un elenco degli elementi di elenco contenuti in un elenco il cui ID è "userlist" che hanno un attributo "data-active" il cui valore è "1":

- -
var container = document.querySelector("#userlist");
-var matches = container.querySelectorAll("li[data-active='1']");
- -

Accedere ai risultati

- -

Una volta restituita la {{domxref("NodeList")}} degli elementi di corrispondenza, è possibile esaminarlo come qualsiasi array. Se la matrice è vuota (ovvero la sua proprietà length è 0), non è stata trovata alcuna corrispondenza.

- -

Altrimenti, puoi semplicemente usare la notazione standard per accedere al contenuto della lista. È possibile utilizzare qualsiasi istruzione di loop comune, come ad esempio:

- -
var highlightedItems = userList.querySelectorAll(".highlighted");
-
-highlightedItems.forEach(function(userItem) {
-  deleteUser(userItem);
-});
- -
-

Note: NodeList non è un vero array, vale a dire che non ha i metodi dell'array come slice, some, map etc. Per convertirlo in un array, prova Array.from(nodeList).

-
- -

Note dell'utente

- -

querySelectorAll() si comporta in modo diverso rispetto alle più comuni librerie DOM JavaScript, il che potrebbe portare a risultati imprevisti.

- -

HTML

- -

Considera questo HTML, con i suoi tre blocchi {{HTMLElement("div")}} annidati.

- -
<div class="outer">
-  <div class="select">
-    <div class="inner">
-    </div>
-  </div>
-</div>
- -

JavaScript

- -
var select = document.querySelector('.select');
-var inner = select.querySelectorAll('.outer .inner');
-inner.length; // 1, not 0!
-
- -

In questo esempio, quando si seleziona ".outer .inner" nel contesto il <div> con la classe "select", tsi trova ancora l'elemento con la classe ".inner", anche se​​​​​​ .outer non è un discendente dell'elemento base su cui viene eseguita la ricerca (".select"). Per impostazione predefinita, querySelectorAll() verifica solo che l'ultimo elemento nel selettore si trovi all'interno dell'ambito di ricerca.

- -

La pseudo-classe {{cssxref(":scope")}} ripristina il comportamento previsto, abbinando solo i selettori sui discendenti dell'elemento base:

- -
var select = document.querySelector('.select');
-var inner = select.querySelectorAll(':scope .outer .inner');
-inner.length; // 0
-
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName("DOM WHATWG", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}{{Spec2("DOM WHATWG")}}Standard di vita
{{SpecName("Selectors API Level 2", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}{{Spec2("Selectors API Level 2")}}Nessun cambiamento
{{SpecName("DOM4", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}{{Spec2("DOM4")}}Definizione iniziale
{{SpecName("Selectors API Level 1", "#interface-definitions", "document.querySelector()")}}{{Spec2("Selectors API Level 1")}}Definizione originale
- -

Compatibilità con i browser

- -
- - -

{{Compat("api.Element.querySelectorAll")}}

-
- -

Vedi anche

- - diff --git a/files/it/web/api/element/removeattribute/index.html b/files/it/web/api/element/removeattribute/index.html deleted file mode 100644 index 2a64205cc3..0000000000 --- a/files/it/web/api/element/removeattribute/index.html +++ /dev/null @@ -1,57 +0,0 @@ ---- -title: Element.removeAttribute() -slug: Web/API/Element/removeAttribute -tags: - - API - - DOM - - Elemento - - Riferimento - - metodo -translation_of: Web/API/Element/removeAttribute ---- -
{{ APIRef("DOM") }}
- -

Il metodo {{domxref("Element")}} removeAttribute() rimuove l'attributo con il nome specificato dall'elemento.

- -

Sintassi

- -
element.removeAttribute(attrName);
-
- -

Parametri

- -
-
attrName
-
Una {{domxref("DOMString")}} che specifica il nome dell'attributo da rimuovere dall'elemento. Se l'attributo specificato non esiste, removeAttribute() restituisce senza generare un errore.
-
- -

Valore di ritorno

- -

undefined.

- -
-

Note: Poiché removeAttribute() non restituisce un valore, non è possibile concatenare più chiamate contemporaneamente per rimuovere più attributi contemporaneamente.

-
- -

Note di utilizzo

- -

Dovresti usare removeAttribute() invece di impostare il valore dell'attributo null direttamente o usando {{domxref("Element.setAttribute", "setAttribute()")}}. Molti attributi non si comportano come previsto se li imposti a null.

- -

{{ DOMAttributeMethods() }}

- -

Esempio

- -
// Prima: <div id="div1" align="left" width="200px">
-document.getElementById("div1").removeAttribute("align");
-// Dopo: <div id="div1" width="200px">
-
- -

Specifica

- -

DOM Level 2 Core: removeAttribute (introdotta nel DOM Level 1 Core)

- -

Compatibilità con i browser

- - - -

{{Compat("api.Element.removeAttribute")}}

diff --git a/files/it/web/api/element/requestfullscreen/index.html b/files/it/web/api/element/requestfullscreen/index.html deleted file mode 100644 index 624e2da766..0000000000 --- a/files/it/web/api/element/requestfullscreen/index.html +++ /dev/null @@ -1,110 +0,0 @@ ---- -title: Element.requestFullscreen() -slug: Web/API/Element/requestFullScreen -translation_of: Web/API/Element/requestFullScreen ---- -
{{APIRef("Fullscreen API")}}
- -

Il metodo Element.requestFullscreen() invia una richiesta asincrona per visualizzare l'elemento a schremo intero (full-screen).

- -

Non c'è garanzia che l'elemento verrà effettivamente visualizzato a schermo intero. Se il permesso di entrare in modalità full-screen è accordato, il documento riceverà un evento di tipo {{event("fullscreenchange")}} che lo informarà dell'avvenuto passaggio in modalità full-screen. Viceversa, se il permesso è negato, il documento riceve un evento di tipo {{event('fullscreenerror')}}.

- -
-

Soltanto gli elementi nel documento principale o in un {{HTMLElement('iframe')}} con l'attributo {{htmlattrxref("allowfullscreen", "iframe")}} possono essere visualizzati a schermo intero. Questo signigica che gli elementi all'interno di un {{HTMLElement('frame')}} o un {{HTMLElement('object')}} non possono.

-
- -

Sintassi

- -
elt.requestFullscreen();
-
- -

Specifiche

- - - - - - - - - - - - - - - - -
SpecificationStatoNote
{{SpecName("Fullscreen", "#dom-element-requestfullscreen", "Element.requestFullScreen()")}}{{Spec2("Fullscreen")}}Initial definition
- -

Compatibilità browser

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefoxInternet ExplorerEdgeOperaSafari
Basic support{{CompatVersionUnknown}}{{property_prefix("webkit")}}[1]{{CompatGeckoDesktop("9.0")}} as mozRequestFullScreen[2]
- {{CompatGeckoDesktop("47.0")}} (behind full-screen-api.unprefix.enabled		11{{property_prefix("ms")}}[3]{{CompatVersionUnknown}}[3]{{CompatUnknown}}{{CompatUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatUnknown}}{{CompatGeckoMobile("9.0")}} as mozRequestFullScreen[2]
- {{CompatGeckoMobile("47.0")}} (behind full-screen-api.unprefix.enabled		{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
-
- -

[1] implementato anche come webkitRequestFullScreen.

- -

[2] Implementato come mozRequestFullScreen (notare la letterea S maiuscola per Screen). Prima di Firefox 44, Gecko erroneamente permetteva agli elementi all'inderno di un {{HTMLElement('frame')}} o un {{HTMLElement('object')}} di richiedere e ottenere il full screen. Da Firefox 44 in poi ciò è stato corretto: solo gli elementi del documento principale o di un {{HTMLElement('iframe')}} con l'attributo {{htmlattrxref("allowfullscreen", "iframe")}} possono essere visualizzati a schermo intero.

- -

[3] Vedi documentazione su MSDN.

- -

Vedi anche

- - diff --git a/files/it/web/api/element/scrollheight/index.html b/files/it/web/api/element/scrollheight/index.html deleted file mode 100644 index 05cc48fd15..0000000000 --- a/files/it/web/api/element/scrollheight/index.html +++ /dev/null @@ -1,170 +0,0 @@ ---- -title: Element.scrollHeight -slug: Web/API/Element/scrollHeight -translation_of: Web/API/Element/scrollHeight ---- -

{{ APIRef("DOM") }}

- -

L' Element.scrollHeight è una proprietà di sola lettura e contiene la misura dell'altezza del contenuto di un elemento, incluso il contenuto non visibile sullo schermo a causa dell'overflow. Il valore dello scrollHeight è uguale al minimo valore del clientHeight che l'elemento richiederebbe per adattare tutto il contenuto nel punto di vista, senza usare una barra di scorrimento verticale. Esso include il padding, ma non il bordo dell'elemento.

- -
-

Questa proprietà ritornerà un numero intero. Se hai bisogno di un numero decimale, invece, usa {{ domxref("Element.getBoundingClientRect()") }}.

-
- -

Sintassi

- -
var intElemScrollHeight = document.getElementById("nome dell'id").scrollHeight;
-
- -

La variabile intElemScrollHeight è una variabile contenente un numero intero che corrisponde allo scrollHeight in pixel dell'elemento. ScrollHeight è una proprietà di sola lettura.

- -

Esempio

- -
-
-

padding-top

- -

Gentle, individualistic and very loyal, Birman cats fall between Siamese and Persian in character. If you admire cats that are non aggressive, that enjoy being with humans and tend to be on the quiet side, you may well find that Birman cats are just the felines for you.

- -

Image:BirmanCat.jpgAll Birmans have colorpointed features, dark coloration of the face, ears, legs and tail.

- -

Cat image and text coming from www.best-cat-art.com

- -

padding-bottom

-
-LeftTopRightBottommargin-topmargin-bottomborder-topborder-bottom{{ mediawiki.external('if IE') }}><span id="MrgLeft" style="position: _fckstyle="position: _fckstyle="position: absolute; left: 8px; top: 65px; font: bold 13px Arial, sans-serif !important; writing-mode: tb-rl;">margin-left</span><span id="BrdLeft" style="position: absolute; left: 33px; top: 65px; color: white; font: bold 13px Arial, sans-serif !important; writing-mode: tb-rl;">border-left</span><span id="PdgLeft" style="position: absolute; left: 55px; top: 65px; font: bold 13px Arial, sans-serif !important; writing-mode: tb-rl;">padding-left</span><span id="PdgRight" style="position: absolute; left: 275px; top: 60px; color: black; font: bold 13px Arial, sans-serif !important; writing-mode: tb-rl; white-space: nowrap;">padding-right</span><span id="BrdRight" style="position: absolute; left: 310px; top: 65px; color: white; font: bold 13px Arial, sans-serif !important; writing-mode: tb-rl;">border-right</span><span id="MrgRight" style="position: absolute; left: 340px; top: 65px; font: bold 13px Arial, sans-serif !important; writing-mode: tb-rl;">margin-right</span><!{{ mediawiki.external('endif') }}
- -

Image:scrollHeight.png

- -

Problemi e soluzioni

- -

Determinare se un elemento è arrivato in fondo con lo scroll.

- -

La seguente funzione ritorna true se l'elemento è in fondo al suo scorrimento, false altrimenti.

- -
element.scrollHeight - element.scrollTop === element.clientHeight
- -

 

- -

Associato all'evento onscroll, questa equivalenza potrebbe tornare utile per determinare se l'utente ha letto un testo o no (guarda anche le proprietà element.scrollTop e element.clientHeight). Per esempio:

- -
-
<!doctype html>
-<html>
-<head>
-<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
-<title>MDN Example</title>
-<script type="text/javascript">
-function checkReading () {
-  if (checkReading.read) { return; }
-  checkReading.read = this.scrollHeight - this.scrollTop === this.clientHeight;
-  document.registration.accept.disabled = document.getElementById("nextstep").disabled = !checkReading.read;
-  checkReading.noticeBox.innerHTML = checkReading.read ?
-    "Thank you." :
-    "Please, scroll and read the following text.";
-}
-
-onload = function () {
-  var oToBeRead = document.getElementById("rules");
-  checkReading.noticeBox = document.createElement("span");
-  document.registration.accept.checked = false;
-  checkReading.noticeBox.id = "notice";
-  oToBeRead.parentNode.insertBefore(checkReading.noticeBox, oToBeRead);
-  oToBeRead.parentNode.insertBefore(document.createElement("br"), oToBeRead);
-  oToBeRead.onscroll = checkReading;
-  checkReading.call(oToBeRead);
-}
-
-</script>
-<style type="text/css">
-
-#notice {
-  display: inline-block;
-  margin-bottom: 12px;
-  border-radius: 5px;
-  width: 600px;
-  padding: 5px;
-  border: 2px #7FDF55 solid;
-}
-
-#rules {
-  width: 600px;
-  height: 130px;
-  padding: 5px;
-  border: #2A9F00 solid 2px;
-  border-radius: 5px;
-}
-</style>
-</head>
-
-<body>
-
-  <form name="registration">
-
-    <p>
-      <textarea id="rules">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum at laoreet magna. Aliquam erat volutpat. Praesent molestie, dolor ut eleifend aliquam, mi ligula ultrices sapien, quis cursus neque dui nec risus. Duis tincidunt lobortis purus eu aliquet. Quisque in dignissim magna. Aenean ac lorem at velit ultrices consequat. Nulla luctus nisi ut libero cursus ultrices. Pellentesque nec dignissim enim.
-
-Phasellus ut quam lacus, sed ultricies diam. Vestibulum convallis rutrum dolor, sit amet egestas velit scelerisque id. Proin non dignissim nisl. Sed mi odio, ullamcorper eget mattis id, malesuada vitae libero. Integer dolor lorem, mattis sed dapibus a, faucibus id metus. Duis iaculis dictum pulvinar. In nisi nibh, dapibus ac blandit at, porta at arcu.
-
-Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent dictum ipsum aliquet erat eleifend sit amet sollicitudin felis tempus. Aliquam congue cursus venenatis. Maecenas luctus pellentesque placerat. Mauris nisl odio, condimentum sed fringilla a, consectetur id ligula. Praesent sem sem, aliquet non faucibus vitae, iaculis nec elit. Nullam volutpat, lectus et blandit bibendum, nulla lorem congue turpis, ac pretium tortor sem ut nibh. Donec vel mi in ligula hendrerit sagittis. Donec faucibus viverra fermentum. Fusce in arcu arcu. Nullam at dignissim massa. Cras nibh est, pretium sit amet faucibus eget, sollicitudin in ligula. Vivamus vitae urna mauris, eget euismod nunc.
-
-Aenean semper gravida enim non feugiat. In hac habitasse platea dictumst. Cras eleifend nisl volutpat ante condimentum convallis. Donec varius dolor malesuada erat consequat congue. Donec eu lacus ut sapien venenatis tincidunt. Quisque sit amet tellus et enim bibendum varius et a orci. Donec aliquet volutpat scelerisque.
-
-Proin et tortor dolor. Ut aliquet, dolor a mattis sodales, odio diam pulvinar sem, egestas pretium magna eros vitae felis. Nam vitae magna lectus, et ornare elit. Morbi feugiat, ipsum ac mattis congue, quam neque mollis tortor, nec mollis nisl dolor a tortor. Maecenas varius est sit amet elit interdum quis placerat metus posuere. Duis malesuada justo a diam vestibulum vel aliquam nisi ornare. Integer laoreet nisi a odio ornare non congue turpis eleifend. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras vulputate libero sed arcu iaculis nec lobortis orci fermentum.</textarea>
-    </p>
-
-    <p>
-      <input type="checkbox" name="accept" id="agree" />
-      <label for="agree">I agree</label>
-      <input type="submit" id="nextstep" value="Next" />
-    </p>
-
-  </form>
-
-</body>
-</html>
-
- -

Guarda l'esempio qui sopra

- -

Specificazioni

- -

scrollHeight è parte del modello dell'oggetto MSIE's DHTML . scrollHeight funziona su questi browser: {{SpecName("CSSOM View")}}.

- -

Compatibilità dei Browser

- - - - - - - - - - - - - - - - - - - - - - - - -
BrowserVersioni
Internet Explorer8.0
Firefox (Gecko)3.0 (1.9)
Opera?
Safari | Chrome | WebKit4.0 | 4.0 | ?
- -

Nelle versioni più vecchie di FireFox: Qualora un contenuto di un elemento non generasse una barra di scorrimento varticale, allora il suo scrollHeight sarebbe uguale al suo clientHeight . Questo ci può dire che, o il contenuto è talmente corto da non richiedere una barra di scorrimento verticale, o che quell'elemento ha impostato la proprietà CSS overflow su visible (non-scrollabile).

- -

Guarda anche

- - diff --git a/files/it/web/api/element/scrolltop/index.html b/files/it/web/api/element/scrolltop/index.html deleted file mode 100644 index 52d7520f6f..0000000000 --- a/files/it/web/api/element/scrolltop/index.html +++ /dev/null @@ -1,83 +0,0 @@ ---- -title: Element.scrollTop -slug: Web/API/Element/scrollTop -tags: - - API - - Proprietà - - Referenza -translation_of: Web/API/Element/scrollTop ---- -
{{ APIRef("DOM") }}
- -

La proprietà Element.scrollTop ottiene o imposta il numero di pixel in cui il contenuto di un elemento viene fatto scorrere verticalmente.

- -

Il valore scrollTop di un elemento è una misura della distanza dalla parte superiore dell'elemento al suo contenuto visibile più in alto. Quando il contenuto di un elemento non genera una barra di scorrimento verticale, il suo valore scrollTop è 0.

- -
-

Sui sistemi che usano il ridimensionamento del display, scrollTop può darti un valore decimale.

-
- -

Sintassi

- -
// Get the number of pixels scrolled.
-var intElemScrollTop = someElement.scrollTop;
-
- -

Dopo aver eseguito questo codice, intElemScrollTop è un numero intero corrispondente al numero di pixel che il contenuto dell'{{domxref("element")}} è stato fatto scorrere verso l'alto.

- -
// Set the number of pixels scrolled.
-element.scrollTop = intValue;
-
- -

scrollTop può essere impostato su qualsiasi valore intero, con alcuni avvertimenti:

- - - -

Esempio

- -
-
-

padding-top

-If you can see this, scrollTop = 0 - -

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

-If you can see this, scrollTop is > 0 - -

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

-If you can see this, scrollTop is maxed-out - -

padding-bottom

-
-Left Top Right Bottom margin-top margin-bottom border-top border-bottom
- -

Specifiche

- - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('CSSOM View', '#dom-element-scrolltop', 'scrollTop')}}{{Spec2("CSSOM View")}}
- -

Compatibilità con i browser

- - - -

{{Compat("api.Element.scrollTop")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/element/setattribute/index.html b/files/it/web/api/element/setattribute/index.html deleted file mode 100644 index b3644c8bb2..0000000000 --- a/files/it/web/api/element/setattribute/index.html +++ /dev/null @@ -1,83 +0,0 @@ ---- -title: Element.setAttribute() -slug: Web/API/Element/setAttribute -translation_of: Web/API/Element/setAttribute ---- -

{{APIRef("DOM")}}

- -

Imposta il valore di un attributo sull'elemento specificato. Se l'attributo esiste già, il valore viene aggiornato; in caso contrario viene aggiunto un nuovo attributo con il nome e il valore specificati.

- -

Per ottenere il valore corrente di un attributo, utilizza il metodo {{domxref("Element.getAttribute", "getAttribute()")}}; per rimuovere un attributo, usa {{domxref("Element.removeAttribute", "removeAttribute()")}}.

- -

Sintassi

- -
Element.setAttribute(nome, valore);
-
- -

Parametri

- -
-
nome
-
Una {{domxref("DOMString")}} specifica il nome dell'attributo il cui valore deve essere impostato. Il nome dell'attributo viene automaticamente convertito in minuscolo quando setAttribute() viene chiamato su un elemento in un documento HTML.
-
valore
-
Una {{domxref("DOMString")}} contenente il valore da assegnare all'attributo. Qualsiasi valore non stringa specificato viene convertito automaticamente in una stringa.
-
- -

Gli attributi booleani sono considerati true se sono presenti sull'elemento, indipendentemente dal loro valore effettivo; di norma, è necessario specificare la stringa vuota ("") in valore (alcune persone usano il nome dell'attributo, ma funziona in modo non standard). Vedi l'{{anch ("Esempio", "esempio")}} sotto per una dimostrazione pratica.

- -

Poiché il valore specificato viene convertito in una stringa, specificare null non fa necessariamente ciò che si aspetta. Invece di rimuovere l'attributo o impostarne il valore come {{jsxref("null")}}, imposta invece il valore dell'attributo sulla stringa null. Se vuoi rimuovere un attributo, usa {{domxref("Element.removeAttribute", "removeAttribute()")}}.

- -

Valore di ritorno

- -

{{jsxref("undefined")}}.

- -

Eccezioni

- -
-
InvalidCharacterError
-
L'attributo specificato nome contiene uno o più caratteri che non sono validi nei nomi degli attributi.
-
- -

Esempio

- -

Nell'esempio seguente, setAttribute() viene utilizzato per impostare gli attributi su un {{HTMLElement("button")}}.

- -

HTML

- -
<button>Hello World</button>
- -

JavaScript

- -
var b = document.querySelector("button");
-
-b.setAttribute("name", "helloButton");
-b.setAttribute("disabled", "");
-
- -

Questo dimostra due cose:

- - - -

{{ EmbedLiveSample('Example', '300', '50') }}

- -

{{DOMAttributeMethods}}

- -

Specifiche

- - - -

Compatibilità con i browser

- - - -

{{Compat("api.Element.setAttribute")}}

- -

Gecko notes

- -

L'utilizzo di setAttribute() per modificare determinati attributi, in particolare value in XUL, funziona in modo incoerente, in quanto l'attributo specifica il valore predefinito. Per accedere o modificare i valori correnti, è necessario utilizzare le proprietà. Ad esempio, utilizzare Element.value anziché Element.setAttribute().

diff --git a/files/it/web/api/element/tagname/index.html b/files/it/web/api/element/tagname/index.html deleted file mode 100644 index 950a9a17a4..0000000000 --- a/files/it/web/api/element/tagname/index.html +++ /dev/null @@ -1,72 +0,0 @@ ---- -title: Element.tagName -slug: Web/API/Element/tagName -tags: - - API - - DOM - - Di sola lettura - - Element - - Gecko - - Proprietà - - Referenza - - Referenza del DOM - - tagName -translation_of: Web/API/Element/tagName ---- -
{{ApiRef("DOM")}}
- -

La proprietà tagName di sola lettura dell'interfaccia {{domxref("Element")}} restituisce il nome del tag dell'elemento su cui è chiamato. Ad esempio, se l'elemento è un {{HTMLElement("img")}}, la sua proprietà tagName è "IMG" (per i documenti HTML, può essere modificata in modo diverso per i documenti XML/XHTML).

- -

Sintassi

- -
elementName = Element.tagName;
-
- -

Valore

- -

Una stringa che indica il nome del tag dell'elemento. La capitalizzazione di questa stringa dipende dal tipo di documento:

- - - -

Per gli oggetti {{domxref("Element")}}, il valore di tagName è uguale al valore della proprietà {{domxref("Node.nodeName", "nodeName")}} che l'oggetto elemento eredita da {{domxref("Node")}}.

- -

Esempio

- -

HTML

- -
<span id="born">Quando sono nato...</span>
-
- -

JavaScript

- -
var span = document.getElementById("born");
-console.log(span.tagName);
-
- -

In XHTML (o qualsiasi altro formato XML), il caso originale verrà mantenuto, quindi "span" verrebbe stampato nel caso in cui il nome del tag originale fosse stato creato in minuscolo. In HTML, "SPAN" verrebbe invece stampato indipendentemente dal caso utilizzato durante la creazione del documento originale.

- -

Specifiche

- - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', '#dom-element-tagname', 'Element: tagName')}}{{Spec2('DOM WHATWG')}} 
- -

Compatibilità con i browser

- - - -

{{Compat("api.Element.tagName")}}

diff --git a/files/it/web/api/element/toggleattribute/index.html b/files/it/web/api/element/toggleattribute/index.html deleted file mode 100644 index c997b4efdd..0000000000 --- a/files/it/web/api/element/toggleattribute/index.html +++ /dev/null @@ -1,104 +0,0 @@ ---- -title: Element.toggleAttribute() -slug: Web/API/Element/toggleAttribute -translation_of: Web/API/Element/toggleAttribute ---- -
{{APIRef("DOM")}}
- -

Il metodo toggleAttribute() dell'interfaccia {{domxref("Element")}} attiva/disattiva un attributo booleano (rimuovendolo se è presente e aggiungendolo se non è presente) sull'elemento specificato.

- -

Sintassi

- -
Element.toggleAttribute(name [, force]);
-
- -

Parametri

- -
-
name
-
Una {{domxref("DOMString")}} che specifica il nome dell'attributo da attivare. Il nome dell'attributo viene automaticamente convertito in minuscolo quando toggleAttribute() viene chiamato su un elemento HTML in un documento HTML.
-
force {{optional_inline}}
-
Un valore booleano per determinare se l'attributo deve essere aggiunto o rimosso, indipendentemente dal fatto che l'attributo sia presente o meno al momento.
-
- -

Valore di ritorno

- -

true se l'attributo name è eventualmente presente, in caso contrario false.

- -

Exceptions

- -
-
InvalidCharacterError
-
L'attributo specificato name contiene uno o più caratteri che non sono validi nei nomi degli attributi.
-
- -

Esempio

- -

Nell'esempio seguente, toggleAttribute() viene utilizzato per commutare l'attributo  readonly di un {{HTMLElement("input")}}.

- -

HTML

- -
<input value="text">
-<button>toggleAttribute("readonly")</button>
- -

JavaScript

- -
var button = document.querySelector("button");
-var input = document.querySelector("input");
-
-button.addEventListener("click", function(){
-  input.toggleAttribute("readonly");
-});
-
- -

Risultato

- -

{{ EmbedLiveSample('Esempio', '300', '50') }}

- -

{{DOMAttributeMethods}}

- -

Polyfill

- -
if (!Element.prototype.toggleAttribute) {
-  Element.prototype.toggleAttribute = function(name, force) {
-    if(force !== void 0) force = !!force
-
-    if (this.getAttribute(name) !== null) {
-      if (force) return true;
-
-      this.removeAttribute(name);
-      return false;
-    } else {
-      if (force === false) return false;
-
-      this.setAttribute(name, "");
-      return true;
-    }
-  };
-}
-
- -

Specifiche

- - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', '#dom-element-toggleattribute', 'Element.toggleAttribute')}}{{Spec2('DOM WHATWG')}} 
- -

Compatibilità con i browser

- - - -

{{Compat("api.Element.toggleAttribute")}}

diff --git a/files/it/web/api/event/bubbles/index.html b/files/it/web/api/event/bubbles/index.html deleted file mode 100644 index e75e385070..0000000000 --- a/files/it/web/api/event/bubbles/index.html +++ /dev/null @@ -1,31 +0,0 @@ ---- -title: event.bubbles -slug: Web/API/Event/bubbles -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Event/bubbles ---- -

{{ ApiRef() }}

-

Sommario

-

Indica se un dato evento può emergere attraverso il DOM oppure no.

-

Sintassi

-
bool = event.bubbles
-
-

bool vale true se l'evento può emergere, altrimenti vale false.

-

Note

-

Solo alcuni eventi possono emergere. Tali eventi hanno questa proprietà impostata a true. E' possibile utilizzarla per controllare se un evento può emergere.

-

Esempio

-
 function leggiInput(e) {
-  // controlla se emerge
-  if not e.bubbles {
-     // in caso negativo, passa oltre
-     passaOltre(e);
-  }
-  // altrimenti emerge
-  scriviOutput(e)
-}
-
-

{{ languages( { "en": "en/DOM/event.bubbles", "pl": "pl/DOM/event.bubbles" } ) }}

diff --git a/files/it/web/api/event/cancelable/index.html b/files/it/web/api/event/cancelable/index.html deleted file mode 100644 index 3258a2b37d..0000000000 --- a/files/it/web/api/event/cancelable/index.html +++ /dev/null @@ -1,23 +0,0 @@ ---- -title: event.cancelable -slug: Web/API/Event/cancelable -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Event/cancelable ---- -

{{ ApiRef() }}

-

Sommario

-

Indica se è possibile cancellare la risposta predefinita di questo evento o meno.

-

Sintassi

-
bool =event.cancelable;
-
-

bool vale true se l'evento è cancellabile, altrimenti false.

-

Note

-

Se un evento possa essere cancellato o meno, viene determinato al momento dell'inizializzazione dell'evento.

-

Per cancellare un evento, si chiami il metodo preventDefault. Questo impedisce al browser di eseguire l'azione di default associata a tale evento.

-

Specification

-

DOM Level 2 Events: cancelable

-

{{ languages( { "en": "en/DOM/event.cancelable", "pl": "pl/DOM/event.cancelable" } ) }}

diff --git a/files/it/web/api/event/currenttarget/index.html b/files/it/web/api/event/currenttarget/index.html deleted file mode 100644 index 7fcc81f4b3..0000000000 --- a/files/it/web/api/event/currenttarget/index.html +++ /dev/null @@ -1,99 +0,0 @@ ---- -title: Event.currentTarget -slug: Web/API/Event/currentTarget -translation_of: Web/API/Event/currentTarget ---- -

{{APIRef("DOM")}}

- -

Identifica l'elemento del DOM a cui è stato assegnato l'event handler diversamente dall' event.target che rappresenta l'elemento da cui è stato generato l'evento.

- -

Esempio

- -

L' event.currentTarget risulta utile da usare quando si assegna lo stesso event handler a numerosi elementi.

- -
function hide(e){
-  e.currentTarget.style.visibility = "hidden";
-  // When this function is used as an event handler: this === e.currentTarget
-}
-
-var ps = document.getElementsByTagName('p');
-
-for(var i = 0; i < ps.length; i++){
-  ps[i].addEventListener('click', hide, false);
-}
-
-// click around and make paragraphs disappear
-
- -

Specifiche

- - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName("DOM2 Events", "#Events-Event-currentTarget", "Event.currentTarget")}}{{Spec2("DOM2 Events")}}Initial definition
- -

Compatibilità Browser

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}[1]{{CompatVersionUnknown}}{{CompatUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
-
- -

[1] Il modello degli eventi implementato dagli Internet Explorer da 6 a 8 è diverso. Gli event listerner sono attaccati attraverso il metodo non standard element.attachEvent. In questo modello non esiste un equivalente dell' event.currentTarget inoltre this è l'oggetto globale. Una possibile soluzione è quella di wrappare la gestione dell' event.currentTarget in una funzione che chiami la funzione di handler attraverso la Function.prototype.call passando come primo parametro l'elemento. In questo modo il valore associato allo this è quello aspettato.

- -

Vedi anche

- -

Comparison of Event Targets

diff --git a/files/it/web/api/event/eventphase/index.html b/files/it/web/api/event/eventphase/index.html deleted file mode 100644 index d695a1451a..0000000000 --- a/files/it/web/api/event/eventphase/index.html +++ /dev/null @@ -1,19 +0,0 @@ ---- -title: event.eventPhase -slug: Web/API/Event/eventPhase -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Event/eventPhase ---- -

{{ ApiRef() }}

-

Sommario

-

Indica quale fase del flusso degli eventi è attualmente in elaborazione.

-

Sintassi

-
fase = event.eventPhase
-
-

Specifiche

-

eventPhase

-

{{ languages( { "en": "en/DOM/event.eventPhase", "pl": "pl/DOM/event.eventPhase" } ) }}

diff --git a/files/it/web/api/event/index.html b/files/it/web/api/event/index.html deleted file mode 100644 index 6ae75ff300..0000000000 --- a/files/it/web/api/event/index.html +++ /dev/null @@ -1,240 +0,0 @@ ---- -title: event -slug: Web/API/Event -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Event ---- -

{{ ApiRef() }}

-

Introduzione

-

Questo capitolo descrive il modello degli eventi del DOM Level 2 così come è implementato in Gecko. Viene descritta l'interfaccia Event, così come le interfacce per la registrazione di eventi per i nodi del DOM, i gestori di eventi, i listener e diversi esempi che mostrano come le interfacce dei diversi eventi si relazionano tra loro.

-

Vi è un diagramma eccellente che spiega chiaramente le tre fasi del flusso degli eventi nella bozza di DOM Level 3.

-

L'interfaccia Event

-

I gestori degli eventi possono essere assegnati a vari elementi DOM. Quando un dato evento si verifica, un oggetto evento viene creato dinamicamente e passato agli event listener che permettono di gestirlo. L'interfaccia Event del DOM è quindi accessibile dalla funzione che gestisce l'evento, alla quale viene passato un oggetto evento come primo e unico argomento.

-

Vi sono tre modi di assegnare un listener a un elemento. Con due di queste tecniche, l'oggetto evento viene passato implicitamente alla funzione che gestisce l'evento. Con la terza tecnica, occorre passare esplicitamente l'oggetto evento come parametro.

-

L'esempio seguente mostra come un oggetto evento viene passato a tale funzione e come può essere utilizzato all'interno della funzione.

-

Si noti che nel codice non viene passato alcun parametro "evt". L'oggetto evento viene passato automaticamente a foo. Tutto ciò che occorre fare è definire un parametro nel gestore di eventi che riceva l'oggetto evento.

-
function foo(evt) {
-  // le funzioni per la gestione degli eventi come questa
-  // ricevono un riferimento implicito all'oggetto evento che gestiscono
-  // (in questo caso abbiamo scelto di chiamarlo "evt").
-  alert(evt);
-}
-elementoTabella.onclick = foo;
-
-

Questo esempio è molto semplice, ma mostra una caratteristica importante degli eventi nel DOM di Gecko, cioè che è possibile accedere all'oggetto evento dalla funzione gestore. Una volta che si ha un riferimento a un evento, si può accedere a tutte le proprietà e ai metodi descritti in questo capitolo.

-

Gestori degli eventi DOM

-

Oltre all'oggetto event qui descritto, il DOM di Gecko fornisce anche metodi per la registrazione dei listener sui nodi del DOM, la rimozione di questi listeners ed eliminare gli eventi dal DOM. Questi event listener sugli elementi HTML o XML sono i modi principali per accedere agli eventi. Questi tre metodi sono descritti nella lista sottostante.

-

Si può anche passare un riferimento all'oggetto evento sotto forma di un parametro definito, chiamato event, alla funzione che gestisce l'evento. Il funzionamento è molto simile a quello della parola chiave this.

-
<html>
-<head>
-<title>esempio sul parametro evento</title>
-
-<script type="text/javascript">
-
-function mostraCoordinate(evt){
-  alert(
-    "valore clientX: " + evt.clientX + "\n" +
-    "valore clientY: " + evt.clientY + "\n"
-  );
-}
-
-</script>
-</head>
-
-<body onmousedown="mostraCoordinate(event)">
-<p>Per conoscere le coordinate della posizione del mouse, clicca in qualunque punto di questa pagina.</p>
-</body>
-</html>
-
-

Utilizzando l'oggetto event predefinito è possibile passare altri parametri alla funzione, come mostrato nel seguente esempio:

-
<html>
-<head>
-<title>esempio sul parametro evento + parametri extra</title>
-
-<script type="text/javascript">
-
-var par2 = 'ciao';
-var par3 = 'mondo!';
-
-function mostraCoordinate(evt, p2, p3){
-  alert(
-    "valore clientX: " + evt.clientX + "\n"
-    + "valore clientY: " + evt.clientY + "\n"
-    + "parametro 2: " + p2 + "\n"
-    + "parametro 3: " + p3 + "\n"
-  );
-}
-
-</script>
-</head>
-
-<body onmousedown="mostraCoordinate(event, par2, par3)">
-<p>Per conoscere le coordinate della posizione del mouse e visualizzare un saluto al mondo, clicca in qualunque punto di questa pagina.</p>
-</body>
-</html>
-
-

Proprietà

-
-
- event.altKey
-
- Restituisce un booleano che indica se il tasto <alt> è stato premuto durante l'evento.
-
- event.bubbles
-
- Restituisce un booleano che indica se l'evento emerge dal DOM.
-
- event.button
-
- Restituisce un intero che indica quale tasto del mouse è stato premuto.
-
- event.cancelBubble
-
- {{ Deprecated_inline() }} Restituisce un booleano che indica se l'evento è stato cancellato.
-
- event.cancelable
-
- Restituisce un booleano che indica se l'evento è cancellabile.
-
- event.charCode
-
- Restituisce il tasto carattere che è stato premuto e che ha scatenato l'evento keypress.
-
- event.clientX
-
- Restituisce la posizione orizzontale del puntatore del mouse.
-
- event.clientY
-
- Restituisce la posizione verticale del puntatore del mouse.
-
- event.ctrlKey
-
- Restituisce un booleano che indica se il tasto <ctrl> è stato premuto durante l'evento.
-
- event.currentTarget
-
- Restituisce un riferimento all'elemento a cui appartiene l'evento.
-
- event.detail
-
- Restituisce alcuni dettagli sull'evento.
-
- event.eventPhase
-
- Indica in quale fase si trova il flusso dell'elaborazione degli eventi.
-
- event.explicitOriginalTarget
-
- Restituisce l'elemento dal quale ha avuto origine l'evento (solo Mozilla).
-
- event.isChar
-
- Restituisce un booleano che indica se l'evento è stato causato dalla pressione di un tasto carattere.
-
- event.keyCode
-
- Restituisce un valore Unicode per un tasto non carattere che è stato premuto.
-
- event.layerX
-
- Restituisce la coordinata orizzontale relativa al layer corrente.
-
- event.layerY
-
- Restituisce la coordinata verticale relativa al layer corrente.
-
- event.metaKey
-
- Restituisce un booleano che indica se il tasto meta è stato premuto durante l'evento.
-
- event.originalTarget
-
- Restituisce l'elemento dal quale ha avuto origine l'evento (solo Mozilla).
-
- event.pageX
-
- Restituisce la coordinata orizzontale relativa alla pagina.
-
- event.pageY
-
- Restituisce la coordinata verticale relativa alla pagina.
-
- event.relatedTarget
-
- Identifica un elemento secondario legato all'evento.
-
- event.screenX
-
- Restituisce la posizione orizzontale relativa allo schermo.
-
- event.screenY
-
- Restituisce la posizione verticale relativa allo schermo.
-
- event.shiftKey
-
- Restituisce un booleano che indica se il tasto <shift> è stato premuto durante l'evento.
-
- event.target
-
- Restituisce un riferimento all'elemento al quale l'evento era legato originariamente.
-
- event.timeStamp
-
- Restituisce il timestamp nel quale l'evento è stato scatenato.
-
- event.type
-
- Restituisce il nome dell'evento (case-insensitive).
-
- event.view
-
- Identifica l'AbstractView dal quale l'evento è stato generato.
-
- event.which
-
- Restituisce il valore Unicode del tasto che è stato premuto, indipendentemente da quale tipo di tasto sia stato premuto.
-
-

Metodi

-
-
- event.initEvent
-
- Inizializza il valore di un evento che è stato creato tramite l'interfaccia DocumentEvent.
-
- event.initKeyEvent
-
- Inizializza un evento legato alla tastiera (specifico di Gecko).
-
- event.initMouseEvent
-
- Inizializza un evento legato al mouse
-
- event.initUIEvent
-
- Inizializza un evento legato all'interfaccia utente
-
- event.preventBubble
-
- {{ Obsolete_inline() }} Previene l'emergere di un evento. Questo metodo è deprecato in favore dello standard stopPropagation ed è stato rimosso in Gecko 1.9.
-
- event.preventCapture
-
- {{ Obsolete_inline() }} Questo metodo è deprecato in favore dello standard stopPropagation ed è stato rimosso in Gecko 1.9.
-
- event.preventDefault
-
- Cancella l'evento (se è cancellabile).
-
- event.stopPropagation
-
- Arresta un'ulteriore propagazione degli eventi DOM.
-
-
-  
-

{{ languages( { "en": "en/DOM/event", "es": "es/DOM/event", "fr": "fr/DOM/event", "pl": "pl/DOM/event" } ) }}

diff --git a/files/it/web/api/event/preventdefault/index.html b/files/it/web/api/event/preventdefault/index.html deleted file mode 100644 index 040257b4a3..0000000000 --- a/files/it/web/api/event/preventdefault/index.html +++ /dev/null @@ -1,176 +0,0 @@ ---- -title: Event.preventDefault() -slug: Web/API/Event/preventDefault -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Event/preventDefault ---- -
{{ ApiRef("DOM") }}
- -

Il metodo preventDefault() dell'interfaccia {{domxref("Event")}} dice all'{{Glossary("user agent")}} che se l'evento non viene esplicitamente gestito, la sua azione predefinita non dovrebbe essere presa come normalmente. L'evento continua a propagarsi come al solito, a meno che uno dei suoi listener di eventi non chiami {{domxref("Event.stopPropagation", "stopPropagation()")}} o {{domxref("Event.stopImmediatePropagation", "stopImmediatePropagation()")}}, uno dei due interrompa la propagazione contemporaneamente.

- -

Sintassi

- -
Event.preventDefault();
- -

Parametri

- -

Nessuno.

- -

Valore di ritorno

- -

undefined.

- -

Esempi

- -

Blocco della gestione dei click predefinita

- -

La commutazione di una casella di controllo è l'azione predefinita di fare click su una casella di controllo. Questo esempio mostra come impedire che ciò accada:

- -

JavaScript

- -
document.querySelector("#id-checkbox").addEventListener("click", function(event) {
-         document.getElementById("output-box").innerHTML += "Mi dispiace! <code>preventDefault()</code> non ti lascerà controllare questo!<br>";
-         event.preventDefault();
-}, false);
- -

HTML

- -
<p>Si prega di fare click sul controllo casella di controllo.</p>
-
-<form>
-  <label for="id-checkbox">Checkbox:</label>
-  <input type="checkbox" id="id-checkbox"/>
-</form>
-
-<div id="output-box"></div>
- -

Risultato

- -

Puoi vedere questo in azione qui:

- -

{{EmbedLiveSample("Blocking_default_click_handling")}}

- -

Interruzione delle sequenze di tasti per raggiungere un campo di modifica

- -

L'esempio seguente dimostra come interrompere l'input di testo non valido per raggiungere il campo di input con preventDefault(). Al giorno d'oggi, di solito dovresti usare convalida del modulo HTML nativo.

- -

HTML

- -

Ecco il modulo:

- -
<div class="container">
-  <p>Inserisci il tuo nome utilizzando solo lettere minuscole.</p>
-
-  <form>
-    <input type="text" id="my-textbox">
-  </form>
-</div>
- -

CSS

- -

Usiamo un po' di CSS per la finestra di avviso che disegneremo quando l'utente preme una chiave non valida:

- -
.warning {
-  border: 2px solid #f39389;
-  border-radius: 2px;
-  padding: 10px;
-  position: absolute;
-  background-color: #fbd8d4;
-  color: #3b3c40;
-}
- -

JavaScript

- -

Ed ecco il codice JavaScript che fa il lavoro. Per prima cosa, ascolta gli eventi {{event("keypress")}}:

- -
var myTextbox = document.getElementById('my-textbox');
-myTextbox.addEventListener('keypress', checkName, false);
-
- -

La funzione checkName(), che controlla il tasto premuto e decide se permetterlo:

- -
function checkName(evt) {
-  var charCode = evt.charCode;
-  if (charCode != 0) {
-    if (charCode < 97 || charCode > 122) {
-      evt.preventDefault();
-      displayWarning(
-        "Per favore usa solo lettere minuscole."
-        + "\n" + "charCode: " + charCode + "\n"
-      );
-    }
-  }
-}
-
- -

la funzione displayWarning() presenta la notifica di un problema. Non è una funzione elegante ma fa il lavoro ai fini di questo esempio:

- -
var warningTimeout;
-var warningBox = document.createElement("div");
-warningBox.className = "warning";
-
-function displayWarning(msg) {
-  warningBox.innerHTML = msg;
-
-  if (document.body.contains(warningBox)) {
-    window.clearTimeout(warningTimeout);
-  } else {
-    // inserisci warningBox dopo myTextbox
-    myTextbox.parentNode.insertBefore(warningBox, myTextbox.nextSibling);
-  }
-
-  warningTimeout = window.setTimeout(function() {
-      warningBox.parentNode.removeChild(warningBox);
-      warningTimeout = -1;
-    }, 2000);
-}
- -

Risultato

- -

Ecco il risultato del codice precedente:

- -

{{ EmbedLiveSample('Stopping_keystrokes_from_reaching_an_edit_field', 600, 200) }}

- -

Note

- -

Chiamando preventDefault() durante qualsiasi fase del flusso di eventi annulla l'evento, il che significa che non verrà eseguita alcuna azione predefinita normalmente eseguita dall'implementazione come risultato dell'evento.

- -
-

A partire da {{Gecko("6.0")}}, chiamare preventDefault()  fa sì che il valore della proprietà {{ domxref("Event.defaultPrevented()") }} diventi true.

-
- -

Puoi utilizzare {{domxref("Event.cancelable")}} per verificare se l'evento è cancellabile. Chiamare preventDefault() per un evento non cancellabile non ha alcun effetto.

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', '#dom-event-preventdefault', 'Event.preventDefault()')}}{{ Spec2('DOM WHATWG') }} 
{{SpecName('DOM2 Events', '#Events-Event-preventDefault', 'Event.preventDefault()')}}{{ Spec2('DOM2 Events') }}Definizione iniziale.
- -

Compatibilità con i browser

- - - -

{{Compat("api.Event.preventDefault")}}

diff --git a/files/it/web/api/event/stoppropagation/index.html b/files/it/web/api/event/stoppropagation/index.html deleted file mode 100644 index 1eef27bf30..0000000000 --- a/files/it/web/api/event/stoppropagation/index.html +++ /dev/null @@ -1,60 +0,0 @@ ---- -title: Event.stopPropagation() -slug: Web/API/Event/stopPropagation -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Event/stopPropagation ---- -

{{APIRef("DOM")}}

- -

Il metodo stopPropagation() dell'interfaccia {{domxref("Event")}} impedisce un'ulteriore propagazione dell'evento corrente nelle fasi di cattura e bubbling.

- -

Sintassi

- -
event.stopPropagation();
- -

Esempio

- -

Vedi Esempio 5: Propagazione degli eventi nel capitolo degli Esempi per un esempio più dettagliato di questo metodo e la propagazione degli eventi nel DOM.

- -

Note

- -

Vedi la specificazione DOM per la spiegazione del flusso di eventi. (La bozza degli eventi di DOM Level 3" ha un'illustrazione.)

- -

preventDefault è un metodo complementare che può essere utilizzato per impedire l'azione predefinita dall'evento.

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName("DOM WHATWG", "#dom-event-stoppropagation", "Event.stopPropagation()")}}{{Spec2("DOM WHATWG")}} 
{{SpecName("DOM4", "#dom-event-stoppropagation", "Event.stopPropagation()")}}{{Spec2("DOM4")}} 
{{SpecName("DOM2 Events", "#Events-Event-stopPropagation", "Event.stopPropagation()")}}{{Spec2("DOM2 Events")}}Definzione iniziale
- -

Compatibilità con i browser

- - - -

{{Compat("api.Event.stopPropagation")}}

diff --git a/files/it/web/api/event/timestamp/index.html b/files/it/web/api/event/timestamp/index.html deleted file mode 100644 index d01ab1986a..0000000000 --- a/files/it/web/api/event/timestamp/index.html +++ /dev/null @@ -1,45 +0,0 @@ ---- -title: event.timeStamp -slug: Web/API/Event/timeStamp -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Event/timeStamp ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce il timestamp (cioè il numero di millisecondi trascorsi dalla Unix Epoch, le ore 00:00:00 del 1/1/1970) corrispondente al momento in cui si è verificato l'evento.

-

Sintassi

-
ts = event.timeStamp
-
-

Esempio

-
<html>
-<head>
-
-<title>esempio di timeStamp</title>
-
-<script type="text/javascript">
-var ora = null;
-
-function leggiOrario(evt) {
-  ora = evt.timeStamp;
-  document.getElementById("time").firstChild.nodeValue = ora;
-}
-</script>
-</head>
-
-<body onkeypress="leggiOrario(event)">
-
-<p>Premi un tasto per conoscere il timestamp corrente grazie all'evento onkeypress.</p>
-<p>timeStamp: <span id="time">-</span></p>
-
-</body>
-</html>
-
-

Note

-

Il sistema di eventi potrebbe non supportare questa proprietà per ogni possibile tipo di evento.

-

Specifiche

-

timestamp

-

{{ languages( { "en": "en/DOM/event.timeStamp", "pl": "pl/DOM/event.timeStamp" } ) }}

diff --git a/files/it/web/api/event/type/index.html b/files/it/web/api/event/type/index.html deleted file mode 100644 index 108e944059..0000000000 --- a/files/it/web/api/event/type/index.html +++ /dev/null @@ -1,50 +0,0 @@ ---- -title: event.type -slug: Web/API/Event/type -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Event/type ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce il nome dell'evento (case-insensitive).

-

Sintassi

-
stringa = event.type
-
-

Esempio

-
<html>
-<head>
-
-<title>esempio su event.type</title>
-
-<script type="text/javascript">
-var eventoCorrente = null;
-
-function tipoEvento(evt) {
-  eventoCorrente = evt.type;
-  document.getElementById("Etype").firstChild.nodeValue = eventoCorrente;
-}
-
-</script>
-</head>
-
-<body
-  onkeydown="tipoEvento(event)"
-  onkeyup="tipoEvento(event)"
-  onmousedown="tipoEvento(event)"
-  onmouseup="tipoEvento(event)">
-
-<p>Premi un tasto della tastiera o del mouse per visualizzare il nome dell'evento.</p>
-<p>Tipo evento: <span id="Etype">-</span></p>
-
-</body>
-</html>
-
-

Note

-

Il è un nome XML valido.

-

Specifiche

-

type

-

{{ languages( { "en": "en/DOM/event.type", "pl": "pl/DOM/event.type" } ) }}

diff --git a/files/it/web/api/eventtarget/addeventlistener/index.html b/files/it/web/api/eventtarget/addeventlistener/index.html deleted file mode 100644 index 36aaeb792f..0000000000 --- a/files/it/web/api/eventtarget/addeventlistener/index.html +++ /dev/null @@ -1,695 +0,0 @@ ---- -title: EventTarget.addEventListener() -slug: Web/API/EventTarget/addEventListener -tags: - - API - - DOM - - EventTarget - - Gestori di Eventi - - JavaScript - - Referenza - - Ricevere Eventi - - Rilevare Eventi - - addEventListener - - attachEvent - - eventi - - metodo - - mselementresize -translation_of: Web/API/EventTarget/addEventListener -original_slug: Web/API/Element/addEventListener ---- -
{{APIRef("DOM Events")}}
- -

Il metodo {{domxref("EventTarget")}} addEventListener() imposta una funzione che verrà chiamata ogni volta che l'evento specificato viene consegnato all'elemento di destinazione. I target comuni sono {{domxref("Element")}}, {{domxref("Document")}}, e {{domxref("Window")}}, ma la destinazione può essere qualsiasi oggetto che supporti eventi (come XMLHttpRequest).

- -

addEventListener() funziona aggiungendo una funzione o un oggetto che implementa {{domxref("EventListener")}} all'elenco di listener di eventi per il tipo di evento specificato sul {{domxref("EventTarget")}} sul quale è chiamato.

- -

Sintassi

- -
target.addEventListener(type, listener[, options]);
-target.addEventListener(type, listener[, useCapture]);
-target.addEventListener(type, listener[, useCapture, wantsUntrusted {{Non-standard_inline}}]); // Gecko/Mozilla only
- -

Parametri

- -
-
type
-
Una stringa sensibile al maiuscolo/minuscolo che rappresenta il tipo di evento da assegnare.
-
listener
-
L'oggetto che riceve una notifica (un oggetto che implementa l'interfaccia {{domxref("Event")}}) quando si verifica un evento del tipo specificato. Questo deve essere un oggetto che implementa l'interfaccia {{domxref("EventListener")}}, o una funzione. Vedi {{anch("Il callback del listener di eventi")}} per i dettagli sul callback stesso.
-
options {{optional_inline}}
-
Un oggetto opzioni che specifica le caratteristiche del listener di eventi. Le opzioni disponibili sono: -
    -
  • capture: Un {{jsxref("Boolean")}} che indica che eventi di questo tipo verranno inviati al listener registrato prima di essere inviati a qualsiasi EventTarget sotto di esso nell'albero del DOM.
    • -
  • once: Un {{jsxref("Boolean")}} che indica che il listener dovrebbe essere invocato al massimo una volta dopo essere stato aggiunto. Se ritorna true, il listener verrebbe automaticamente rimosso quando invocato.
    • -
  • passive: Un {{jsxref("Boolean")}} che, se true, indica che la funzione specificata da listener non chiamerà mai {{domxref("Event.preventDefault", "preventDefault()")}}. Se un listener passivo chiama preventDefault(), l'user agent non farà altro che generare un avviso nella console. Vedi {{anch("Miglioramento delle prestazioni di scorrimento con i listeners passivi")}} per saperne di più.
    • -
  • {{non-standard_inline}} mozSystemGroup: Un {{jsxref("Boolean")}} che indica che l'ascoltatore deve essere aggiunto al gruppo di sistema. Disponibile solo nel codice in esecuzione in XBL o nel {{glossary("chrome")}} del browser Firefox.
    • -
-
-
useCapture {{optional_inline}}
-
Un {{jsxref("Boolean")}} che indica se eventi di questo tipo verranno inviati al listener registrato prima di essere inviati a qualsiasi EventTarget sotto di esso nell'albero del DOM. Gli eventi che stanno ribollendo verso l'alto attraverso l'albero non innescheranno un ascoltatore designato ad usare il capturing. Il bubbling e la cattura degli eventi sono due modi di propagare gli eventi che si verificano in un elemento che è annidato in un altro elemento, quando entrambi gli elementi hanno registrato un handle per quell'evento. La modalità di propagazione dell'evento determina l'ordine in cui gli elementi ricevono l'evento. Vedi DOM Level 3 Events e JavaScript Event order per una spiegazione dettagliata. Se non specificato, useCapture di default è false.
-
-
Note: Per gli ascoltatori di eventi collegati al target dell'evento, l'evento si trova nella fase target, piuttosto che nelle fasi di cattura e bubbling. Gli eventi nella fase di destinazione attiveranno tutti gli ascoltatori di un elemento nell'ordine in cui sono stati registrati, indipendentemente dal parametro useCapture.
- -
Note: useCapture non è sempre stato opzionale. Idealmente, dovresti includerlo per la massima compatibilità con i browser.
-
-
wantsUntrusted {{Non-standard_inline}}
-
Un parametro specifico per Firefox (Gecko). Se è true, il listener riceve eventi sintetici inviati dal contenuto web (il valore predefinito è false per il browser {{glossary("chrome")}} e true per le normali pagine Web). Questo parametro è utile per il codice trovato nei componenti aggiuntivi e anche per il browser stesso.
-
- -

Valore di ritorno

- -

undefined

- -

Note di utilizzo

- -

Il callback del listener di eventi

- -

Il listener di eventi può essere specificato come funzione di callback o come oggetto che implementa {{domxref("EventListener")}}, il cui metodo {{domxref("EventListener.handleEvent", "handleEvent()")}} funge da funzione di callback.

- -

La stessa funzione di callback ha gli stessi parametri e il valore di ritorno del metodo handleEvent() cioè, il callback accetta un singolo parametro: un oggetto basato su {{domxref("Event")}} che descrive l'evento che si è verificato e non restituisce nulla.

- -

Ad esempio, un callback del gestore di eventi che può essere utilizzato per gestire entrambi gli eventi {{event("fullscreenchange")}} e {{event("fullscreenerror")}} potrebbe avere il seguente aspetto:

- -
function eventHandler(event) {
-  if (event.type == 'fullscreenchange') {
-    /* gestire un interruttore a schermo intero */
-  } else /* fullscreenerror */ {
-    /* gestire un errore di commutazione a schermo intero */
-  }
-}
- -

Rilevamento sicuro del supporto opzionale

- -

Nelle versioni precedenti della specifica DOM, il terzo parametro di addEventListener() era un valore booleano che indicava se utilizzare o meno l'acquisizione. Nel corso del tempo, è diventato chiaro che erano necessarie più opzioni. Piuttosto che aggiungere altri parametri alla funzione (complicando enormemente le cose quando si tratta di valori opzionali), il terzo parametro è stato modificato in un oggetto che può contenere varie proprietà che definiscono i valori delle opzioni per configurare il processo di rimozione del listener di eventi.

- -

Poiché i browser più vecchi (così come alcuni browser non troppo vecchi) presuppongono ancora che il terzo parametro sia un booleano, è necessario creare il codice per gestire questo scenario in modo intelligente. Puoi farlo utilizzando il rilevamento delle funzioni per ciascuna delle opzioni che ti interessano.

- -

Ad esempio, se si desidera verificare l'opzione passive:

- -
var passiveSupported = false;
-
-try {
-  var options = {
-    get passive() { // Questa funzione verrà chiamata quando il browser
-                    //     tenta di accedere alla proprietà passiva.
-      passiveSupported = true;
-    }
-  };
-
-  window.addEventListener("test", options, options);
-  window.removeEventListener("test", options, options);
-} catch(err) {
-  passiveSupported = false;
-}
-
- -

Questo crea un oggetto options con una funzione getter per la proprietà passive; il getter imposta una flag, passiveSupported, è true se viene chiamato. Ciò significa che se il browser controlla il valore della proprietà passive sull'oggetto options, passiveSupported sarà impostato su true; altrimenti rimarrà false. Chiamiamo quindi addEventListener() per impostare un gestore di eventi falsi, specificando tali opzioni, in modo che le opzioni vengano controllate se il browser riconosce un oggetto come terzo parametro. Quindi, chiamiamo removeEventListener() per pulire dopo noi stessi. (Nota che handleEvent() viene ignorato sui listener di eventi che non vengono chiamati.)

- -

Puoi verificare se un'opzione è supportata in questo modo. Basta aggiungere un getter per quella opzione usando il codice simile a quello mostrato sopra.

- -

Quindi, quando vuoi creare un listener di eventi effettivo che utilizza le opzioni in questione, puoi fare qualcosa di simile a questo:

- -
someElement.addEventListener("mouseup", handleMouseUp, passiveSupported
-                               ? { passive: true } : false);
- -

Qui stiamo aggiungendo un listener per l'evento {{event("mouseup")}} sull'elemento someElement. Per il terzo parametro, se passiveSupported è true, stiamo specificando un oggetto options con passive impostato su true; altrimenti, sappiamo che dobbiamo passare un booleano e passiamo false come valore del parametro useCapture.

- -

Se preferisci, puoi usare una libreria di terze parti come Modernizr o Detect It per fare questo test per te.

- -

È possibile ottenere ulteriori informazioni dall'articolo su EventListenerOptions dal gruppo di Web Incubator Community.

- -

Esempi

- -

Aggiungere un semplice listener

- -

Questo esempio dimostra come utilizzare addEventListener() per controllare i click del mouse su un elemento.

- -

HTML

- -
<table id="outside">
-    <tr><td id="t1">one</td></tr>
-    <tr><td id="t2">two</td></tr>
-</table>
-
- -

JavaScript

- -
// Funzione per modificare il contenuto di t2
-function modifyText() {
-  var t2 = document.getElementById("t2");
-  if (t2.firstChild.nodeValue == "three") {
-    t2.firstChild.nodeValue = "two";
-  } else {
-    t2.firstChild.nodeValue = "three";
-  }
-}
-
-// Aggiungere listener di eventi alla tabella
-var el = document.getElementById("outside");
-el.addEventListener("click", modifyText, false);
-
- -

In questo codice, modifyText() è un listener per gli eventi click registrati usando addEventListener(). Un click in qualsiasi punto della tabella esegue il gestore ed esegue modifyText().

- -

Risultato

- -

{{EmbedLiveSample('Aggiungere_un_semplice_listener')}}

- -

Listener di eventi con funzione anonima

- -

Qui, daremo un'occhiata a come utilizzare una funzione anonima per passare parametri nel listener di eventi.

- -

HTML

- -
<table id="outside">
-    <tr><td id="t1">one</td></tr>
-    <tr><td id="t2">two</td></tr>
-</table>
- -

JavaScript

- -
// Funzione per modificare il contenuto di t2
-function modifyText(new_text) {
-  var t2 = document.getElementById("t2");
-  t2.firstChild.nodeValue = new_text;
-}
-
-// Funzione per aggiungere listener alla tabella
-var el = document.getElementById("outside");
-el.addEventListener("click", function(){modifyText("four")}, false);
-
- -

Nota che il listener è una funzione anonima che incapsula codice che è quindi, a sua volta, in grado di inviare parametri alla funzione modifyText(), che è responsabile per rispondere effettivamente all'evento.

- -

Risultato

- -

{{EmbedLiveSample('Listener_di_eventi_con_funzione_anonima')}}

- -

Listener di eventi con una funzione a freccia

- -

Questo esempio dimostra un semplice listener di eventi implementato utilizzando la notazione della funzione a freccia.

- -

HTML

- -
<table id="outside">
-    <tr><td id="t1">one</td></tr>
-    <tr><td id="t2">two</td></tr>
-</table>
- -

JavaScript

- -
// Funzione per modificare il contenuto di t2
-function modifyText(new_text) {
-  var t2 = document.getElementById("t2");
-  t2.firstChild.nodeValue = new_text;
-}
-
-// Aggiungere un listener alla tabella con una funzione a freccia
-var el = document.getElementById("outside");
-el.addEventListener("click", () => { modifyText("four"); }, false);
-
- -

Risultato

- -

{{EmbedLiveSample('Listener_di_eventi_con_una_funzione_a_freccia')}}

- -

Si noti che, mentre le funzioni anonime e le frecce sono simili, hanno diversi collegamenti this. Mentre le funzioni anonime (e tutte le funzioni JavaScript tradizionali) creano i propri collegamenti this, le funzioni a freccia ereditano il vincolo this della funzione di contenimento.

- -

Ciò significa che le variabili e le costanti disponibili per la funzione di contenimento sono disponibili anche per il gestore di eventi quando si utilizza una funzione di freccia.

- -

Esempio di utilizzo delle opzioni

- -

HTML

- -
<div class="outer">
-    outer, once & none-once
-    <div class="middle" target="_blank">
-        middle, capture & none-capture
-        <a class="inner1" href="https://www.mozilla.org" target="_blank">
-            inner1, passive & preventDefault(which is not allowed)
-        </a>
-        <a class="inner2" href="https://developer.mozilla.org/" target="_blank">
-            inner2, none-passive & preventDefault(not open new page)
-        </a>
-    </div>
-</div>
-
- -

CSS

- -
    .outer, .middle, .inner1, .inner2 {
-        display:block;
-        width:520px;
-        padding:15px;
-        margin:15px;
-        text-decoration:none;
-    }
-    .outer{
-        border:1px solid red;
-        color:red;
-    }
-    .middle{
-        border:1px solid green;
-        color:green;
-        width:460px;
-    }
-    .inner1, .inner2{
-        border:1px solid purple;
-        color:purple;
-        width:400px;
-    }
-
- -

JavaScript

- -
    let outer  = document.getElementsByClassName('outer') [0];
-    let middle = document.getElementsByClassName('middle')[0];
-    let inner1 = document.getElementsByClassName('inner1')[0];
-    let inner2 = document.getElementsByClassName('inner2')[0];
-
-    let capture = {
-        capture : true
-    };
-    let noneCapture = {
-        capture : false
-    };
-    let once = {
-        once : true
-    };
-    let noneOnce = {
-        once : false
-    };
-    let passive = {
-        passive : true
-    };
-    let nonePassive = {
-        passive : false
-    };
-
-
-    outer.addEventListener('click', onceHandler, once);
-    outer.addEventListener('click', noneOnceHandler, noneOnce);
-    middle.addEventListener('click', captureHandler, capture);
-    middle.addEventListener('click', noneCaptureHandler, noneCapture);
-    inner1.addEventListener('click', passiveHandler, passive);
-    inner2.addEventListener('click', nonePassiveHandler, nonePassive);
-
-    function onceHandler(event) {
-        alert('outer, once');
-    }
-    function noneOnceHandler(event) {
-        alert('outer, none-once, default');
-    }
-    function captureHandler(event) {
-        //event.stopImmediatePropagation();
-        alert('middle, capture');
-    }
-    function noneCaptureHandler(event) {
-        alert('middle, none-capture, default');
-    }
-    function passiveHandler(event) {
-        // Unable to preventDefault inside passive event listener invocation.
-        event.preventDefault();
-        alert('inner1, passive, open new page');
-    }
-    function nonePassiveHandler(event) {
-        event.preventDefault();
-        //event.stopPropagation();
-        alert('inner2, none-passive, default, not open new page');
-    }
-
- -

Risultato

- -

Fai click rispettivamente sui contenitori esterni, centrali e interni per vedere come funzionano le opzioni.

- -

{{ EmbedLiveSample('Esempio_di_utilizzo_delle_opzioni', 600, 310, '', 'Web/API/EventTarget/addEventListener') }}

- -

Prima di utilizzare un particolare valore nell'oggetto options è una buona idea assicurarsi che il browser dell'utente lo supporti, poiché si tratta di un'aggiunta che non tutti i browser hanno supportato storicamente. Vedi {{anch("Rilevamento sicuro del supporto opzionale")}} per i dettagli.

- -

Altre note

- -

Perchè usare addEventListener?

- -

addEventListener() è il modo per registrare un listener di eventi come specificato nel DOM W3C. I benefici sono i seguenti:

- - - -

Il modo alternativo, più vecchio per registrare i listener, è descritto di seguito.

- -

Aggiunta di un listener durante la spedizione dell'evento

- -

Se un {{domxref("EventListener")}} viene aggiunto ad un {{domxref("EventTarget")}} mentre sta elaborando un evento, quell'evento non attiva il listener. Tuttavia, lo stesso listener può essere attivato durante una fase successiva del flusso di eventi, come la fase di bubbling.

- -

Più listeners identici

- -

Se più EventListener indentici sono registrati sullo stesso EventTarget con gli stessi parametri, le istanze duplicate vengono scartate. Non causano l'EventListener da chiamare due volte e non devono essere rimossi manualmente con il metodo {{domxref("EventTarget.removeEventListener", "removeEventListener()")}}. Nota tuttavia che quando si utilizza una funzione anonima come gestore, tali listener NON saranno identici poiché le funzioni anonime non sono identiche anche se definite utilizzando il codice sorgente invariato SAME chiamato semplicemente ripetutamente, anche se in un ciclo. Tuttavia, definire ripetutamente la stessa funzione denominata in questi casi può essere più problematico. (vedi Problemi di memoria di seguito.)

- -

Il valore di this all'interno del gestore

- -

È spesso preferibile fare riferimento all'elemento su cui è stato attivato il gestore eventi, ad esempio quando si utilizza un gestore generico per un insieme di elementi simili.

- -

Se si collega un handler ad un elemento utilizzando addEventListener(), il valore di this all'interno del gestore è un riferimento all'elemento. È uguale al valore della proprietà currentTarget dell'argomento evento che viene passato al gestore.

- -
my_element.addEventListener('click', function (e) {
-  console.log(this.className)           // registra il className di my_element
-  console.log(e.currentTarget === this) // ritorna `true`
-})
-
- -

Come promemoria, le funzioni freccia non hanno il loro this contesto.

- -
my_element.addEventListener('click', (e) => {
-  console.log(this.className)           // WARNING: `this` is not `my_element`
-  console.log(e.currentTarget === this) // logs `false`
-})
- -

Se un gestore di eventi (ad esempio, {{domxref("Element.onclick", "onclick")}}) è specificato su un elemento nel codice sorgente HTML, il codice JavaScript nel valore dell'attributo viene effettivamente racchiuso in una funzione di gestore che associa il valore di this in modo coerente con addEventListener(); un'occorrenza di this all'interno del codice rappresenta un riferimento all'elemento.

- -
<table id="my_table" onclick="console.log(this.id);"><!-- `this` refers to the table; logs 'my_table' -->
-  ...
-</table>
-
- -

Si noti che il valore di this all'interno di una funzione, chiamato dal codice nel valore dell'attributo, si comporta come per regole standard. Questo è mostrato nel seguente esempio:

- -
<script>
-  function logID() { console.log(this.id); }
-</script>
-<table id="my_table" onclick="logID();"><!-- when called, `this` will refer to the global object -->
-  ...
-</table>
-
- -

Il valore di this all'interno di logID() è un riferimento all'oggetto globale {{domxref("Window")}} (o undefined nel caso della strict mode).

- -

Specificare this usando bind()

- -

Il metodo Function.prototype.bind() consente di specificare il valore che dovrebbe essere usato come this per tutte le chiamate a una determinata funzione. Ciò ti consente di bypassare facilmente i problemi in cui non è chiaro quale sarà this a seconda del contesto in cui è stata chiamata la tua funzione. Nota, tuttavia, che è necessario mantenere un riferimento per l'ascoltatore in modo da poterlo rimuovere in seguito.

- -

Questo è un esempio con e senza bind():

- -
var Something = function(element) {
-  // |this| is a newly created object
-  this.name = 'Something Good';
-  this.onclick1 = function(event) {
-    console.log(this.name); // undefined, as |this| is the element
-  };
-  this.onclick2 = function(event) {
-    console.log(this.name); // 'Something Good', as |this| is bound to newly created object
-  };
-  element.addEventListener('click', this.onclick1, false);
-  element.addEventListener('click', this.onclick2.bind(this), false); // Trick
-}
-var s = new Something(document.body);
-
- -

Un'altra soluzione sta utilizzando una funzione speciale chiamata handleEvent() per catturare qualsiasi evento:

- -
var Something = function(element) {
-  // |this| is a newly created object
-  this.name = 'Something Good';
-  this.handleEvent = function(event) {
-    console.log(this.name); // 'Something Good', as this is bound to newly created object
-    switch(event.type) {
-      case 'click':
-        // some code here...
-        break;
-      case 'dblclick':
-        // some code here...
-        break;
-    }
-  };
-
-  // Note that the listeners in this case are |this|, not this.handleEvent
-  element.addEventListener('click', this, false);
-  element.addEventListener('dblclick', this, false);
-
-  // You can properly remove the listeners
-  element.removeEventListener('click', this, false);
-  element.removeEventListener('dblclick', this, false);
-}
-var s = new Something(document.body);
-
- -

Un altro modo di gestire il riferimento a this è passare ad EventListener una funzione che chiama il metodo dell'oggetto che contiene i campi a cui è necessario accedere:

- -
class SomeClass {
-
-  constructor() {
-    this.name = 'Something Good';
-  }
-
-  register() {
-    var that = this;
-    window.addEventListener('keydown', function(e) {return that.someMethod(e);});
-  }
-
-  someMethod(e) {
-    console.log(this.name);
-    switch(e.keyCode) {
-      case 5:
-        // some code here...
-        break;
-      case 6:
-        // some code here...
-        break;
-    }
-  }
-
-}
-
-var myObject = new SomeClass();
-myObject.register();
- -

Legacy Internet Explorer e attachEvent

- -

Nelle versioni di Internet Explorer precedenti a IE 9, devi usare {{domxref("EventTarget.attachEvent", "attachEvent()")}}, piuttosto che lo standard addEventListener(). Per IE, modifichiamo l'esempio precedente per:

- -
if (el.addEventListener) {
-  el.addEventListener('click', modifyText, false);
-} else if (el.attachEvent)  {
-  el.attachEvent('onclick', modifyText);
-}
-
- -

C'è un inconveniente di attachEvent(): il valore di this sarà un riferimento all'oggetto window, invece dell'elemento su cui è stato chiamato.

- -

Il metodo attachEvent() potrebbe essere associato all'evento onresize per rilevare quando alcuni elementi di una pagina Web sono stati ridimensionati. L'evento proprietario mselementresize quando abbinato al metodo addEventListener di registrazione dei gestori di eventi, fornisce funzionalità simili a onresize, attivando quando alcuni elementi HTML vengono ridimensionati.

- -

Compatibilità

- -

Puoi lavorare attorno a addEventListener(), removeEventListener(), {{domxref("Event.preventDefault()")}}, e {{domxref("Event.stopPropagation()")}} non supportati da Internet Explorer 8 di usando il seguente codice all'inizio del tuo script. Il codice supporta l'uso di handleEvent() e anche l'evento {{event("DOMContentLoaded")}}.

- -
-

Note: useCapture non è supportato, in quanto IE 8 non ha alcun metodo alternativo. Il seguente codice aggiunge solo il supporto per IE 8. Questo polyfill di IE 8 funziona solo in modalità standard: è richiesta una dichiarazione doctype.

-
- -
(function() {
-  if (!Event.prototype.preventDefault) {
-    Event.prototype.preventDefault=function() {
-      this.returnValue=false;
-    };
-  }
-  if (!Event.prototype.stopPropagation) {
-    Event.prototype.stopPropagation=function() {
-      this.cancelBubble=true;
-    };
-  }
-  if (!Element.prototype.addEventListener) {
-    var eventListeners=[];
-
-    var addEventListener=function(type,listener /*, useCapture (will be ignored) */) {
-      var self=this;
-      var wrapper=function(e) {
-        e.target=e.srcElement;
-        e.currentTarget=self;
-        if (typeof listener.handleEvent != 'undefined') {
-          listener.handleEvent(e);
-        } else {
-          listener.call(self,e);
-        }
-      };
-      if (type=="DOMContentLoaded") {
-        var wrapper2=function(e) {
-          if (document.readyState=="complete") {
-            wrapper(e);
-          }
-        };
-        document.attachEvent("onreadystatechange",wrapper2);
-        eventListeners.push({object:this,type:type,listener:listener,wrapper:wrapper2});
-
-        if (document.readyState=="complete") {
-          var e=new Event();
-          e.srcElement=window;
-          wrapper2(e);
-        }
-      } else {
-        this.attachEvent("on"+type,wrapper);
-        eventListeners.push({object:this,type:type,listener:listener,wrapper:wrapper});
-      }
-    };
-    var removeEventListener=function(type,listener /*, useCapture (will be ignored) */) {
-      var counter=0;
-      while (counter<eventListeners.length) {
-        var eventListener=eventListeners[counter];
-        if (eventListener.object==this && eventListener.type==type && eventListener.listener==listener) {
-          if (type=="DOMContentLoaded") {
-            this.detachEvent("onreadystatechange",eventListener.wrapper);
-          } else {
-            this.detachEvent("on"+type,eventListener.wrapper);
-          }
-          eventListeners.splice(counter, 1);
-          break;
-        }
-        ++counter;
-      }
-    };
-    Element.prototype.addEventListener=addEventListener;
-    Element.prototype.removeEventListener=removeEventListener;
-    if (HTMLDocument) {
-      HTMLDocument.prototype.addEventListener=addEventListener;
-      HTMLDocument.prototype.removeEventListener=removeEventListener;
-    }
-    if (Window) {
-      Window.prototype.addEventListener=addEventListener;
-      Window.prototype.removeEventListener=removeEventListener;
-    }
-  }
-})();
- -

Il modo più antico per registrare i listeners

- -

addEventListener() è stato introdotto con la specifica DOM 2 Prima di allora, gli ascoltatori di eventi sono stati registrati come segue:

- -
// Passando un riferimento alla funzione - non aggiungere "()" dopo di esso, che chiamerebbe la funzione!
-el.onclick = modifyText;
-
-// Using a function expression
-element.onclick = function() {
-  // ... function logic ...
-};
-
- -

Questo metodo sostituisce il listener dell'evento click esistente sull'elemento se ce n'è uno. Altri eventi e gestori di eventi associati come blur (onblur) e keypress (onkeypress) si comportano in modo simile.

- -

Poiché era essenzialmente parte di {{glossary("DOM", "DOM 0")}}, questa tecnica per aggiungere listener di eventi è ampiamente supportata e non richiede uno speciale codice cross-browser. Viene normalmente utilizzato per registrare dinamicamente i listener di eventi a meno che non siano necessarie le funzionalità extra di addEventListener().

- -

Problemi di memoria

- -
var els = document.getElementsByTagName('*');
-
-
-// Case 1
-for(var i = 0; i < els.length; i++) {
-  els[i].addEventListener("click", function(e){/* do something */}, false);
-}
-
-
-// Case 2
-function processEvent(e) {
-  /* do something */
-}
-
-for(var i = 0; i < els.length; i++){
-  els[i].addEventListener("click", processEvent, false);
-}
-
- -

Nel primo caso sopra, viene creata una nuova funzione (anonima) di gestione con ogni iterazione del ciclo. Nel secondo caso, la stessa funzione dichiarata in precedenza viene utilizzata come gestore di eventi, il che si traduce in un minore consumo di memoria poiché è stata creata una sola funzione di gestore. Inoltre, nel primo caso, non è possibile chiamare {{domxref("EventTarget.removeEventListener", "removeEventListener()")}} perché non viene mantenuto alcun riferimento alla funzione anonima (o qui, non mantenuto a nessuna delle più funzioni anonime che il loop potrebbe creare.) Nel secondo caso, è possibile eseguire myElement.removeEventListener("click", processEvent, false) perchè processEvent è il riferimento alla funzione.

- -

In realtà, per quanto riguarda il consumo di memoria, la mancanza di mantenere un riferimento alla funzione non è il vero problema; piuttosto è la mancanza di mantenere un riferimento di funzione STATICO. In entrambi i casi di problemi di seguito, viene mantenuto un riferimento alla funzione, ma poiché viene ridefinito a ogni iterazione, non è statico. Nel terzo caso, il riferimento alla funzione anonima viene riassegnato ad ogni iterazione. Nel quarto caso, l'intera definizione di funzione è invariata, ma viene ancora ripetutamente definita come se fosse nuova (a meno che non fosse [[promoted]] dal compilatore) e quindi non sia statica. Pertanto, sebbene sembrino essere semplicemente [[Multiple identifier event listers]], in entrambi i casi ogni iterazione creerà invece un nuovo listener con il proprio riferimento univoco alla funzione del gestore. Tuttavia, poiché la definizione della funzione stessa non cambia, la STESSA funzione può ancora essere chiamata per ogni listener duplicato (specialmente se il codice viene ottimizzato).

- -

Anche in entrambi i casi, poiché il riferimento alla funzione è stato mantenuto ma ripetutamente ridefinito con ogni aggiunta, l'istruzione remove di sopra può ancora rimuovere un listener, ma ora solo l'ultimo aggiunto.

- -
// Solo a scopo illustrativo: nota che "MISTAKE" di [j] per [i] causando così l'associazione di tutti gli eventi desiderati allo STESSO elemento
-
-// Case 3
-for (var i = 0, j = 0 ; i < els.length ; i++) {
-  /* do lots of stuff with */
-  els[j].addEventListener("click", processEvent = function(e){/* do something */}, false);
-}
-
-// Case 4
-for (var i = 0, j = 0 ; i < els.length ; i++) {
-  /* do lots of stuff with j */
-  function processEvent(e){/* do something */};
-  els[j].addEventListener("click", processEvent, false);
-}
- -

Miglioramento delle prestazioni di scorrimento con i listeners passivi

- -

Secondo la specifica, il valore predefinito per l'opzione passive è sempre falso. Tuttavia, questo introduce il potenziale per gli ascoltatori di eventi che gestiscono determinati eventi di tocco (tra gli altri) per bloccare il thread principale del browser mentre sta tentando di gestire lo scrolling, con conseguente enorme riduzione delle prestazioni durante la gestione dello scorrimento.

- -

Per evitare questo problema, alcuni browser (in particolare, Chrome e Firefox) hanno modificato il valore predefinito dell'opzione passive in true per gli eventi {{event("touchstart")}} e {{event("touchmove")}} sui nodi a livello del documento {{domxref("Window")}}, {{domxref("Document")}}, e {{domxref("Document.body")}}. Questo impedisce al listener di eventi di essere chiamato, quindi non può bloccare il rendering della pagina mentre l'utente sta scorrendo.

- -
-

Note: Vedi la tabella di compatibilità qui sotto se hai bisogno di sapere quali browser (e / o quali versioni di quei browser) implementano questo comportamento alterato.

-
- -

Puoi sovrascrivere questo comportamento impostando esplicitamente il valore di passive a false, come mostrato qui:

- -
/* Feature detection */
-var passiveIfSupported = false;
-
-try {
-  window.addEventListener("test", null, Object.defineProperty({}, "passive", { get: function() { passiveIfSupported = { passive: true }; } }));
-} catch(err) {}
-
-window.addEventListener('scroll', function(event) {
-  /* do something */
-  // can't use event.preventDefault();
-}, passiveIfSupported );
-
- -

Nei browser meno recenti che non supportano il parametro options su addEventListener(), il tentativo di utilizzarlo impedisce l'utilizzo dell'argomento useCapture senza utilizzare correttamente il rilevamento delle funzionalità.

- -

Non è necessario preoccuparsi del valore di passive per l'evento di base {{event("scroll")}}. Poiché non può essere annullato, i listener di eventi non possono comunque bloccare il rendering della pagina.

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificazioneStatoCommento
{{SpecName("DOM WHATWG", "#dom-eventtarget-addeventlistener", "EventTarget.addEventListener()")}}{{Spec2("DOM WHATWG")}} 
{{SpecName("DOM4", "#dom-eventtarget-addeventlistener", "EventTarget.addEventListener()")}}{{Spec2("DOM4")}} 
{{SpecName("DOM2 Events", "#Events-EventTarget-addEventListener", "EventTarget.addEventListener()")}}{{Spec2("DOM2 Events")}}Definizione inziale
- -

Compatibilità con i browser

- - - -

{{Compat("api.EventTarget.addEventListener", 3)}}

- -

Vedi anche

- - diff --git a/files/it/web/api/fetch_api/index.html b/files/it/web/api/fetch_api/index.html deleted file mode 100644 index 1a458fb681..0000000000 --- a/files/it/web/api/fetch_api/index.html +++ /dev/null @@ -1,170 +0,0 @@ ---- -title: Fetch API -slug: Web/API/Fetch_API -tags: - - API - - Documentazione - - Fetch - - Response - - Sperimentale - - XMLHttpRequest - - request -translation_of: Web/API/Fetch_API ---- -

{{DefaultAPISidebar("Fetch API")}}{{ SeeCompatTable }}

- -

La Fetch API fornisce un'interfaccia per ottenere risorse (anche attraverso la rete). Sembrerá familiare a tutti coloro che hanno usato {{domxref("XMLHttpRequest")}}, ma la nuova API fornisce un'insieme piú potente e flessibile di funzionalitá.

- -

Concetti e uso

- -

Fetch fornisce una definizione generica di oggetti {{domxref("Request")}} e {{domxref("Response")}} (e altri inclusi nelle richieste di rete). Questo permette loro di essere usati ovunque necessari, in futuro, sia che servano per service workers, Cache API e altri oggetti simili che usano o modificano richieste e risposte, sia per qualunque altro caso d'uso che richieda di generare le proprie risposte via codice.

- -

Esso fornisce anche una definizione per concetti correlati come CORS e la semantica degli header HTTP di tipo origin, ovviando alla necessità di doverli definire separatamente altrove.

- -

Per effettuare una richiesta e ottenere una risorsa, si usa il metodo {{domxref("GlobalFetch.fetch")}}. Esso è implementato in piú interfacce (specificatamente {{domxref("Window")}} e {{domxref("WorkerGlobalScope")}}). Questo lo rende disponibile all'incirca in ogni contesto in cui si puó voler ottenere risorse.

- -

Il metodo fetch() richiede un parametro obbligatorio, il percorso (path) alla risorsa che si vuole ottenere, e ritorna una {{domxref("Promise")}} che risolve la {{domxref("Response")}} a quella richiesta, sia essa stata eseguita con successo oppure no. Si puó anche passare in via opzionale un oggetto init (per definire opzioni facoltative) come secondo parametro (per l'elenco completo delle opzioni visitare {{domxref("Request")}}).

- -

Non appena una {{domxref("Response")}} è recuperata, vi è un certo numero di metodi disponibile allo scopo di definire cosa sia il corpo della risposta e come dovrebbe essere gestito (in dettaglio : {{domxref("Body")}}.)

- -

È possibile creare una richiesta e una risposta direttamente usando i costruttori delle classi {{domxref("Request.Request","Request()")}} e {{domxref("Response.Response","Response()")}}, ma non e' una pratica comune. Invece, e' piu' frequente che essi vengano creati come risultato delle altre azioni della API (ad esempio, {{domxref("FetchEvent.respondWith")}} dei service workers.)

- -
-

Note: Puoi trovare informazioni aggiuntive riguardo l'uso di fetch sulla pagina Using Fetch, e studiare i concetti sulla pagina Fetch basic concepts.

-
- -

Annullare un fetch

- -

I browsers hanno cominciato a supportare in via sperimentale le interfacce {{domxref("AbortController")}} e {{domxref("AbortSignal")}} (meglio note come Abort API), che permettono di annullare operazioni come Fetch e XHR quando non sono ancora state completate. Per maggiori informazioni controlla la pagina con la descrizione delle interfacce.

- -

Fetch Interfaces

- -
-
{{domxref("GlobalFetch")}}
-
Contiene il metodo globale fetch() usato per ottenere una risorsa.
-
{{domxref("Headers")}}
-
Rappresenta un header di richiesta/risposta, permettendo di interrogarlo ed eseguire azioni differenti in base ai risultati.
-
{{domxref("Request")}}
-
Rappresenta una richiesta.
-
{{domxref("Response")}}
-
Rappresenta una risposta a una richiesta.
-
- -

Fetch mixin

- -
-
{{domxref("Body")}}
-
Fornisce metodi relativi al corpo di una richiesta/risposta permettendo di dichiarare quale sia il tipo di contenuto e come dovrebbe essere gestito.
-
- -

Specifiche

- - - - - - - - - - - - - - -
SpecificheStatoCommento
{{SpecName('Fetch')}}{{Spec2('Fetch')}}Definizione di cui sopra
- -

Compatibilitá coi Browsers

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureChromeEdgeFirefox (Gecko)IEOperaSafari (WebKit)
Supporto base{{CompatChrome(42)}}14{{CompatGeckoDesktop(39)}}
- 34[1]
- {{ CompatGeckoDesktop(52)}}[2]		{{CompatNo}}29
- 28[1]		10.1
{{domxref('ReadableStream')}}{{CompatChrome(43)}}14{{CompatNo}}[3]{{CompatNo}}{{CompatUnknown}}{{CompatNo}}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureAndroid WebviewChrome for AndroidEdgeFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Supporto base{{CompatChrome(42)}}{{CompatChrome(42)}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatNo}}{{CompatNo}}10.1
{{domxref('ReadableStream')}}{{CompatChrome(43)}}{{CompatChrome(43)}}{{CompatVersionUnknown}}{{CompatNo}}[3]{{CompatNo}}{{CompatUnknown}}{{CompatNo}}
-
- -

[1] Questa API è implementata ma dev'essere abilitata da un'opzione di Firefox.

- -

[2] Per le versioni di Firefox precedenti la 52, get() ottiene solamente il primo valore nell'header specificato, mentre getAll() ottiene tutti i valori. Dalla versione 52 in avanti, get() ottiene tutti i valori e getAll() è stato eliminato.

- -

[3] La lettura degli streams è disponibile nell'attuale versione di Firefox, ma deve essere abilitata tramite le opzioni dom.streams.enabled e javascript.options.streams.

- -

Guarda anche

- - diff --git a/files/it/web/api/file/index.html b/files/it/web/api/file/index.html deleted file mode 100644 index 1d1941d482..0000000000 --- a/files/it/web/api/file/index.html +++ /dev/null @@ -1,101 +0,0 @@ ---- -title: File -slug: Web/API/File -tags: - - API - - File API - - Interface - - NeedsTranslation - - Reference - - TopicStub - - Web -translation_of: Web/API/File ---- -
{{APIRef}}
- -

The File interface provides information about files and allows JavaScript in a web page to access their content.

- -

File objects are generally retrieved from a {{DOMxRef("FileList")}} object returned as a result of a user selecting files using the {{HTMLElement("input")}} element, from a drag and drop operation's {{DOMxRef("DataTransfer")}} object, or from the mozGetAsFile() API on an {{DOMxRef("HTMLCanvasElement")}}.

- -

A File object is a specific kind of a {{DOMxRef("Blob")}}, and can be used in any context that a Blob can. In particular, {{DOMxRef("FileReader")}}, {{DOMxRef("URL.createObjectURL()")}}, {{DOMxRef("ImageBitmapFactories.createImageBitmap()", "createImageBitmap()")}}, and {{DOMxRef("XMLHttpRequest", "", "send()")}} accept both Blobs and Files.

- -

See Using files from web applications for more information and examples.

- -

{{InheritanceDiagram}}

- -

Constructor

- -
-
{{DOMxRef("File.File", "File()")}}
-
Returns a newly constructed File.
-
- -

Properties

- -
-
{{DOMxRef("File.lastModified")}} {{ReadOnlyInline}}
-
Returns the last modified time of the file, in millisecond since the UNIX epoch (January 1st, 1970 at Midnight).
-
{{DOMxRef("File.lastModifiedDate")}} {{Deprecated_Inline}} {{ReadOnlyInline}}
-
Returns the last modified {{JSxRef("Date")}} of the file referenced by the File object.
-
{{DOMxRef("File.name")}}{{ReadOnlyInline}}
-
Returns the name of the file referenced by the File object.
-
{{DOMxRef("File.webkitRelativePath")}} {{Non-standard_Inline}} {{ReadOnlyInline}}
-
Returns the path the URL of the {{DOMxRef("File")}} is relative to.
-
- -

File implements {{DOMxRef("Blob")}}, so it also has the following properties available to it:

- -
-
{{DOMxRef("File.size")}} {{ReadOnlyInline}}
-
Returns the size of the file in bytes.
-
{{DOMxRef("File.type")}} {{ReadOnlyInline}}
-
Returns the MIME type of the file.
-
- -

Methods

- -

The File interface doesn't define any methods, but inherits methods from the {{DOMxRef("Blob")}} interface:

- -
-
{{DOMxRef("Blob.slice()", "Blob.slice([start[, end[, contentType]]])")}}
-
Returns a new Blob object containing the data in the specified range of bytes of the source Blob.
-
{{DOMxRef("Blob.stream()")}}
-
Transforms the File into a {{DOMxRef("ReadableStream")}} that can be used to read the File contents.
-
{{DOMxRef("Blob.text()")}}
-
Transforms the File into a stream and reads it to completion. It returns a promise that resolves with a {{DOMxRef("USVString")}} (text).
-
{{DOMxRef("Blob.arrayBuffer()")}}
-
Transforms the File into a stream and reads it to completion. It returns a promise that resolves with an {{DOMxRef("ArrayBuffer")}}.
-
- -

Specifications

- - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('File API', "#file-section", "The File interface")}}{{Spec2('File API')}}Initial definition.
- -

Browser compatibility

- - - -

{{Compat("api.File")}}

- -

See also

- - diff --git a/files/it/web/api/file/using_files_from_web_applications/index.html b/files/it/web/api/file/using_files_from_web_applications/index.html deleted file mode 100644 index 00d0b5f28c..0000000000 --- a/files/it/web/api/file/using_files_from_web_applications/index.html +++ /dev/null @@ -1,506 +0,0 @@ ---- -title: Using files from web applications -slug: Web/API/File/Using_files_from_web_applications -translation_of: Web/API/File/Using_files_from_web_applications ---- -
{{APIRef ("File API")}}
- -

Utilizzando l'API File, che è stata aggiunta al DOM in HTML5, è ora possibile per il contenuto Web chiedere all'utente di selezionare i file locali e quindi leggere il contenuto di tali file. Questa selezione può essere effettuata utilizzando un {{HTMLElement("input/file", '<input type="file">')}}elemento HTML o trascinandolo.

- -

Se si desidera utilizzare l'API del file DOM da estensioni o altro codice Chrome del browser, è possibile; tuttavia, nota che ci sono alcune funzionalità aggiuntive di cui essere a conoscenza. Per i dettagli, vedi Utilizzo dell'API del file DOM nel codice Chrome .

- -

Accesso ai file selezionati

- -

Considera questo HTML:

- -
<input type = "file" id = "input" multiple>
- -

L'API File consente di accedere a un {{DOMxRef ("FileList")}} contenente {{DOMxRef ("File")}} oggetti che rappresentano i file selezionati dall'utente.

- -

L' multipleattributo inputsull'elemento consente all'utente di selezionare più file.

- -

Accesso al primo file selezionato usando un classico selettore DOM:

- -
const selectedFile = document.getElementById ('input'). files [0];
- -

Accesso ai file selezionati su un evento di modifica

- -

È anche possibile (ma non obbligatorio) accedere a {{DOMxRef ("FileList")}} tramite l' changeevento. È necessario utilizzare {{DOMxRef ("EventTarget.addEventListener ()")}} per aggiungere il changelistener di eventi, in questo modo:

- -
const inputElement = document.getElementById ("input");
-inputElement.addEventListener ("change", handleFiles, false);
-funzione handleFiles () {
-  const fileList = this.files; / * ora puoi lavorare con l'elenco dei file * /
-}
- -

Ottenere informazioni sui file selezionati

- -

L'oggetto {{DOMxRef ("FileList")}} fornito dal DOM elenca tutti i file selezionati dall'utente, ognuno specificato come oggetto {{DOMxRef ("File")}}. È possibile determinare il numero di file selezionato dall'utente controllando il valore dell'attributo dell'elenco file length:

- -
const numFiles = fileList.length;
- -

I singoli oggetti {{DOMxRef ("File")}} possono essere recuperati semplicemente accedendo all'elenco come un array:

- -
for (let i = 0, numFiles = fileList.length; i <numFiles; i ++) {
-  const file = fileList [i];
-  // ...
-}
-
- -

Questo ciclo scorre su tutti i file nell'elenco dei file.

- -

Esistono tre attributi forniti dall'oggetto {{DOMxRef ("File")}} che contengono informazioni utili sul file.

- -
-
name
-
Il nome del file come stringa di sola lettura. Questo è solo il nome del file e non include alcuna informazione sul percorso.
-
size
-
La dimensione del file in byte come numero intero a 64 bit di sola lettura.
-
type
-
Il tipo MIME del file come stringa di sola lettura o ""se il tipo non può essere determinato.
-
- -

Esempio: visualizzazione delle dimensioni dei file

- -

L'esempio seguente mostra un possibile utilizzo della sizeproprietà:

- -
<! DOCTYPE html>
-<Html>
-<Head>
-<meta charset = "UTF-8">
-<title> Dimensioni file </title>
-<Script>
-funzione updateSize () {
-  let nBytes = 0,
-      oFiles = this.files,
-      nFiles = oFiles.length;
-  for (let nFileId = 0; nFileId <nFiles; nFileId ++) {
-    nBytes + = oFiles [nFileId] .size;
-  }
-  let sOutput = nBytes + "bytes";
-  // codice opzionale per l'approssimazione di multipli
-  const aMultiples = ["KiB", "MiB", "GiB", "TiB", "PiB", "EiB", "ZiB", "YiB"];
-  per (nMultiple = 0, nApprox = nBytes / 1024; nApprox> 1; nApprox / = 1024, nMultiple ++) {
-    sOutput = nApprox.toFixed (3) + "" + aMultiples [nMultiple] + "(" + nBytes + "bytes)";
-  }
-  // fine del codice opzionale
-  document.getElementById ("fileNum"). innerHTML = nFiles;
-  document.getElementById ("fileSize"). innerHTML = sOutput;
-}
-
-document.getElementById ("uploadInput"). addEventListener ("change", updateSize, false);
-</ Script>
-</ Head>
-
-<Body>
-  <form name = "uploadForm">
-    <Div>
-      <input id = "uploadInput" type = "file" name = "myFiles" multiple>
-      file selezionati: <span id = "fileNum"> 0 </span>;
-      dimensione totale: <span id = "fileSize"> 0 </span>
-    </ Div>
-    <div> <input type = "submit" value = "Invia file"> </div>
-  </ Form>
-</ Body>
-</ Html>
-
- -

Utilizzo di elementi di input di file nascosti utilizzando il metodo click ()

- -

Puoi nascondere l'elemento file {{HTMLElement ("input")}}, ammesso, brutto e presentare la tua interfaccia per aprire il selettore di file e visualizzare il file o i file selezionati dall'utente. Puoi farlo stilando l'elemento di input con display:nonee chiamando il metodo {{DOMxRef ("HTMLElement.click", "click ()")}} sull'elemento {{HTMLElement ("input")}}.

- -

Considera questo HTML:

- -
<input type="file" id="fileElem" multiple accept="image/*" style="display:none">
-<button id="fileSelect">Select some files</button>
- -

The code that handles the click event can look like this:

- -
const fileSelect = document.getElementById("fileSelect"),
-  fileElem = document.getElementById("fileElem");
-
-fileSelect.addEventListener("click", function (e) {
-  if (fileElem) {
-    fileElem.click();
-  }
-}, false);
-
- -

You can style the new button for opening the file picker as you wish.

- -

Using a label element to trigger a hidden file input element

- -

To allow opening the file picker without using JavaScript (the click() method), a {{HTMLElement("label")}} element can be used. Note that in this case the input element must not be hidden using display: none (nor visibility: hidden), otherwise the label would not be keyboard-accessible. Use the visually-hidden technique instead.

- -

Consider this HTML:

- -
<input type="file" id="fileElem" multiple accept="image/*" class="visually-hidden">
-<label for="fileElem">Select some files</label>
- -

and this CSS:

- -
.visually-hidden {
-  position: absolute !important;
-  height: 1px;
-  width: 1px;
-  overflow: hidden;
-  clip: rect(1px, 1px, 1px, 1px);
-}
-
-/* Separate rule for compatibility, :focus-within is required on modern Firefox and Chrome */
-input.visually-hidden:focus + label {
-  outline: thin dotted;
-}
-input.visually-hidden:focus-within + label {
-  outline: thin dotted;
-}
-
- -

There is no need to add JavaScript code to call fileElem.click(). Also in this case you can style the label element as you wish. You need to provide a visual cue for the focus status of the hidden input field on its label, be it an outline as shown above, or background-color or box-shadow. (As of time of writing, Firefox doesn’t show this visual cue for <input type="file"> elements.)

- -

Selecting files using drag and drop

- -

You can also let the user drag and drop files into your web application.

- -

The first step is to establish a drop zone. Exactly what part of your content will accept drops may vary depending on the design of your application, but making an element receive drop events is easy:

- -
let dropbox;
-
-dropbox = document.getElementById("dropbox");
-dropbox.addEventListener("dragenter", dragenter, false);
-dropbox.addEventListener("dragover", dragover, false);
-dropbox.addEventListener("drop", drop, false);
-
- -

In this example, we're turning the element with the ID dropbox into our drop zone. This is done by adding listeners for the {{event('dragenter')}}, {{event('dragover')}}, and {{event('drop')}} events.

- -

We don't actually need to do anything with the dragenter and dragover events in our case, so these functions are both simple. They just stop propagation of the event and prevent the default action from occurring:

- -
function dragenter(e) {
-  e.stopPropagation();
-  e.preventDefault();
-}
-
-function dragover(e) {
-  e.stopPropagation();
-  e.preventDefault();
-}
-
- -

The real magic happens in the drop() function:

- -
function drop(e) {
-  e.stopPropagation();
-  e.preventDefault();
-
-  const dt = e.dataTransfer;
-  const files = dt.files;
-
-  handleFiles(files);
-}
-
- -

Here, we retrieve the dataTransfer field from the event, pull the file list out of it, and then pass that to handleFiles(). From this point on, handling the files is the same whether the user used the input element or drag and drop.

- -

Example: Showing thumbnails of user-selected images

- -

Let's say you're developing the next great photo-sharing website and want to use HTML to display thumbnail previews of images before the user actually uploads them. You can establish your input element or drop zone as discussed previously and have them call a function such as the handleFiles() function below.

- -
function handleFiles(files) {
-  for (let i = 0; i < files.length; i++) {
-    const file = files[i];
-
-    if (!file.type.startsWith('image/')){ continue }
-
-    const img = document.createElement("img");
-    img.classList.add("obj");
-    img.file = file;
-    preview.appendChild(img); // Assuming that "preview" is the div output where the content will be displayed.
-
-    const reader = new FileReader();
-    reader.onload = (function(aImg) { return function(e) { aImg.src = e.target.result; }; })(img);
-    reader.readAsDataURL(file);
-  }
-}
-
- -

Here our loop handling the user-selected files looks at each file's type attribute to see if its MIME type begins with the string "image/"). For each file that is an image, we create a new img element. CSS can be used to establish any pretty borders or shadows and to specify the size of the image, so that doesn't need to be done here.

- -

Each image has the CSS class obj added to it, making it easy to find in the DOM tree. We also add a file attribute to each image specifying the {{DOMxRef("File")}} for the image; this will let us fetch the images for actual upload later. We use {{DOMxRef("Node.appendChild()")}} to add the new thumbnail to the preview area of our document.

- -

Next, we establish the {{DOMxRef("FileReader")}} to handle asynchronously loading the image and attaching it to the img element. After creating the new FileReader object, we set up its onload function and then call readAsDataURL() to start the read operation in the background. When the entire contents of the image file are loaded, they are converted into a data: URL which is passed to the onload callback. Our implementation of this routine sets the img element's src attribute to the loaded image which results in the image appearing in the thumbnail on the user's screen.

- -

Using object URLs

- -

The DOM {{DOMxRef("URL.createObjectURL()")}} and {{DOMxRef("URL.revokeObjectURL()")}} methods let you create simple URL strings that can be used to reference any data that can be referred to using a DOM {{DOMxRef("File")}} object, including local files on the user's computer.

- -

When you have a {{DOMxRef("File")}} object you'd like to reference by URL from HTML, you can create an object URL for it like this:

- -
const objectURL = window.URL.createObjectURL(fileObj);
- -

The object URL is a string identifying the {{DOMxRef("File")}} object. Each time you call {{DOMxRef("URL.createObjectURL()")}}, a unique object URL is created even if you've created an object URL for that file already. Each of these must be released. While they are released automatically when the document is unloaded, if your page uses them dynamically you should release them explicitly by calling {{DOMxRef("URL.revokeObjectURL()")}}:

- -
URL.revokeObjectURL(objectURL);
- -

Example: Using object URLs to display images

- -

This example uses object URLs to display image thumbnails. In addition, it displays other file information including their names and sizes.

- -

The HTML that presents the interface looks like this:

- -
<input type="file" id="fileElem" multiple accept="image/*" style="display:none">
-<a href="#" id="fileSelect">Select some files</a>
-<div id="fileList">
-  <p>No files selected!</p>
-</div>
-
- -

This establishes our file {{HTMLElement("input")}} element as well as a link that invokes the file picker (since we keep the file input hidden to prevent that less-than-attractive user interface from being displayed). This is explained in the section {{anch("Using hidden file input elements using the click() method")}}, as is the method that invokes the file picker.

- -

The handleFiles() method follows:

- -
const fileSelect = document.getElementById("fileSelect"),
-    fileElem = document.getElementById("fileElem"),
-    fileList = document.getElementById("fileList");
-
-fileSelect.addEventListener("click", function (e) {
-  if (fileElem) {
-    fileElem.click();
-  }
-  e.preventDefault(); // prevent navigation to "#"
-}, false);
-
-fileElem.addEventListener("change", handleFiles, false);
-
-function handleFiles() {
-  if (!this.files.length) {
-    fileList.innerHTML = "<p>No files selected!</p>";
-  } else {
-    fileList.innerHTML = "";
-    const list = document.createElement("ul");
-    fileList.appendChild(list);
-    for (let i = 0; i < this.files.length; i++) {
-      const li = document.createElement("li");
-      list.appendChild(li);
-
-      const img = document.createElement("img");
-      img.src = URL.createObjectURL(this.files[i]);
-      img.height = 60;
-      img.onload = function() {
-        URL.revokeObjectURL(this.src);
-      }
-      li.appendChild(img);
-      const info = document.createElement("span");
-      info.innerHTML = this.files[i].name + ": " + this.files[i].size + " bytes";
-      li.appendChild(info);
-    }
-  }
-}
-
- -

This starts by fetching the URL of the {{HTMLElement("div")}} with the ID fileList. This is the block into which we'll insert our file list, including thumbnails.

- -

If the {{DOMxRef("FileList")}} object passed to handleFiles() is null, we simply set the inner HTML of the block to display "No files selected!". Otherwise, we start building our file list, as follows:

- -
    -
  1. A new unordered list ({{HTMLElement("ul")}}) element is created.
    2. -
  2. The new list element is inserted into the {{HTMLElement("div")}} block by calling its {{DOMxRef("Node.appendChild()")}} method.
    3. -
  3. For each {{DOMxRef("File")}} in the {{DOMxRef("FileList")}} represented by files: -
      -
    1. Create a new list item ({{HTMLElement("li")}}) element and insert it into the list.
      2. -
    2. Create a new image ({{HTMLElement("img")}}) element.
      3. -
    3. Set the image's source to a new object URL representing the file, using {{DOMxRef("URL.createObjectURL()")}} to create the blob URL.
      4. -
    4. Set the image's height to 60 pixels.
      5. -
    5. Set up the image's load event handler to release the object URL since it's no longer needed once the image has been loaded. This is done by calling the {{DOMxRef("URL.revokeObjectURL()")}} method and passing in the object URL string as specified by img.src.
      6. -
    6. Append the new list item to the list.
      7. -
    -
    4. -
- -

Here is a live demo of the code above:

- -

{{EmbedLiveSample('Example_Using_object_URLs_to_display_images', '100%', '300px')}}

- -

Example: Uploading a user-selected file

- -

Another thing you might want to do is let the user upload the selected file or files (such as the images selected using the previous example) to a server. This can be done asynchronously very easily.

- -

Creating the upload tasks

- -

Continuing with the code that built the thumbnails in the previous example, recall that every thumbnail image is in the CSS class obj with the corresponding {{DOMxRef("File")}} attached in a file attribute. This allows us to select all of the images the user has chosen for uploading using {{DOMxRef("Document.querySelectorAll()")}}, like this:

- -
function sendFiles() {
-  const imgs = document.querySelectorAll(".obj");
-
-  for (let i = 0; i < imgs.length; i++) {
-    new FileUpload(imgs[i], imgs[i].file);
-  }
-}
-
- -

Line 2 fetches a {{DOMxRef("NodeList")}}, called imgs, of all the elements in the document with the CSS class obj. In our case, these will be all of the image thumbnails. Once we have that list, it's trivial to go through it and create a new FileUpload instance for each. Each of these handles uploading the corresponding file.

- -

Handling the upload process for a file

- -

The FileUpload function accepts two inputs: an image element and a file from which to read the image data.

- -
function FileUpload(img, file) {
-  const reader = new FileReader();
-  this.ctrl = createThrobber(img);
-  const xhr = new XMLHttpRequest();
-  this.xhr = xhr;
-
-  const self = this;
-  this.xhr.upload.addEventListener("progress", function(e) {
-        if (e.lengthComputable) {
-          const percentage = Math.round((e.loaded * 100) / e.total);
-          self.ctrl.update(percentage);
-        }
-      }, false);
-
-  xhr.upload.addEventListener("load", function(e){
-          self.ctrl.update(100);
-          const canvas = self.ctrl.ctx.canvas;
-          canvas.parentNode.removeChild(canvas);
-      }, false);
-  xhr.open("POST", "http://demos.hacks.mozilla.org/paul/demos/resources/webservices/devnull.php");
-  xhr.overrideMimeType('text/plain; charset=x-user-defined-binary');
-  reader.onload = function(evt) {
-    xhr.send(evt.target.result);
-  };
-  reader.readAsBinaryString(file);
-}
-
- -

The FileUpload() function shown above creates a throbber, which is used to display progress information, and then creates an {{DOMxRef("XMLHttpRequest")}} to handle uploading the data.

- -

Before actually transferring the data, several preparatory steps are taken:

- -
    -
  1. The XMLHttpRequest's upload progress listener is set to update the throbber with new percentage information so that as the upload progresses the throbber will be updated based on the latest information.
    2. -
  2. The XMLHttpRequest's upload load event handler is set to update the throbber progress information to 100% to ensure the progress indicator actually reaches 100% (in case of granularity quirks during the process). It then removes the throbber since it's no longer needed. This causes the throbber to disappear once the upload is complete.
    3. -
  3. The request to upload the image file is opened by calling XMLHttpRequest's open() method to start generating a POST request.
    4. -
  4. The MIME type for the upload is set by calling the XMLHttpRequest function overrideMimeType(). In this case, we're using a generic MIME type; you may or may not need to set the MIME type at all depending on your use case.
    5. -
  5. The FileReader object is used to convert the file to a binary string.
    6. -
  6. Finally, when the content is loaded the XMLHttpRequest function send() is called to upload the file's content.
    7. -
- -

Asynchronously handling the file upload process

- -

This example, which uses PHP on the server side and JavaScript on the client side, demonstrates asynchronous uploading of a file.

- -
<?php
-if (isset($_FILES['myFile'])) {
-    // Example:
-    move_uploaded_file($_FILES['myFile']['tmp_name'], "uploads/" . $_FILES['myFile']['name']);
-    exit;
-}
-?><!DOCTYPE html>
-<html>
-<head>
-    <title>dnd binary upload</title>
-    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-    <script type="application/javascript">
-        function sendFile(file) {
-            const uri = "/index.php";
-            const xhr = new XMLHttpRequest();
-            const fd = new FormData();
-
-            xhr.open("POST", uri, true);
-            xhr.onreadystatechange = function() {
-                if (xhr.readyState == 4 && xhr.status == 200) {
-                    alert(xhr.responseText); // handle response.
-                }
-            };
-            fd.append('myFile', file);
-            // Initiate a multipart/form-data upload
-            xhr.send(fd);
-        }
-
-        window.onload = function() {
-            const dropzone = document.getElementById("dropzone");
-            dropzone.ondragover = dropzone.ondragenter = function(event) {
-                event.stopPropagation();
-                event.preventDefault();
-            }
-
-            dropzone.ondrop = function(event) {
-                event.stopPropagation();
-                event.preventDefault();
-
-                const filesArray = event.dataTransfer.files;
-                for (let i=0; i<filesArray.length; i++) {
-                    sendFile(filesArray[i]);
-                }
-            }
-        }
-    </script>
-</head>
-<body>
-    <div>
-        <div id="dropzone" style="margin:30px; width:500px; height:300px; border:1px dotted grey;">Drag & drop your file here...</div>
-    </div>
-</body>
-</html>
-
- -

Example: Using object URLs to display PDF

- -

Object URLs can be used for other things than just images! They can be used to display embedded PDF files or any other resources that can be displayed by the browser.

- -

In Firefox, to have the PDF appear embedded in the iframe (rather than proposed as a downloaded file), the preference pdfjs.disabled must be set to false {{non-standard_inline()}}.

- -
<iframe id="viewer">
-
- -

And here is the change of the src attribute:

- -
const obj_url = URL.createObjectURL(blob);
-const iframe = document.getElementById('viewer');
-iframe.setAttribute('src', obj_url);
-URL.revokeObjectURL(obj_url);
- -

Example: Using object URLs with other file types

- -

You can manipulate files of other formats the same way. Here is how to preview uploaded video:

- -
const video = document.getElementById('video');
-const obj_url = URL.createObjectURL (blob);
-video.src = obj_url;
-Video.play ();
-URL.revokeObjectURL (obj_url);
- -

specificazioni

- - - - - - - - - - - - - - - - - - - - - -
specificazioneStatoCommento
{{SpecName ('HTML WHATWG', 'numero-stato.html # concetto-input-tipo-file-selezionato', 'Stato caricamento file')}}{{Spec2 ('HTML WHATWG')}}
{{SpecName ('File API')}}{{Spec2 ('API file')}}Definizione iniziale
- -

Guarda anche

- - diff --git a/files/it/web/api/geolocation/index.html b/files/it/web/api/geolocation/index.html deleted file mode 100644 index 290260cdd6..0000000000 --- a/files/it/web/api/geolocation/index.html +++ /dev/null @@ -1,133 +0,0 @@ ---- -title: Geolocation -slug: Web/API/Geolocation -translation_of: Web/API/Geolocation ---- -
{{securecontext_header}}{{APIRef("Geolocation API")}}
- -

L'interfaccia Geolocation rappresenta un oggetto in grado di ottenere tramite codice la posizione del dispositivo utilizzato. Questo permette ai contenuti web di accedere alla posizione del dispositivo: ad esempio un sito web o una applicaziomne possono mostrare risultati personalizzati in base alla posizione del dispositivo.

- -

Un oggetto con questa interfaccia si ottiene usando la proprietà {{domxref("navigator.geolocation")}}, implementata dall'oggetto {{domxref("Navigator")}}.

- -
-

Nota: Per ragioni di sicurezza, quando una pagina web cerca di accedere alla posizione, l'utente viene notificato e gli viene chiesto il permesso. Considera che ogni browser ha una propria policy e un modo differente per chiedere il permesso.

-
- -

Proprietà

- -

L'interfaccia Geolocation non ha né implementazioni né proprietà.

- -

Metodi

- -

L'interfaccia Geolocation non eredita alcun metodo.

- -
-
{{domxref("Geolocation.getCurrentPosition()")}} {{securecontext_inline}}
-
Determina la posizione corrente del dispositivo e ritorna un oggetto {{domxref("Position")}} con i dati.
-
{{domxref("Geolocation.watchPosition()")}} {{securecontext_inline}}
-
Ritorna un valore long che rappresenta l'ultima chiamata alla funzione eseguita, quando la posizione del dispositivo cambia.
-
{{domxref("Geolocation.clearWatch()")}} {{securecontext_inline}}
-
Rimuove l'handler installato con watchPosition().
-
- -

Specifiche

- - - - - - - - - - - - - - - - -
SpecificheStatoCommento
{{SpecName('Geolocation')}}{{Spec2('Geolocation')}}Specifiche iniziali.
- -

Compatibilità dei browser

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Supporto base5{{CompatVersionUnknown}}{{CompatGeckoDesktop("1.9.1")}}910.60
- Rimosso nella 15.0
- Reintrodotto nella 16.0		5
Secure context-only47{{CompatUnknown()}}{{CompatGeckoDesktop("55")}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidChrome for AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Supporto base{{CompatUnknown()}}{{CompatUnknown()}}{{CompatVersionUnknown}}{{CompatGeckoMobile("4")}}{{CompatUnknown()}}10.60{{CompatUnknown()}}
Secure context-only{{CompatNo}}47{{CompatUnknown()}}{{CompatGeckoDesktop("55")}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -

Vedi anche

- - diff --git a/files/it/web/api/geolocation/watchposition/index.html b/files/it/web/api/geolocation/watchposition/index.html deleted file mode 100644 index e218675cf7..0000000000 --- a/files/it/web/api/geolocation/watchposition/index.html +++ /dev/null @@ -1,166 +0,0 @@ ---- -title: Geolocation.watchPosition() -slug: Web/API/Geolocation/watchPosition -translation_of: Web/API/Geolocation/watchPosition ---- -

{{securecontext_header}}{{ APIref("Geolocation API") }}

- -

Il metodo watchPosition() viene usato per creare una funzione che viene chiamata automaticamente ogni volta che cambia la posizione del dispositivo. Si può anche specificare una funzione da chiamare in caso di errore.

- -

Questo metodo ritorna un valore ID che può essere usato per terminare il metodo {{domxref("Geolocation.clearWatch()")}}.

- -

Sintassi

- -
id = navigator.geolocation.watchPosition(successo[, errore[, opzioni]])
- -

Parametri

- -
-
successo
-
Un funzione che prende come parametro di input un oggetto {{domxref("Position")}}.
-
errore {{optional_inline}}
-
Una funzione che prende come parametro di input un oggetto {{domxref("PositionError")}}.
-
opzioni {{optional_inline}}
-
Un oggetto {{domxref("PositionOptions")}} che permette di configurare la funzione che controlla la posizione.
-
- -

Esempi

- -
var id, target, options;
-
-function success(pos) {
-  var crd = pos.coords;
-
-  if (target.latitude === crd.latitude && target.longitude === crd.longitude) {
-    console.log('Congratulazioni, hai raggiunto il target');
-    navigator.geolocation.clearWatch(id);
-  }
-}
-
-function error(err) {
-  console.warn('ERROR(' + err.code + '): ' + err.message);
-}
-
-target = {
-  latitude : 0,
-  longitude: 0
-};
-
-options = {
-  enableHighAccuracy: false,
-  timeout: 5000,
-  maximumAge: 0
-};
-
-id = navigator.geolocation.watchPosition(success, error, options);
-
- -
-

Se la tua applicazione gira su Firefox OS, controlla la pagina geolocation wake lock per fare in modo che la posizione del dispositivo venga aggiornata in backgound o quando lo schermo del dispositivo è spento.

-
- -

Specifiche

- - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('Geolocation', '#watch-position', 'Geolocation.watchPosition()')}}{{Spec2('Geolocation')}}Specifica iniziale.
- -

Compatibilità dei browser

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Supporto base5{{CompatVersionUnknown}}{{CompatGeckoDesktop("1.9.1")}}910.60
- Rimosso nella 15.0
- Reintrodotto nella 16.0		5
Secure context-only47{{CompatUnknown()}}{{CompatGeckoDesktop("55")}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàAndroidChrome for AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Supporto base{{CompatUnknown()}}{{CompatUnknown()}}{{CompatVersionUnknown}}{{CompatGeckoMobile("4")}}{{CompatUnknown()}}10.60{{CompatUnknown()}}
Secure context-only{{CompatNo}}47{{CompatUnknown()}}{{CompatGeckoDesktop("55")}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -

Vedi anche

- - diff --git a/files/it/web/api/geolocation_api/index.html b/files/it/web/api/geolocation_api/index.html deleted file mode 100644 index 64fb909e34..0000000000 --- a/files/it/web/api/geolocation_api/index.html +++ /dev/null @@ -1,322 +0,0 @@ ---- -title: Using geolocation -slug: Web/API/Geolocation_API -translation_of: Web/API/Geolocation_API -original_slug: Web/API/Geolocation/Using_geolocation ---- -

{{securecontext_header}}{{APIRef("Geolocation API")}}

- -

Le API per la geolocalizzazione permettono agli utenti di fornire la propria posizione alle applicazioni web. Per ragioni di privacy, all'utente viene richiesta l'autorizzazione all'uso della posizione.

- -

L'oggetto della geolocalizzazione

- -

Le API di geolocalizzazione sono pubblicate tramite l'oggetto {{domxref("navigator.geolocation")}}.

- -

Se l'oggetto esiste, il servizio di geolocalizzazione è disponibile. Puoi testare l'esistenza dell'oggetto tramite:

- -
if ("geolocation" in navigator) {
-  /* la geolocalizzazione è disponibile */
-} else {
-  /* la geolocalizzazione NON È disponibile */
-}
-
- -
-

Nota: Su Firefox 24 e versioni più vecchie, "geolocation" in navigator ritorna sempre true anche se l'API è stata disabilitata. Questa cosa è stata sistemata con Firefox 25. ({{bug(884921)}}).

-
- -

Ottenere la posizione corrente

- -

Per ottenere la posizione corrente dell'utente devi chiamare il metodo {{domxref("geolocation.getCurrentPosition()","getCurrentPosition()")}}. Viene così lanciata una richiesta asincrona che calcola la posizione attuale dell'utente. Quando la posizione viene calcolata, la funzione viene eseguita. Puoi creare una funzione che viene chiamata in caso di errore. Un terzo parametro opzionale è un oggetto che permette di settare il tempo massimo della posizione calcolata, il tempo di attessa per una nuova richiesta e la possibilità di usare la massima accuratezza per il cacolo della posizione.

- -
-

Nota: Per default, {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}} cerca di calcolare la posizione nel modo più veloce possibile avendo però una bassa accuratezza. Questo metodo è utile se ti serve una risposta veloce. Dispositivi con il GPS possono richiedere anche alcuni minuti per fare un calcolo preciso della posizione, quindi dei dati meno accurati (come l'indirizzo IP o il wifi) possono essere usati da {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}.

-
- -
navigator.geolocation.getCurrentPosition(function(position) {
-  do_something(position.coords.latitude, position.coords.longitude);
-});
- -

L'esempio qui sopra chiama la funzione do_something() quando la posizione viene calcolata.

- -

Controllare la posizione attuale

- -

Se la posizione cambia (perché il dispositivo di sposta o perché viene calcolata una posizione più accurata), puoi settare una funzione che viene chiamata quando la posizione attuale si aggiorna. Basta usare la funzione {{domxref("Geolocation.watchPosition()","watchPosition()")}}, che ha gli stessi parametri di input di {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}. Questa funzione viene chiamata più volte così da permettere al browser di sapere sempre la posizione del dispositivo. La funzione di errore è opzionale come lo era per {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}.

- -
-

Nota: Puoi usare {{domxref("Geolocation.watchPosition()","watchPosition()")}} senza una chiamata iniziale a {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}

-
- -
var watchID = navigator.geolocation.watchPosition(function(position) {
-  do_something(position.coords.latitude, position.coords.longitude);
-});
- -

Il metodo {{domxref("Geolocation.watchPosition()","watchPosition()")}} ritorna un ID numerico che può essere usato per identificare univocamente il controllo della posizione; puoi usare questo valore insieme al metodo {{domxref("Geolocation.clearWatch()","clearWatch()")}} per fermare il controllo della posizione.

- -
navigator.geolocation.clearWatch(watchID);
-
- -

Risposta positiva

- -

Sia {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}} che {{domxref("Geolocation.watchPosition()","watchPosition()")}} accettano una risposta positiva, opzionalmente una risposta di errore e un oggetto PositionOptions.

- -

{{page("/en-US/docs/DOM/navigator.geolocation.getCurrentPosition","PositionOptions")}}

- -

Una chiamata a {{domxref("Geolocation.watchPosition()","watchPosition")}} è più o meno così:

- -
function geo_success(position) {
-  do_something(position.coords.latitude, position.coords.longitude);
-}
-
-function geo_error() {
-  alert("Nessuna posizione disponibile.");
-}
-
-var geo_options = {
-  enableHighAccuracy: true,
-  maximumAge        : 30000,
-  timeout           : 27000
-};
-
-var wpid = navigator.geolocation.watchPosition(geo_success, geo_error, geo_options);
- -

Descrivere una posizione

- -

La posizione dell'utente è descritta usando un oggetto Position, che deriva dall'oggetto Coordinates.

- -

{{page("/en-US/docs/DOM/navigator/geolocation/getCurrentPosition","Position")}}

- -

{{page("/en-US/docs/DOM/navigator/geolocation/getCurrentPosition","Coordinates")}}

- -

Errori

- -

La funzione che viene invocata in caso di errore quando si chiamano getCurrentPosition() o watchPosition() vuole un oggetto PositionError come primo parametro.

- -
function errorCallback(error) {
-  alert('ERROR(' + error.code + '): ' + error.message);
-};
-
- -

{{page("/en-US/docs/DOM/navigator/geolocation/getCurrentPosition","PositionError")}}

- -

Esempi live

- - - -

HTML Content

- -
<p><button onclick="geoFindMe()">Viasualizza la mia posizione</button></p>
-<div id="out"></div>
-
- -

JavaScript Content

- -
function geoFindMe() {
-  var output = document.getElementById("out");
-
-  if (!navigator.geolocation){
-    output.innerHTML = "<p>La geolocalizzazione non è supportata dal tuo browser</p>";
-    return;
-  }
-
-  function success(position) {
-    var latitude  = position.coords.latitude;
-    var longitude = position.coords.longitude;
-
-    output.innerHTML = '<p>Latitudine: ' + latitude + '° <br>Longitudine: ' + longitude + '°</p>';
-
-    var img = new Image();
-    img.src = "https://maps.googleapis.com/maps/api/staticmap?center=" + latitude + "," + longitude + "&zoom=13&size=300x300&sensor=false";
-
-    output.appendChild(img);
-  }
-
-  function error() {
-    output.innerHTML = "Impossibile calcolare la tua posizione";
-  }
-
-  output.innerHTML = "<p>Locating…</p>";
-
-  navigator.geolocation.getCurrentPosition(success, error);
-}
-
- -

Risultato live

- -

{{EmbedLiveSample('Geolocation_Live_Example', 350, 410)}}

- -

I permessi

- -

Tutte le estensioni presenti su addons.mozilla.org che richiedono la posizione sono obbligate a chiedere un permesso all'utente. La seguente funzione richiede il permesso per l'uso della posizione. La risposta dell'utente viene salvata nelle preferenze tramite il parametro pref. La funzione fornita nel parametro callback viene chiamata con un valore booleano (true o false) che indica la risposta dell'utente. Se la risposta è true, l'estensione può accedere alla posizione dell'utente.

- -
function prompt(window, pref, message, callback) {
-    let branch = Components.classes["@mozilla.org/preferences-service;1"]
-                           .getService(Components.interfaces.nsIPrefBranch);
-
-    if (branch.getPrefType(pref) === branch.PREF_STRING) {
-        switch (branch.getCharPref(pref)) {
-        case "always":
-            return callback(true);
-        case "never":
-            return callback(false);
-        }
-    }
-
-    let done = false;
-
-    function remember(value, result) {
-        return function() {
-            done = true;
-            branch.setCharPref(pref, value);
-            callback(result);
-        }
-    }
-
-    let self = window.PopupNotifications.show(
-        window.gBrowser.selectedBrowser,
-        "geolocation",
-        message,
-        "geo-notification-icon",
-        {
-            label: "Share Location",
-            accessKey: "S",
-            callback: function(notification) {
-                done = true;
-                callback(true);
-            }
-        }, [
-            {
-                label: "Always Share",
-                accessKey: "A",
-                callback: remember("always", true)
-            },
-            {
-                label: "Never Share",
-                accessKey: "N",
-                callback: remember("never", false)
-            }
-        ], {
-            eventCallback: function(event) {
-                if (event === "dismissed") {
-                    if (!done) callback(false);
-                    done = true;
-                    window.PopupNotifications.remove(self);
-                }
-            },
-            persistWhileVisible: true
-        });
-}
-
-prompt(window,
-       "extensions.foo-addon.allowGeolocation",
-       "Foo Add-on wants to know your location.",
-       function callback(allowed) { alert(allowed); });
-
- -

Compatibilità dei browser

- -
{{CompatibilityTable}}
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Supporto base{{CompatChrome(5.0)}}{{CompatVersionUnknown}}{{CompatGeckoDesktop("1.9.1")}}[1]910.60
- {{CompatNo}} 15.0
- 16.0		5
Secure origins only{{CompatChrome(50.0)}}{{CompatNo}}{{CompatGeckoDesktop("55")}}{{CompatNo}}3910
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàAndroidAndroid WebviewEdgeFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Supporto base{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatGeckoMobile("4")}}1.0.1{{CompatUnknown}}10.60
- {{CompatNo}} 15.0
- 16.0		3.2{{CompatVersionUnknown}}
Secure origins only{{CompatUnknown}}{{CompatChrome(50.0)}}{{CompatNo}}{{CompatGeckoMobile("55")}}   10.1{{CompatChrome(50.0)}}
-
- -

[1] Firefox calcola la tua posizione anche usando il tuo WiFi grazie ai Google Location Services. Durante il trasferimento tra Firefox e Google, i dati scambiati includono dei dati sul WiFi Access Point, un token di accesso (simile a un cookie) e l'indirizzo IP dell'utente. Per maggiori informazioni, dai un'occhiata alla Privacy Policy di Mozzilla e alla Privacy Policy di Google.

- -

[2] A causa del punto [1], questa API non si può usare in China. Puoi usare le API di Baidu o di Autonavi.

- -

Firefox 3.6 (Gecko 1.9.2) ha aggiunta il supporto per l'uso del servizio GPSD (GPS daemon) per usare la geolocalizzazione su Linux.

- -

Vedi anche

- - diff --git a/files/it/web/api/geolocationposition/index.html b/files/it/web/api/geolocationposition/index.html deleted file mode 100644 index 7498033a57..0000000000 --- a/files/it/web/api/geolocationposition/index.html +++ /dev/null @@ -1,126 +0,0 @@ ---- -title: Position -slug: Web/API/GeolocationPosition -translation_of: Web/API/GeolocationPosition ---- -
{{securecontext_header}}{{APIRef("Geolocation API")}}
- -

L'interfaccia Position rappresenta la posizione di un particolare dispositivo in un preciso istante. La posizione, rappresentata da un oggetto {{domxref("Coordinates")}}, comprende la posizione in 2D del dispositivo, su una sfera che rappresenta la Terra, l'altitudine e la velocità.

- -

Proprietà

- -

L'interfaccia Position non estende alcuna proprietà.

- -
-
{{domxref("Position.coords")}} {{readonlyInline}} {{securecontext_inline}}
-
Ritorna un oggetto {{domxref("Coordinates")}} che rappresenta la posizione attuale.
-
{{domxref("Position.timestamp")}} {{readonlyInline}} {{securecontext_inline}}
-
Ritorna {{domxref("DOMTimeStamp")}} che rappresenta l'orario in cui è stata calcolata la posizione.
-
- -

Metodi

- -

L'interaccia Position non va implementata e non estende alcun metodo.

- -

Specifiche

- - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('Geolocation', '#position', 'Position')}}{{Spec2('Geolocation')}}Specifica iniziale.
- -

Compatibilità dei browser

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Supporto base{{CompatChrome(5)}}{{CompatVersionUnknown}}{{CompatGeckoDesktop("1.9.1")}}910.60
- Rimosso nella 15.0
- Reintrodotto nella 16.0		5
Secure context-only{{CompatChrome(47)}}{{CompatUnknown()}}{{CompatGeckoDesktop("55")}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàAndroid WebviewChrome for AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Supporto base{{CompatUnknown()}}{{CompatUnknown()}}{{CompatVersionUnknown}}{{CompatGeckoMobile("4")}}{{CompatUnknown()}}10.60{{CompatUnknown()}}
Secure context-only{{CompatNo}}{{CompatChrome(47)}}{{CompatUnknown()}}{{CompatGeckoDesktop("55")}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -

Vedi anche

- - diff --git a/files/it/web/api/globaleventhandlers/index.html b/files/it/web/api/globaleventhandlers/index.html deleted file mode 100644 index 9238474923..0000000000 --- a/files/it/web/api/globaleventhandlers/index.html +++ /dev/null @@ -1,714 +0,0 @@ ---- -title: GlobalEventHandlers -slug: Web/API/GlobalEventHandlers -tags: - - API - - DOM - - GlobalEventHandlers - - HTML DOM - - Mixin - - NeedsTranslation - - Reference - - TopicStub - - events -translation_of: Web/API/GlobalEventHandlers ---- -
{{ApiRef("HTML DOM")}}
- -

The GlobalEventHandlers mixin describes the event handlers common to several interfaces like {{domxref("HTMLElement")}}, {{domxref("Document")}}, or {{domxref("Window")}}. Each of these interfaces can, of course, add more event handlers in addition to the ones listed below.

- -
-

Note: GlobalEventHandlers is a mixin and not an interface; you can't actually create an object of type GlobalEventHandlers.

-
- -

Properties

- -

This interface doesn't include any properties except for the event handlers listed below.

- -

Event handlers

- -

These event handlers are defined on the {{domxref("GlobalEventHandlers")}} mixin, and implemented by {{domxref("HTMLElement")}}, {{domxref("Document")}}, {{domxref("Window")}}, as well as by {{domxref("WorkerGlobalScope")}} for Web Workers.

- -
-
-
{{domxref("GlobalEventHandlers.onabort")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("abort")}} event is raised.
-
{{domxref("GlobalEventHandlers.onanimationcancel")}} {{Non-standard_inline}}
-
An {{domxref("EventHandler")}} called when an {{event("animationcancel")}} event is sent, indicating that a running CSS animation has been canceled.
-
{{domxref("GlobalEventHandlers.onanimationend")}} {{Non-standard_inline}}
-
An {{domxref("EventHandler")}} called when an {{event("animationend")}} event is sent, indicating that a CSS animation has stopped playing.
-
{{domxref("GlobalEventHandlers.onanimationiteration")}} {{Non-standard_inline}}
-
An {{domxref("EventHandler")}} called when an {{event("animationiteration")}} event has been sent, indicating that a CSS animation has begun playing a new iteration of the animation sequence.
-
{{domxref("GlobalEventHandlers.onanimationstart")}} {{Non-standard_inline}}
-
An {{domxref("EventHandler")}} called when an {{event("animationstart")}} event is sent, indicating that a CSS animation has started playing.
-
{{domxref("GlobalEventHandlers.onauxclick")}} {{Non-standard_inline}}
-
An {{domxref("EventHandler")}} called when an {{event("auxclick")}} event is sent, indicating that a non-primary button has been pressed on an input device (e.g. a middle mouse button).
-
{{domxref("GlobalEventHandlers.onblur")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("blur")}} event is raised.
-
{{domxref("GlobalEventHandlers.onerror")}}
-
Is an {{domxref("OnErrorEventHandler")}} representing the code to be called when the {{event("error")}} event is raised.
-
{{domxref("GlobalEventHandlers.onfocus")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("focus")}} event is raised.
-
{{domxref("GlobalEventHandlers.oncancel")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("cancel")}} event is raised.
-
{{domxref("GlobalEventHandlers.oncanplay")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("canplay")}} event is raised.
-
{{domxref("GlobalEventHandlers.oncanplaythrough")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("canplaythrough")}} event is raised.
-
{{domxref("GlobalEventHandlers.onchange")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("change")}} event is raised.
-
{{domxref("GlobalEventHandlers.onclick")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("click")}} event is raised.
-
{{domxref("GlobalEventHandlers.onclose")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("close")}} event is raised.
-
{{domxref("GlobalEventHandlers.oncontextmenu")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("contextmenu")}} event is raised.
-
{{domxref("GlobalEventHandlers.oncuechange")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("cuechange")}} event is raised.
-
{{domxref("GlobalEventHandlers.ondblclick")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("dblclick")}} event is raised.
-
{{domxref("GlobalEventHandlers.ondrag")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("drag")}} event is raised.
-
{{domxref("GlobalEventHandlers.ondragend")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("dragend")}} event is raised.
-
{{domxref("GlobalEventHandlers.ondragenter")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("dragenter")}} event is raised.
-
{{domxref("GlobalEventHandlers.ondragexit")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("dragexit")}} event is raised.
-
{{domxref("GlobalEventHandlers.ondragleave")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("dragleave")}} event is raised.
-
{{domxref("GlobalEventHandlers.ondragover")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("dragover")}} event is raised.
-
{{domxref("GlobalEventHandlers.ondragstart")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("dragstart")}} event is raised.
-
{{domxref("GlobalEventHandlers.ondrop")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("drop")}} event is raised.
-
{{domxref("GlobalEventHandlers.ondurationchange")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("durationchange")}} event is raised.
-
{{domxref("GlobalEventHandlers.onemptied")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("emptied")}} event is raised.
-
{{domxref("GlobalEventHandlers.onended")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("ended")}} event is raised.
-
{{domxref("GlobalEventHandlers.ongotpointercapture")}}
-
-

Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("gotpointercapture")}} event type is raised.

-
-
{{domxref("GlobalEventHandlers.oninput")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("input")}} event is raised.
-
{{domxref("GlobalEventHandlers.oninvalid")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("invalid")}} event is raised.
-
{{domxref("GlobalEventHandlers.onkeydown")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("keydown")}} event is raised.
-
{{domxref("GlobalEventHandlers.onkeypress")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("keypress")}} event is raised.
-
{{domxref("GlobalEventHandlers.onkeyup")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("keyup")}} event is raised.
-
{{domxref("GlobalEventHandlers.onload")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("load")}} event is raised.
-
{{domxref("GlobalEventHandlers.onloadeddata")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("loadeddata")}} event is raised.
-
{{domxref("GlobalEventHandlers.onloadedmetadata")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("loadedmetadata")}} event is raised.
-
{{domxref("GlobalEventHandlers.onloadend")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("loadend")}} event is raised (when progress has stopped on the loading of a resource.)
-
{{domxref("GlobalEventHandlers.onloadstart")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("loadstart")}} event is raised (when progress has begun on the loading of a resource.)
-
{{domxref("GlobalEventHandlers.onlostpointercapture")}}
-
-

Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("lostpointercapture")}} event type is raised.

-
-
{{domxref("GlobalEventHandlers.onmousedown")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("mousedown")}} event is raised.
-
{{domxref("GlobalEventHandlers.onmouseenter")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("mouseenter")}} event is raised.
-
{{domxref("GlobalEventHandlers.onmouseleave")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("mouseleave")}} event is raised.
-
{{domxref("GlobalEventHandlers.onmousemove")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("mousemove")}} event is raised.
-
{{domxref("GlobalEventHandlers.onmouseout")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("mouseout")}} event is raised.
-
{{domxref("GlobalEventHandlers.onmouseover")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("mouseover")}} event is raised.
-
{{domxref("GlobalEventHandlers.onmouseup")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("mouseup")}} event is raised.
-
{{domxref("GlobalEventHandlers.onmousewheel")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("mousewheel")}} event is raised.
-
{{ domxref("GlobalEventHandlers.onwheel") }}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("wheel")}} event is raised.
-
{{domxref("GlobalEventHandlers.onpause")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("pause")}} event is raised.
-
{{domxref("GlobalEventHandlers.onplay")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("play")}} event is raised.
-
{{domxref("GlobalEventHandlers.onplaying")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("playing")}} event is raised.
-
{{domxref("GlobalEventHandlers.onpointerdown")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("pointerdown")}} event is raised.
-
{{domxref("GlobalEventHandlers.onpointermove")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("pointermove")}} event is raised.
-
{{domxref("GlobalEventHandlers.onpointerup")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("pointerup")}} event is raised.
-
{{domxref("GlobalEventHandlers.onpointercancel")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("pointercancel")}} event is raised.
-
{{domxref("GlobalEventHandlers.onpointerover")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("pointerover")}} event is raised.
-
{{domxref("GlobalEventHandlers.onpointerout")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("pointerout")}} event is raised.
-
{{domxref("GlobalEventHandlers.onpointerenter")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("pointerevent")}} event is raised.
-
{{domxref("GlobalEventHandlers.onpointerleave")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("pointerleave")}} event is raised.
-
{{domxref("GlobalEventHandlers.onpointerlockchange")}} {{experimental_inline}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("pointerlockchange")}} event is raised.
-
{{domxref("GlobalEventHandlers.onpointerlockerror")}} {{experimental_inline}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("pointerlockerror")}} event is raised.
-
{{domxref("GlobalEventHandlers.onprogress")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("progress")}} event is raised.
-
{{domxref("GlobalEventHandlers.onratechange")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("ratechange")}} event is raised.
-
{{domxref("GlobalEventHandlers.onreset")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("reset")}} event is raised.
-
{{domxref("GlobalEventHandlers.onscroll")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("scroll")}} event is raised.
-
{{domxref("GlobalEventHandlers.onseeked")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("seeked")}} event is raised.
-
{{domxref("GlobalEventHandlers.onseeking")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("seeking")}} event is raised.
-
{{domxref("GlobalEventHandlers.onselect")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("select")}} event is raised.
-
{{domxref("GlobalEventHandlers.onselectstart")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("selectionchange")}} event is raised, i.e. when the user starts to make a new text selection on a web page.
-
{{domxref("GlobalEventHandlers.onselectionchange")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("selectionchange")}} event is raised, i.e. when the text selected on a web page changes.
-
{{domxref("GlobalEventHandlers.onshow")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("show")}} event is raised.
-
{{domxref("GlobalEventHandlers.onsort")}} {{experimental_inline}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("sort")}} event is raised.
-
{{domxref("GlobalEventHandlers.onstalled")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("stalled")}} event is raised.
-
{{domxref("GlobalEventHandlers.onsubmit")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("submit")}} event is raised.
-
{{domxref("GlobalEventHandlers.onsuspend")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("suspend")}} event is raised.
-
{{domxref("GlobalEventHandlers.ontimeupdate")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("timeupdate")}} event is raised.
-
{{domxref("GlobalEventHandlers.onvolumechange")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("volumechange")}} event is raised.
-
{{domxref("GlobalEventHandlers.ontouchcancel")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("touchcancel")}} event is raised.
-
{{domxref("GlobalEventHandlers.ontouchend")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("touchend")}} event is raised.
-
{{domxref("GlobalEventHandlers.ontouchmove")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("touchmove")}} event is raised.
-
{{domxref("GlobalEventHandlers.ontouchstart")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("touchstart")}} event is raised.
-
{{domxref("GlobalEventHandlers.ontransitioncancel")}}
-
An {{domxref("EventHandler")}} called when a {{event("transitioncancel")}} event is sent, indicating that a CSS transition has been cancelled.
-
{{domxref("GlobalEventHandlers.ontransitionend")}}
-
An {{domxref("EventHandler")}} called when a {{event("transitionend")}} event is sent, indicating that a CSS transition has finished playing.
-
{{domxref("GlobalEventHandlers.onwaiting")}}
-
Is an {{domxref("EventHandler")}} representing the code to be called when the {{event("waiting")}} event is raised.
-
-
- -

Methods

- -

This interface defines no methods.

- -

Specifications

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName("Selection API",'', 'Extension to GlobalEventHandlers')}}{{Spec2('Selection API')}}Adds onselectionchange.
{{SpecName('Pointer Lock', '#extensions-to-the-document-interface', 'Extension of Document')}}{{Spec2('Pointer Lock')}}Adds onpointerlockchange and onpointerlockerror on {{domxref("Document")}}. It is experimentally implemented on GlobalEventHandlers.
{{SpecName('HTML WHATWG', '#globaleventhandlers', 'GlobalEventHandlers')}}{{Spec2('HTML WHATWG')}}No change since the latest snapshot, {{SpecName("HTML5.1")}}.
{{SpecName('HTML5.1', '#globaleventhandlers', 'GlobalEventHandlers')}}{{Spec2('HTML5.1')}}Snapshot of {{SpecName("HTML WHATWG")}}. Added onsort since the {{SpecName("HTML5 W3C")}} snapshot.
{{SpecName("HTML5 W3C", "#globaleventhandlers", "GlobalEventHandlers")}}{{Spec2('HTML5 W3C')}}Snapshot of {{SpecName("HTML WHATWG")}}. Creation of GlobalEventHandlers (properties where on the target before it).
- -

Browser compatibility

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureFirefox (Gecko)ChromeEdgeInternet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
oncanplay, oncanplaythrough, ondurationchange, onemptied, onended, onloadeddata, onloadedmetadata, onloadstart, onpause, onplay, onplaying, onprogress, onratechange, onseeked, onseeking, onstalled, ontimeupdate, onvolumechange, onwaiting{{CompatGeckoDesktop(1.9.1)}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
onsuspend{{CompatGeckoDesktop(1.9.2)}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
ondrag, ondragend, ondragenter, ondragleave, ondragover, ondragstart, ondrop{{CompatGeckoDesktop(1.9.1)}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
onmouseenter, onmouseleave{{CompatGeckoDesktop(10)}}{{CompatChrome(30.0)}}{{CompatUnknown}}5.517{{CompatUnknown}}
ondragexit{{CompatNo}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
oncancel{{CompatNo}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
onclose{{CompatNo}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
oncuechange{{CompatNo}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
onmousewheel{{CompatNo}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
onsort {{experimental_inline}}{{CompatNo}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
onmozfullscreenchange, onmozfullscreenerror {{non-standard_inline}}{{CompatVersionUnknown}}{{CompatVersionUnknown}} {{property_prefix("-webkit")}}
- {{CompatVersionUnknown}} (unprefixed)		{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
onpointerlockchange, onpointerlockerror{{CompatGeckoDesktop(10)}}[1]{{CompatVersionUnknown}}[2] {{property_prefix("-webkit")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
onpointercancel, onpointerdown, onpointerup, onpointermove, onpointerout, onpointerover, onpointerenter, onpointerleave{{CompatVersionUnknown}}[3]{{CompatChrome(55.0)}}{{CompatVersionUnknown}}10{{CompatUnknown}}{{CompatUnknown}}
onselectionchange{{CompatGeckoDesktop(43)}}[4]{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
ontouchend, ontouchcancel, ontouchmove, ontouchstart{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
animationstart, animationend, animationcancel, animationiteration{{CompatGeckoDesktop(51)}}{{CompatVersionUnknown}} {{property_prefix("-webkit")}}
- {{CompatVersionUnknown}} (unprefixed)		{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
ongotpointercapture, onlostpointercapture{{CompatUnknown}}{{CompatChrome(57.0)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatOpera(44)}}{{CompatUnknown}}
onauxclick{{CompatGeckoDesktop(53)}}{{CompatVersionUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
onwheel{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureAndroid WebviewEdgeFirefox Mobile (Gecko)AndroidIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}
ondrag, ondragend, ondragenter, ondragleave, ondragover, ondragstart, ondrop{{CompatUnknown}}{{CompatUnknown}}{{CompatGeckoMobile(1.9.1)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
oncanplay, oncanplaythrough, ondurationchange, onemptied, onended, onloadeddata, onloadedmetadata, onloadstart, onpause, onplay, onplaying, onprogress, onratechange, onseeked, onseeking, onstalled, ontimeupdate, onvolumechange, onwaiting{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatGeckoMobile(1.9.1)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}
onmouseenter, onmouseleave{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatGeckoMobile(10)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}
onsuspend{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatGeckoMobile(1.9.2)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}
ondragexit{{CompatNo}}{{CompatUnknown}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatNo}}
oncancel{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}
onclose{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}
oncuechange{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}
onmousewheel{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}
onsort{{CompatNo}}{{CompatUnknown}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatNo}}
onmozfullscreenchange, onmozfullscreenerror {{non-standard_inline}}{{CompatVersionUnknown}} {{property_prefix("-webkit")}}
- {{CompatVersionUnknown}} (unprefixed)		{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatVersionUnknown}} {{property_prefix("-webkit")}}
- {{CompatVersionUnknown}} (unprefixed)
onpointerlockchange, onpointerlockerror{{CompatNo}}{{CompatUnknown}}{{CompatGeckoMobile(10)}}[1]{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatNo}}
onpointercancel, onpointerdown, onpointerup, onpointermove, onpointerout, onpointerover, onpointerenter, onpointerleave{{CompatChrome(55.0)}}{{CompatUnknown}}{{CompatVersionUnknown}}[3]{{CompatNo}}10{{CompatNo}}{{CompatNo}}{{CompatChrome(55.0)}}
onselectionchange{{CompatNo}}{{CompatUnknown}}{{CompatGeckoMobile(43)}}[4]{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatNo}}
ontouchend, ontouchcancel, ontouchmove, ontouchstart{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}
animationstart, animationend, animationcancel, animationiteration{{CompatVersionUnknown}} {{property_prefix("-webkit")}}
- {{CompatVersionUnknown}} (unprefixed)		{{CompatUnknown}}{{CompatGeckoMobile(51)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}} {{property_prefix("-webkit")}}
- {{CompatVersionUnknown}} (unprefixed)
ongotpointercapture, onlostpointercapture{{CompatChrome(57.0)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatOperaMobile(44)}}{{CompatUnknown}}{{CompatChrome(57.0)}}
onauxclick{{CompatVersionUnknown}}{{CompatNo}}{{CompatGeckoMobile(53)}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatVersionUnknown}}
onwheel{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -

[1] In Gecko this is implemented as onmozpointerlockchange, onmozpointerlockerror.

- -

[2] In Blink this is implemented as onwebkitpointerlockchange, onwebkitpointerlockerror.

- -

[3] This is implemented behind the dom.w3c_pointer_events.enabled preference, defaulting to false.

- -

[4] This is implemented behind the dom.select_events.enabled preference, that default to false, except on Nightly.

- -

See also

- - diff --git a/files/it/web/api/globaleventhandlers/onresize/index.html b/files/it/web/api/globaleventhandlers/onresize/index.html deleted file mode 100644 index 27e71c3438..0000000000 --- a/files/it/web/api/globaleventhandlers/onresize/index.html +++ /dev/null @@ -1,77 +0,0 @@ ---- -title: GlobalEventHandlers.onresize -slug: Web/API/GlobalEventHandlers/onresize -tags: - - API - - DOM - - Proprietà -translation_of: Web/API/GlobalEventHandlers/onresize ---- -

{{ ApiRef() }}

- -

La proprietà GlobalEventHandlers.onresize contiene un {{domxref("EventHandler")}} il quale viene lanciato quando un evento {{event("resize")}} viene ricevuto.

- -

Sintassi

- -
window.onresize = funcRef;
-
- -

Parameters

- - - -

Esempio

- -
window.onresize = doFunc;
-
- -
<html>
-<head>
-
-<title>onresize test</title>
-
-</head>
-
-<body>
-<p>Ridimensiona la finestra del browser per lanciare l'evento resize.</p>
-
-<p>Altezza finestra: <span id="height"></span></p>
-<p>Larghezza finestra: <span id="width"></span></p>
-
-<script type="text/javascript">
-  var heightOutput = document.querySelector('#height');
-  var widthOutput = document.querySelector('#width');
-
-  function resize() {
-    heightOutput.textContent = window.innerHeight;
-    widthOutput.textContent = window.innerWidth;
-  }
-
-  window.onresize = resize;
-</script>
-</body>
-</html>
-
- -

Note

- -

L'evento resize viene scatenato dopo che la finestra è stata ridimensionata.

- -

Specifiche

- - - - - - - - - - - - - - -
SpecificazioneStatoCommento
{{SpecName('HTML WHATWG','webappapis.html#handler-onresize','onresize')}}{{Spec2('HTML WHATWG')}} 
diff --git a/files/it/web/api/htmlcanvaselement/index.html b/files/it/web/api/htmlcanvaselement/index.html deleted file mode 100644 index 763a2bc7bc..0000000000 --- a/files/it/web/api/htmlcanvaselement/index.html +++ /dev/null @@ -1,245 +0,0 @@ ---- -title: HTMLCanvasElement -slug: Web/API/HTMLCanvasElement -tags: - - API - - Canvas - - HTML DOM - - Interfaccia - - Riferimenti -translation_of: Web/API/HTMLCanvasElement ---- -
-
{{APIRef("Canvas API")}}
- -
L'interfaccia HTMLCanvasElement fornisce proprietà e metodi per manipolare il layout e la presentazione degli elementi del canvas. L'interfaccia HTMLCanvasElement eredita anche le proprietà ed i metodi della interfaccia {{domxref("HTMLElement")}}.
-
- -

 

- -

Proprietà

- -

Eredita proprietà dalla interfaccia genitore, {{domxref("HTMLElement")}}.

- -
-
{{domxref("HTMLCanvasElement.height")}}
-
Intero positivo che rispecchia l'attributo dell'elemento HTML {{htmlattrxref("height", "canvas")}} interpretato in unità pixel CSS. Quando l'attributo non è specificato, o se è impostato ad un valore non valido, come un numero negativo, è usato il valore di default 150.
-
{{domxref("HTMLCanvasElement.mozOpaque")}} {{non-standard_inline}}
-
Un {{jsxref("Boolean")}} che rispecchia l'attributo HTML {{htmlattrxref("moz-opaque", "canvas")}} dell'elemento {{HTMLElement("canvas")}}. Permette al canvas di sapere se la traslucenza sarà un fattore. Se il canvas sa che non ci sarà traslucenza, la prestazione del dipingere puo' essere ottimizzata.
-
{{domxref("HTMLCanvasElement.width")}}
-
Intero positivo che rispecchia l'attributo HTML {{htmlattrxref("width", "canvas")}} dell'elemento {{HTMLElement("canvas")}} interpretato in unità pixel CSS. Quando l'attributo non è specificato, o se è impostato ad un valore non valido, ad esempio negativo, è usato il valore di default 300.
-
- -

Metodi

- -

Eredita dal proprio genitore, {{domxref("HTMLElement")}}.

- -
-
{{domxref("HTMLCanvasElement.captureStream()")}} {{experimental_inline}}
-
Restituisce un oggetto {{domxref("CanvasCaptureMediaStream")}} che è una capture video in tempo reale della superficie del canvas.
-
{{domxref("HTMLCanvasElement.getContext()")}}
-
Restituisce un contesto di disegno sul canvas, oppure null se l'identificativo del contesto non ha supporto. Un contesto di disegno permette di disegnare sul canvas. Chiamare getContext con "2d" come parametro restituisce un oggetto {{domxref("CanvasRenderingContext2D")}}, mentre chiamarlo con "experimental-webgl" (o "webgl") restituisce un oggetto {{domxref("WebGLRenderingContext")}}. Questo contesto è disponibile solo su browsers che implementano WebGL.
-
{{domxref("HTMLCanvasElement.toDataURL()")}}
-
Restituisce un URL dati contentente una rappresentazione della immagine nel formato specificato dal parametro tipo (il valore di default è png). L'immagine restituita ha una risoluzione di 96dpi.
-
{{domxref("HTMLCanvasElement.toBlob()")}}
-
Crea un oggetto {{domxref("Blob")}} che rappresenta l'immagine contenuta nel canvas; questo file puo' essere immagazzinato temporaneamente su disco oppure nella memoria a discrezione dell'agente per l'utente (user agent).
-
{{domxref("HTMLCanvasElement.transferControlToOffscreen()")}} {{experimental_inline}}
-
Trasferisce il controllo ad un oggetto {{domxref("OffscreenCanvas")}}, o nella thread principale oppure in una worker.
-
{{domxref("HTMLCanvasElement.mozGetAsFile()")}} {{non-standard_inline}} {{deprecated_inline}}
-
Restituisce un oggetto {{domxref("File")}} che rappresenta l'immagine contenuta nel canvas; questo è un file immagazzinato nella memoria, col nome indicato. Se il tipo del file non è specificato, il tipo di default per l'immagine è image/png.
-
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatusCommento
{{SpecName('Media Capture DOM Elements', '#html-media-element-media-capture-extensions', 'HTMLCanvasElement')}}{{Spec2('Media Capture DOM Elements')}}Aggiunge il metodo captureStream().
{{SpecName('HTML WHATWG', "#the-canvas-element", "HTMLCanvasElement")}}{{Spec2('HTML WHATWG')}}Il metodo getContext() ora restituisce  {{domxref("RenderingContext")}} invece di un oggetto opaco.
- Sono stati aggiunti i metodi probablySupportsContext(), setContext() etransferControlToProxy().
{{SpecName('HTML5.1', "scripting-1.html#the-canvas-element", "HTMLCanvasElement")}}{{Spec2('HTML5.1')}} 
{{SpecName('HTML5 W3C', "scripting-1.html#the-canvas-element", "HTMLCanvasElement")}}{{Spec2('HTML5 W3C')}}Definizione iniziale.
- -

Compatibilità coi Browsers

- -
{{CompatibilityTable}}
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support (2D context)4.0{{CompatGeckoDesktop('1.9.2')}}9.09.0 [1]3.1
toBlob()50{{CompatGeckoDesktop('19')}} [2]{{CompatUnknown}}{{CompatUnknown}}{{CompatNo}} (bug 71270)
probablySupportsContext(),
- setContext(),
- transferControlToProxy() {{experimental_inline}}		{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
mozGetAsFile() {{non-standard_inline}} {{deprecated_inline}}{{CompatNo}}{{CompatGeckoDesktop('2')}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
captureStream() {{experimental_inline}}{{CompatNo}}{{CompatGeckoDesktop('41')}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
transferControlToOffscreen() {{experimental_inline}}{{CompatNo}}{{CompatGeckoDesktop(44)}} [3]{{CompatNo}}{{CompatNo}}{{CompatNo}}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support (2D context)2.1{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}10.0 [1]3.2
webgl context{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}} as experimental-webgl{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
toBlob(){{CompatNo}} (bug 67587)50{{CompatGeckoMobile('18')}} [2]{{CompatUnknown}}{{CompatUnknown}}{{CompatNo}} (bug 71270)
probablySupportsContext(),
- setContext(),
- transferControlToProxy() {{experimental_inline}}		{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
mozGetAsFile() {{non-standard_inline}} {{deprecated_inline}}{{CompatNo}}{{CompatNo}}{{CompatGeckoMobile('2')}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
captureStream() {{experimental_inline}}{{CompatNo}}{{CompatNo}}{{CompatGeckoMobile('41')}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
transferControlToOffscreen() {{experimental_inline}}{{CompatNo}}{{CompatNo}}{{CompatGeckoMobile(44)}} [3]{{CompatNo}}{{CompatNo}}{{CompatNo}}
-
- -

[1] Supporto parziale in Opera Mini 5.0 e successivi.

- -

[2] Il supporto per il terzo parametro, è stato aggiunto solo con Gecko 25: quando viene usato col tipo "image/jpeg," questo argomento specifica la qualità dell'immagine.

- -

[3] Da questa funzionalità dipende una impostazione di preferenza di funzionalità. Imposta come true gfx.offscreencanvas.enabled in about:config .

- -

Vedi anche:

- - diff --git a/files/it/web/api/htmlcanvaselement/toblob/index.html b/files/it/web/api/htmlcanvaselement/toblob/index.html deleted file mode 100644 index f0793eb393..0000000000 --- a/files/it/web/api/htmlcanvaselement/toblob/index.html +++ /dev/null @@ -1,262 +0,0 @@ ---- -title: HTMLCanvasElement.toBlob() -slug: Web/API/HTMLCanvasElement/toBlob -translation_of: Web/API/HTMLCanvasElement/toBlob ---- -
-
-
{{APIRef("Canvas API")}}
-
-
- -

Il metodoHTMLCanvasElement.toBlob() crea un oggetto {{domxref("Blob")}} rappresentante l'immagine contenuta nel canvas;  questo file potrebbe essere immagazzinato per usi futuri su disco o in memoria a discrezione dell'user agent. Se type non è specificato, il tipo immagine è impostato aimage/png. L'immagine creata ha una risoluzione di 96dpi.
- Il terzo argomento è usato con immagini di tipoimage/jpeg per specificare la qualità dell'output.

- -

Sintassi

- -
void canvas.toBlob(callback, mimeType, qualityArgument);
-
- -

Parametri

- -
-
callback
-
Funzione di callback con l'oggetto {{domxref("Blob")}} risultante come singolo argomento.
-
mimeType {{optional_inline}}
-
Un oggetto {{domxref("DOMString")}} indicante il tipo immagine. Quella di default èimage/png.
-
qualityArgument {{optional_inline}}
-
Un oggetto {{jsxref("Number")}} tra0 e1 indicante la qualità immagine se il tipo richiesto è image/jpeg oimage/webp. Se questo argomento è diverso dai due precedenti è utilizzato il valore di qualità immagine di default. Altri argomenti verranno ignorati.
-
- -

Valore ritornato

- -

Nessuno.

- -

Esempi

- -

Ottenere un file rappresentante il canvas

- -

Una volta aver disegnato il contenuto in un canvas, è possibile convertirlo in un file di un qualsiasi. Lo snippet di codice in basso, ad esempio, prende l'immagine contenuta nell'elemento {{HTMLElement("canvas")}} avente ID "canvas", ottenendo una sua copia in formato immagine PNG, quindi aggiunge un nuovo elemento {{HTMLElement("img")}} al documento, la cui immagine di origine è quella creata utilizzando il canvas.

- -
var canvas = document.getElementById('canvas');
-
-canvas.toBlob(function(blob) {
-  var newImg = document.createElement('img'),
-      url = URL.createObjectURL(blob);
-
-  newImg.onload = function() {
-    // no longer need to read the blob so it's revoked
-    URL.revokeObjectURL(url);
-  };
-
-  newImg.src = url;
-  document.body.appendChild(newImg);
-});
-
- -

Si noti che si sta creando un'immagine PNG; se si specifica un secondo parametro nella chiamata a toBlob(),  si può specificare il formato immagine. Ad esempio, per ottenere l'immagine in formato JPEG:

- -
 canvas.toBlob(function(blob){...}, 'image/jpeg', 0.95); // JPEG at 95% quality
- -
-

Convertire un canvas in icona (solo su Mozilla)

- -

Ora si userà -moz-parse per convertire un canvas in icona. Windows XP non supporta la conversione dal formato PNG ad ICO, quindi usa quello bitmap (BMP) al suo posto. Un link di download è creato impostando l'attributo download. Il valore dello stesso è il nome che verrà utilizzato come nome del file.

- -
var canvas = document.getElementById('canvas');
-var d = canvas.width;
-ctx = canvas.getContext('2d');
-ctx.beginPath();
-ctx.moveTo(d / 2, 0);
-ctx.lineTo(d, d);
-ctx.lineTo(0, d);
-ctx.closePath();
-ctx.fillStyle = 'yellow';
-ctx.fill();
-
-function blobCallback(iconName) {
-  return function(b) {
-    var a = document.createElement('a');
-    a.textContent = 'Download';
-    document.body.appendChild(a);
-    a.style.display = 'block';
-    a.download = iconName + '.ico';
-    a.href = window.URL.createObjectURL(b);
-  }
-}
-canvas.toBlob(blobCallback('passThisString'), 'image/vnd.microsoft.icon',
-              '-moz-parse-options:format=bmp;bpp=32');
-
- -

Salvare toBlob su disco con OS.File (valido solo per chrome/add-on)

- -
-

This technique saves it to the desktop and is only useful in Firefox chrome context or add-on code as OS APIs are not present on web sites.

-
- -
var canvas = document.getElementById('canvas');
-var d = canvas.width;
-ctx = canvas.getContext('2d');
-ctx.beginPath();
-ctx.moveTo(d / 2, 0);
-ctx.lineTo(d, d);
-ctx.lineTo(0, d);
-ctx.closePath();
-ctx.fillStyle = 'yellow';
-ctx.fill();
-
-function blobCallback(iconName) {
-  return function(b) {
-    var r = new FileReader();
-    r.onloadend = function () {
-    // r.result contains the ArrayBuffer.
-    Cu.import('resource://gre/modules/osfile.jsm');
-    var writePath = OS.Path.join(OS.Constants.Path.desktopDir,
-                                 iconName + '.ico');
-    var promise = OS.File.writeAtomic(writePath, new Uint8Array(r.result),
-                                      {tmpPath:writePath + '.tmp'});
-    promise.then(
-      function() {
-        console.log('successfully wrote file');
-      },
-      function() {
-        console.log('failure writing file')
-      }
-    );
-  };
-  r.readAsArrayBuffer(b);
-  }
-}
-
-canvas.toBlob(blobCallback('passThisString'), 'image/vnd.microsoft.icon',
-              '-moz-parse-options:format=bmp;bpp=32');
- -

Specifications

- - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('HTML WHATWG', "scripting.html#dom-canvas-toblob", "HTMLCanvasElement.toBlob")}}{{Spec2('HTML WHATWG')}}No change since the latest snapshot, {{SpecName('HTML5 W3C')}}
{{SpecName('HTML5.1', "scripting-1.html#dom-canvas-toblob", "HTMLCanvasElement.toBlob")}}{{Spec2('HTML5.1')}}No change
{{SpecName('HTML5 W3C', "scripting-1.html#dom-canvas-toblob", "HTMLCanvasElement.toBlob")}}{{Spec2('HTML5 W3C')}}Snapshot of the {{SpecName('HTML WHATWG')}} containing the initial definition.
- -

Browser compatibility

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatChrome("50")}}{{CompatGeckoDesktop('19')}}{{CompatIE(10)}}{{property_prefix("ms")}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}[1]
Image quality parameter{{CompatChrome("50")}}{{CompatGeckoDesktop('25')}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatNo}}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidAndroid WebviewFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatNo}}{{CompatChrome("50")}}{{CompatGeckoMobile("19")}}{{CompatUnknown}}{{CompatNo}}{{CompatUnknown}}{{CompatChrome("50")}}
Image quality parameter{{CompatNo}}{{CompatChrome("50")}}{{CompatGeckoMobile("25")}}{{CompatUnknown}}{{CompatNo}}{{CompatUnknown}}{{CompatChrome("50")}}
-
- -

[1] See {{WebKitBug("71270")}}.

- -

Polyfill

- -

A low performance polyfill based on toDataURL.

- -
if (!HTMLCanvasElement.prototype.toBlob) {
- Object.defineProperty(HTMLCanvasElement.prototype, 'toBlob', {
-  value: function (callback, type, quality) {
-
-    var binStr = atob( this.toDataURL(type, quality).split(',')[1] ),
-        len = binStr.length,
-        arr = new Uint8Array(len);
-
-    for (var i = 0; i < len; i++ ) {
-     arr[i] = binStr.charCodeAt(i);
-    }
-
-    callback( new Blob( [arr], {type: type || 'image/png'} ) );
-  }
- });
-}
-
- -

See also

- - diff --git a/files/it/web/api/htmlcollection/index.html b/files/it/web/api/htmlcollection/index.html deleted file mode 100644 index 53eb23edd1..0000000000 --- a/files/it/web/api/htmlcollection/index.html +++ /dev/null @@ -1,101 +0,0 @@ ---- -title: HTMLCollection -slug: Web/API/HTMLCollection -tags: - - API - - DOM - - HTML DOM - - HTMLCollection - - Interfaccia - - Lista di elementi - - Referenza - - Referenza DOM -translation_of: Web/API/HTMLCollection ---- -

{{APIRef("HTML DOM")}}

- -

L'interfaccia HTMLCollection rappresenta una raccolta generica (array-like object simile agli argomenti) di elementi (nell'ordine del documento) e offre metodi e proprietà per la selezione dall'elenco.

- -
Note: Questa interfaccia è chiamata HTMLCollection per ragioni storiche (prima del DOM moderno, le raccolte che implementano questa interfaccia potevano avere solo elementi HTML come elementi).
- -

Una HTMLCollection nell'HTML DOM è attiva; viene aggiornata automaticamente quando viene modificato il documento sottostante.

- -

Proprietà

- -
-
{{domxref("HTMLCollection.length")}} {{readonlyInline}}
-
Restituisce il numero di elementi nella raccolta.
-
- -

Metodi

- -
-
{{domxref("HTMLCollection.item()")}}
-
Restituisce il nodo specifico al dato index a base zero nella lista. Restituisce null se index non è compreso nell'intervallo
-
{{domxref("HTMLCollection.namedItem()")}}
-
Restituisce il nodo specifico il cui ID o, come nome di fallback, corrisponde alla stringa specificata da nome. La corrispondenza per nome viene eseguita solo come ultima risorsa, solo in HTML, e solo se l'elemento di riferimento supporta l'attributo name. Restituisce null se nessun nodo corrisponde con il nome specificato.
-
- -

Utilizzo in JavaScript

- -

HTMLCollection espone anche i suoi membri direttamente come proprietà sia per nome che per indice. Gli ID HTML possono contenere : e . come caratteri validi, che richiederebbero l'uso della notazione della parentesi per l'accesso alla proprietà. Attualmente HTMLCollections non riconosce gli ID puramente numerici, il che causerebbe un conflitto con l'accesso in stile array, sebbene HTML5 li autorizzi.

- -

Ad esempio, supponendo che esista un elemento <form> nel documento e il suo id sia "myForm":

- -
var elem1, elem2;
-
-// document.forms è una HTMLCollection
-
-elem1 = document.forms[0];
-elem2 = document.forms.item(0);
-
-alert(elem1 === elem2); // ritorna: "true"
-
-elem1 = document.forms.myForm;
-elem2 = document.forms.namedItem("myForm");
-
-alert(elem1 === elem2); // ritorna: "true"
-
-elem1 = document.forms["named.item.with.periods"];
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', '#htmlcollection', 'HTMLCollection')}}{{ Spec2('DOM WHATWG') }} 
{{SpecName('DOM2 HTML', 'html.html#ID-75708506', 'HTMLCollection')}}{{ Spec2('DOM2 HTML') }} 
{{SpecName('DOM1', 'level-one-html.html#ID-75708506', 'HTMLCollection')}}{{ Spec2('DOM1') }}Definizione iniziale.
- -

Compatibilità con i browser

- - - -

{{Compat("api.HTMLCollection")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/htmlcollection/item/index.html b/files/it/web/api/htmlcollection/item/index.html deleted file mode 100644 index f53047ffbc..0000000000 --- a/files/it/web/api/htmlcollection/item/index.html +++ /dev/null @@ -1,50 +0,0 @@ ---- -title: HTMLCollection.item -slug: Web/API/HTMLCollection/item -translation_of: Web/API/HTMLCollection/item ---- -
{{APIRef("HTML DOM")}}
- -

Il metodo {{domxref("HTMLCollection")}} item() restituisce il nodo situato nell'offset specificato nella raccolta.

- -
-

Note: Poiché il contenuto di una HTMLCollection è attivo, le modifiche al DOM sottostante possono e causano la modifica della posizione dei singoli nodi nella raccolta, pertanto il valore dell'indice non resterà necessariamente costante per un determinato nodo.

-
- -

Sintassi

- -
var elemento = HTMLCollection.item(index)
- -

Parametri

- -
-
index
-
La posizione del {{domxref("Node")}} da restituire. Gli elementi appaiono in una HTMLCollection nello stesso ordine in cui appaiono nella fonte del documento.
-
- -

Valore di ritorno

- -

Il {{domxref("Node")}} nell'indice specificato, o null se index è minore di zero o maggiore o uguale alla proprietà length.

- -

Note di utilizzo

- -

Il metodo item() estituisce un elemento numerato da una HTMLCollection. In JavaScript, è più semplice trattare HTMLCollection come una matrice e indicizzarla mediante la notazione degli array. Vedi l'{{anch ("Esempio", "esempio")}} sotto.

- -

Esempio

- -
var c = document.images;  // Questa è una HTMLCollection
-var img0 = c.item(0);     // Puoi usare il metodo item() in questo modo
-var img1 = c[1];          // Ma questa notazione è più facile e più comune
-
- -

Compatibilità con i browser

- - - -

{{Compat("api.HTMLCollection.item")}}

- -

Guarda anche

- - diff --git a/files/it/web/api/htmlelement/index.html b/files/it/web/api/htmlelement/index.html deleted file mode 100644 index a1b53a7528..0000000000 --- a/files/it/web/api/htmlelement/index.html +++ /dev/null @@ -1,481 +0,0 @@ ---- -title: HTMLElement -slug: Web/API/HTMLElement -tags: - - API - - HTML DOM - - Interface - - NeedsNewLayout - - Referenza -translation_of: Web/API/HTMLElement ---- -
{{ApiRef("HTML DOM")}}
- -

L'interfaccia HTMLElement rappresenta un qualsiasi elemento HTML. Alcuni elementi implementano direttamente questa interfaccia, altri la implementano attraverso un'interfaccia che la eredita.

- -

Proprietà

- -

Eredita le proprietà dai propri genitori, da {{domxref("Element")}} e da {{domxref("GlobalEventHandlers")}}.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
NomeTipoDescrizione
{{domxref("HTMLElement.accessKey")}}{{domxref("DOMString")}}La chiave d'accesso assegnata all'elemento.
{{domxref("HTMLElement.accessKeyLabel")}}{{domxref("DOMString")}}Una stringa che rappresenta la chiave d'accesso assegnata all'elemento.
{{domxref("HTMLElement.contentEditable")}}{{domxref("DOMString")}}Ritorna o assegna la modificabilità dell'elemento.
{{domxref("HTMLElement.isContentEditable")}} {{readonlyInline}}{{domxref("Boolean")}}Indica se il contenuto dell'elemento sia modificabile.
{{domxref("HTMLElement.dataset")}} {{readonlyInline}}{{domxref("DOMStringMap")}}Permette di leggere e scrivere attributi personalizzati (data-*) nell'elemento.
{{domxref("HTMLElement.dir")}}{{domxref("DOMString")}}Ritorna o assegna la direzione dell'elemento
{{domxref("HTMLElement.draggable")}}{{domxref("Boolean")}} 
{{domxref("HTMLElement.dropzone")}} {{readonlyInline}}{{domxref("DOMSettableTokenList")}} 
{{domxref("HTMLElement.hidden")}}{{domxref("Boolean")}} 
{{domxref("HTMLElement.itemScope")}} {{experimental_inline}}{{domxref("Boolean")}} 
{{domxref("HTMLElement.itemType")}} {{readonlyInline}}{{experimental_inline}}{{domxref("DOMSettableTokenList")}} 
{{domxref("HTMLElement.itemId")}} {{experimental_inline}}{{domxref("DOMString")}} 
{{domxref("HTMLElement.itemRef")}} {{readonlyInline}}{{experimental_inline}}{{domxref("DOMSettableTokenList")}} 
{{domxref("HTMLElement.itemProp")}} {{readonlyInline}}{{experimental_inline}}{{domxref("DOMSettableTokenList")}} 
{{domxref("HTMLElement.itemValue")}} {{experimental_inline}}any 
{{domxref("HTMLElement.lang")}}{{domxref("DOMString")}}Ritorna o assegna la lingua di un attributo, di un elemento, del testo e del contenuto di un elemento.
{{domxref("HTMLElement.offsetHeight")}} {{readonlyInline}}{{experimental_inline}}doubleL'altezza di un elemento, relativa al layout.
{{domxref("HTMLElement.offsetLeft")}}{{readonlyInline}}{{experimental_inline}}doubleLa distanza tra il bordo sinistro dell'elemento e il bordo sinistro del suo offsetParent.
{{domxref("HTMLElement.offsetParent")}}{{readonlyInline}}{{experimental_inline}}{{domxref("Element")}}L'elemento a partire dal quale tutti i calcoli dell'offset sono effettuati.
{{domxref("HTMLElement.offsetTop")}}{{readonlyInline}}{{experimental_inline}}doubleLa distanza tra il bordo superiore dell'elemento e il bordo superiore del suo offsetParent.
{{domxref("HTMLElement.offsetWidth")}}{{readonlyInline}}{{experimental_inline}}doubleLa larghezza di un elemento, relativa al layout.
{{domxref("HTMLElement.properties")}} {{readonlyInline}}{{experimental_inline}}{{domxref("HTMLPropertiesCollection")}} 
{{domxref("HTMLElement.spellcheck")}}{{ gecko_minversion_inline("1.9")}}{{domxref("Boolean")}}Controlla il controllo ortografico (presente in tutti gli elementi HTML)
{{domxref("HTMLElement.style")}}{{domxref("CSSStyleDeclaration")}}Un oggetto che rappresenta la dichiarazione degli attributi di stile di un elemento.
{{domxref("HTMLElement.tabIndex")}}longRitorna o assegna la posizione di un elemento nell'ordine di tabbing.
{{domxref("HTMLElement.title")}}{{domxref("DOMString")}}Una stringa che appare in un popup quando il mouse si trova sopra all'elemento.
{{domxref("HTMLElement.translate")}} {{experimental_inline}}{{domxref("Boolean")}} 
- -

Gestori degli eventi

- -

Le proprietà degli eventi, nella forma onXYZ, sono definite nei {{domxref("GlobalEventHandlers")}} implementati da HTMLElement. Alcune altre sono specifiche per HTMLElement.

- -
-
{{domxref("HTMLElement.onTouchStart")}} {{non-standard_inline}}
-
Restituisce il codice di gestione dell'evento {{event("touchstart")}}.
-
{{domxref("HTMLElement.onTouchEnd")}} {{non-standard_inline}}
-
Restituisce il codice di gestione dell'evento {{event("touchend")}}.
-
{{domxref("HTMLElement.onTouchMove")}} {{non-standard_inline}}
-
Restituisce il codice di gestione dell'evento {{event("touchmove")}}.
-
{{domxref("HTMLElement.onTouchEnter")}} {{non-standard_inline}}
-
Restituisce il codice di gestione dell'evento {{event("touchenter")}}.
-
{{domxref("HTMLElement.onTouchLeave")}} {{non-standard_inline}}
-
Restituisce il codice di gestione dell'evento {{event("touchleave")}}.
-
{{domxref("HTMLElement.onTouchCancel")}} {{non-standard_inline}}
-
Restituisce il codice di gestione dell'evento {{event("touchcancel")}}.
-
- -

Metodi

- -

Eredita i metodi dal genitore, {{domxref("Element")}}.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Nome e argomentiRestituisceDescrizione
{{domxref("HTMLElement.blur()")}}voidRimuove il focus della tastiera dall'elemento attualmente in focus.
{{domxref("HTMLElement.click()")}}voidInvia un evento di clic del mouse all'elemento.
{{domxref("HTMLElement.focus()")}}voidPorta il focus della tastiera sull'elemento.
{{domxref("HTMLElement.forceSpellCheck()")}} {{experimental_inline}}void 
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommenti
{{SpecName('CSSOM View', '#extensions-to-the-htmlelement-interface', 'HTMLElement')}}{{Spec2('CSSOM View')}}Aggiunge le seguenti proprietà: offsetParent, offsetTop, offsetLeft, offsetWidth, e offsetHeight.
{{SpecName('HTML WHATWG', 'elements.html#htmlelement', 'HTMLElement')}}{{Spec2('HTML WHATWG')}}Aggiunge le seguenti proprietà: translate, itemScope, itemType, itemId, itemRef, itemProp, properties, e itemValue.
- Aggiunti i seguenti metodi: forceSpellcheck().
- Spostati gli attributi onXYZ all'interfaccia {{domxref("GlobalEventHandlers")}} e aggiunta la sua ereditarietà.
{{SpecName('HTML5 W3C', 'dom.html#htmlelement', 'HTMLElement')}}{{Spec2('HTML5 W3C')}}Aggiunge le seguenti proprietà: dataset, hidden, tabindex, accessKey, accessKeyLabel, draggable, dropzone, contentEditable, isContentEditable, contextMenu, spellcheck, commandType, commandLabel, commandIcon, commandHidden, commandDisabled, commandChecked, style, e tutte le proprietà onXYZ.
- Spostate le proprietà id e className all'interfaccia {{domxref("Element")}}.
{{SpecName('DOM2 HTML', 'html.html#ID-011100101', 'HTMLElement')}}{{Spec2('DOM2 HTML')}}Nessun cambiamento da {{SpecName('DOM2 HTML')}}
{{SpecName('DOM1', 'level-one-html.html#ID-011100101', 'HTMLElement')}}{{Spec2('DOM1')}}Definizione iniziale.
- -

Compatibilità con i browser

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Supporto di base{{CompatGeckoDesktop("1.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
{{domxref("HTMLElement.accessKey", "accessKey")}}{{CompatGeckoDesktop("5.0")}}17.0{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}(535.10)
{{domxref("HTMLElement.accessKeyLabel", "accessKeyLabel")}}{{CompatGeckoDesktop("8.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatNo}}{{WebkitBug(72715)}}
{{domxref("HTMLElement.blur()", "blur()")}}{{CompatGeckoDesktop("5.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
{{domxref("HTMLElement.click()", "click()")}}{{CompatGeckoDesktop("5.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}(535.24)
{{domxref("HTMLElement.dataset", "dataset")}}{{CompatGeckoDesktop("6.0")}}9.0{{CompatUnknown}}11.105.1
{{domxref("HTMLElement.focus()", "focus()")}}{{CompatGeckoDesktop("5.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
{{domxref("HTMLElement.contentEditable", "contentEditable")}}{{CompatGeckoDesktop("1.9")}}{{CompatVersionUnknown}}5.59{{CompatVersionUnknown}}
{{domxref("HTMLElement.spellcheck", "spellcheck")}}{{CompatGeckoDesktop("1.8.1")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
{{domxref("HTMLElement.forceSpellCheck", "forceSpellCheck()")}} {{experimental_inline}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
{{domxref("HTMLElement.dataset", "dataset")}}{{CompatGeckoDesktop("6.0")}}8.01111.106
{{domxref("HTMLElement.draggable", "draggable")}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}12.0{{CompatUnknown}}
{{domxref("HTMLElement.dropzone", "dropzone")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}12.0{{CompatNo}}
{{domxref("HTMLElement.offsetLeft", "offsetLeft")}}, {{domxref("HTMLElement.offsetTop", "offsetTop")}}, {{domxref("HTMLElement.offsetParent", "offsetParent")}}, {{domxref("HTMLElement.offsetHeight", "offsetHeight")}} and {{domxref("HTMLElement.offsetWidth", "offsetWidth")}} {{experimental_inline}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}
{{domxref("HTMLElement.translate", "translate")}} {{experimental_inline}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
{{domxref("HTMLElement.itemScope", "itemScope")}}, {{domxref("HTMLElement.itemType", "itemType")}}, {{domxref("HTMLElement.itemRef", "itemRef")}}, {{domxref("HTMLElement.itemId", "itemId")}}, {{domxref("HTMLElement.itemProp", "itemProp")}}, and {{domxref("HTMLElement.itemValue", "itemValue")}} {{experimental_inline}}{{CompatGeckoDesktop("6.0")}}{{CompatNo}}{{CompatNo}}11.60
- (Removed in Opera 15)		{{CompatNo}}
{{domxref("HTMLElement.properties", "properties")}} {{experimental_inline}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
{{domxref("HTMLElement.ontouchstart")}}, {{domxref("HTMLElement.ontouchend")}}, {{domxref("HTMLElement.ontouchmove")}}, {{domxref("HTMLElement.ontouchenter")}}, {{domxref("HTMLElement.ontouchleave")}}, and {{domxref("HTMLElement.ontouchcancel")}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatNo}}{{CompatUnknown}}{{CompatVersionUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàFirefox Mobile (Gecko)AndroidIE MobileOpera MobileSafari Mobile
Supporto di base -

{{CompatGeckoMobile("1.0")}}

- 		{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
{{domxref("HTMLElement.accessKey", "accessKey")}}{{CompatGeckoMobile("5.0")}}
{{domxref("HTMLElement.accessKeyLabel", "accessKeyLabel")}}{{CompatGeckoMobile("8.0")}}
{{domxref("HTMLElement.blur()", "blur()")}}{{CompatGeckoMobile("5.0")}}
{{domxref("HTMLElement.click()", "click()")}}{{CompatGeckoMobile("5.0")}}
{{domxref("HTMLElement.dataset", "dataset")}}{{CompatGeckoMobile("6.0")}}
{{domxref("HTMLElement.focus()", "focus()")}}{{CompatGeckoMobile("5.0")}}
-
- -

Vedi anche

- - diff --git a/files/it/web/api/htmlelement/offsetheight/index.html b/files/it/web/api/htmlelement/offsetheight/index.html deleted file mode 100644 index 46b7232b50..0000000000 --- a/files/it/web/api/htmlelement/offsetheight/index.html +++ /dev/null @@ -1,123 +0,0 @@ ---- -title: HTMLElement.offsetHeight -slug: Web/API/HTMLElement/offsetHeight -translation_of: Web/API/HTMLElement/offsetHeight ---- -
{{ APIRef("HTML DOM") }}
- -

La proprietà HTMLElement.offsetHeight è una proprietà di tipo read-only e rappresenta l'altezza dell'elemento incluso padding verticale e magini, in pixels, come intero.

- -

Di solito, l'offsetHeight di un elemento è una misura che include i bordi dell'elemento, il padding verticale dell'elemento, la scrollbar orizzontale dell'elemento  (se presente , se renderizzata) e l'altezza nel css dell'elemento.

- -

Per l'oggetto body, la misua include la totale altezza lineare invece dell'altezza CSS. Elementi floattati sotto altri contenuti lineari sono ignorati.

- -
-

Questa proprietà arrotonderà il valore ad un intero. Se vi serve un valore decimale usate {{ domxref("element.getBoundingClientRect()") }}.

-
- -

Sintassi

- -
var intElemOffsetHeight = document.getElementById(id_attribute_value).offsetHeight;
-
- -

intElemOffsetHeight è una variabile che associa un intero corrispondente al valore dell'offsetHeight in pixel dell'elemento. La proprietà offsetHeight è di tipo readonly.

- -

Esempio

- -

 

- -

             Image:Dimensions-offset.png

- - -

L'immagine nell'esempio sopra mosta una scrollbar e un offsetHeigh che si adatta alla finestra. Comunque, elementi non scrollabili potrebbero avere un offsetHeights largo, molto più largo del contenuto visibile. Questi elemnti sono tipicamente contenuti in un elemento scrollabile; di conseguenza questi elementi non scrollabili possono essere invisibili completamente o parzialmente, dipende dal settaggio dello scrollTop del contenitore scrollabile.

- -

 

- -

Specifiche

- - - - - - - - - - - - - - - - -
SpecificheStatusCommenti
{{SpecName('CSSOM View', '#dom-htmlelement-offsetHeight', 'offsetLeft')}}{{Spec2('CSSOM View')}} 
- -

Note

- -

offsetHeight è una proprietà del DHTML object model la quale era stata introdotta precedentemente da MSIE. Questa si riferisce a volte alla dimensione fisica/grafica di un elemento, o all'altezza del border-box di un elemento.

- -

Compatibilità Browser

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidAndroid WebviewFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
-
- -

Vedi Anche

- - diff --git a/files/it/web/api/htmlformelement/acceptcharset/index.html b/files/it/web/api/htmlformelement/acceptcharset/index.html deleted file mode 100644 index 5100a8d7f4..0000000000 --- a/files/it/web/api/htmlformelement/acceptcharset/index.html +++ /dev/null @@ -1,22 +0,0 @@ ---- -title: HTMLFormElement.acceptCharset -slug: Web/API/HTMLFormElement/acceptCharset -translation_of: Web/API/HTMLFormElement/acceptCharset ---- -
{{APIRef("HTML DOM")}}
- -

acceptCharset restituisce una lista delle codifiche dei caratteri supportate per un dato elemento form. Questa lista è una stringa e gli elementi possono essere separati da virgole o da spazi.

- -

Sintassi

- -
stringa = form.acceptCharset;
-
- -

Esempio

- -
inputs = document.forms["myform"].acceptCharset
-
- -

Specifiche

- -

DOM Level 2 HTML: acceptCharset

diff --git a/files/it/web/api/htmlformelement/action/index.html b/files/it/web/api/htmlformelement/action/index.html deleted file mode 100644 index 8b55910259..0000000000 --- a/files/it/web/api/htmlformelement/action/index.html +++ /dev/null @@ -1,30 +0,0 @@ ---- -title: HTMLFormElement.action -slug: Web/API/HTMLFormElement/action -translation_of: Web/API/HTMLFormElement/action ---- -
{{APIRef("HTML DOM")}}
- -

action legge o imposta l'attributo action dell'elemento FORM.

- -

Sintassi

- -
stringa = form.action
-form.action =
-stringa
-
- -

Esempio

- -
form.action = "/cgi-bin/publish";
-
- -

Note

- -

L'attributo action di un form è il programma che viene eseguito sul server quando il form viene inviato. Questa proprietà può essere letta o impostata.

- -

Specifiche

- -

DOM Level 2 HTML: action

- -

{{ languages( { "ja": "ja/DOM/form.action" } ) }}

diff --git a/files/it/web/api/htmlformelement/elements/index.html b/files/it/web/api/htmlformelement/elements/index.html deleted file mode 100644 index 3ea2a2aa32..0000000000 --- a/files/it/web/api/htmlformelement/elements/index.html +++ /dev/null @@ -1,34 +0,0 @@ ---- -title: HTMLFormElement.elements -slug: Web/API/HTMLFormElement/elements -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/HTMLFormElement/elements ---- -
-
{{APIRef("HTML DOM")}}
-
- -

Restituisce una HTMLCollection contenente tutti i controlli dell'elemento form a cui si riferisce.

- -

Puoi accedere un elemento della collezione sia usando l'indice che usando l'id o il name.

- -

Sintassi

- -
nodeList =
-HTMLFormElement.elements
-
- -

Esempio

- -
var input = document.getElementById("form1").elements;
-var inputByIndex = inputs[2]; //indice
-var inputByName = inputs["login"]; //id oppure name
-
- -

Specifiche

- -

Specifica W3C DOM 2 HTML Specifica elements

diff --git a/files/it/web/api/htmlformelement/enctype/index.html b/files/it/web/api/htmlformelement/enctype/index.html deleted file mode 100644 index 082db19303..0000000000 --- a/files/it/web/api/htmlformelement/enctype/index.html +++ /dev/null @@ -1,28 +0,0 @@ ---- -title: HTMLFormElement.enctype -slug: Web/API/HTMLFormElement/enctype -translation_of: Web/API/HTMLFormElement/enctype ---- -
{{APIRef("HTML DOM")}}
- -

enctype legge o imposta il tipo di contenuto del form.

- -

Sintassi

- -
stringa = form.enctype
-form.enctype =
-stringa
-
- -

Esempio

- -
form.enctype = "application/x-www-form-urlencoded";
-
- -

Note

- -

Il tipo di codifica predefinito è "application/x-www-form-urlencoded".

- -

Specifiche

- -

DOM Level 2 HTML: enctype

diff --git a/files/it/web/api/htmlformelement/index.html b/files/it/web/api/htmlformelement/index.html deleted file mode 100644 index 35ef7bcb58..0000000000 --- a/files/it/web/api/htmlformelement/index.html +++ /dev/null @@ -1,125 +0,0 @@ ---- -title: form -slug: Web/API/HTMLFormElement -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/HTMLFormElement ---- -

{{ ApiRef() }}

-

HTML Form Element Interface

-

L'elemento FORM possiede tutte le proprietà e i metodi di qualunque element, e inoltre ha un'interfaccia specializzata: HTMLFormElement.

-

Questa interfaccia fornisce i metodi per creare e modificare gli elementi del FORM. L'esempio seguente mostra come creare un nuovo elemento form, modificare i suoi attributi e inviarlo.

-
// Crea un form
-var f = document.createElement("form");
-
-// Lo aggiungere come ultimo nodo all'interno dell'elemento Body
-document.body.appendChild(f);
-
-// Setta l'attributo action e l'attributo method
-f.action = "/cgi-bin/some.cgi";
-f.method = "POST"
-
-// Invia il form tramite il metodo submit
-f.submit();
-
-

Il seguente esempio di pagina HTML mostra come estrarre informazioni da un form e come settare alcuni dei suoi attributi.

-
</html>
-<head>
-<title>Esempio di Form</title>
-<script type="text/javascript">
-  function getFormInfo() {
-    var info;
-
-    // Ricava un riferimento al form usando la collezione di form disponibile in document
-    var f = document.forms["formA"];
-    info = "f.elements: " + f.elements + "\n"
-         + "f.length: " + f.length + "\n"
-         + "f.name: " + f.elements + "\n"
-         + "f.acceptCharset: " + f.acceptCharset + "\n"
-         + "f.action: " + f.action + "\n"
-         + "f.enctype: " + f.enctype + "\n"
-         + "f.encoding: " + f.encoding + "\n"
-         + "f.method: " + f.method + "\n"
-         + "f.target: " + f.target;
-    document.forms["formA"].elements['tex'].value = info;
-  }
-
-  // Un riferimento al form viene passato
-  //  dall'attributo onclick del button usando 'this.form'
-  function setFormInfo(f) {
-    f.method = "GET";
-    f.action = "/cgi-bin/evil_executable.cgi";
-    f.name   = "totally_new";
-  }
-</script>
-</head>
-<body>
-<h1>Form  example</h1>
-
-<form id="formA"
- action="/cgi-bin/test" method="POST">
- <p>Clicca "Info" per vedere delle info sul form.
-    Cllica set per cambiare i settaggi,quindi di nuovo info per vedere l'effetto</p>
- <p>
-  <input type="button" value="info"
-   onclick="getFormInfo();">
-  <input type="button" value="set"
-   onclick="setFormInfo(this.form);">
-  <input type="reset" value="reset">
-  <br>
-  <textarea id="tex" style="height:15em; width:20em">
- </p>
-</form>
-</body>
-</html>
-
-

Proprietà

-
-
- form.elements
-
- Restituisce una collezione dei controlli contenuti form corrente.
-
- form.length
-
- Restituisce il numero di controlli contenuti nel form corrente.
-
- form.name
-
- Restituisce una stringa con con il valore dell'attributo name del form corrente.
-
- form.acceptCharset
-
- Restituisce una lista dei set di caratteri supportati per il form corrente.
-
- form.action
-
- Restituisce/setta l'URI a cui verranno spediti i dati del form.
-
- form.enctype
-
- Restituisce/setta il tipo di contenuto che il form corrente invierà al server.
-
- form.method
-
- Restituisce/setta il metodo con cui inviare le informazioni al server.
-
- form.target
-
- Restituisce/setta il nome del frame in cui rendere la pagina di risposta del server.
-
-

Metodi

-
-
- form.submit
-
- Invia il form.
-
- form.reset
-
- Riporta il form al suo stato iniziale.
-
-

{{ languages( { "fr": "fr/DOM/form", "pl": "pl/DOM/form", "en": "en/DOM/form" } ) }}

diff --git a/files/it/web/api/htmlformelement/length/index.html b/files/it/web/api/htmlformelement/length/index.html deleted file mode 100644 index 34f1e82ef3..0000000000 --- a/files/it/web/api/htmlformelement/length/index.html +++ /dev/null @@ -1,26 +0,0 @@ ---- -title: HTMLFormElement.length -slug: Web/API/HTMLFormElement/length -translation_of: Web/API/HTMLFormElement/length ---- -
{{APIRef("HTML DOM")}}
- -

length restituisce il numero di controlli contenuti dall'elemento FORM.

- -

Sintassi

- -
integer = form.length
-
- -

Esempio

- -
if (document.getElementById("form1").length > 1) {
-  // vi è più di un controllo
-}
-
- -

Specification

- -

DOM Level 2: length

- -

{{ languages( { "ja": "ja/DOM/form.length" } ) }}

diff --git a/files/it/web/api/htmlformelement/method/index.html b/files/it/web/api/htmlformelement/method/index.html deleted file mode 100644 index bffd4f7faf..0000000000 --- a/files/it/web/api/htmlformelement/method/index.html +++ /dev/null @@ -1,28 +0,0 @@ ---- -title: HTMLFormElement.method -slug: Web/API/HTMLFormElement/method -translation_of: Web/API/HTMLFormElement/method ---- -
{{APIRef("HTML DOM")}}
- -

method legge o imposta il metodo HTTP utilizzato per l'invio del form.

- -

-

Sintassi

-

- -
stringa = form.method
-form.method =
-stringa
-
- -

Esempio

- -
document.forms["myform"].method = "POST";
-
- -

Specifiche

- -

DOM Level 2 HTML: method

- -

{{ languages( { "ja": "ja/DOM/form.method" } ) }}

diff --git a/files/it/web/api/htmlformelement/name/index.html b/files/it/web/api/htmlformelement/name/index.html deleted file mode 100644 index 1e6c741329..0000000000 --- a/files/it/web/api/htmlformelement/name/index.html +++ /dev/null @@ -1,35 +0,0 @@ ---- -title: HTMLFormElement.name -slug: Web/API/HTMLFormElement/name -translation_of: Web/API/HTMLFormElement/name ---- -
{{APIRef("HTML DOM")}}
- -

name restituisce il nome dell'elemento FORM corrente come stringa.

- -

Sintassi

- -
stringa = form.name
-form.name =
-stringa
-
- -

Esempio

- -
form1 = document.getElementById("form1").name;
-if (form1 != document.form.form1) {
-   // il browser non supporta questo tipo di riferimenti
-}
-
- -

Note

- -

Si noti che questa proprietà può essere letta o impostata, il chè significa che è possibile modificare o impostare il nome del form.

- -

Se l'elemento FORM contiene un elemento chiamato "name", questo elemento coprirà la proprietà form.name, quindi non sarà possibile utilizzarla.

- -

Internet Explorer (IE) non permette di modificare l'attributo name di un elemento che è stato creato con createElement() utilizzando la proprietà name.

- -

Specifiche

- -

DOM Level 2 HTML: name

diff --git a/files/it/web/api/htmlformelement/reset/index.html b/files/it/web/api/htmlformelement/reset/index.html deleted file mode 100644 index 0d373e6938..0000000000 --- a/files/it/web/api/htmlformelement/reset/index.html +++ /dev/null @@ -1,28 +0,0 @@ ---- -title: HTMLFormElement.reset -slug: Web/API/HTMLFormElement/reset -translation_of: Web/API/HTMLFormElement/reset ---- -
{{APIRef("HTML DOM")}}
- -

reset resetta il form al suo stato iniziale.

- -

Sintassi

- -
HTMLForm.reset()
-
- -

Esempio

- -
document.forms["mioForm"].reset();
-
- -

Note

- -

Questo metodo simula ciò che accadrebbe se l'utente cliccasse il bottone reset.

- -

Se un controllo di un form (come il bottone reset) ha come nome reset, questo coprirà il metodo reset.

- -

Specifiche

- -

DOM Level 2 HTML: reset

diff --git a/files/it/web/api/htmlformelement/submit/index.html b/files/it/web/api/htmlformelement/submit/index.html deleted file mode 100644 index b762349b6c..0000000000 --- a/files/it/web/api/htmlformelement/submit/index.html +++ /dev/null @@ -1,30 +0,0 @@ ---- -title: HTMLFormElement.submit() -slug: Web/API/HTMLFormElement/submit -translation_of: Web/API/HTMLFormElement/submit ---- -
{{APIRef("HTML DOM")}}
- -

submit invia il form.

- -

Sintassi

- -
HTMLForm.submit()
-
- -

Esempio

- -
document.forms["mioForm"].submit()
-
- -

Note

- -

Questo metodo simula ciò che accadrebbe se l'utente cliccasse sul bottone "invia".

- -

Se il controllo di un form (come il bottone di invio) ha come nome o un id submit, questo coprirà il metodo submit.

- -

Specifiche

- -

DOM Level 2 HTML: submit

- -

{{ languages( { "ja": "ja/DOM/form.submit" } ) }}

diff --git a/files/it/web/api/htmlformelement/target/index.html b/files/it/web/api/htmlformelement/target/index.html deleted file mode 100644 index c94b8a78f9..0000000000 --- a/files/it/web/api/htmlformelement/target/index.html +++ /dev/null @@ -1,24 +0,0 @@ ---- -title: HTMLFormElement.target -slug: Web/API/HTMLFormElement/target -translation_of: Web/API/HTMLFormElement/target ---- -
{{APIRef("HTML DOM")}}
- -

target legge o imposta il contenuto dell'attributo target (per esempio, il frame dove verrà visualizzato l'output del form).

- -

Sintassi

- -
stringa = form.target
-form.target =
-stringa
-
- -

Esempio

- -
myForm.target = document.frames[1].name;
-
- -

Specifiche

- -

DOM Level 2 HTML: target

diff --git a/files/it/web/api/htmliframeelement/index.html b/files/it/web/api/htmliframeelement/index.html deleted file mode 100644 index 4138970a78..0000000000 --- a/files/it/web/api/htmliframeelement/index.html +++ /dev/null @@ -1,455 +0,0 @@ ---- -title: HTMLIFrameElement -slug: Web/API/HTMLIFrameElement -tags: - - API - - HTML DOM - - Interface - - NeedsTranslation - - Reference - - TopicStub -translation_of: Web/API/HTMLIFrameElement ---- -
{{APIRef("HTML DOM")}}
- -

The HTMLIFrameElement interface provides special properties and methods (beyond those of the {{domxref("HTMLElement")}} interface it also has available to it by inheritance) for manipulating the layout and presentation of inline frame elements.

- -

{{InheritanceDiagram(600,120)}}

- -

Properties

- -

Inherits properties from its parent, {{domxref("HTMLElement")}}.

- -
-
{{domxref("HTMLIFrameElement.align")}} {{obsolete_inline}}
-
Is a {{domxref("DOMString")}} that specifies the alignment of the frame with respect to the surrounding context.
-
{{domxref("HTMLIFrameElement.allowfullscreen")}} {{experimental_inline}}
-
Is a {{domxref("Boolean")}} indicating whether the inline frame is willing to be placed into full screen mode. See Using full-screen mode for details.
-
{{domxref("HTMLIFrameElement.allowPaymentRequest")}}
-
Is a {{domxref("Boolean")}} indicating whether the Payment Request API may be invoked inside a cross-origin iframe.
-
{{domxref("HTMLIFrameElement.contentDocument")}} {{readonlyInline}}
-
Returns a {{domxref("Document")}}, the active document in the inline frame's nested browsing context.
-
{{domxref("HTMLIFrameElement.contentWindow")}} {{readonlyInline}}
-
Returns a {{domxref("WindowProxy")}}, the window proxy for the nested browsing context.
-
{{domxref("HTMLIFrameElement.frameBorder")}} {{obsolete_inline}}
-
Is a {{domxref("DOMString")}} that indicates whether to create borders between frames.
-
{{domxref("HTMLIFrameElement.height")}}
-
Is a {{domxref("DOMString")}} that reflects the {{htmlattrxref("height", "iframe")}} HTML attribute, indicating the height of the frame.
-
{{domxref("HTMLIFrameElement.longDesc")}} {{obsolete_inline}}
-
Is a {{domxref("DOMString")}} that contains the URI of a long description of the frame.
-
{{domxref("HTMLIFrameElement.marginHeight")}} {{obsolete_inline}}
-
Is a {{domxref("DOMString")}} being the height of the frame margin.
-
{{domxref("HTMLIFrameElement.marginWidth")}} {{obsolete_inline}}
-
Is a {{domxref("DOMString")}} being the width of the frame margin.
-
{{domxref("HTMLIFrameElement.name")}}
-
Is a {{domxref("DOMString")}} that reflects the {{htmlattrxref("name", "iframe")}} HTML attribute, containing a name by which to refer to the frame.
-
{{domxref("HTMLIFrameElement.referrerPolicy")}} {{experimental_inline}}
-
Is a {{domxref("DOMString")}} that reflects the {{htmlattrxref("referrerPolicy", "iframe")}} HTML attribute indicating which referrer to use when fetching the linked resource.
-
{{domxref("HTMLIFrameElement.sandbox")}}
-
Is a {{domxref("DOMSettableTokenList")}} that reflects the {{htmlattrxref("sandbox", "iframe")}} HTML attribute, indicating extra restrictions on the behavior of the nested content.
-
{{domxref("HTMLIFrameElement.scrolling")}} {{obsolete_inline}}
-
Is a {{domxref("DOMString")}} that indicates whether the browser should provide scrollbars for the frame.
-
{{domxref("HTMLIFrameElement.src")}}
-
Is a {{domxref("DOMString")}} that reflects the {{htmlattrxref("src", "iframe")}} HTML attribute, containing the address of the content to be embedded.
-
{{domxref("HTMLIFrameElement.srcdoc")}}
-
Is a {{domxref("DOMString")}} that represents the content to display in the frame.
-
{{domxref("HTMLIFrameElement.width")}}
-
Is a {{domxref("DOMString")}} that reflects the {{htmlattrxref("width", "iframe")}} HTML attribute, indicating the width of the frame.
-
- -

Methods

- -

Inherits properties from its parent, {{domxref("HTMLElement")}}.

- -

Browser API methods

- -

To support the requirement of a browser {{HTMLElement("iframe")}}, HTMLIFrameElement has been extended with new methods that give the {{HTMLElement("iframe")}} some super powers. These are non-standard (see {{anch("Browser compatibility")}}.)

- - - -

The following navigation methods allow navigation through the browsing history of the {{HTMLElement("iframe")}}. They are necessary to be able to implement back, forward, stop, and reload buttons.

- -
-
{{domxref("HTMLIFrameElement.reload()")}}
-
Allows reloading of the {{HTMLElement("iframe")}} element content.
-
{{domxref("HTMLIFrameElement.stop()")}}
-
Allows stopping of the {{HTMLElement("iframe")}}'s content loading.
-
{{domxref("HTMLIFrameElement.getCanGoBack()")}}
-
Indicates whether it's possible to navigate backwards.
-
{{domxref("HTMLIFrameElement.goBack()")}}
-
Changes the location of the {{HTMLElement("iframe")}} for the previous location in its browsing history.
-
{{domxref("HTMLIFrameElement.getCanGoForward()")}}
-
Indicates whether it's possible to navigate forward.
-
{{domxref("HTMLIFrameElement.goForward()")}}
-
Changes the location of the {{HTMLElement("iframe")}} for the next location in its browsing history.
-
- -

Management methods

- -

The next set of methods manage the resources used by a browser {{HTMLElement("iframe")}}. These are especially useful for implementing tabbed browser application.

- -
-
{{domxref("HTMLIFrameElement.executeScript()")}}
-
Allows a specified script to be executed against a page loaded in the browser {{HTMLElement("iframe")}}.
-
{{domxref("HTMLIFrameElement.purgeHistory()")}}
-
Clears all the resources (cookies, localStorage, cache, etc.) associated with the browser {{HTMLElement("iframe")}}.
-
{{domxref("HTMLIFrameElement.setVisible()")}}
-
Changes the visibility state of a browser {{HTMLElement("iframe")}}. This can influence resource allocation and some function usage such as {{domxref("window.requestAnimationFrame","requestAnimationFrame")}}.
-
{{domxref("HTMLIFrameElement.getVisible()")}}
-
Indicates the current visibility state of the browser {{HTMLElement("iframe")}}.
-
{{domxref("HTMLIFrameElement.setActive()")}}
-
Sets the current {{HTMLElement("iframe")}} as the active frame, which has an effect on how it is prioritized by the process manager.
-
{{domxref("HTMLIFrameElement.getActive()")}}
-
Indicates whether the current browser {{htmlelement("iframe")}} is the currently active frame.
-
- - - -

The following methods allow direct control of sound in the browser element.

- -
-
{{domxref("HTMLIFrameElement.getVolume()")}}
-
Gets the current volume of the browser {{HTMLElement("iframe")}}.
-
{{domxref("HTMLIFrameElement.setVolume()")}}
-
Sets the current volume of the browser {{HTMLElement("iframe")}}.
-
{{domxref("HTMLIFrameElement.mute()")}}
-
Mutes any audio playing in the browser {{HTMLElement("iframe")}}.
-
{{domxref("HTMLIFrameElement.unmute()")}}
-
Unmutes any audio playing in the browser {{HTMLElement("iframe")}}.
-
{{domxref("HTMLIFrameElement.getMuted()")}}
-
Indicates whether the browser {{HTMLElement("iframe")}} is currently muted.
-
- -

Search methods

- -

New methods are provided to allow programmatic searches of browser {{HTMLElement("iframe")}}s to be carried out.

- -
-
{{domxref("HTMLIFrameElement.findAll()")}}
-
Searches for a string in a browser {{HTMLElement("iframe")}}'s content; if found, the first instance of the string relative to the caret position will be highlighted.
-
{{domxref("HTMLIFrameElement.findNext()")}}
-
Highlights the next or previous instance of a search result after a {{domxref("HTMLIFrameElement.findAll","findAll()")}} search has been carried out.
-
{{domxref("HTMLIFrameElement.clearMatch()")}}
-
Clears any content highlighted by {{domxref("HTMLIFrameElement.findAll","findAll()")}} or {{domxref("HTMLIFrameElement.findNext","findNext()")}}.
-
- - - -

In order to manage the browser {{HTMLElement("iframe")}}'s content, many new events were added (see below). The following methods are used to deal with those events:

- -
-
The {{HTMLElement("iframe")}} gains support for the methods of the {{domxref("EventTarget")}} interface
-
{{domxref("EventTarget.addEventListener","addEventListener()")}}, {{domxref("EventTarget.removeEventListener","removeEventListener()")}}, and {{domxref("EventTarget.dispatchEvent","dispatchEvent()")}}.
-
{{domxref("HTMLIFrameElement.sendMouseEvent()")}}
-
Sends a {{domxref("MouseEvent")}} to the {{HTMLElement("iframe")}}'s content.
-
{{domxref("HTMLIFrameElement.sendTouchEvent()")}}
-
Sends a {{domxref("TouchEvent")}} to the {{HTMLElement("iframe")}}'s content. Note that this method is available for touch enabled devices only.
-
{{domxref("HTMLIFrameElement.addNextPaintListener()")}}
-
Defines a handler to listen for the next {{event("MozAfterPaint")}} event in the browser {{HTMLElement("iframe")}}.
-
{{domxref("HTMLIFrameElement.removeNextPaintListener()")}}
-
Removes a handler previously set with {{domxref("HTMLIFrameElement.addNextPaintListener","addNextPaintListener()")}}.
-
- -

Utility methods

- -

Last, there are some utility methods, useful for apps that host a browser {{HTMLElement("iframe")}}.

- -
-
{{domxref("HTMLIFrameElement.download()")}}
-
Downloads a specified URL, storing it at the specified filename/path.
-
{{domxref("HTMLIFrameElement.getContentDimensions()")}}
-
Retrieves the X and Y dimensions of the content window.
-
{{domxref("HTMLIFrameElement.getManifest()")}}
-
Retrieves the manifest of an app loaded in the browser {{HTMLElement("iframe")}} and returns it as JSON.
-
{{domxref("HTMLIFrameElement.getScreenshot()")}}
-
Takes a screenshot of the browser {{HTMLElement("iframe")}}'s content. This is particularly useful to get thumbnails of tabs in a tabbed browser app.
-
{{domxref("HTMLIFrameElement.getStructuredData()")}}
-
Retrieves any structured microdata (and hCard and hCalendar microformat data) contained in the HTML loaded in the browser {{HTMLElement("iframe")}} and returns it as JSON.
-
{{domxref("HTMLIFrameElement.zoom()")}}
-
Changes the zoom factor of the browser {{HTMLElement("iframe")}}'s content. This is particularly useful for zooming in/out on non-touch-enabled devices.
-
- -
-
- - - - - -

Specifications

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('Payment','#paymentrequest-and-iframe-elements','allowPaymentRequest')}}{{Spec2('Payment')}}Adds allowPaymentRequest property.
{{SpecName('Referrer Policy', '#referrer-policy-delivery-referrer-attribute', 'referrer attribute')}}{{Spec2('Referrer Policy')}}Added the referrerPolicy property.
{{SpecName('HTML WHATWG', "the-iframe-element.html#the-iframe-element", "HTMLIFrameElement")}}{{Spec2('HTML WHATWG')}}The following property has been added: allowFullscreen.
{{SpecName('HTML5 W3C', "embedded-content-0.html#the-iframe-element", "HTMLIFrameElement")}}{{Spec2('HTML5 W3C')}}The following properties are now obsolete: scrolling, marginWidth, marginHeight, longDesc, frameBorder, and align.
- The following properties have been added: srcdoc, sandbox, and contentWindow.
{{SpecName('DOM2 HTML', 'html.html#ID-50708718', 'HTMLIFrameElement')}}{{Spec2('DOM2 HTML')}}The contentDocument property has been added.
{{SpecName('DOM1', 'level-one-html.html#ID-50708718', 'HTMLIFrameElement')}}{{Spec2('DOM1')}}Initial definition.
- -

Browser compatibility

- -
{{CompatibilityTable}}
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatGeckoDesktop(1.0)}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
srcdoc{{CompatChrome(4)}}{{CompatVersionUnknown}}{{CompatGeckoDesktop(25)}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}
sandbox{{CompatChrome(4)}}{{CompatVersionUnknown}}{{CompatGeckoDesktop(17)}}[1]{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
contentDocument{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}8.0[3]{{CompatVersionUnknown}}{{CompatVersionUnknown}}
contentWindow{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}
allowFullScreen {{experimental_inline}}{{CompatChrome(17)}} {{property_prefix("-webkit")}}[4]{{CompatVersionUnknown}}{{CompatGeckoDesktop(9.0)}} {{property_prefix("-moz")}}
- {{CompatGeckoDesktop(18.0)}}		{{CompatNo}}{{CompatNo}}{{CompatNo}}
referrerPolicy {{experimental_inline}}{{CompatChrome(51)}}{{CompatNo}}{{compatGeckoDesktop(50)}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
Browser API methods{{CompatNo}}{{CompatNo}}{{CompatNo}}[5]{{CompatNo}}{{CompatNo}}{{CompatNo}}
allowPaymentRequest{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatNo}}{{CompatUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureAndroid WebviewChrome for AndroidEdgeFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatGeckoMobile(1.0)}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
srcdoc{{CompatChrome(4)}}{{CompatChrome(4)}}{{CompatVersionUnknown}}{{CompatGeckoMobile(25)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
sandbox{{CompatChrome(4)}}{{CompatChrome(4)}}{{CompatVersionUnknown}}{{CompatGeckoMobile(17)}}[1]{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
seamless {{experimental_inline}}{{CompatChrome(4)}}{{CompatChrome(4)}}{{CompatNo}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
contentDocument{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
contentWindow{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
allowFullScreen {{experimental_inline}}{{CompatChrome(17)}} {{property_prefix("-webkit")}}[4]{{CompatChrome(17)}} {{property_prefix("-webkit")}}[4]{{CompatVersionUnknown}}{{CompatGeckoMobile(9.0)}} {{property_prefix("-moz")}}
- {{CompatGeckoMobile(18.0)}}		{{CompatNo}}{{CompatNo}}{{CompatNo}}
referrerPolicy {{experimental_inline}}{{CompatChrome(51)}}{{CompatChrome(51)}}{{CompatNo}}{{compatGeckoMobile(50)}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
Browser API methods{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
allowPaymentRequest{{CompatNo}}{{CompatChrome(57)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatNo}}{{CompatUnknown}}
-
- - - -

See also

- - diff --git a/files/it/web/api/htmlunknownelement/index.html b/files/it/web/api/htmlunknownelement/index.html deleted file mode 100644 index 079de3d82d..0000000000 --- a/files/it/web/api/htmlunknownelement/index.html +++ /dev/null @@ -1,58 +0,0 @@ ---- -title: HTMLUnknownElement -slug: Web/API/HTMLUnknownElement -tags: - - API - - HTML DOM - - Interfaccia - - Referenza -translation_of: Web/API/HTMLUnknownElement ---- -

{{APIRef("HTML DOM")}}

- -

L'interfaccia HTMLUnknownElement rappresenta un elemento HTML non valido e deriva dall'interfaccia {{DOMxRef("HTMLElement")}}, ma senza implementare ulteriori proprietà o metodi.

- -

{{InheritanceDiagram(600, 120)}}

- -

Proprietà

- -

Nessuna proprietà specifica; eredita proprietà dal suo genitore, {{DOMxRef("HTMLElement")}}.

- -

Metodi

- -

Nessuna proprietà specifica; eredita proprietà dal suo genitore, {{DOMxRef("HTMLElement")}}.

- -

Specifiche

- - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName("HTML WHATWG", "elements.html#htmlunknownelement", "HTMLUnknownElement")}}{{Spec2("HTML WHATWG")}}Nessun cambiamento da {{SpecName("HTML5 W3C")}}.
{{SpecName("HTML5 W3C", "dom.html#htmlunknownelement", "HTMLUnknownElement")}}{{Spec2("HTML5 W3C")}}Definizione iniziale.
- -

Compatibilità con i browser

- - - -

{{Compat("api.HTMLUnknownElement")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/index.html b/files/it/web/api/index.html deleted file mode 100644 index e5b4b1b744..0000000000 --- a/files/it/web/api/index.html +++ /dev/null @@ -1,17 +0,0 @@ ---- -title: Riferimento Web API -slug: Web/API -tags: - - API - - Landing - - Riferimento - - Web -translation_of: Web/API ---- -

Le APIs sono dispositivi pronti per coloro che scrivono codice per il Web in JavaScript. Di seguito è riportato un elenco di tutte le interfacce (ovvero tipi di oggetti) che potresti essere in grado di utilizzare durante lo sviluppo della tua app o sito Web. API è l'acronimo di Application Programming Interface, nonché di Application Program Interface. Come parzialmente intuibile dai termini che compongono l'acronimo, le API rappresentano un'interfaccia di programmazione.

- -
-
{{APIListAlpha}}
-
- -

 

diff --git a/files/it/web/api/indexeddb_api/index.html b/files/it/web/api/indexeddb_api/index.html deleted file mode 100644 index 8512b030bd..0000000000 --- a/files/it/web/api/indexeddb_api/index.html +++ /dev/null @@ -1,243 +0,0 @@ ---- -title: IndexedDB -slug: Web/API/IndexedDB_API -translation_of: Web/API/IndexedDB_API ---- -
-

IndexedDB è una API per la memorizzazione client-side di una considerevole quantità di dati strutturati (inclusi file e blob) e per una ricerca performante su questi dati mediante gli indici. Se Web Storage è utile per memorizzare piccole quantità di dati, non lo è invece per memorizzare grandi quantità di dati strutturati. IndexedDB fornisce la soluzione. Questa è la pagina principale su IndexedDB di MDN — qui vengono forniti link a tutti i riferimenti API e guide all'uso, dettagli di supporto al browser ed alcune spiegazioni dei concetti chiave.

-
- -

Concetti chiave ed uso

- -

IndexedDB è un sistema di database transazionale, che inizialmente potrebbe creare confusione se si è abituati a lavorare solo con i database relazionali, ma presto diverrà abbastanza chiaro. IndexedDB permette di memorizzare e recuperare oggetti indicizzati con una chiave. E' necessario specificare lo schema del database, aprire una connessione al proprio database e poi recuperare ed aggiornare i dati attraverso una serie di transazioni.

- - - -
-

Nota: Come molte soluzioni web storage, IndexedDB segue una same-origin policy. Quindi mentre si può accedere ai dati memorizzati sotto un dominio, non è possibile accedere ai dati attraverso domini differenti.

-
- -

Sincrono e asincrono

- -

IndexedDB include sia una API asincrona che una API sincrona. La API asincrona può essere usata in molti casi, incluso WebWorkers, mentre la API sincrona è designata ad essere utilizzata solo con Web Workers e sarà usata molto raramente.

- -
-

Nota: Attualmente, nessuno dei principali browser supporta la API sincrona.

-
- -

Limiti di memorizzazione

- -

Non c'è alcun limite alla dimensione di un singolo elemento del database, tuttavia ci potrebbe essere un limite ad ogni dimensione complessiva del database IndexedDB. Questo limite (ed il modo con cui l'interfaccia utente lo supporterà) potrebbe variare da un browser ad un altro:

- - - -

Asynchronous API

- -

The asynchronous API methods return without blocking the calling thread. To get asynchronous access to a database, call open() on the indexedDB attribute of a window object. This method returns an {{domxref("IDBRequest")}} object; asynchronous operations communicate to the calling application by firing events on {{domxref("IDBRequest")}} objects.

- -

Connecting to a database

- -
-
{{domxref("IDBEnvironment")}}
-
Provides access to a client-side database. It is implemented by the {{ domxref("window") }} and {{ domxref("worker") }} objects.
-
{{domxref("IDBFactory")}}
-
Provides access to a database. This is the interface implemented by the global object indexedDB and is therefore the entry point for the API.
-
{{domxref("IDBOpenDBRequest")}}
-
Represents a request to open a database.
-
{{domxref("IDBDatabase")}}
-
Represents a connection to a database. It's the only way to get a transaction on the database.
-
- -

Accessing results of database requests

- -
-
{{domxref("IDBRequest")}}
-
Provides access to results of asynchronous requests to databases and database objects. It is what you get when you call an asynchronous method.
-
- -

Retrieving and modifying data

- -
-
{{domxref("IDBTransaction")}}
-
Represents a transaction. You create a transaction on a database, specify the scope (such as which object stores you want to access), and determine the kind of access (read only or write) that you want.
-
{{domxref("IDBObjectStore")}}
-
Represents an object store.
-
{{domxref("IDBIndex")}}
-
Provides access to the metadata of an index.
-
{{domxref("IDBCursor")}}
-
Iterates over object stores and indexes.
-
{{domxref("IDBCursorWithValue")}}
-
Iterates over object stores and indexes and returns the cursor's current value.
-
{{domxref("IDBKeyRange")}}
-
Defines a range of keys.
-
- -

Deprecated interfaces

- -

An early version of the specification also defined these now removed interfaces. They are still documented in case you need to update previously written code:

- -
-
{{domxref("IDBVersionChangeRequest")}}
-
Represents a request to change the version of a database. The way to change the version of the database has since changed (by calling {{domxref("IDBFactory.open")}} without also calling {{domxref("IDBDatabase.setVersion")}}), and the interface {{domxref("IDBOpenDBRequest")}} now has the functionality of the removed {{domxref("IDBVersionChangeRequest")}}.
-
{{domxref("IDBDatabaseException")}}  {{ obsolete_inline() }}
-
Represents exception conditions that can be encountered while performing database operations.
-
- -

Synchronous API

- -
-

Important: This is a reminder that the synchronous version of IndexedDB is not yet implemented in any browser.

-
- -

To get synchronous access to a database, call open() on the Unimplemented indexedDBSync attribute of a worker object. This returns an IDBDatabaseSync object, which enables you to create, open, and remove object stores and indexes, set the version of the database, and create transactions.

- - - -

Examples

- - - -

Browser compatibility

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Asynchronous API -

11.0 {{ property_prefix("webkit") }}
- 24

- 		{{ CompatGeckoDesktop("2.0") }} {{ property_prefix("moz") }}
- {{ CompatGeckoDesktop("16.0") }}		1017{{ CompatNo() }}
Synchronous API
- (used with WebWorkers)		{{ CompatNo() }}{{ CompatNo() }}
- See {{ bug(701634) }}		{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Asynchronous API4.4{{ CompatGeckoDesktop("6.0") }} {{ property_prefix("moz") }}
- {{ CompatGeckoDesktop("16.0") }}		1017{{ CompatNo() }}
-
- -
-

Note: Some browsers don't yet support IndexedDB but do support WebSQL, most notably Safari/Webkit on desktop and iOS. One way around this problem is to use an IndexedDB Polyfill or Shim that falls back to WebSQL or even localStorage for non-supporting browsers. The best available polyfill at present is localForage.

-
- -

Specifications

- - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('IndexedDB', '#idl-def-IDBEnvironment', 'IDBEnvironment')}}{{Spec2('IndexedDB')}} 
- - diff --git a/files/it/web/api/keyboardevent/charcode/index.html b/files/it/web/api/keyboardevent/charcode/index.html deleted file mode 100644 index 4dbc90bf17..0000000000 --- a/files/it/web/api/keyboardevent/charcode/index.html +++ /dev/null @@ -1,50 +0,0 @@ ---- -title: event.charCode -slug: Web/API/KeyboardEvent/charCode -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/KeyboardEvent/charCode -original_slug: Web/API/Event/charCode ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce il valore Unicode del tasto carattere che è stato premuto e ha scatenato un evento keypress.

-

Sintassi

-
valore = event.charCode
-
- -

Esempio

-
<html>
-<head>
-<title>esempio di charCode</title>
-
-<script type="text/javascript">
-
-function mostraCarattere(e)
-{
-alert("Tasto premuto: " + String.fromCharCode(e.charCode) + "\n"
-      + "Codice carattere: " + e.charCode);
-}
-
-</script>
-</head>
-
-<body onkeypress="mostraCarattere(event);">
-<p>Premere un qualsiasi tasto carattere.</p>
-</body>
-</html>
-
-

Note

-

In un evento keypress, il valore Unicode del tasto premuto viene registrato nella proprietà keyCode oppure nella proprietà charCode, mai in entrambe. Se il tasto premuto corrisponde a un carattere (per esempio 'a'), charCode assume il valore Unicode di quel carattere (che è diverso per le maiuscole e per le minuscole). In caso contrario, il codice del tasto premuto viene registrato nella proprietà keyCode.

-

charCode non viene mai impostato durante gli eventi keydown e keyup. In questi casi, viene impostato keyCode.

-

Per leggere il codice del tasto indipendentemente dal fatto che esso si trovi in keyCode o in charCode, si può utilizzare la proprietà which.

-

I caratteri inseriti attraverso un IME non vengono registrati nè in keyCode nè in charCode.

-

Per una lista dei possibili valori di charCode e per conoscere i tasti ai quali sono associati, vedere l'esempio Reference del DOM di Gecko:Esempi #Example 7: Mostrare le costanti dell'oggetto Event.

-

Specifiche

-

Non è parte di alcuna specifica. Si veda nsIDOMKeyEvent

-

{{ languages( { "en": "en/DOM/event.charCode", "pl": "pl/DOM/event.charCode" } ) }}

diff --git a/files/it/web/api/keyboardevent/keycode/index.html b/files/it/web/api/keyboardevent/keycode/index.html deleted file mode 100644 index 8c212fac97..0000000000 --- a/files/it/web/api/keyboardevent/keycode/index.html +++ /dev/null @@ -1,50 +0,0 @@ ---- -title: event.keyCode -slug: Web/API/KeyboardEvent/keyCode -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/KeyboardEvent/keyCode -translation_of_original: Web/API/event.keyCode -original_slug: Web/API/Event/keyCode ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce il valore Unicode di un tasto non-carattere che è stato premuto scatenando un evento keypress, oppure il valore di qualsiasi tasto premuto scatenando un qualsiasi altro evento relativo alla tastiera.

-

Sintassi

-
valore = event.keyCode
-
- -

Esempio

-
<html>
-<head>
-<title>esempio di keyCode</title>
-
-<script type="text/javascript">
-
-function mostraCodiceTasto(e)
-{
-alert("Codice del tasto premuto: " + e.keyCode + "\n");
-}
-
-</script>
-</head>
-
-<body onkeydown="mostraCodiceTasto(event);">
-<p>Premere un tasto qualsiasi.</p>
-</body>
-</html>
-
-

Note

-

In un evento keypress, il valore Unicode del tasto premuto viene registrato nella proprietà keyCode oppure nella proprietà charCode, mai in entrambe. Se il tasto premuto corrisponde a un carattere (per esempio 'a'), charCode assume il valore Unicode di quel carattere (che è diverso per le maiuscole e per le minuscole). In caso contrario, il codice del tasto premuto viene registrato nella proprietà keyCode.

-

charCode non viene mai impostato durante gli eventi keydown e keyup. In questi casi, viene impostato keyCode.

-

Per leggere il codice del tasto indipendentemente dal fatto che esso si trovi in keyCode o in charCode, si può utilizzare la proprietà which.

-

I caratteri inseriti attraverso un IME non vengono registrati nè in keyCode nè in charCode.

-

Per una lista dei possibili valori di charCode e per conoscere i tasti ai quali sono associati, vedere l'esempio Reference del DOM di Gecko:Esempi #Example 7: Mostrare le costanti dell'oggetto Event.

-

Specifiche

-

Non è parte di alcuna specifica. Si veda nsIDOMKeyEvent

-

{{ languages( { "en": "en/DOM/event.keyCode", "pl": "pl/DOM/event.keyCode" } ) }}

diff --git a/files/it/web/api/keyboardevent/which/index.html b/files/it/web/api/keyboardevent/which/index.html deleted file mode 100644 index 4d5d567468..0000000000 --- a/files/it/web/api/keyboardevent/which/index.html +++ /dev/null @@ -1,61 +0,0 @@ ---- -title: event.which -slug: Web/API/KeyboardEvent/which -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/KeyboardEvent/which -original_slug: Web/API/Event/which ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce il valore di keyCode se il tasto premuto non è un tasto carattere, altrimenti restituisce il valore di charCode se è stato premuto un tasto alfanumerico.

-

Sintassi

-
int = event.which
-
-

int è il codice numerico del tasto che è stato premuto, sia esso alfanumerico oppure no. Si vedano charCode e keyCode per ulteriori informazioni.

-

Esempio

-
<html>
-<head>
-<title>esempio con charCode/keyCode/which</title>
-
-<script type="text/javascript">
-
-function mostraTastoPremuto(evt)
-{
-alert("Evento onkeypress: \n"
-      + "proprietà keyCode: " + evt.keyCode + "\n"
-      + "proprietà which: " + evt.which + "\n"
-      + "proprietà charCode: " + evt.charCode + "\n"
-      + "Tasto premuto (se alfanumerico): "
-      + String.fromCharCode(evt.charCode) + "\n"
-     );
-}
-
-
-function pressioneTasto(evt)
-{
-alert("onkeydown handler: \n"
-      + "proprietà keyCode: " + evt.keyCode + "\n"
-      + "proprietà which: " + evt.which + "\n"
-     );
-}
-
-
-</script>
-</head>
-
-<body
- onkeypress="mostraTastoPremuto(event);"
- onkeydown="pressioneTasto(event);"
->
-
-<p>Premere un tasto</p>
-
-</body>
-</html>
-
-

Specifiche

-

Non è parte di alcuna specifica.

diff --git a/files/it/web/api/mouseevent/altkey/index.html b/files/it/web/api/mouseevent/altkey/index.html deleted file mode 100644 index b282dcb2ee..0000000000 --- a/files/it/web/api/mouseevent/altkey/index.html +++ /dev/null @@ -1,48 +0,0 @@ ---- -title: event.altKey -slug: Web/API/MouseEvent/altKey -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/MouseEvent/altKey -translation_of_original: Web/API/event.altKey -original_slug: Web/API/Event/altKey ---- -

{{ ApiRef() }}

-

Sommario

-

Indica se il tasto ALT era premuto mentre l'evento si verificava.

-

Syntax

-
bool = event.altKey
-
-

bool vale true se il tasto ALT era premuto, altrimenti false.

-

Esempio

-
<html>
-<head>
-<title>esempio tasto ALT</title>
-
-<script type="text/javascript">
-
-function mostraCarattere(e){
-  alert(
-    "Tasto premuto: " + String.fromCharCode(e.charCode) + "\n"
-    + "Codice carattere: " + e.charCode + "\n"
-    + "Tasto ALT premuto: " + e.altKey + "\n"
-  );
-}
-
-</script>
-</head>
-
-<body onkeypress="mostraCarattere(event);">
-<p>
-Prova a premere un tasto tenendo premuto ALT e prova a premere un tasto senza premere ALT.<br />
-Puoi anche provare a premere ALT+SHIFT.
-</p>
-</body>
-</html>
-
-

Specifiche

-

altKey

-

{{ languages( { "en": "en/DOM/event.altKey", "pl": "pl/DOM/event.altKey" } ) }}

diff --git a/files/it/web/api/mouseevent/button/index.html b/files/it/web/api/mouseevent/button/index.html deleted file mode 100644 index ff3d67d702..0000000000 --- a/files/it/web/api/mouseevent/button/index.html +++ /dev/null @@ -1,59 +0,0 @@ ---- -title: event.button -slug: Web/API/MouseEvent/button -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/MouseEvent/button -translation_of_original: Web/API/event.button -original_slug: Web/API/Event/button ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce un intero che indica quale tasto del mouse è stato premuto.

-

Sintassi

-
var codiceBottone = event.button;
-
-

codiceBottone può assumere uno dei seguenti valori:

- -

L'ordine dei bottoni è inverso se il mouse è configurato per l'utilizzo da parte dei mancini.

-

Esempio

-
<script type="text/javascript">
-
-function qualeTasto(e)
-{
-  var e = e || window.event;
-  var codiceTasto;
-
-  if ('object' == typeof e){
-    codiceTasto = e.button;
-
-    switch (codiceTasto){
-      case 0  : alert('Hai premuto il tasto sinistro');
-                break;
-      case 1  : alert('Hai premuto il tasto centrale');
-                break;
-      case 2  : alert('Hai premuto il tasto destro');
-                break;
-      default : alert('Codice sconosciuto: ' + btnCode);
-    }
-  }
-}
-
-</script>
-
-<p onclick="qualeBottone(event);">Clicca con il mouse...</p>
-
-
-

Note

-

Poichè i click del mouse spesso vengono intercettati dall'interfaccia utente, in alcuni casi potrebbe essere difficile rilevare la pressione di un bottone che non sia quello standard (generalmente il sinistro).

-

Gli utenti possono cambiare la configurazione dei tasti del loro dispositivo di puntamento in modo tale che se il valore di codiceBottone è 0, questo non è causato dal tasto che si trova fisicamente a sinistra, ma questo non ha molta importanza.

-

Specifiche

-

DOM 2 Events Specification: button

-

{{ languages( { "en": "en/DOM/event.button", "pl": "pl/DOM/event.button" } ) }}

diff --git a/files/it/web/api/mouseevent/ctrlkey/index.html b/files/it/web/api/mouseevent/ctrlkey/index.html deleted file mode 100644 index c4ce9255e8..0000000000 --- a/files/it/web/api/mouseevent/ctrlkey/index.html +++ /dev/null @@ -1,46 +0,0 @@ ---- -title: event.ctrlKey -slug: Web/API/MouseEvent/ctrlKey -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/MouseEvent/ctrlKey -translation_of_original: Web/API/event.ctrlKey -original_slug: Web/API/Event/ctrlKey ---- -

{{ ApiRef() }}

-

Sommario

-

Indica se il tasto CTRL è stato premuto mentre l'evento si verificava.

-

Sintassi

-
bool = event.ctrlKey
-
-

bool vale true se il tasto CTRL era premuto, altrimenti false.

-

Esempio

-
<html>
-<head>
-<title>esempio tasto control</title>
-
-<script type="text/javascript">
-
-function mostraCarattere(e){
-  alert(
-    "Tasto premuto: " + String.fromCharCode(e.charCode) + "\n"
-    + "Codice carattere: " + e.charCode + "\n"
-    + "Tasto CTRL premuto: " + e.ctrlKey + "\n"
-  );
-}
-
-</script>
-</head>
-
-<body onkeypress="mostraCarattere(event);">
-<p>Prova a premere un tasto tenendo premuto CTRL e prova a premere un tasto senza premere CTRL.<br />
-Puoi anche provare a premere CTRL+SHIFT.</p>
-</body>
-</html>
-
-

Specifiche

-

ctrlKey

-

{{ languages( { "en": "en/DOM/event.ctrlKey", "pl": "pl/DOM/event.ctrlKey" } ) }}

diff --git a/files/it/web/api/mouseevent/metakey/index.html b/files/it/web/api/mouseevent/metakey/index.html deleted file mode 100644 index b97904a5d4..0000000000 --- a/files/it/web/api/mouseevent/metakey/index.html +++ /dev/null @@ -1,32 +0,0 @@ ---- -title: event.metaKey -slug: Web/API/MouseEvent/metaKey -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/MouseEvent/metaKey -translation_of_original: Web/API/event.metaKey -original_slug: Web/API/Event/metaKey ---- -

{{ ApiRef() }}

-

Sommario

-

Indica se il tasto META era premuto mentre l'evento si verificava. Questo tasto è il tasto Apple sui computer Mac, il tasto Windows sui pc con tastiere per Windows sui quali gira questo sistema operativo e potrebbe corrispondere ad altri tasti su altre piattaforme. Non esiste però un unico tasto standard sulla cui presenza si possa fare affidamento per qualsiasi tipo di piattaforma.

-

Sintassi

-
bool = event.metaKey
-
-

bool vale true se il tasto META era premuto, altrimenti false.

-

Esempio

-
 function leggiInput(e) {
- // controlla il tasto meta
-   if e.metaKey
-        // se era premuto si comporta di conseguenza
-     outputBellissimo(e);
-   else
-     outputMediocre(e)
- }
-
-

Specifiche

-

metaKey

-

{{ languages( { "en": "en/DOM/event.metaKey", "pl": "pl/DOM/event.metaKey" } ) }}

diff --git a/files/it/web/api/mouseevent/shiftkey/index.html b/files/it/web/api/mouseevent/shiftkey/index.html deleted file mode 100644 index 3365619bf1..0000000000 --- a/files/it/web/api/mouseevent/shiftkey/index.html +++ /dev/null @@ -1,47 +0,0 @@ ---- -title: event.shiftKey -slug: Web/API/MouseEvent/shiftKey -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/MouseEvent/shiftKey -translation_of_original: Web/API/event.shiftKey -original_slug: Web/API/Event/shiftKey ---- -

{{ ApiRef() }}

-

Sommario

-

Indica se il tasto SHIFT è stato premuto durante l'evento.

-

Sintassi

-
bool = event.shiftKey
-
-

bool restituisce true se il tasto SHIFT era premuto mentre l'evento si verificava, altrimenti false.

-

Esempio

-
<html>
-<head>
-<title>esempio tasto shift</title>
-
-<script type="text/javascript">
-
-function mostraCarattere(e){
-  alert(
-    "Tasto premuto: " + String.fromCharCode(e.charCode) + "\n"
-    + "Codice carattere: " + e.charCode + "\n"
-    + "Tasto SHIFT premuto: " + e.shiftKey + "\n"
-    + "Tasto ALT premuto: " + e.altKey + "\n"
-  );
-}
-
-</script>
-</head>
-
-<body onkeypress="mostraCarattere(event);">
-<p>Prova a premere un tasto tenendo premuto SHIFT e prova a premere un tasto senza premere SHIFT.<br />
-Puoi anche provare a premere SHIFT+ALT.</p>
-</body>
-</html>
-
-

Specifiche

-

shiftKey

-

{{ languages( { "en": "en/DOM/event.shiftKey", "pl": "pl/DOM/event.shiftKey" } ) }}

diff --git a/files/it/web/api/mutationobserver/index.html b/files/it/web/api/mutationobserver/index.html deleted file mode 100644 index 6c15916a56..0000000000 --- a/files/it/web/api/mutationobserver/index.html +++ /dev/null @@ -1,102 +0,0 @@ ---- -title: MutationObserver -slug: Web/API/MutationObserver -tags: - - Cambiamenti del DOM - - DOM - - DOM Reference - - Mutation Observer - - Mutation Observer e resize - - resize - - resize listener -translation_of: Web/API/MutationObserver ---- -
{{APIRef("DOM WHATWG")}}
- -

L'interfaccia {{domxref("MutationObserver")}} offre la possibilità di monitorare le mutazioni subite dall'alberatura del DOM. È stata progettata per sostituire i Mutation Events che fanno parte del DOM3 Events specification.

- -

Costruttore

- -
-
{{domxref("MutationObserver.MutationObserver", "MutationObserver()")}}
-
Crea e restituisce un nuovo MutationObserver che invocherà una funzione di callback specificata alla mutazione del DOM.
-
- -

Metodi

- -
-
{{domxref("MutationObserver.disconnect", "disconnect()")}}
-
Interrompe la ricezione da parte dell'istanza MutationObserver di notifiche sulla mutazione del DOM fino a quando verrà nuovamente invocato {{domxref("MutationObserver.observe", "observe()")}}
-
{{domxref("MutationObserver.observe", "observe()")}}
-
Configura il MutationObserver affinché possa ricevere notifiche attraverso la funzione di callback specificata quando avviene una mutazione del DOM che corrisponda alle opzioni impostate.
-
{{domxref("MutationObserver.takeRecords", "takeRecords()")}}
-
Rimuove tutte le notifiche in coda sul MutationObserver e le restituisce come nuovo  {{jsxref("Array")}} di oggetti {{domxref("MutationRecord")}}
-
- -

Mutation Observer & customizzazione del resize event & demo

- -

https://codepen.io/webgeeker/full/YjrZgg/

- -

Esempio

- -

L'esempio seguente è un adattamento di questo post

- -
// Seleziona il nodo di cui monitare la mutazione
-var targetNode = document.getElementById('some-id');
-
-// Opzioni per il monitoraggio (quali mutazioni monitorare)
-var config = { attributes: true, childList: true, subtree: true };
-
-// Funzione di callback da eseguire quando avvengono le mutazioni
-var callback = function(mutationsList, observer) {
-    for(var mutation of mutationsList) {
-        if (mutation.type == 'childList') {
-            console.log('A child node has been added or removed.');
-        }
-        else if (mutation.type == 'attributes') {
-            console.log('The ' + mutation.attributeName + ' attribute was modified.');
-        }
-    }
-};
-
-// Creazione di un'istanza di monitoraggio collegata alla funzione di callback
-var observer = new MutationObserver(callback);
-
-// Inizio del monitoraggio del nodo target riguardo le mutazioni configurate
-observer.observe(targetNode, config);
-
-// Successivamente si può interrompere il monitoraggio
-observer.disconnect();
- -

Leggi pure

- - - -

Specifiche

- - - - - - - - - - - - - - - - -
SpecificaStatoCommenti
{{SpecName('DOM WHATWG', '#mutationobserver', 'MutationObserver')}}{{ Spec2('DOM WHATWG') }} 
- -

Compatibilità dei Browser

- - - -

{{Compat("api.MutationObserver")}}

diff --git a/files/it/web/api/navigator/cookieenabled/index.html b/files/it/web/api/navigator/cookieenabled/index.html deleted file mode 100644 index 4905b8deb8..0000000000 --- a/files/it/web/api/navigator/cookieenabled/index.html +++ /dev/null @@ -1,83 +0,0 @@ ---- -title: Navigator.cookieEnabled -slug: Web/API/Navigator/cookieEnabled -translation_of: Web/API/Navigator/cookieEnabled ---- -

{{ ApiRef("HTML DOM") }}

- -

Riassunto

- -

Restituisce un valore booleano che indica se i cookie abilitati o meno (sola lettura).

- -

Sintassi

- -
var cookieEnabled = navigator.cookieEnabled;
-
- - - -

Example

- -
if (!navigator.cookieEnabled) {
-  // dire all'utente che l'attivazione dei cookie rende le pagine web più utile}
-
- -

Browser compatibility

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic supportYes{{ CompatGeckoDesktop(1.0) }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{ CompatUnknown() }}{{ CompatGeckoMobile(1.0) }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
-
- -

Note di Gecko

- -

Prima di Gecko 8.0 {{ geckoRelease("8.0") }}, window.navigator.cookieEnabled potrebbe segnalare il risultato errato se un'eccezione del sito è stata in vigore per la pagina in cui è stato eseguito il controllo. Questo è stato risolto.

- -

Specifications

- -

HTML WHATWG

diff --git a/files/it/web/api/navigator/credentials/index.html b/files/it/web/api/navigator/credentials/index.html deleted file mode 100644 index 107fe4a123..0000000000 --- a/files/it/web/api/navigator/credentials/index.html +++ /dev/null @@ -1,57 +0,0 @@ ---- -title: credentials -slug: Web/API/Navigator/credentials -tags: - - API - - CredentialContainer - - Proprietà - - Riferimento - - credentials -translation_of: Web/API/Navigator/credentials ---- -

{{SeeCompatTable}}{{APIRef("")}}

- -

La proprietà credentials dell'interfaccia {{domxref("Navigator")}} restituisce un interfaccia {{domxref("CredentialsContainer")}}, la quale espone metodi utili per fare request-credentials. L'interfaccia {{domxref("CredentialsContainer")}} inoltre notifica louser agent quando un avviene un evento di interesse, come, ad esempio, un sign-in o un sign-out avvenuto con successo. Questa interfaccia può essere utilizzata per scoprire la presenza della funzionalità.

- -

Sintassi

- -
var credentialsContainer = navigator.credentials
- -

Value

- -

Un'interfaccia {{domxref("CredentialsContainer")}}.

- -

Esempio

- -
if ('credentials' in navigator) {
-  navigator.credentials.get({password: true})
-  .then(function(creds) {
-    // Usa le credenziali.
-  });
-} else {
-  // Gestisci il sign-in alternativo, senza credentials.
-};
-
- -

Specifica

- - - - - - - - - - - - - - -
SpecificaStatoCommenti
{{SpecName('Credential Management')}}{{Spec2('Credential Management')}}Definizione iniziale.
- -

Browser compatibili

- - - -

{{Compat("api.Navigator.credentials")}}

diff --git a/files/it/web/api/navigator/index.html b/files/it/web/api/navigator/index.html deleted file mode 100644 index 6ef2055b7a..0000000000 --- a/files/it/web/api/navigator/index.html +++ /dev/null @@ -1,119 +0,0 @@ ---- -title: Navigator -slug: Web/API/Navigator -translation_of: Web/API/Navigator ---- -

{{ apiref() }}

- -

The Navigator interface represents the state and the identity of the user agent. It allows scripts to query it and to register themselves to carry on some activities.

- -

A Navigator object can be retrieved using the read-only {{domxref("Window.navigator")}} property.

- -

Properties

- -

Doesn't inherit any property, but implements those defined in {{domxref("NavigatorID")}}, {{domxref("NavigatorLanguage")}}, {{domxref("NavigatorOnLine")}}, {{domxref("NavigatorGeolocation")}}, {{domxref("NavigatorPlugins")}}, {{domxref("NavigatorUserMedia")}}, and {{domxref("NetworkInformation")}}.

- -

Standard

- -
-
{{domxref("NavigatorID.appCodeName")}} {{readonlyInline}}{{experimental_inline}}
-
Returns the internal "code" name of the current browser. Do not rely on this property to return the correct value.
-
{{domxref("NavigatorID.appName")}} {{readonlyInline}}{{experimental_inline}}
-
Returns a {{domxref("DOMString")}} with the official name of the browser. Do not rely on this property to return the correct value.
-
{{domxref("NavigatorID.appVersion")}} {{readonlyInline}}{{experimental_inline}}
-
Returns the version of the browser as a {{domxref("DOMString")}}. Do not rely on this property to return the correct value.
-
{{domxref("Navigator.battery")}} {{readonlyInline}}
-
Returns a {{domxref("BatteryManager")}} object you can use to get information about the battery charging status.
-
{{domxref("NetworkInformation.connection")}} {{readonlyInline}}{{experimental_inline}}
-
Provides a {{domxref("Connection")}} with information about the network connection of a device.
-
{{domxref("NavigatorGeolocation.geolocation")}} {{readonlyInline}}
-
Returns a {{domxref("Geolocation")}} object allowing accessing the location of the device.
-
{{domxref("NavigatorPlugins.javaEnabled")}} {{readonlyInline}}{{experimental_inline}}
-
Returns a {{domxref("Boolean")}} flag indicating whether the host browser is Java-enabled or not.
-
{{domxref("NavigatorLanguage.language")}} {{readonlyInline}}
-
Returns a {{domxref("DOMString")}} representing the preferred language of the user, usually the language of the browser UI. The null value is returned when this is unknown.
-
{{domxref("NavigatorLanguage.languages")}} {{readonlyInline}}
-
Returns an array of {{domxref("DOMString")}} representing the languages known to the user, by order of preference.
-
{{domxref("NavigatorPlugins.mimeTypes")}} {{readonlyInline}}{{experimental_inline}}
-
Returns an {{domxref("MimeTypeArray")}} listing the MIME types supported by the browser.
-
{{domxref("NavigatorOnLine.onLine")}} {{readonlyInline}}
-
Returns a {{domxref("Boolean")}} indicating whether the browser is working online.
-
{{domxref("Navigator.oscpu")}}
-
Returns a string that represents the current operating system.
-
{{domxref("NavigatorID.platform")}} {{readonlyInline}}{{experimental_inline}}
-
Returns a string representing the platform of the browser. Do not rely on this function to return a significant value.
-
{{domxref("NavigatorPlugins.plugins")}} {{readonlyInline}}{{experimental_inline}}
-
Returns a {{domxref("PluginArray")}} listing the plugins installed in the browser.
-
{{domxref("NavigatorID.product")}} {{readonlyInline}} {{experimental_inline}}
-
Always returns 'Gecko', on any browser. This property is kept only for compatibility purpose.
-
{{domxref("NavigatorID.userAgent")}} {{readonlyInline}}
-
Returns the user agent string for the current browser.
-
{{domxref("Navigator.serviceWorker")}} {{readonlyInline}}
-
Returns a {{domxref("ServiceWorkerContainer")}} object, which provides access to registration, removal, upgrade, and communication with the {{domxref("ServiceWorker")}} objects for the associated document.
-
- -

Non-standard

- -
-
{{domxref("window.navigator.buildID", "navigator.buildID")}} {{non-standard_inline}}
-
Returns the build identifier of the browser (e.g., "2006090803").
-
{{domxref("Navigator.cookieEnabled")}} {{non-standard_inline}}
-
Returns a boolean indicating whether cookies are enabled in the browser or not.
-
{{domxref("navigator.doNotTrack")}} {{non-standard_inline}}
-
Reports the value of the user's do-not-track preference. When this value is "yes", your web site or application should not track the user.
-
{{domxref("navigator.id")}} {{non-standard_inline}}
-
Returns the {{domxref("window.navigator.id", "id")}} object which you can use to add support for BrowserID to your web site.
-
{{domxref("window.navigator.mozApps", "navigator.mozApps")}} {{non-standard_inline}}
-
Returns an {{domxref("window.navigator.mozApps", "Apps")}} object you can use to install, manage, and control Open Web apps.
-
{{domxref("Navigator.mozAudioChannelManager", "navigator.mozAudioChannelManager")}} {{non-standard_inline}}
-
The navigator.mozAudioChannelManager object provides access to the {{domxref("mozAudioChannelManager")}} interface, which is used to manage your Firefox OS device's audio channels, including setting what channel's volume to affect when the volume buttons are pressed inside a particular app.
-
{{domxref("window.navigator.mozNotification","navigator.mozNotification")}} {{deprecated_inline("22")}} {{non-standard_inline}}
- {{domxref("window.navigator.webkitNotification","navigator.webkitNotification")}}
-
Returns a {{domxref("navigator.mozNotification", "notification")}} object you can use to deliver notifications to the user from your web application.
-
{{domxref("navigator.mozSocial")}} {{non-standard_inline}}
-
The Object, returned by the navigator.mozSocial property, is available within the social media provider's panel to provide functionality it may need.
-
{{domxref("window.navigator.productSub", "navigator.productSub")}} {{non-standard_inline}}
-
Returns the build number of the current browser (e.g., "20060909").
-
{{domxref("window.navigator.securitypolicy", "navigator.securitypolicy")}} {{non-standard_inline}}
-
Returns an empty string. In Netscape 4.7x, returns "US & CA domestic policy" or "Export policy".
-
{{domxref("window.navigator.standalone", "navigator.standalone")}} {{non-standard_inline}}
-
Returns a boolean indicating whether the browser is running in standalone mode. Available on Apple's iOS Safari only.
-
{{domxref("window.navigator.vendor", "navigator.vendor")}} {{non-standard_inline}}
-
Returns the vendor name of the current browser (e.g., "Netscape6").
-
{{domxref("window.navigator.vendorSub", "navigator.vendorSub")}} {{non-standard_inline}}
-
Returns the vendor version number (e.g. "6.1").
-
navigator.webkitPointer {{non-standard_inline}}
-
Returns a PointerLock object for the Mouse Lock API.
-
- -

Methods

- -

Doesn't inherit any method, but implements those defined in {{domxref("NavigatorID")}}, {{domxref("NavigatorContentUtils")}}, {{domxref("NavigatorUserMedia")}}, and {{domxref("NavigatorStorageUtils")}}.

- -

Standard

- -
-
{{domxref("NavigatorUserMedia.getUserMedia()")}}
-
After having prompted the user for permission, returns the audio or video stream associated to a camera or microphone on the local computer.
-
{{domxref("window.navigator.registerContentHandler", "navigator.registerContentHandler")}}
-
Allows web sites to register themselves as a possible handler for a given MIME type.
-
{{domxref("navigator.registerProtocolHandler", "navigator.registerProtocolHandler")}}
-
Allows web sites to register themselves as a possible handler for a given protocol.
-
{{domxref("NavigatorID.taintEnabled()")}} {{deprecated_inline("1.7.8")}} {{obsolete_inline("9.0")}} {{experimental_inline}}
-
Returns false. JavaScript taint/untaint functions removed in JavaScript 1.2.
-
{{domxref("Navigator.vibrate()")}} {{gecko_minversion_inline("11.0")}}
-
Causes vibration on devices with support for it. Does nothing if vibration support isn't available.
-
- -

Non standard

- -
-
{{domxref("window.navigator.mozIsLocallyAvailable", "navigator.mozIsLocallyAvailable")}} {{non-standard_inline}}
-
Lets code check to see if the document at a given URI is available without using the network.
-
{{domxref("window.navigator.mozPay", "navigator.mozPay")}} {{non-standard_inline}}
-
Allows in-app payment.
-
{{domxref("window.navigator.preference", "navigator.preference")}} {{obsolete_inline("2.0")}} {{non-standard_inline}}
-
Sets a user preference. This method is only available to privileged code and is obsolete; you should use the XPCOM Preferences API instead.
-
{{domxref("window.navigator.requestWakeLock", "navigator.requestWakeLock")}} {{non-standard_inline}}
-
Request a wake lock for a resource. A wake lock prevents a specific part of a device from being turned off automatically.
-
diff --git a/files/it/web/api/navigatorconcurrenthardware/index.html b/files/it/web/api/navigatorconcurrenthardware/index.html deleted file mode 100644 index 10fb1576ca..0000000000 --- a/files/it/web/api/navigatorconcurrenthardware/index.html +++ /dev/null @@ -1,56 +0,0 @@ ---- -title: NavigatorConcurrentHardware -slug: Web/API/NavigatorConcurrentHardware -translation_of: Web/API/NavigatorConcurrentHardware ---- -

 

- -

Il NavigatorConcurrentHardware aggiunge all'interfaccia delle caratteristiche che permettono ai contenuti Web di determinare quanti processori logici sono a disposizione dell'utente, in modo tale da ottimizzare le operazioni di contenuti e Web apps che possano usufruire al meglio la CPU dell'utente.

- -

Il numero dei processori logici del core serve a misurare il numero di threads che possono essere di fatto eseguiti per volta, senza che questi condividano la stesse CPU. Oggigiorno i computer hanno diversi core nella loro CPU(2 o 4 cores). Ogni core è in grado di eseguire più di un thread per volta, avvalendosi di tecniche avanzate di scheduling. Una CPU a 4 cores può restituire dunque 8 threads. Tuttavia, il browser può scegliere di ridurre questo numero in modo tale da rappresentare in maniera più accurata il numero di Worker eseguiti per volta.

- -

Proprietà

- -
-
NavigatorConcurrentHardware.hardwareConcurrency 
-
Restituisce il numero di processori logici disponibili allo user agent. Il valore sarà sempre almeno pari a 1 e restituirà 1 se non è possibile determinare il numero di processori logici. 
-
- -

Metodi

- -

Il mixin di NavigatorConcurrentHardware non ha metodi.

- -

Specifiche

- - - - - - - - - - - - - - - - -
SpecificaStatoCommento
HTML Living Standard
- The definition of 'NavigatorConcurrentHardware' in that specification.		Living Standard -

Definizione Iniziale

-
- -

Browser compatibility

- - - -

{{Compat("api.NavigatorConcurrentHardware")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/node/appendchild/index.html b/files/it/web/api/node/appendchild/index.html deleted file mode 100644 index acef4909a3..0000000000 --- a/files/it/web/api/node/appendchild/index.html +++ /dev/null @@ -1,99 +0,0 @@ ---- -title: Node.appendChild() -slug: Web/API/Node/appendChild -tags: - - API - - DOM - - Node - - Referenza - - metodo -translation_of: Web/API/Node/appendChild ---- -
{{APIRef("DOM")}}
- -

Il metodo Node.appendChild() aggiunge un nodo alla fine dell'elenco di figli di un nodo genitore specificato. Se il figlio dato è un riferimento a un nodo esistente nel documento, appendChild() lo sposta dalla sua posizione corrente alla nuova posizione (non è necessario rimuovere il nodo dal suo nodo padre prima di aggiungerlo ad un altro nodo).

- -

Ciò significa che un nodo non può essere in due punti del documento contemporaneamente. Quindi se il nodo ha già un genitore, il nodo viene prima rimosso, quindi aggiunto alla nuova posizione. Il metodo {{domxref("Node.cloneNode()")}} può essere usato per fare una copia del nodo prima di aggiungerlo sotto il nuovo genitore. Si noti che le copie eseguite con cloneNode non verranno automaticamente mantenute sincronizzate.

- -

Se il figlio dato è un {{domxref("DocumentFragment")}}, l'intero contenuto di {{domxref("DocumentFragment")}} viene spostato nell'elenco secondario del nodo genitore specificato.

- -

Sintassi

- -
element.appendChild(aChild);
- -

Parametri

- -
-
aChild
-
Il nodo da aggiungere al nodo genitore dato (comunemente un elemento).
-
- -

Valore di ritorno

- -

Il valore restituito è il figlio aggiunto tranne quando il figlio dato è un {{domxref("DocumentFragment")}}, nel qual caso viene restituito il {{domxref("DocumentFragment")}}.

- -

Appunti

- -

Il concatenamento potrebbe non funzionare come previsto a causa di appendChild() che restituisce l'elemento figlio:

- -
var aBlock = doc.createElement('block').appendChild(doc.createElement('b'));
- -

Sets aBlock to <b></b> only, which is probably not what you want.

- -

Esempio

- -
// Crea un nuovo elemento di paragrafo e aggiungilo alla fine del corpo del documento
-var p = document.createElement("p");
-document.body.appendChild(p);
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', '#dom-node-appendchild', 'Node.appendChild()')}}{{Spec2('DOM WHATWG')}}Nessun cambiamento da {{SpecName("DOM3 Core")}}.
{{SpecName('DOM3 Core', 'core.html#ID-184E7107', 'Node.appendChild()')}}{{Spec2('DOM3 Core')}}Nessun cambiamento da {{SpecName("DOM2 Core")}}.
{{SpecName('DOM2 Core', 'core.html#ID-184E7107', 'Node.appendChild()')}}{{Spec2('DOM2 Core')}}Nessun cambiamento da {{SpecName("DOM1")}}.
{{SpecName('DOM1', 'level-one-core.html#ID-184E7107', 'Node.appendChild()')}}{{Spec2('DOM1')}}Definizione inziale.
- -

Compatibilità con i browser

- -
- - -

{{Compat("api.Node.appendChild")}}

-
- -

Vedi anche

- - diff --git a/files/it/web/api/node/childnodes/index.html b/files/it/web/api/node/childnodes/index.html deleted file mode 100644 index 1db83ea87c..0000000000 --- a/files/it/web/api/node/childnodes/index.html +++ /dev/null @@ -1,100 +0,0 @@ ---- -title: Node.childNodes -slug: Web/API/Node/childNodes -translation_of: Web/API/Node/childNodes -original_slug: Web/API/Element/childNodes ---- -
-
{{APIRef("DOM")}}
-
- -

La proprietà di sola lettura Node.childNodes restituisce una {{domxref("NodeList")}} dinamica di {{domxref("Node","nodi")}} figli dell'elemento dato in cui il primo nodo figlio viene assegnato all'indice 0.

- -

Sintassi

- -
var nodeList = elementNodeReference.childNodes;
-
- -

Esempi

- -

Utilizzo semplice

- -
// parg è un riferimento a un elemento <p>
-
-// Innanzitutto controlliamo che l'elemento abbia dei nodi figli
-if (parg.hasChildNodes()) {
-  var children = parg.childNodes;
-
-  for (var i = 0; i < children.length; i++) {
-    // fare qualcosa con ogni bambino da children[i]
-    // NOTA: l'elenco è dinamico, l'aggiunta o la rimozione di bambini modificherà l'elenco
-  }
-}
- -

Rimuovi tutti i bambini da un nodo

- -
// Questo è un modo per rimuovere tutti i bambini da una
-// finestra di nodo è un riferimento ad un oggetto
-
-while (box.firstChild) {
-    //L'elenco è DINAMICO, quindi indicizzerà nuovamente ogni chiamata
-    box.removeChild(box.firstChild);
-}
- -

Appunti

- -

Gli elementi nella raccolta di nodi sono oggetti e non stringhe. Per ottenere dati da oggetti nodo, usa le loro proprietà (ad esempio elementNodeReference.childNodes[1].nodeName per ottenere il nome, ecc.).

- -

L'oggetto document ha 2 figli: la dichiarazione Doctype e l'elemento root, in genere documentElement. (Nei documenti (X)HTML questo è l'elemento HTML.)

- -

childNodes include tutti i nodi figli, inclusi nodi non-elemento come nodi di testo e commenti. Per ottenere una raccolta di soli elementi, usa {{domxref("ParentNode.children")}}.

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', '#dom-node-childnodes', 'Node.childNodes')}}{{Spec2('DOM WHATWG')}}Nessun cambiamento
{{SpecName('DOM3 Core', 'core.html#ID-1451460987', 'Node.childNodes')}}{{Spec2('DOM3 Core')}}Nessun cambiamento
{{SpecName('DOM2 Core', 'core.html#ID-1451460987', 'Node.childNodes')}}{{Spec2('DOM2 Core')}}Nessun cambiamento
{{SpecName('DOM1', 'level-one-core.html#ID-1451460987', 'Node.childNodes')}}{{Spec2('DOM1')}}Definizione iniziale
- -

Compatibilità con i browser

- - - -

{{Compat("api.Node.childNodes")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/node/firstchild/index.html b/files/it/web/api/node/firstchild/index.html deleted file mode 100644 index b99b694dbe..0000000000 --- a/files/it/web/api/node/firstchild/index.html +++ /dev/null @@ -1,91 +0,0 @@ ---- -title: Node.firstChild -slug: Web/API/Node/firstChild -tags: - - API - - DOM - - Node - - Proprietà - - Referenza -translation_of: Web/API/Node/firstChild -original_slug: Web/API/Element/firstChild ---- -
{{APIRef("DOM")}}
- -

La proprietà di sola lettura Node.firstChild restituisce il primo figlio del nodo nell'albero o null se il nodo non ha figli. Se il nodo è un Document, restituisce il primo nodo nell'elenco dei suoi figli diretti.

- -

Sintassi

- -
var childNode = node.firstChild;
-
- -

Esempio

- -

Questo esempio dimostra l'uso di firstChild e il modo in cui i nodi degli spazi bianchi potrebbero interferire con l'utilizzo di questa proprietà.

- -
<p id="para-01">
-  <span>First span</span>
-</p>
-
-<script>
-  var p01 = document.getElementById('para-01');
-  console.log(p01.firstChild.nodeName);
-</script>
- -

In quanto sopra, la console console mostrerà '#text' perché viene inserito un nodo di testo per mantenere lo spazio bianco tra la fine dei tag di apertura <p> e <span>. Qualsiasi spazio bianco creerà un nodo #text da un singolo spazio a più spazi, ritorni, schede e così via.

- -

Un altro nodo #text viene inserito tra i tag di chiusura </span> e </p>.

- -

Se questo spazio viene rimosso dall'origine, i nodi #text non vengono inseriti e l'elemento span diventa il primo figlio del paragrafo.

- -
<p id="para-01"><span>First span</span></p>
-
-<script>
-  var p01 = document.getElementById('para-01');
-  console.log(p01.firstChild.nodeName);
-</script>
-
- -

Ora l'avviso mostrerà 'SPAN'.

- -

Per evitare il problema con node.firstChild che restituisce i nodi #text o #comment, {{domxref("ParentNode.firstElementChild")}} può essere utilizzato per restituire solo il primo nodo elemento. Tuttavia, node.firstElementChild richiede uno shim per Internet Explorer 9 e versioni precedenti.

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommentp
{{SpecName('DOM WHATWG', '#dom-node-firstchild', 'Node.firstChild')}}{{Spec2('DOM WHATWG')}}Nessun cambiamento
{{SpecName('DOM3 Core', 'core.html#ID-169727388', 'Node.firstChild')}}{{Spec2('DOM3 Core')}}Nessun cambiamento
{{SpecName('DOM2 Core', 'core.html#ID-169727388', 'Node.firstChild')}}{{Spec2('DOM2 Core')}}Nessun cambiamento
{{SpecName('DOM1', 'level-one-core.html#ID-169727388', 'Node.firstChild')}}{{Spec2('DOM1')}}Definizione iniziale
- -

Compatibilità con i browser

- - - -

{{Compat("api.Node.firstChild")}}

diff --git a/files/it/web/api/node/index.html b/files/it/web/api/node/index.html deleted file mode 100644 index 7e0112e21c..0000000000 --- a/files/it/web/api/node/index.html +++ /dev/null @@ -1,368 +0,0 @@ ---- -title: Node -slug: Web/API/Node -tags: - - API - - DOM - - DOM Reference - - Interface - - NeedsTranslation - - Node - - Reference - - TopicStub -translation_of: Web/API/Node ---- -
{{APIRef("DOM")}}
- -

Node is an interface from which a number of DOM API object types inherit. It allows those types to be treated similarly; for example, inheriting the same set of methods, or being tested in the same way.

- -

The following interfaces all inherit from Node’s methods and properties: {{domxref("Document")}}, {{domxref("Element")}}, {{domxref("Attr")}}, {{domxref("CharacterData")}} (which {{domxref("Text")}}, {{domxref("Comment")}}, and {{domxref("CDATASection")}} inherit), {{domxref("ProcessingInstruction")}}, {{domxref("DocumentFragment")}}, {{domxref("DocumentType")}}, {{domxref("Notation")}}, {{domxref("Entity")}}, {{domxref("EntityReference")}}

- -

These interfaces may return null in certain cases where the methods and properties are not relevant. They may throw an exception — for example when adding children to a node type for which no children can exist.

- -

{{InheritanceDiagram}}

- -

Properties

- -

Inherits properties from its parents {{domxref("EventTarget")}}.[1]

- -
-
{{domxref("Node.baseURI")}} {{readonlyInline}}
-
Returns a {{domxref("DOMString")}} representing the base URL. The concept of base URL changes from one language to another; in HTML, it corresponds to the protocol, the domain name and the directory structure, that is all until the last '/'.
-
{{domxref("Node.baseURIObject")}} {{Non-standard_inline()}}
-
(Not available to web content.) The read-only {{ Interface("nsIURI") }} object representing the base URI for the element.
-
{{domxref("Node.childNodes")}} {{readonlyInline}}
-
Returns a live {{domxref("NodeList")}} containing all the children of this node. {{domxref("NodeList")}} being live means that if the children of the Node change, the {{domxref("NodeList")}} object is automatically updated.
-
{{domxref("Node.firstChild")}} {{readonlyInline}}
-
Returns a {{domxref("Node")}} representing the first direct child node of the node, or null if the node has no child.
-
{{domxref("Node.isConnected")}} {{readonlyInline}}
-
Returns a boolean indicating whether or not the Node is connected (directly or indirectly) to the context object, e.g. the {{domxref("Document")}} object in the case of the normal DOM, or the {{domxref("ShadowRoot")}} in the case of a shadow DOM.
-
{{domxref("Node.lastChild")}} {{readonlyInline}}
-
Returns a {{domxref("Node")}} representing the last direct child node of the node, or null if the node has no child.
-
{{domxref("Node.nextSibling")}} {{readonlyInline}}
-
Returns a {{domxref("Node")}} representing the next node in the tree, or null if there isn't such node.
-
{{domxref("Node.nodeName")}} {{readonlyInline}}
-
Returns a {{domxref("DOMString")}} containing the name of the Node. The structure of the name will differ with the node type. E.g. An {{domxref("HTMLElement")}} will contain the name of the corresponding tag, like 'audio' for an {{domxref("HTMLAudioElement")}}, a {{domxref("Text")}} node will have the '#text' string, or a {{domxref("Document")}} node will have the '#document' string.
-
{{domxref("Node.nodePrincipal")}} {{Non-standard_inline()}}
-
A {{ Interface("nsIPrincipal") }} representing the node principal.
-
{{domxref("Node.nodeType")}}{{readonlyInline}}
-
Returns an unsigned short representing the type of the node. Possible values are: - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
NameValue
ELEMENT_NODE1
ATTRIBUTE_NODE {{deprecated_inline()}}2
TEXT_NODE3
CDATA_SECTION_NODE {{deprecated_inline()}}4
ENTITY_REFERENCE_NODE {{deprecated_inline()}}5
ENTITY_NODE {{deprecated_inline()}}6
PROCESSING_INSTRUCTION_NODE7
COMMENT_NODE8
DOCUMENT_NODE9
DOCUMENT_TYPE_NODE10
DOCUMENT_FRAGMENT_NODE11
NOTATION_NODE {{deprecated_inline()}}12
-
-
{{domxref("Node.nodeValue")}}
-
Returns / Sets the value of the current node
-
{{domxref("Node.ownerDocument")}} {{readonlyInline}}
-
Returns the {{domxref("Document")}} that this node belongs to. If the node is itself a document, returns null.
-
{{domxref("Node.parentNode")}} {{readonlyInline}}
-
Returns a {{domxref("Node")}} that is the parent of this node. If there is no such node, like if this node is the top of the tree or if doesn't participate in a tree, this property returns null.
-
{{domxref("Node.parentElement")}} {{readonlyInline}}
-
Returns an {{domxref("Element")}} that is the parent of this node. If the node has no parent, or if that parent is not an {{domxref("Element")}}, this property returns null.
-
{{domxref("Node.previousSibling")}} {{readonlyInline}}
-
Returns a {{domxref("Node")}} representing the previous node in the tree, or null if there isn't such node.
-
{{domxref("Node.textContent")}}
-
Returns / Sets the textual content of an element and all its descendants.
-
- -

Deprecated properties

- -
-
{{domxref("Node.rootNode")}} {{readOnlyInline}} {{deprecated_inline}}
-
Returns a {{domxref("Node")}} object representing the topmost node in the tree, or the current node if it's the topmost node in the tree. This has been replaced by {{domxref("Node.getRootNode()")}}.
-
- -

Obsolete properties

- -
-
{{domxref("Node.localName")}} {{obsolete_inline}}{{readonlyInline}}
-
Returns a {{domxref("DOMString")}} representing the local part of the qualified name of an element. -
-

Note: In Firefox 3.5 and earlier, the property upper-cases the local name for HTML elements (but not XHTML elements). In later versions, this does not happen, so the property is in lower case for both HTML and XHTML. {{gecko_minversion_inline("1.9.2")}}

-
-
-
{{domxref("Node.namespaceURI")}} {{obsolete_inline}}{{readonlyInline}}
-
The namespace URI of this node, or null if it is no namespace. -
-

Note: In Firefox 3.5 and earlier, HTML elements are in no namespace. In later versions, HTML elements are in the http://www.w3.org/1999/xhtml/ namespace in both HTML and XML trees. {{gecko_minversion_inline("1.9.2")}}

-
-
-
{{domxref("Node.prefix")}} {{obsolete_inline}}{{readonlyInline}}
-
Is a {{domxref("DOMString")}} representing the namespace prefix of the node, or null if no prefix is specified.
-
- -

Methods

- -

Inherits methods from its parent, {{domxref("EventTarget")}}.[1]

- -
-
{{domxref("Node.appendChild()")}}
-
Adds the specified childNode argument as the last child to the current node.
- If the argument referenced an existing node on the DOM tree, the node will be detached from its current position and attached at the new position.
-
{{domxref("Node.cloneNode()")}}
-
Clone a {{domxref("Node")}}, and optionally, all of its contents. By default, it clones the content of the node.
-
{{domxref("Node.compareDocumentPosition()")}}
-
Compares the position of the current node against another node in any other document.
-
{{domxref("Node.contains()")}}
-
Returns a {{jsxref("Boolean")}} value indicating whether a node is a descendant of a given node or not.
-
{{domxref("Node.getRootNode()")}}
-
Returns the context object's root which optionally includes the shadow root if it is available. 
-
{{domxref("Node.hasChildNodes()")}}
-
Returns a {{jsxref("Boolean")}} indicating if the element has any child nodes, or not.
-
{{domxref("Node.insertBefore()")}}
-
Inserts a {{domxref("Node")}} before the reference node as a child of a specified parent node.
-
{{domxref("Node.isDefaultNamespace()")}}
-
Accepts a namespace URI as an argument and returns a {{jsxref("Boolean")}} with a value of true if the namespace is the default namespace on the given node or false if not.
-
{{domxref("Node.isEqualNode()")}}
-
Returns a {{jsxref("Boolean")}} which indicates whether or not two nodes are of the same type and all their defining data points match.
-
{{domxref("Node.isSameNode()")}}
-
Returns a {{jsxref("Boolean")}} value indicating whether or not the two nodes are the same (that is, they reference the same object).
-
{{domxref("Node.lookupPrefix()")}}
-
Returns a {{domxref("DOMString")}} containing the prefix for a given namespace URI, if present, and null if not. When multiple prefixes are possible, the result is implementation-dependent.
-
{{domxref("Node.lookupNamespaceURI()")}}
-
Accepts a prefix and returns the namespace URI associated with it on the given node if found (and null if not). Supplying null for the prefix will return the default namespace.
-
{{domxref("Node.normalize()")}}
-
Clean up all the text nodes under this element (merge adjacent, remove empty).
-
{{domxref("Node.removeChild()")}}
-
Removes a child node from the current element, which must be a child of the current node.
-
{{domxref("Node.replaceChild()")}}
-
Replaces one child {{domxref("Node")}} of the current one with the second one given in parameter.
-
- -

Obsolete methods

- -
-
{{domxref("Node.getFeature()")}} {{obsolete_inline}}
-
 
-
{{domxref("Node.getUserData()")}} {{obsolete_inline}}
-
Allows a user to get some {{domxref("DOMUserData")}} from the node.
-
{{domxref("Node.hasAttributes()")}} {{obsolete_inline}}
-
Returns a {{jsxref("Boolean")}} indicating if the element has any attributes, or not.
-
{{domxref("Node.isSupported()")}} {{obsolete_inline}}
-
Returns a {{jsxref("Boolean")}} flag containing the result of a test whether the DOM implementation implements a specific feature and this feature is supported by the specific node.
-
{{domxref("Node.setUserData()")}} {{obsolete_inline}}
-
Allows a user to attach, or remove, {{domxref("DOMUserData")}} to the node.
-
- -

Examples

- -

Remove all children nested within a node

- -
Element.prototype.removeAll = function () {
-  while (this.firstChild) { this.removeChild(this.firstChild); }
-  return this;
-};
- -

Sample usage

- -
/* ... an alternative to document.body.innerHTML = "" ... */
-document.body.removeAll();
- -

Recurse through child nodes

- -

The following function calls a function recursively for each node contained by a root node (including the root itself):

- -
function eachNode(rootNode, callback){
-	if(!callback){
-		var nodes = [];
-		eachNode(rootNode, function(node){
-			nodes.push(node);
-		});
-		return nodes;
-	}
-
-	if(false === callback(rootNode))
-		return false;
-
-	if(rootNode.hasChildNodes()){
-		var nodes = rootNode.childNodes;
-		for(var i = 0, l = nodes.length; i < l; ++i)
-			if(false === eachNode(nodes[i], callback))
-				return;
-	}
-}
- -

Syntax

- -
eachNode(rootNode, callback);
- -

Description

- -

Recursively calls a function for each descendant node of rootNode (including the root itself).

- -

If callback is omitted, the function returns an {{jsxref("Array")}} instead, which contains rootNode and all nodes contained therein.

- -

If callback is provided, and it returns {{jsxref("Boolean")}} false when called, the current recursion level is aborted, and the function resumes execution at the last parent's level. This can be used to abort loops once a node has been found (such as searching for a text node that contains a certain string).

- -

Parameters

- -
-
rootNode
-
The Node object whose descendants will be recursed through.
-
callback
-
An optional callback function that receives a Node as its only argument. If omitted, eachNode returns an {{jsxref("Array")}} of every node contained within rootNode (including the root itself).
-
- -

Sample usage

- -

The following example prints the textContent properties of each <span> tag in a <div> element named "box":

- -
<div id="box">
-	<span>Foo</span>
-	<span>Bar</span>
-	<span>Baz</span>
-</div>
- -
var box = document.getElementById("box");
-eachNode(box, function(node){
-	if(null != node.textContent){
-		console.log(node.textContent);
-	}
-});
- -

The following strings will be displayed in the user's console:

- -
"\n\t", "Foo", "\n\t", "Bar", "\n\t", "Baz"
- -
-

Note: Whitespace forms part of a {{domxref("Text")}} node, meaning indentation and newlines form separate Text between the Element nodes.

-
- -

Realistic usage

- -

The following demonstrates a real-world use of the eachNode function: searching for text on a web-page. We use a wrapper function named grep to do the searching:

- -
function grep(parentNode, pattern){
-	var matches = [];
-	var endScan = false;
-
-	eachNode(parentNode, function(node){
-		if(endScan)
-			return false;
-
-		// Ignore anything which isn't a text node
-		if(node.nodeType !== Node.TEXT_NODE)
-			return;
-
-		if("string" === typeof pattern){
-			if(-1 !== node.textContent.indexOf(pattern))
-				matches.push(node);
-		}
-		else if(pattern.test(node.textContent)){
-			if(!pattern.global){
-				endScan = true;
-				matches = node;
-			}
-			else matches.push(node);
-		}
-	});
-
-	return matches;
-}
- -

For example, to find {{domxref("Text")}} nodes that contain typos:

- -
var typos = ["teh", "adn", "btu", "adress", "youre", "msitakes"];
-var pattern = new RegExp("\\b(" + typos.join("|") + ")\\b", "gi");
-var mistakes = grep(document.body, pattern);
-console.log(mistakes);
-
- -

Specifications

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('DOM WHATWG', '#interface-node', 'Node')}}{{Spec2('DOM WHATWG')}}Removed the following properties: attributes, namespaceURI, prefix, and localName.
- Removed the following methods: isSupported(), hasAttributes(), getFeature(), setUserData(), and getUserData().
{{SpecName('DOM3 Core', 'core.html#ID-1950641247', 'Node')}}{{Spec2('DOM3 Core')}}The methods insertBefore(), replaceChild(), removeChild(), and appendChild() returns one more kind of error (NOT_SUPPORTED_ERR) if called on a {{domxref("Document")}}.
- The normalize() method has been modified so that {{domxref("Text")}} node can also be normalized if the proper {{domxref("DOMConfiguration")}} flag is set.
- Added the following methods: compareDocumentPosition(), isSameNode(), lookupPrefix(), isDefaultNamespace(), lookupNamespaceURI(), isEqualNode(), getFeature(), setUserData(), and getUserData().
- Added the following properties: baseURI and textContent.
{{SpecName('DOM2 Core', 'core.html#ID-1950641247', 'Node')}}{{Spec2('DOM2 Core')}}The ownerDocument property was slightly modified so that {{domxref("DocumentFragment")}} also returns null.
- Added the following properties: namespaceURI, prefix, and localName.
- Added the following methods: normalize(), isSupported() and hasAttributes().
{{SpecName('DOM1', 'level-one-core.html#ID-1950641247', 'Node')}}{{Spec2('DOM1')}}Initial definition
- -

Browser compatibility

- - - -

{{Compat("api.Node")}}

diff --git a/files/it/web/api/node/lastchild/index.html b/files/it/web/api/node/lastchild/index.html deleted file mode 100644 index 34804c5644..0000000000 --- a/files/it/web/api/node/lastchild/index.html +++ /dev/null @@ -1,59 +0,0 @@ ---- -title: Node.lastChild -slug: Web/API/Node/lastChild -translation_of: Web/API/Node/lastChild ---- -
{{APIRef("DOM")}}
- -

La proprietà di sola lettura Node.lastChild restituisce l'ultimo figlio del nodo. Se il suo genitore è un elemento, allora il bambino è generalmente un nodo di elemento, un nodo di testo o un nodo di commento. Restituisce null se non ci sono elementi figli.

- -

Sintassi

- -
var childNode = node.lastChild;
-
- -

Esempio

- -
var tr = document.getElementById("row1");
-var corner_td = tr.lastChild;
-
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', '#dom-node-lastchild', 'Node.lastChild')}}{{Spec2('DOM WHATWG')}}Nessun cambiamento
{{SpecName('DOM3 Core', 'core.html#ID-61AD09FB', 'Node.lastChild')}}{{Spec2('DOM3 Core')}}Nessun cambiamento
{{SpecName('DOM2 Core', 'core.html#ID-61AD09FB', 'Node.lastChild')}}{{Spec2('DOM2 Core')}}Nessun cambiamento
{{SpecName('DOM1', 'level-one-core.html#ID-61AD09FB', 'Node.lastChild')}}{{Spec2('DOM1')}}Definizione iniziale
- -

Compatibilità con i browser

- - - -

{{Compat("api.Node.lastChild")}}

diff --git a/files/it/web/api/node/nextsibling/index.html b/files/it/web/api/node/nextsibling/index.html deleted file mode 100644 index f2355a6402..0000000000 --- a/files/it/web/api/node/nextsibling/index.html +++ /dev/null @@ -1,101 +0,0 @@ ---- -title: Node.nextSibling -slug: Web/API/Node/nextSibling -translation_of: Web/API/Node/nextSibling ---- -
{{APIRef("DOM")}}
- -

La proprietà di sola lettura Node.nextSibling restituisce il nodo immediatamente successivo a quello specificato nei {{domxref("Node.childNodes","childNodes")}}, del loro genitore o restituisce null se il nodo specificato è l'ultimo figlio nell'elemento genitore.

- -

Sintassi

- -
nextNode = node.nextSibling
-
- -

Appunti

- -
-

I browser basati su Gecko inseriscono nodi di testo in un documento per rappresentare gli spazi bianchi nel codice sorgente. Pertanto, un nodo ottenuto, ad esempio, utilizzando Node.firstChild o Node.previousSibling può fare riferimento a un nodo di testo di spazi bianchi piuttosto che all'elemento effettivo che l'autore intendeva ottenere.

- -

Vedi Whitespace in the DOM e W3C DOM 3 FAQ: Why are some Text nodes empty? per maggiori informazioni.

-
- -

{{domxref("Element.nextElementSibling")}} può essere usato per ottenere l'elemento successivo saltando eventuali nodi di spazi vuoti, altro testo tra elementi o commenti.

- -

Esempio

- -
<div id="div-1">Here is div-1</div>
-<div id="div-2">Here is div-2</div>
-
-<script>
-var el = document.getElementById('div-1').nextSibling,
-    i = 1;
-
-console.group('Siblings of div-1:');
-
-while (el) {
-  console.log(i, '. ', el.nodeName);
-  el = el.nextSibling;
-  i++;
-}
-
-console.groupEnd();
-</script>
-
-/**************************************************
-  The console displays the following:
-
-     Siblings of div-1
-
-      1. #text
-      2. DIV
-      3. #text
-      4. SCRIPT
-
-**************************************************/
-
- -

Nell'esempio precedente, i nodi, #text sono inseriti nel DOM in cui si verifica lo spazio bianco tra i tag (ad esempio dopo il tag di chiusura di un elemento e prima del tag di apertura del successivo).

- -

La possibile inclusione di nodi di testo deve essere consentita quando si attraversa il DOM utilizzando nextSibling. Vedi le risorse nella sezione Appunti.

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', '#dom-node-nextsibling', 'Node.nextSibling')}}{{Spec2('DOM WHATWG')}}Nessun cambiamento
{{SpecName('DOM2 Core', 'core.html#ID-6AC54C2F', 'Node.nextSibling')}}{{Spec2('DOM2 Core')}}Nessun cambiamento
{{SpecName('DOM1', 'level-one-core.html#attribute-nextSibling', 'Node.nextSibling')}}{{Spec2('DOM1')}}Definizione iniziale
- -

Compatibilità con i browser

- - - -

{{Compat("api.Node.nextSibling")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/node/nodename/index.html b/files/it/web/api/node/nodename/index.html deleted file mode 100644 index 2738910a45..0000000000 --- a/files/it/web/api/node/nodename/index.html +++ /dev/null @@ -1,117 +0,0 @@ ---- -title: Node.nodeName -slug: Web/API/Node/nodeName -tags: - - API - - DOM - - Gecko - - NeedsSpecTable - - Node - - Property - - Read-only -translation_of: Web/API/Node/nodeName -original_slug: Web/API/Element/nodeName ---- -
{{APIRef("DOM")}}
- -

La proprietà di sola lettura nodeName restituisce il nome dell'attuale {{domxref("Node")}} come stringa.

- -

Sintassi

- -
var str = node.nodeName;
-
- -

Valore

- -

Una {{domxref("DOMString")}}. I valori per i diversi tipi di nodi sono:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Interfacciavalore nodeName
{{domxref("Attr")}}Il valore di {{domxref("Attr.name")}}
{{domxref("CDATASection")}}"#cdata-section"
{{domxref("Comment")}}"#comment"
{{domxref("Document")}}"#document"
{{domxref("DocumentFragment")}}"#document-fragment"
{{domxref("DocumentType")}}Il valore di {{domxref("DocumentType.name")}}
{{domxref("Element")}}Il valore di {{domxref("Element.tagName")}}
{{domxref("Entity")}}Il nome dell'entità
{{domxref("EntityReference")}}Il nome del riferimento all'entità
{{domxref("Notation")}}Il nome della notazione
{{domxref("ProcessingInstruction")}}Il valore di {{domxref("ProcessingInstruction.target")}}
{{domxref("Text")}}"#text"
- -

Esempio

- -

Dato il seguente markup:

- -
<div id="d1">hello world</div>
-<input type="text" id="t">
-
- -

e il seguente script:

- -
var div1 = document.getElementById("d1");
-var text_field = document.getElementById("t");
-
-text_field.value = div1.nodeName;
-
- -

IIn XHTML (o in qualsiasi altro formato XML), il valore di text_field sarebbe letto "div". Tuttavia, in HTML, il valore di text_field sarebbe letto "DIV", poichè nodeName e tagName restituiscono in maiuscolo gli elementi HTML nei DOM contrassegnati come documenti HTML. Read more details on nodeName case sensitivity in different browsers.

- -

Nota che la proprietà {{domxref("Element.tagName")}} potrebbe essere stata utilizzata, poiché nodeName ha lo stesso valore di tagName per un elemento. Tieni presente, tuttavia, che nodeName ritornerà "#text" per i nodi di testo mentre tagName restituirà undefined.

- -

Specifiche

- - - -

Compatibilità con i browser

- - - -

{{Compat("api.Node.nodeName")}}

diff --git a/files/it/web/api/node/nodetype/index.html b/files/it/web/api/node/nodetype/index.html deleted file mode 100644 index c484034dc7..0000000000 --- a/files/it/web/api/node/nodetype/index.html +++ /dev/null @@ -1,179 +0,0 @@ ---- -title: Node.nodeType -slug: Web/API/Node/nodeType -tags: - - API - - DOM - - Proprietà - - Referenza -translation_of: Web/API/Node/nodeType -original_slug: Web/API/Element/nodeType ---- -
{{APIRef("DOM")}}
- -

La proprietà di sola lettura Node.nodeType è un numero intero che identifica il nodo. Distingue tra diversi tipi di nodi tra loro, come {{domxref("Element", "elements")}}, {{domxref("Text", "text")}} and {{domxref("Comment", "comments")}}.

- -

Sintassi

- -
var type = node.nodeType;
-
- -

Restituisce un numero intero che specifica il tipo del nodo. I valori possibili sono elencati in {{anch("Tipi di nodi costanti")}}.

- -

Constanti

- -

Tipi di nodi costanti

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
ConstanteValoreDescrizione
Node.ELEMENT_NODE1Un nodo {{domxref("Element")}} come {{HTMLElement("p")}} o {{HTMLElement("div")}}.
Node.TEXT_NODE3L'attuale {{domxref("Text")}} dentro un {{domxref("Element")}} o {{domxref("Attr")}}.
Node.CDATA_SECTION_NODE4Una {{domxref("CDATASection")}}, ad esempio <!CDATA[[ … ]]>.
Node.PROCESSING_INSTRUCTION_NODE7Una {{domxref("ProcessingInstruction")}} di un documento XML, come <?xml-stylesheet … ?>.
Node.COMMENT_NODE8Un nodo {{domxref("Comment")}}, come <!-- … -->.
Node.DOCUMENT_NODE9Un nodo {{domxref("Document")}}.
Node.DOCUMENT_TYPE_NODE10Un nodo {{domxref("DocumentType")}}, come <!DOCTYPE html>.
Node.DOCUMENT_FRAGMENT_NODE11Un nodo {{domxref("DocumentFragment")}}.
- -

Tipi di nodo deprecati {{deprecated_inline()}}

- -
-

Le seguenti costanti sono state deprecate e non dovrebbero essere più utilizzate.

-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
ConstanteValoreDescrizione
Node.ATTRIBUTE_NODE2Un {{domxref("Attr", "Attribute")}} di un {{domxref("Element")}}. Gli attributi non implementano più l'interfaccia {{domxref("Node")}} dal {{SpecName("DOM4")}}.
Node.ENTITY_REFERENCE_NODE5Un nodo di riferimento di entità XML, come &foo;. Rimosso nel {{SpecName("DOM4")}}.
Node.ENTITY_NODE6Un nodo XML <!ENTITY …>. Rimosso nel {{SpecName("DOM4")}}.
Node.NOTATION_NODE12Un nodo XML <!NOTATION …>. Rimosso nel {{SpecName("DOM4")}}.
- -

Esempi

- -

Diversi tipi di nodi

- -
document.nodeType === Node.DOCUMENT_NODE; // true
-document.doctype.nodeType === Node.DOCUMENT_TYPE_NODE; // true
-
-document.createDocumentFragment().nodeType === Node.DOCUMENT_FRAGMENT_NODE; // true
-
-var p = document.createElement("p");
-p.textContent = "Once upon a time…";
-
-p.nodeType === Node.ELEMENT_NODE; // true
-p.firstChild.nodeType === Node.TEXT_NODE; // true
-
- -

Commenti

- -

Questo esempio controlla se il primo nodo all'interno dell'elemento del documento è un commento e visualizza un messaggio in caso contrario.

- -
var node = document.documentElement.firstChild;
-if (node.nodeType !== Node.COMMENT_NODE) {
-  console.warn("Dovresti commentare il tuo codice!");
-}
-
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', '#dom-node-nodetype', 'Node.nodeType')}}{{Spec2('DOM WHATWG')}}Deprecated ATTRIBUTE_NODE, ENTITY_REFERENCE_NODE and NOTATION_NODE types.
{{SpecName('DOM3 Core', 'core.html#ID-1950641247', 'Node.nodeType')}}{{Spec2('DOM3 Core')}}Nessun cambiamento.
{{SpecName('DOM2 Core', 'core.html#ID-111237558', 'Node.nodeType')}}{{Spec2('DOM2 Core')}}Nessun cambiamento.
{{SpecName('DOM1', 'level-one-core.html#ID-111237558', 'Node.nodeType')}}{{Spec2('DOM1')}}Definizione iniziale.
- -

Compatibilità con i browser

- - - -

{{Compat("api.Node.nodeType")}}

diff --git a/files/it/web/api/node/nodevalue/index.html b/files/it/web/api/node/nodevalue/index.html deleted file mode 100644 index 6eef21baad..0000000000 --- a/files/it/web/api/node/nodevalue/index.html +++ /dev/null @@ -1,76 +0,0 @@ ---- -title: element.nodeValue -slug: Web/API/Node/nodeValue -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Node/nodeValue -original_slug: Web/API/Element/nodeValue ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce il valore del nodo corrente.

-

Sintassi

-
valore = document.nodeValue
-
-

valore è una stringa contenente il valore del nodo corrente, se esiste.

-

Note

-

La proprietà nodeValue dell'intero documento, restituisce null. Per un nodo di tipo testo, commento o CDATA, nodeValue restituisce il contenuto del nodo. Per i nodi attributo, restituisce il valore dell'attributo.

-

La tabella seguente mostra i valori restituiti per i vari tipi di elementi:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Attril valore dell'attributo
CDATASectionil contenuto della sezione CDATA
Commentil commento
Documentnull
DocumentFragmentnull
DocumentTypenull
Elementnull
NamedNodeMapnull
EntityReferencenull
Notationnull
ProcessingInstructionl'intero contenuto, escluso il target
Textil contenuto del nodo testo
-

Quando nodeValue è impostato a null, reimpostarlo non ha alcun effetto.

-

Specifiche

-

nodeValue

diff --git a/files/it/web/api/node/parentnode/index.html b/files/it/web/api/node/parentnode/index.html deleted file mode 100644 index 610cc3e5e4..0000000000 --- a/files/it/web/api/node/parentnode/index.html +++ /dev/null @@ -1,62 +0,0 @@ ---- -title: Node.parentNode -slug: Web/API/Node/parentNode -tags: - - API - - DOM - - Gecko - - Proprietà -translation_of: Web/API/Node/parentNode -original_slug: Web/API/Element/parentNode ---- -
-
{{APIRef("DOM")}}
-
- -

La proprietà di sola lettura Node.parentNode restituisce il genitore del nodo specificato nell'albero DOM.

- -

Sintassi

- -
parentNode = node.parentNode
-
- -

parentNode è il genitore del nodo corrente. Il genitore di un elemento è un nodo Element, un nodo Document, o un nodo DocumentFragment.

- -

Esempio

- -
if (node.parentNode) {
-  // rimuovi un nodo dall'albero, a meno che
-  // non sia già nell'albero
-  node.parentNode.removeChild(node);
-}
- -

Note

- -

I nodi Document e DocumentFragment non possono mai avere un genitore, quindi parentNode ritornerà sempre null.

- -

Restituisce anche null se il nodo è appena stato creato e non è ancora collegato all'albero.

- -

Compatibilità con i browser

- - - -

{{Compat("api.Node.parentNode")}}

- -

Specifiche

- - - -

Vedi anche

- - diff --git a/files/it/web/api/node/previoussibling/index.html b/files/it/web/api/node/previoussibling/index.html deleted file mode 100644 index 735433da9e..0000000000 --- a/files/it/web/api/node/previoussibling/index.html +++ /dev/null @@ -1,81 +0,0 @@ ---- -title: Node.previousSibling -slug: Web/API/Node/previousSibling -translation_of: Web/API/Node/previousSibling ---- -
-
{{APIRef("DOM")}}
-
- -

La proprietà di sola lettura Node.previousSibling restituisce il nodo immediatamente precedente a quello specificato nell'elenco {{domxref("Node.childNodes", "childNodes")}} del genitore, o null se il nodo specificato è il primo in tale elenco.

- -

Sintassi

- -
previousNode = node.previousSibling;
-
- -

Esempio

- -
<img id="b0">
-<img id="b1">
-<img id="b2">
- -
console.log(document.getElementById("b1").previousSibling); // <img id="b0">
-console.log(document.getElementById("b2").previousSibling.id); // "b1"
-
- -

Appunti

- -
-

I browser basati su Gecko inseriscono nodi di testo in un documento per rappresentare gli spazi bianchi nel codice sorgente. Pertanto, un nodo ottenuto, ad esempio, utilizzando Node.firstChild o Node.previousSibling può fare riferimento a un nodo di testo di spazi bianchi piuttosto che all'elemento effettivo che l'autore intendeva ottenere.

- -

Vedi Whitespace in the DOM e W3C DOM 3 FAQ: Why are some Text nodes empty? per maggiori informazioni.

-
- -

Per navigare nella direzione opposta attraverso l'elenco dei nodi secondari usa Node.nextSibling.

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', '#dom-node-previousSibling', 'Node.previousSibling')}}{{Spec2('DOM WHATWG')}}Nessun cambiamento
{{SpecName('DOM3 Core', 'core.html#ID-640FB3C8', 'Node.previousSibling')}}{{Spec2('DOM3 Core')}}Nessun cambiamento
{{SpecName('DOM2 Core', 'core.html#ID-640FB3C8', 'Node.previousSibling')}}{{Spec2('DOM2 Core')}}Nessun cambiamento
{{SpecName('DOM1', 'level-one-core.html#attribute-previousSibling', 'Node.previousSibling')}}{{Spec2('DOM1')}}Definizione iniziale
- -

Compatibilità con i browser

- - - -

{{Compat("api.Node.previousSibling")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/node/textcontent/index.html b/files/it/web/api/node/textcontent/index.html deleted file mode 100644 index bd2186323e..0000000000 --- a/files/it/web/api/node/textcontent/index.html +++ /dev/null @@ -1,139 +0,0 @@ ---- -title: Node.textContent -slug: Web/API/Node/textContent -tags: - - API - - Command API - - DOM - - Proprietà - - Referenza -translation_of: Web/API/Node/textContent -original_slug: Web/API/Element/textContent ---- -
{{APIRef("DOM")}}
- -

La proprietà textContent dell'interfaccia {{domxref("Node")}} rappresenta il contenuto del testo di un nodo e dei suoi discendenti.

- -
-

Note: textContent e {{domxref("HTMLElement.innerText")}} sono facilmente confusi, ma i due sono diversi in modi molto importanti.

-
- -

Sintassi

- -
var text = Node.textContent;
-Node.textContent = string;
-
- -

Valore di ritorno

- -

Una stringa o null.

- -

Descrizione

- -

Quando ottieni questa proprietà:

- - - -

L'impostazione di textContent su un nodo rimuove tutti i figli del nodo e li sostituisce con un singolo nodo di testo con il valore di stringa specificato.

- -

Differenze da innerText

- -

Non lasciarti confondere dalle differenze tra Node.textContent e {{domxref("HTMLElement.innerText")}}. Anche se i nomi sembrano simili, ci sono differenze importanti:

- - - -

Differenze da innerHTML

- -

{{domxref("Element.innerHTML")}} restituisce HTML, come indica il nome. A volte le persone usano innerHTML per recuperare o scrivere testo all'interno di un elemento, ma textContent ha prestazioni migliori perché il suo valore non viene analizzato come HTML. Inoltre, l'utilizzo di textContent può impedire gli attacchi XSS.

- -

Esempi

- -

Dato questo codice HTML:

- -
<div id="divA">Questo è <span>un</span> testo!</div>
- -

...puoi usare textContent per ottenere il contenuto del testo dell'elemento:

- -
let text = document.getElementById('divA').textContent;
-// La variabile text è ora: "Questo è un testo!"
- -

...o imposta il contenuto del testo dell'elemento:

- -
document.getElementById('divA').textContent = 'Questo testo è diverso!';
-// L'HTML per divA è ora:
-// <div id="divA">Questo testo è diverso!</div>
-
- -

Polyfill per IE8

- -
// Source: Eli Grey @ https://eligrey.com/blog/post/textcontent-in-ie8
-if (Object.defineProperty
-  && Object.getOwnPropertyDescriptor
-  && Object.getOwnPropertyDescriptor(Element.prototype, "textContent")
-  && !Object.getOwnPropertyDescriptor(Element.prototype, "textContent").get) {
-  (function() {
-    var innerText = Object.getOwnPropertyDescriptor(Element.prototype, "innerText");
-    Object.defineProperty(Element.prototype, "textContent",
-     // Passare innerText o innerText.get direttamente non funziona,
-     // è richiesta la funzione wrapper.
-     {
-       get: function() {
-         return innerText.get.call(this);
-       },
-       set: function(s) {
-         return innerText.set.call(this, s);
-       }
-     }
-   );
-  })();
-}
-
- -

Compatibilità con i browser

- - - -

{{Compat("api.Node.textContent")}}

- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG','#dom-node-textcontent','Node.textContent')}}{{Spec2('DOM WHATWG')}}Nessun cambiamento vs. DOM4
{{SpecName('DOM4','#dom-node-textcontent','Node.textContent')}}{{Spec2('DOM4')}}
{{SpecName('DOM3 Core','core.html#Node3-textContent','Node.textContent')}}{{Spec2('DOM3 Core')}}Introdotto
- -

Vedi anche

- - diff --git a/files/it/web/api/nodelist/foreach/index.html b/files/it/web/api/nodelist/foreach/index.html deleted file mode 100644 index 5d8f5d0088..0000000000 --- a/files/it/web/api/nodelist/foreach/index.html +++ /dev/null @@ -1,125 +0,0 @@ ---- -title: NodeList.prototype.forEach() -slug: Web/API/NodeList/forEach -tags: - - DOM - - Iterabile - - NodeList - - Referenza - - Web - - metodo -translation_of: Web/API/NodeList/forEach ---- -

{{APIRef("DOM")}}

- -

Il metodo forEach() dell'interfaccia {{domxref("NodeList")}} chiama il callback fornito nel parametro una volta per ogni coppia di valori nell'elenco, in ordine di inserimento.

- -

Sintassi

- -
NodeList.forEach(callback[, thisArg]);
-
- -

Parametri

- -
-
callback
-
Funzione da eseguire per ciascun elemento, eventualmente con 3 argomenti: -
-
currentValue
-
L'elemento corrente in elaborazione nella NodeList.
-
currentIndex
-
L'indice dell'elemento corrente in fase di elaborazione nella NodeList.
-
listObj
-
La NodeList a cui viene applicato forEach().
-
-
-
thisArg {{Optional_inline}}
-
Valore da utilizzare come {{jsxref("this")}} quando viene eseguito callback.
-
- -

Valore di ritorno

- -

{{jsxref('undefined')}}.

- -

Eccezioni

- -

Nessuna.

- -

Esempio

- -
var node = document.createElement("div");
-var kid1 = document.createElement("p");
-var kid2 = document.createTextNode("hey");
-var kid3 = document.createElement("span");
-
-node.appendChild(kid1);
-node.appendChild(kid2);
-node.appendChild(kid3);
-
-var list = node.childNodes;
-
-list.forEach(
-  function(currentValue, currentIndex, listObj) {
-    console.log(currentValue + ', ' + currentIndex + ', ' + this);
-  },
-  'myThisArg'
-);
- -

ritorna:

- -
[object HTMLParagraphElement], 0, myThisArg
-[object Text], 1, myThisArg
-[object HTMLSpanElement], 2, myThisArg
- -

Polyfill

- -

Questo {{Glossary("Polyfill","polyfill")}} aggiunge compatibilità a tutti i browser che supportano ES5:

- -
if (window.NodeList && !NodeList.prototype.forEach) {
-    NodeList.prototype.forEach = function (callback, thisArg) {
-        thisArg = thisArg || window;
-        for (var i = 0; i < this.length; i++) {
-            callback.call(thisArg, this[i], i, this);
-        }
-    };
-}
- -

OPPURE

- -
if (window.NodeList && !NodeList.prototype.forEach) {
-    NodeList.prototype.forEach = Array.prototype.forEach;
-}
- -

Il comportamento sopra riportato indica il numero di browser che implementa effettivamente NodeList.prototype.forEach (Chrome, ad esempio).

- -

Specifiche

- - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName("WebIDL", "#es-forEach", "forEach")}}{{Spec2("WebIDL")}}Definisce forEach sulle dichiarazioni iterable
- -

Compatibilità con i browser

- - - -

{{Compat("api.NodeList.forEach")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/nodelist/index.html b/files/it/web/api/nodelist/index.html deleted file mode 100644 index 4b18f62d63..0000000000 --- a/files/it/web/api/nodelist/index.html +++ /dev/null @@ -1,124 +0,0 @@ ---- -title: NodeList -slug: Web/API/NodeList -tags: - - API - - DOM - - Interfaccia - - NodeList -translation_of: Web/API/NodeList ---- -
{{APIRef("DOM")}}
- -

Gli oggetti NodeList sono un insieme di nodi, di solito restituiti da proprietà come {{domxref("Node.childNodes")}} ed il metodo {{domxref("document.querySelectorAll()")}}.

- -
-

Nonostante NodeList non sia un Array, è possibile iterare su esso usando forEach(). Può anche essere convertito in un vero Array usando Array.from().

- -

Tuttavia, alcuni browser meno recenti non hanno implementato NodeList.forEach() né Array.from(). Questo può essere aggirato usando {{jsxref("Array.forEach()", "Array.prototype.forEach()")}} — vedi l'esempio di questo documento.

-
- -

In alcuni casi, la NodeList è dinamica, ciò significa che i cambiamenti nel DOM si riflettono sulla collezione. Per esempio, {{domxref("Node.childNodes")}} è dinamico:

- -
var parent = document.getElementById('parent');
-var child_nodes = parent.childNodes;
-console.log(child_nodes.length); // assume "2"
-parent.appendChild(document.createElement('div'));
-console.log(child_nodes.length); // dovrebbe produrre "3"
-
- -

In altri casi, la NodeList è statica, ciò vuol dire che il contenuto della collezione non è influenzato da quelli nel DOM. {{domxref("document.querySelectorAll()")}} restituisce una NodeList statica.

- -

È bene tenere in mente questa distinzione quando si sceglie di iterare sugli elementi nella NodeList, ed in particolare al modo in cui si salva la lunghezza della lista.

- -

Proprietà

- -
-
{{domxref("NodeList.length")}}
-
Il numero dei nodi nella NodeList.
-
- -

Metodi

- -
-
{{domxref("NodeList.item()")}}
-
Restituisce un elemento nell'elenco per il suo indice, o null se l'indice è fuori misura.
-
Un'alternativa all'accesso a nodeList[i] (che invece restituisce undefined quando i è fuori dai limiti). Ciò è utile soprattutto per le implementazioni DOM di linguaggi non JavaScript.
-
{{domxref("NodeList.entries()")}}
-
Ritorna un {{jsxref("Iteration_protocols","iterator")}} che permette al codice di passare attraverso tutte le coppie chiave/valore contenute nella collezione. (In questo caso, le chiavi sono numeri che iniziano da 0 e i valori sono nodi.)
-
{{domxref("NodeList.forEach()")}}
-
Esegue una funzione fornita una volta per elemento NodeList passando l'elemento come argomento alla funzione.
-
{{domxref("NodeList.keys()")}}
-
Ritorna un {{jsxref("Iteration_protocols", "iterator")}} che permette al codice di passare attraverso tutte le chiavi delle coppie chiave/valore contenute nella collezione. (In questo caso, i tasti sono numeri che iniziano da 0).
-
{{domxref("NodeList.values()")}}
-
Ritorna un {{jsxref("Iteration_protocols", "iterator")}} che permette al codice di passare attraverso tutti i valori (nodi) delle coppie chiave/valore contenute nella collezione.
-
- -

Esempio

- -

È possibile iterare sugli elementi in una NodeList usando un for loop:

- -
for (var i = 0; i < myNodeList.length; i++) {
-  var item = myNodeList[i];  // La chiamata myNodeList.item(i) non è necessaria in JavaScript
-}
-
- -

Non utilizzare for...in o for each...in per enumerare gli elementi nelle NodeList, poiché enumereranno anche le proprietà length e item e causeranno errori se il tuo script presume che debba occuparsi solo di oggetti {{domxref("element")}}. Inoltre, for..in non garantisce la visita delle proprietà in un particolare ordine.

- -

for...of itererà sugli oggetti NodeList correttamente:

- -
var list = document.querySelectorAll( 'input[type=checkbox]' );
-for (var item of list) {
-  item.checked = true;
-}
- -

I browser recenti supportano anche metodi iteratori, {{domxref("NodeList.forEach()", "forEach()")}}, come {{domxref("NodeList.entries()", "entries()")}}, {{domxref("NodeList.values()", "values()")}}, e {{domxref("NodeList.keys()", "keys()")}}.

- -

Esiste anche un modo compatibile con Internet Explorer {{jsxref("Array.forEach()", "Array.prototype.forEach")}} per l'iterazione.

- -
var list = document.querySelectorAll( 'input[type=checkbox]' );
-Array.prototype.forEach.call(list, function (item) {
-  item.checked = true;
-});
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('DOM WHATWG', '#interface-nodelist', 'NodeList')}}{{ Spec2('DOM WHATWG') }} 
{{SpecName('DOM3 Core', 'core.html#ID-536297177', 'NodeList')}}{{ Spec2('DOM3 Core') }} 
{{SpecName('DOM2 Core', 'core.html#ID-536297177', 'NodeList')}}{{ Spec2('DOM2 Core') }} 
{{SpecName('DOM1', 'level-one-core.html#ID-536297177', 'NodeList')}}{{ Spec2('DOM1') }} -

Definizione iniziale.

-
- -

Compatibilità con i browser

- - - -

{{Compat("api.NodeList")}}

diff --git a/files/it/web/api/notification/dir/index.html b/files/it/web/api/notification/dir/index.html deleted file mode 100644 index b2a3a3ec70..0000000000 --- a/files/it/web/api/notification/dir/index.html +++ /dev/null @@ -1,73 +0,0 @@ ---- -title: Notification.dir -slug: Web/API/Notification/dir -translation_of: Web/API/Notification/dir -original_slug: Web/API/notifiche/dir ---- -

{{APIRef("Web Notifications")}}

- -

La proprieta' in sola lettura dir dell'interfaccia {{domxref("Notification")}} indica la direzione del testo della notifica, puo' essere specificata nell'opzione dir del costruttore di {{domxref("Notification.Notification","Notification()")}} .

- -

{{AvailableInWorkers}}

- -

Sintassi

- -
var direzione = Notification.dir;
-
- -

Valori

- -

La {{domxref("DOMString")}} specifica la direzione el testo. I possibili valori sono:

- - - -
-

Note: La maggior parte dei browser ignora le opzioni esplicite settate e funzionano con le proprie impostazioni.

-
- -

Esempi

- -

Il seguente frammento di codice crea un oggetto opzioni, da passare al costruttore Notification().

- -
var opzioni = {
-  body: 'Amo JavaScript!',
-  dir: 'rtl'
-}
-
-var n = new Notification('Mio titolo',opzioni);
-
-n.dir // dovrebbe ritornare 'rtl'
-
- -

Specifications

- - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('Web Notifications','#dom-notification-dir','dir')}}{{Spec2('Web Notifications')}}Living standard
- -

Browser compatibility

- - - -

{{Compat("api.Notification.dir")}}

- -

See also

- - diff --git a/files/it/web/api/notification/index.html b/files/it/web/api/notification/index.html deleted file mode 100644 index d734613849..0000000000 --- a/files/it/web/api/notification/index.html +++ /dev/null @@ -1,496 +0,0 @@ ---- -title: Notifiche -slug: Web/API/Notification -translation_of: Web/API/Notification -original_slug: Web/API/notifiche ---- -

{{APIRef("Web Notifications")}}

- -

L'interfaccia Notification di Notifications API viene usata per configurare e mostrare le notifiche desktop all'utente.

- -

{{AvailableInWorkers}}

- -

Costruttore

- -
-
{{domxref("Notification.Notification", "Notification()")}}
-
Crea una nuova istanza dell'oggetto Notification.
-
- -

Proprietà

- -

Proprietà Static

- -

Queste proprietà sono disponibili solo sull'oggetto Notification stesso.

- -
-
{{domxref("Notification.permission")}} {{readonlyinline}}
-
Una stringa che rappresenta l'attuale permesso per mostrare le notifiche. I possibili valori sono: denied (l'utente rifiuta la ricezione delle notifiche), granted (l'utente accetta la ricezione delle notifiche), o default (la scelta dell'utente è sconosciuta, quindi il browser agirà come se il valore fosse negato).
-
- -

Proprietà Instance

- -

Queste proprietà sono disponibili solo su istanze dell'oggetto Notification.

- -
-
{{domxref("Notification.actions")}} {{readonlyinline}}
-
L'array di azioni della notifica come specificato nel parametro options del costruttore.
-
{{domxref("Notification.badge")}} {{readonlyinline}}
-
L'URL dell'immagine utilizzata per rappresentare la notifica quando non c'è abbastanza spazio per visualizzare la notifica stessa.
-
{{domxref("Notification.body")}} {{readonlyinline}}
-
La stringa del corpo della notifica come specificato nel parametro options del costruttore.
-
{{domxref("Notification.data")}} {{readonlyinline}}
-
Restituisce un clone strutturato dei dati della notifica.
-
{{domxref("Notification.dir")}} {{readonlyinline}}
-
La direzione del testo della notifica come specificato nel parametro options del costruttore.
-
{{domxref("Notification.lang")}} {{readonlyinline}}
-
Il codice della lingua della notifica come specificato nel parametro options del costruttore.
-
{{domxref("Notification.tag")}} {{readonlyinline}}
-
L'ID della notifica (se presente) come specificato nel parametro options del costruttore.
-
{{domxref("Notification.icon")}} {{readonlyinline}}
-
L'URL dell'immagine utilizzata come icona della notifica come specificato nel parametro options del costruttore.
-
{{domxref("Notification.image")}} {{readonlyinline}}
-
L'URL di un'immagine da visualizzare come parte della notifica, come specificato nel parametro options del costruttore.
-
{{domxref("Notification.requireInteraction")}} {{readonlyinline}}
-
Un {{jsxref("Boolean")}} che indica che una notifica deve rimanere attiva finché l'utente non fa click o non la chiude, anziché chiudersi automaticamente.
-
{{domxref("Notification.silent")}} {{readonlyinline}}
-
Specifica se la notifica deve essere silenziosa, ovvero che non emetta suoni o vibrazioni, indipendentemente dalle impostazioni del dispositivo.
-
{{domxref("Notification.timestamp")}} {{readonlyinline}}
-
Specifica l'ora in cui viene creata o applicata una notifica (passato, presente o fututo).
-
{{domxref("Notification.title")}} {{readonlyinline}}
-
Il titolo della notifica come specificato nel primo parametro del costruttore.
-
{{domxref("Notification.vibrate")}} {{readonlyinline}}
-
Specifica un modello di vibrazione da emettere per i dispositivi con hardware di vibrazione.
-
- -

Proprietà non supportate

- -

Le seguenti proprietà sono elencate nelle specifiche più aggiornate, ma non sono ancora supportate da alcuni browser. È consigliabile controllare regolarmente per vedere se lo stato di queste proprietà viene aggiornato, e facci sapere se trovi informazioni non aggiornate.

- -
-
{{domxref("Notification.noscreen")}} {{readonlyinline}}
-
Specifica se l'attivazione della notifica deve abilitare o meno lo schermo del dispositivo.
-
{{domxref("Notification.renotify")}} {{readonlyinline}}
-
Specifica se l'utente deve essere avvisato dopo che una nuova notifica sostituisce una vecchia.
-
{{domxref("Notification.sound")}} {{readonlyinline}}
-
Specifica una risorsa sonora da riprodurre quando scatta la notifica, al prosto del suono di notifica predefinito del sistema.
-
{{domxref("Notification.sticky")}} {{readonlyinline}}
-
Specifica se la notifica deve essere "sticky", cioè non facilmente modificabile dall'utente.
-
- -

Gestori di eventi

- -
-
{{domxref("Notification.onclick")}}
-
Un gestore per l'evento {{event("click")}}. Viene attivato ogni volta che l'utente fa click sulla notifica.
-
{{domxref("Notification.onerror")}}
-
Un gestore per l'evento {{event("error")}}. Viene attivato ogni volta che la notifica incontra un errore.
-
- -

Obsolete handlers

- -

The following event handlers are still supported as listed in the {{anch("browser compatibility")}} section below, but are no longer listed in the current spec. It is safe therefore to assume they are obsolete, and may stop working in future browser versions.

- -
-
{{domxref("Notification.onclose")}}
-
A handler for the {{event("close")}} event. It is triggered when the user closes the notification.
-
{{domxref("Notification.onshow")}}
-
A handler for the {{event("show")}} event. It is triggered when the notification is displayed.
-
- -

Methods

- -

Static methods

- -

These methods are available only on the Notification object itself.

- -
-
{{domxref("Notification.requestPermission()")}}
-
Requests permission from the user to display notifications.
-
- -

Instance methods

- -

These properties are available only on an instance of the Notification object or through its prototype. The Notification object also inherits from the {{domxref("EventTarget")}} interface.

- -
-
{{domxref("Notification.close()")}}
-
Programmatically closes a notification.
-
- -

Example

- -

Assume this basic HTML:

- -
<button onclick="notifyMe()">Notify me!</button>
- -

It's possible to send a notification as follows — here we present a fairly verbose and complete set of code you could use if you wanted to first check whether notifications are supported, then check if permission has been granted for the current origin to send notifications, then request permission if required, before then sending a notification.

- -
function notifyMe() {
-  // Let's check if the browser supports notifications
-  if (!("Notification" in window)) {
-    alert("This browser does not support desktop notification");
-  }
-
-  // Let's check whether notification permissions have already been granted
-  else if (Notification.permission === "granted") {
-    // If it's okay let's create a notification
-    var notification = new Notification("Hi there!");
-  }
-
-  // Otherwise, we need to ask the user for permission
-  else if (Notification.permission !== 'denied') {
-    Notification.requestPermission(function (permission) {
-      // If the user accepts, let's create a notification
-      if (permission === "granted") {
-        var notification = new Notification("Hi there!");
-      }
-    });
-  }
-
-  // At last, if the user has denied notifications, and you
-  // want to be respectful there is no need to bother them any more.
-}
- -

{{EmbedLiveSample('Example', '100%', 30)}}

- -

In many cases, you don't need to be this verbose. For example, in our Emogotchi demo (see source code), we simply run {{domxref("Notification.requestPermission")}} regardless to make sure we can get permission to send notifications (this uses the newer promise-based method syntax):

- -
Notification.requestPermission().then(function(result) {
-  console.log(result);
-});
- -

Then we run a simple spawnNotification() function when we want to fire a notification — this is passed arguments to specify the body, icon and title we want, then it creates the necessary options object and fires the notification using the {{domxref("Notification.Notification","Notification()")}} constructor.

- -
function spawnNotification(theBody,theIcon,theTitle) {
-  var options = {
-      body: theBody,
-      icon: theIcon
-  }
-  var n = new Notification(theTitle,options);
-}
- -

Specifications

- - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('Web Notifications')}}{{Spec2('Web Notifications')}}Living standard
- -

Browser compatibility

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support5{{property_prefix("webkit")}}[1]
- 22		{{CompatVersionUnknown}}4.0 {{property_prefix("moz")}}[2]
- 22		{{CompatNo}}256[3]
icon5{{property_prefix("webkit")}}[1]
- 22		{{CompatUnknown}}4.0 {{property_prefix("moz")}}[2]
- 22		{{CompatNo}}25{{CompatNo}}
Available in workers{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatGeckoDesktop("41.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
silent{{CompatChrome(43.0)}}{{CompatUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
noscreen, sticky{{CompatNo}}{{CompatUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
sound{{CompatNo}}{{CompatUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
renotify{{CompatChrome(50.0)}}{{CompatUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
Promise-based Notification.requestPermission(){{CompatChrome(46.0)}}{{CompatUnknown}}{{CompatGeckoDesktop("47.0")}}{{CompatUnknown}}{{CompatOpera(40)}}{{CompatNo}}
vibrate, actions{{CompatChrome(53.0)}}{{CompatUnknown}}  {{CompatOpera(39)}} 
badge{{CompatChrome(53.0)}}{{CompatUnknown}}  {{CompatOpera(39)}} 
image{{CompatChrome(55.0)}}{{CompatUnknown}}  {{CompatUnknown}} 
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidAndroid WebviewEdgeFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}} -

{{CompatVersionUnknown}}

- 		{{CompatVersionUnknown}}4.0{{property_prefix("moz")}}[2]
- 22		1.0.1{{property_prefix("moz")}}[2]
- 1.2		{{CompatNo}}{{CompatUnknown}}{{CompatNo}} -

{{CompatVersionUnknown}}

-
icon{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}4.0{{property_prefix("moz")}}[2]
- 22		1.0.1{{property_prefix("moz")}}[2]
- 1.2		{{CompatNo}}{{CompatUnknown}}{{CompatNo}}{{CompatVersionUnknown}}
Available in workers{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatGeckoMobile("41.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}
silent{{CompatNo}}{{CompatChrome(43.0)}}{{CompatUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatChrome(43.0)}}
noscreen, sticky{{CompatNo}}{{CompatNo}}{{CompatUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
sound{{CompatNo}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatVersionUnknown}}
renotify{{CompatNo}}{{CompatChrome(50.0)}}{{CompatUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
Promise-based Notification.requestPermission(){{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatGeckoMobile("47.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
vibrate, actions{{CompatNo}}{{CompatChrome(53.0)}}{{CompatUnknown}}   {{CompatOperaMobile(39)}} {{CompatChrome(53.0)}}
badge{{CompatNo}}{{CompatChrome(53.0)}}{{CompatUnknown}}   {{CompatOperaMobile(39)}} {{CompatChrome(53.0)}}
image{{CompatNo}}{{CompatNo}}{{CompatUnknown}}   {{CompatUnknown}} {{CompatChrome(55.0)}}
-
- -

[1] Before Chrome 22, the support for notification followed an old prefixed version of the specification and used the {{domxref("window.navigator.webkitNotifications","navigator.webkitNotifications")}} object to instantiate a new notification.

- -

Before Chrome 32, {{domxref("Notification.permission")}} was not supported.

- -

Before Chrome 42, service worker additions were not supported.

- -

Starting in Chrome 49, notifications do not work in incognito mode.

- -

[2] Prior to Firefox 22 (Firefox OS <1.2), the instantiation of a new notification must be done with the {{domxref("window.navigator.mozNotification", "navigator.mozNotification")}} object through its createNotification method.

- -

Prior to Firefox 22 (Firefox OS <1.2), the Notification was displayed when calling the show method and supported only the click and close events.

- -

Nick Desaulniers wrote a Notification shim to cover both newer and older implementations.

- -

One particular Firefox OS issue is that you can pass a path to an icon to use in the notification, but if the app is packaged you cannot use a relative path like /my_icon.png. You also can't use window.location.origin + "/my_icon.png" because window.location.origin is null in packaged apps. The manifest origin field fixes this, but it is only available in Firefox OS 1.1+. A potential solution for supporting Firefox OS <1.1 is to pass an absolute URL to an externally hosted version of the icon. This is less than ideal as the notification is displayed immediately without the icon, then the icon is fetched, but it works on all versions of Firefox OS.

- -

When using notifications  in a Firefox OS app, be sure to add the desktop-notification permission in your manifest file. Notifications can be used at any permission level, hosted or above: "permissions": { "desktop-notification": {} }

- -

[3] Safari started to support notification with Safari 6, but only on Mac OSX 10.8+ (Mountain Lion).

- -

See also

- - diff --git a/files/it/web/api/parentnode/index.html b/files/it/web/api/parentnode/index.html deleted file mode 100644 index 2cbf79f11c..0000000000 --- a/files/it/web/api/parentnode/index.html +++ /dev/null @@ -1,90 +0,0 @@ ---- -title: ParentNode -slug: Web/API/ParentNode -tags: - - API - - DOM - - Finding Elements - - Finding Nodes - - Interface - - Locating Elements - - Locating Nodes - - Managing Elements - - Managing Nodes - - Mixin - - NeedsTranslation - - Node - - ParentNode - - Reference - - Selectors - - TopicStub -translation_of: Web/API/ParentNode ---- -
{{APIRef("DOM")}}
- -

The ParentNode mixin contains methods and properties that are common to all types of {{domxref("Node")}} objects that can have children. It's implemented by {{domxref("Element")}}, {{domxref("Document")}}, and {{domxref("DocumentFragment")}} objects.

- -

See Locating DOM elements using selectors to learn how to use CSS selectors to find nodes or elements of interest.

- -

Properties

- -
-
{{domxref("ParentNode.childElementCount")}} {{readonlyInline}}
-
Returns the number of children of this ParentNode which are elements.
-
{{domxref("ParentNode.children")}} {{readonlyInline}}
-
Returns a live {{domxref("HTMLCollection")}} containing all of the {{domxref("Element")}} objects that are children of this ParentNode, omitting all of its non-element nodes.
-
{{domxref("ParentNode.firstElementChild")}} {{readonlyInline}}
-
Returns the first node which is both a child of this ParentNode and is also an Element, or null if there is none.
-
{{domxref("ParentNode.lastElementChild")}} {{readonlyInline}}
-
Returns the last node which is both a child of this ParentNode and is an Element, or null if there is none.
-
- -

Methods

- -
-
{{domxref("ParentNode.append()")}} {{experimental_inline}}
-
Inserts a set of {{domxref("Node")}} objects or {{domxref("DOMString")}} objects after the last child of the ParentNode. {{domxref("DOMString")}} objects are inserted as equivalent {{domxref("Text")}} nodes.
-
{{domxref("ParentNode.prepend()")}} {{experimental_inline}}
-
Inserts a set of {{domxref("Node")}} objects or {{domxref("DOMString")}} objects before the first child of the ParentNode. {{domxref("DOMString")}} objects are inserted as equivalent {{domxref("Text")}} nodes.
-
{{domxref("ParentNode.querySelector()")}}
-
Returns the first {{domxref("Element")}} with the current element as root that matches the specified group of selectors.
-
{{domxref("ParentNode.querySelectorAll()")}}
-
Returns a {{domxref("NodeList")}} representing a list of elements with the current element as root that matches the specified group of selectors.
-
- -

Specification

- - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('DOM WHATWG', '#parentnode', 'ParentNode')}}{{Spec2('DOM WHATWG')}}Split the ElementTraversal interface into {{domxref("ChildNode")}} and {{domxref("ParentNode")}}. The {{domxref("ParentNode.firstElementChild")}}, {{domxref("ParentNode.lastElementChild")}}, and {{domxref("ParentNode.childElementCount")}} properties are now defined on the latter. Added the {{domxref("ParentNode.children")}} property, and the {{domxref("ParentNode.querySelector()")}}, {{domxref("ParentNode.querySelectorAll()")}}, {{domxref("ParentNode.append()")}}, and {{domxref("ParentNode.prepend()")}} methods.
{{SpecName('Element Traversal', '#interface-elementTraversal', 'ElementTraversal')}}{{Spec2('Element Traversal')}}Added the initial definition of its properties to the ElementTraversal pure interface and used it on {{domxref("Element")}}.
- -

Browser compatibility

- - - -

{{Compat("api.ParentNode")}}

- -

See also

- - diff --git a/files/it/web/api/performance/index.html b/files/it/web/api/performance/index.html deleted file mode 100644 index fde24fddb4..0000000000 --- a/files/it/web/api/performance/index.html +++ /dev/null @@ -1,135 +0,0 @@ ---- -title: Performance -slug: Web/API/Performance -tags: - - API - - Interface - - Misurazione delle performance - - Performance - - Reference - - Web Performance -translation_of: Web/API/Performance ---- -
{{APIRef("High Resolution Time")}}
- -

 
- L'interaccia Performance fornisce l'accesso alle informazioni relative alle performance della pagina corrente. Fa parte delle High Resolution Time API, ma viene migliorata tramite le Performance Timeline API, le Navigation Timing API, le User Timing API e le Resource Timing API.

- -

Un oggetto di questo tipo può essere ottenuto chiamando {{domxref("Window.performance")}} in sola lettura.

- -
-

Nota:  Questa interfaccia ed i suoi metodi sono disponibili nei Web Workers, ad eccezione di dove diversamente indicato nella guida sottostante.
- Da notare inoltre che i markers delle peformance e le misurazioni sono relative al contesto. Se crei un marker sul thread principale (o su un altro worker), non potrai vederlo in un thread del worker e viceversa.

-
- -

Proprietà

- -

L'interfaccia Performance non eredita nessuna proprietà.

- -
-
{{deprecated_inline}} {{domxref("Performance.navigation")}} {{readonlyInline}}
-
{{domxref("PerformanceNavigation")}} è un oggetto che fornisce un utile contesto sulle operazioni incluse nella lista timing, sia che la pagina venga caricata o ricaricata, quante occorrenze di redirect sono presenti e così via. Not available in workers.
-
{{deprecated_inline}}  {{domxref("Performance.timing")}} {{readonlyInline}}
-
L'oggetto {{domxref("PerformanceTiming")}} contiene le informazioni relative alla latenza delle performance. Not available in workers.
-
{{domxref("Performance.memory", "performance.memory")}} {{Non-standard_inline}}
-
Estensione non-standard aggiunta in Chrome, questa proprietà fornisce un oggetto con l'utilizzo della memoria di base. Non dovresti usare questa API non-stanrdard.
-
{{domxref("Performance.timeOrigin")}} {{readonlyInline}} {{Non-standard_inline}}
-
Restituisce il timestamp preciso del momento in cui si è iniziato a misurare le performance.
-
- -
-
-

Event handlers

-
-
{{domxref("Performance.onresourcetimingbufferfull")}}
-
Un {{domxref("EventTarget")}} che funge da callback e che viene eseguito quando viene scatenato l'evento {{event("resourcetimingbufferfull")}}
-
- -

Metodi

- -

L'interfaccia Performance non eredita nessun metodo.

- -
-
{{domxref("Performance.clearMarks()")}}
-
Rimuove il segnaposto specificato dal buffer delle performance del browser.
-
{{domxref("Performance.clearMeasures()")}}
-
Rimuove la misurazione specificata dal buffer delle performance del browser.
-
{{domxref("Performance.clearResourceTimings()")}}
-
Rimuove tutte le {{domxref("PerformanceEntry","performance entries")}} con un {{domxref("PerformanceEntry.entryType","entryType")}} di resource dal data buffer delle performance del browser.
-
{{domxref("Performance.getEntries()")}}
-
Restituisce una lista di oggetti di tipo {{domxref("PerformanceEntry")}}  basati sul filtro specificato.
-
{{domxref("Performance.getEntriesByName()")}}
-
Restituisce una lista di oggetti di tipo {{domxref("PerformanceEntry")}} secondo il nome specificato ed il tipo divoce specificata.
-
{{domxref("Performance.getEntriesByType()")}}
-
Restituisce una list di oggetti {{domxref("PerformanceEntry")}} relativi alla voce specificata
-
{{domxref("Performance.mark()")}}
-
Crea un {{domxref("DOMHighResTimeStamp","timestamp")}} nel buffer delle performance usando il nome specificato.
-
{{domxref("Performance.measure()")}}
-
Crea un {{domxref("DOMHighResTimeStamp","timestamp")}} nel buffer delle performance del browser tra due segnaposti (indicati rispettivamente come start mark ed end mark)
-
{{domxref("Performance.now()")}}
-
Restituisce un {{domxref("DOMHighResTimeStamp")}} ceh rappresenta il numero in millisecondi trascorso dall'istante preso come riferimento.
-
{{domxref("Performance.setResourceTimingBufferSize()")}}
-
Imposta la dimensione del buffer del browser relativo alla temporizzazione in un numero specificato di oggetti {{domxref("PerformanceEntry","performance entry")}} "resource" {{domxref("PerformanceEntry.entryType","type")}}
-
{{domxref("Performance.toJSON()")}}
-
Restituisce un oggetto json che rappresenta l'oggetto Performance
-
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('Highres Time Level 3', '#dom-performance-timeorigin','timeOrigin')}}{{Spec2('Highres Time Level 3')}}Definisce la proprietà timeOrigin 
{{SpecName('Highres Time Level 2', '#the-performance-interface', 'toJSON()')}}{{Spec2('Highres Time Level 2')}}Definisce il metodo toJson() .
{{SpecName('Highres Time', '#the-performance-interface', 'Performance')}}{{Spec2('Highres Time')}}Definisce il metodo now() .
{{SpecName('Performance Timeline Level 2', '#extensions-to-the-performance-interface', 'Performance extensions')}}{{Spec2('Performance Timeline Level 2')}}Cambia l'interfaccia getEntries() .
{{SpecName('Performance Timeline', '#sec-window.performance-attribute', 'Performance extensions')}}{{Spec2('Performance Timeline')}}Definisce i metodi getEntries(), getEntriesByType() e getEntriesByName() .
{{SpecName('Resource Timing', '#extensions-performance-interface', 'Performance extensions')}}{{Spec2('Resource Timing')}}Definisce i metodi clearResourceTimings() e setResourceTimingBufferSize() e la proprietà onresourcetimingbufferfull .
{{SpecName('User Timing Level 2', '#extensions-performance-interface', 'Performance extensions')}}{{Spec2('User Timing Level 2')}}Spiega i metodi mark(), clearMark(), measure() e clearMeasure() .
{{SpecName('User Timing', '#extensions-performance-interface', 'Performance extensions')}}{{Spec2('User Timing')}}Definisce i metodi mark(), clearMark(), measure() e clearMeasure().
- -

Browser compatibility

- -
- - -

{{Compat("api.Performance")}}

-
diff --git a/files/it/web/api/performance/now/index.html b/files/it/web/api/performance/now/index.html deleted file mode 100644 index 2331157f18..0000000000 --- a/files/it/web/api/performance/now/index.html +++ /dev/null @@ -1,104 +0,0 @@ ---- -title: performance.now() -slug: Web/API/Performance/now -tags: - - API - - Performance - - Prestazioni - - Reference - - Riferimento - - Web Performance API - - metodo -translation_of: Web/API/Performance/now ---- -
{{APIRef("High Resolution Timing")}}
- -

Il metodo performance.now() restituisce un {{domxref("DOMHighResTimeStamp")}}, misurato in millisecondi.

- -
-

The timestamp is not actually high-resolution. To mitigate security threats such as Spectre, browsers currently round the results to varying degrees. (Firefox started rounding to 1 millisecond in Firefox 60.) Some browsers may also slightly randomize the timestamp. The precision may improve again in future releases; browser developers are still investigating these timing attacks and how best to mitigate them.

-
- -

{{AvailableInWorkers}}

- -

Il valore restituito rappresenta il tempo trascorso dal time origin.

- -

Tieni a mente i seguenti punti:

- - - -

Sintassi

- -
t = performance.now();
- -

Esempio

- -
var t0 = performance.now();
-doSomething();
-var t1 = performance.now();
-console.log("Call to doSomething took " + (t1 - t0) + " milliseconds.");
-
- -

A differenza di altri timing data disponibili con JavaScript (per esempio Date.now), i timestamps restituiti da Performance.now() non sono limitati a una risoluzione di un millisecondo. Invece, rappresentano il tempo come numeri a virgola mobile con una precisione che può arrivare a un microsecondo.

- -

Inolre, a differenza di Date.now(), il valore restituito da Performance.now() aumenta sempre con costanza, indipendentemente dal clock di sistema (che può essere regolato manualmente o distorto da software come NTP). Altrimenti, performance.timing.navigationStart + performance.now() sarà approssimativamente uguale a Date.now().

- -

Reduced time precision

- -

To offer protection against timing attacks and fingerprinting, the precision of performance.now() might get rounded depending on browser settings.
- In Firefox, the privacy.reduceTimerPrecision  preference is enabled by default and defaults to 1ms.

- -
// reduced time precision (1ms) in Firefox 60
-performance.now();
-// 8781416
-// 8781815
-// 8782206
-// ...
-
-
-// reduced time precision with `privacy.resistFingerprinting` enabled
-performance.now();
-// 8865400
-// 8866200
-// 8866700
-// ...
-
- -

In Firefox, you can also enable privacy.resistFingerprinting — this changes the precision to 100ms or the value of privacy.resistFingerprinting.reduceTimerPrecision.microseconds, whichever is larger.

- -

Specifications

- - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('Highres Time Level 2', '#dom-performance-now', 'performance.now()')}}{{Spec2('Highres Time Level 2')}}Stricter definitions of interfaces and types.
{{SpecName('Highres Time', '#dom-performance-now', 'performance.now()')}}{{Spec2('Highres Time')}}Initial definition
- -

Browser compatibility

- - - -

{{Compat("api.Performance.now")}}

- -

See also

- - diff --git a/files/it/web/api/plugin/index.html b/files/it/web/api/plugin/index.html deleted file mode 100644 index b160be06fc..0000000000 --- a/files/it/web/api/plugin/index.html +++ /dev/null @@ -1,64 +0,0 @@ ---- -title: Plug-in -slug: Web/API/Plugin -tags: - - Add-ons - - Plugins - - Tutte_le_categorie -translation_of: Web/API/Plugin -original_slug: Plug-in ---- -

 

-
-

I Plugins (o plug-ins) sono piccoli software che interagiscono con il browser al fine di fornire alcune funzioni specifiche. Classici esempi di plugin sono quelli che consentono di visualizzare formati grafici specifici, o di eseguire file multimediali. I plugin sono leggermente diversi dalle estensioni, che modificano o aggiungono funzionalità già presenti.

-
- - - - - - - -
-

Documentazione

-
-
- Gecko Plugin API Reference
-
- Questo manuale di riferimento descrive le interfacce impiegabili dal programmatore nella realizzazione di plugin per Gecko, e fornisce indicazioni su come usare tali interfacce.
-
-
-
- Using XPInstall to Install Plugins
-
- XPInstall è una tecnologia che consente una interazione utente molto semplice qualora sia necessario aggiungere nuovi plugin, senza dover costringere l'utente ad uscire dal proprio ambiente di navigazione per eseguire un programma esterno di installazione.
-
-
-
- Detecting Plugins (en)
-
- "Dato che ci sono delle ovvie situazioni in cui ha un senso usare un plug-in, la domanda che sorge è come interagire con coloro che non hanno già installato il plug-in necessario"
-
-
-
- Scripting Plugins: Macromedia Flash
-
- Questo articolo spiega come è possibile usare JavaScript per accedere a metodi disponibili in un plugin Flash, ed anche come impiegare la funzionalità chiamata FSCommands per accedere a funzioni JavaScript dall'interno di animazioni Flash.
-
-

Mostra tutto...

- 		-

Community

-
    -
  • View Mozilla forums...
    • -
-

{{ DiscussionList("dev-tech-plugins", "mozilla.dev.tech.plugins") }}

- -
-
- Gecko
-
-
-

Categories

-

Interwiki Language Links

-

 

-

{{ languages( { "en": "en/Plugins", "es": "es/Plugins", "fr": "fr/Plugins", "ja": "ja/Plugins", "pl": "pl/Wtyczki" } ) }}

diff --git a/files/it/web/api/range/clonecontents/index.html b/files/it/web/api/range/clonecontents/index.html deleted file mode 100644 index 48d1bc09b9..0000000000 --- a/files/it/web/api/range/clonecontents/index.html +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: range.cloneContents -slug: Web/API/Range/cloneContents -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Range/cloneContents ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce un frammento del documento copiando i nodi di un Range.

-

Sintassi

-
frammento = range.cloneContents();
-
-

Esempio

-
range = document.createRange();
-range.selectNode(document.getElementsByTagName("div").item(0));
-frammento = range.cloneContents();
-document.body.appendChild(frammento);
-
-

Note

-

Gli Event Listener aggiunti utilizzando gli Event del DOM non vengono copiati durante la clonazione. Gli attributi-evento di HTML vengono duplicati allo stesso modo in cui li copia il metodo clonNode. Anche gli attributi HTML "id" vengono clonati, il che può portare a rendere il documento non valido.

-

I nodi parzialmente selezionati includono i tag padri necessari perché il frammento di documento sia valido.

-

Specifiche

-

cloneContents

diff --git a/files/it/web/api/range/clonerange/index.html b/files/it/web/api/range/clonerange/index.html deleted file mode 100644 index ba8c0076b3..0000000000 --- a/files/it/web/api/range/clonerange/index.html +++ /dev/null @@ -1,28 +0,0 @@ ---- -title: range.cloneRange -slug: Web/API/Range/cloneRange -translation_of: Web/API/Range/cloneRange ---- -

{{ APIRef("DOM") }}

- -

Restituisce un oggetto Range con i punti d'inizio e di fine identici a quelli del Range attuale.

- -

Sintassi

- -
clone = range.cloneRange();
-
- -

Esempio

- -
range = document.createRange();
-range.selectNode(document.getElementsByTagName("div").item(0));
-clone = range.cloneRange();
-
- -

Note

- -

Il Range viene copiato per valore, non per referenza, quindi una modifica su uno dei due oggetti non avrà effetti sull'altro.

- -

Specifiche

- -

cloneRange

diff --git a/files/it/web/api/range/collapse/index.html b/files/it/web/api/range/collapse/index.html deleted file mode 100644 index f976cfeca6..0000000000 --- a/files/it/web/api/range/collapse/index.html +++ /dev/null @@ -1,36 +0,0 @@ ---- -title: range.collapse -slug: Web/API/Range/collapse -translation_of: Web/API/Range/collapse ---- -

{{ APIRef("DOM") }}

- -

Collassa il range tra i suoi due estremi.

- -

Sintassi

- -
range.collapse(toStart);
-
- -

Parametri

- -
-
toStart 
-
Un booleano, true collassa il Range al suo punto iniziale, False lo collassa alla fine.
-
- -

Esempio

- -
range = document.createRange();
-referenceNode = document.getElementsByTagName("div").item(0);
-range.selectNode(referenceNode);
-range.collapse(true);
-
- -

Note

- -

Un Range collassato è vuoto, non ha alcun contenuto, specifica un singolo punto nell'albero del DOM. Per determinare se un Range è già collassato, si veda la proprietà collapsed.

- -

Specifiche

- -

collapse

diff --git a/files/it/web/api/range/collapsed/index.html b/files/it/web/api/range/collapsed/index.html deleted file mode 100644 index 3d06ee5385..0000000000 --- a/files/it/web/api/range/collapsed/index.html +++ /dev/null @@ -1,33 +0,0 @@ ---- -title: range.collapsed -slug: Web/API/Range/collapsed -translation_of: Web/API/Range/collapsed ---- -

{{ APIRef("DOM") }}

- -

Restituisce un booleano che indica se i punti d'inizio e di fine sono nella stessa posizione.

- -

Sintassi

- -
isCollapsed = range.collapsed;
-
- -

Esempio

- -
range = document.createRange();
-range.setStart(startNode,startOffset);
-range.setEnd(endNode,endOffset);
-isCollapsed = range.collapsed;
-
- -

Note

- -

Restituisce il valore booleano true se l'inizio e la fine del Range sono lo stesso punto nel DOM, altrimenti restituisce false.

- -

Un Range collapsed è vuoto, non ha alcun contenuto, rappresenta un singolo punto nell'albero del DOM. Per collassare un Range, si veda il metodo collapse.

- -

Specifiche

- -

collapsed

- -

{{ languages( { "ja": "ja/DOM/range.collapsed" } ) }}

diff --git a/files/it/web/api/range/commonancestorcontainer/index.html b/files/it/web/api/range/commonancestorcontainer/index.html deleted file mode 100644 index 9f4cbec910..0000000000 --- a/files/it/web/api/range/commonancestorcontainer/index.html +++ /dev/null @@ -1,31 +0,0 @@ ---- -title: range.commonAncestorContainer -slug: Web/API/Range/commonAncestorContainer -translation_of: Web/API/Range/commonAncestorContainer ---- -

{{ APIRef("DOM") }}

- -

Restituisce il nodo più interno che contiene i nodi startContainer e endContainer.

- -

Sintassi

- -
rangeAncestor = range.commonAncestorContainer;
-
- -

Esempio

- -
range = document.createRange();
-range.setStart(startNode,startOffset);
-range.setEnd(endNode,endOffset);
-rangeAncestor = range.commonAncestorContainer;
-
- -

Note

- -

Restituisce il nodo che si trova più in profondità, o più in basso nell'albero del DOM, che contiene entrambi i nodi startContainer e endContainer. Siccome Range non deve necessariamente essere contiguo e potrebbe anche selezionare solo in parte alcuni nodi, questo è un modo conveniente per trovare un nodo che racchiuda completamente il Range.

- -

Questa proprietà è di sola lettura. Per cambiare il più profondo contenitore di un nodo, si consideri la possibilità di utilizzare i vari metodi per impostare le posizioni iniziali e finali di un Range.

- -

Specifiche

- -

commonAncestorContainer

diff --git a/files/it/web/api/range/compareboundarypoints/index.html b/files/it/web/api/range/compareboundarypoints/index.html deleted file mode 100644 index f815fd019b..0000000000 --- a/files/it/web/api/range/compareboundarypoints/index.html +++ /dev/null @@ -1,54 +0,0 @@ ---- -title: range.compareBoundaryPoints -slug: Web/API/Range/compareBoundaryPoints -translation_of: Web/API/Range/compareBoundaryPoints ---- -

{{ APIRef("DOM") }}

- -

Compara i punti estremi di due Range.

- -

Sintassi

- -
compara =
-range.compareBoundaryPoints(
-come,
-rangeSorgente);
-
- -
-
compara 
-
Un numero che vale 1, 0, o -1, che indica se un punto estremo di - range - è rispettivamente prima, nella stessa posizione o dopo il corrispondente punto estremo di rangeSorgente.
-
come 
-
Una costante che indica la modalità di comparazione, i possibili valori sono descritti sotto.
-
rangeSorgente 
-
Un range con cui effettuare la comparazione
-
- -

Esempio

- -
var range, rangeSorgente, compara;
-range = document.createRange();
-range.selectNode(document.getElementsByTagName("div")[0]);
-rangeSorgente = document.createRange();
-rangeSorgente.selectNode(document.getElementsByTagName("div")[1]);
-compara = range.compareBoundaryPoints(START_TO_END, rangeSorgente);
-
- -

Note

- -

Il parametro - come - può assumere i seguenti valori:

- - - -

Specifiche

- -

DOM Level 2 Traversal: compareBoundaryPoints

diff --git a/files/it/web/api/range/comparepoint/index.html b/files/it/web/api/range/comparepoint/index.html deleted file mode 100644 index 2d3356b532..0000000000 --- a/files/it/web/api/range/comparepoint/index.html +++ /dev/null @@ -1,37 +0,0 @@ ---- -title: range.comparePoint -slug: Web/API/Range/comparePoint -translation_of: Web/API/Range/comparePoint ---- -

{{ APIRef("DOM") }}

- -

Restituisce -1 se nodo si trova prima del range, 0 se si trova nello stesso punto, 1 se si trova dopo.

- -

Sintassi

- -
int = range.comparePoint( nodo, offset )
-
- -

Parametri

- -
-
nodo 
-
Il node da comparare con range
-
offset 
-
Un intero maggiore o uguale a zero che rappresenta la distanza dall'inizio del nodo
-
- -

Esempio

- -
range = document.createRange();
-range.selectNode(document.getElementsByTagName("div").item(0));
-valore = range.comparePoint(document.getElementsByTagName("p").item(0),1);
-
- -

Note

- -

Se il nodo è di tipo Text, Comment, o CDATASection, allora l'offset è il numero di caratteri dall'inizio del nodo. Per tutti gli altri tipi di nodo, offset</offset> rappresenta il numero dei nodi figlio dall'inizio di <code>nodo.

- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/range/createcontextualfragment/index.html b/files/it/web/api/range/createcontextualfragment/index.html deleted file mode 100644 index f56354ddc4..0000000000 --- a/files/it/web/api/range/createcontextualfragment/index.html +++ /dev/null @@ -1,37 +0,0 @@ ---- -title: range.createContextualFragment -slug: Web/API/Range/createContextualFragment -translation_of: Web/API/Range/createContextualFragment ---- -

{{ APIRef("DOM") }}

- -

Restituisce un frammento di documento.

- -

Sintassi

- -
frammento = range.createContextualFragment( tag )
-
- -

Parametri

- -
-
tag 
-
stringa che contiene del testo da convertire in un frammento di documento
-
- -

Esempio

- -
var tag = "<div>Ciao, sono un nodo!</div>";
-var range = document.createRange();
-range.selectNode(document.getElementsByTagName("div").item(0));
-var frammento = range.createContextualFragment(tag);
-document.body.appendChild(frammento);
-
- -

Note

- -

Questo metodo accetta una stringa e utilizza l'interprete di Mozilla per convertirla in un ramo (o un singolo nodo) del DOM.

- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/range/deletecontents/index.html b/files/it/web/api/range/deletecontents/index.html deleted file mode 100644 index 25ade9f3ca..0000000000 --- a/files/it/web/api/range/deletecontents/index.html +++ /dev/null @@ -1,25 +0,0 @@ ---- -title: range.deleteContents -slug: Web/API/Range/deleteContents -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Range/deleteContents ---- -

{{ ApiRef() }}

-

Sommario

-

Rimuove i contenuti di un Range dal documento.

-

Sintassi

-
range.deleteContents()
-
-

Esempio

-
range = document.createRange();
-range.selectNode(document.getElementsByTagName("div").item(0));
-range.deleteContents();
-
-

Note

-

Diversamente dal metodo extractContents, deleteContents non restituisce un frammento di documento contenente il contenuto cancellato.

-

Specifiche

-

deleteContents

diff --git a/files/it/web/api/range/detach/index.html b/files/it/web/api/range/detach/index.html deleted file mode 100644 index be4f1de75d..0000000000 --- a/files/it/web/api/range/detach/index.html +++ /dev/null @@ -1,28 +0,0 @@ ---- -title: range.detach -slug: Web/API/Range/detach -translation_of: Web/API/Range/detach ---- -

{{ APIRef("DOM") }}

- -

Rilascia un Range in uso, per liberare memoria.

- -

Sintassi

- -
range.detach();
-
- -

Esempio

- -
range = document.createRange();
-range.selectNode(document.getElementsByTagName("div").item(0));
-range.detach();
-
- -

Note

- -

Permette a Mozilla di rilasciare le risorse associate a questo Range. Successivi tentativi di usare il range rilasciato causeranno una DOMException lanciata con un codice di errore INVALID_STATE_ERR.

- -

Specifiche

- -

detach

diff --git a/files/it/web/api/range/endcontainer/index.html b/files/it/web/api/range/endcontainer/index.html deleted file mode 100644 index b727827a32..0000000000 --- a/files/it/web/api/range/endcontainer/index.html +++ /dev/null @@ -1,29 +0,0 @@ ---- -title: range.endContainer -slug: Web/API/Range/endContainer -translation_of: Web/API/Range/endContainer ---- -

{{ APIRef("DOM") }}

- -

Restituisce il nodo dentro il quale termina il Range.

- -

Sintassi

- -
endRangeNode = range.endContainer;
-
- -

Esempio

- -
range = document.createRange();
-range.setStart(startNode,startOffset);
-range.setEnd(endNode,endOffset);
-endRangeNode = range.endContainer;
-
- -

Note

- -

Restituisce una referenza al Nodo del documento dentro il quale termina il Range. Questa proprietà è di sola lettura. Per modificare la posizione finale di un nodo, si può utilizzare il metodo setEnd o un altro metodo simile.

- -

Specifiche

- -

endContainer

diff --git a/files/it/web/api/range/endoffset/index.html b/files/it/web/api/range/endoffset/index.html deleted file mode 100644 index 0d4556ef6f..0000000000 --- a/files/it/web/api/range/endoffset/index.html +++ /dev/null @@ -1,29 +0,0 @@ ---- -title: range.endOffset -slug: Web/API/Range/endOffset -translation_of: Web/API/Range/endOffset ---- -

{{ APIRef("DOM") }}

- -

Restituisce un numero che rappresenta dove termina il Range, all'interno di endContainer.

- -

Sintassi

- -
endRangeOffset = range.endOffset;
-
- -

Esempio

- -
range = document.createRange();
-range.setStart(startNode,startOffset);
-range.setEnd(endNode,endOffset);
-endRangeOffset = range.endOffset;
-
- -

Note

- -

endOffset ha due significati. Se endContainer è un Node di tipo Text, Comment, o CDATASection, allora l'offset è il numero di caratteri dall'inizio di endContainer alla fine del Range. Per altri tipi di Node, endOffset è il numero dei nodi figli tra l'inizio di endContainer e la fine del Range. Questa proprietà è di sola lettura. Per cambiare l'endOffset del Range, è possibile utilizzare uno dei metodi setEnd.

- -

Specifiche

- -

endOffset

diff --git a/files/it/web/api/range/extractcontents/index.html b/files/it/web/api/range/extractcontents/index.html deleted file mode 100644 index 9c2cc50586..0000000000 --- a/files/it/web/api/range/extractcontents/index.html +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: range.extractContents -slug: Web/API/Range/extractContents -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Range/extractContents ---- -

{{ ApiRef() }}

-

Sommario

-

Sposta i contenuti di un Range da un ramo del documento ad un altro ramo del documento.

-

Sintassi

-
frammento = range.extractContents();
-
-

Esempio

-
range = document.createRange();
-range.selectNode(document.getElementsByTagName("div").item(0));
-frammento = range.extractContents();
-document.body.appendChild(frammento);
-
-

Note

-

Gli Event Listener creati utilizzando gli eventi DOM non vengono conservati durante l'estrazione. Gli attributi-evento di HTML non vengono conservati nè duplicati. Gli attributi HTML "id" vengono clonati, il che può portare a rendere invalido un documento se il nodo parzialmente selezionato è estratto ed aggiunto in un altro punto del documento.

-

I nodi parzialmente selezionati vengono clonati per includere i tag padri necessari perché il frammento del documento sia valido.

-

Specifiche

-

extractContents

diff --git a/files/it/web/api/range/index.html b/files/it/web/api/range/index.html deleted file mode 100644 index 9ff0663ee0..0000000000 --- a/files/it/web/api/range/index.html +++ /dev/null @@ -1,150 +0,0 @@ ---- -title: range -slug: Web/API/Range -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - SezioneIncompleta - - Tutte_le_categorie -translation_of: Web/API/Range ---- -

{{ ApiRef() }}

-

Introduzione

-

L'oggetto Range rappresenta una parte di un documento, che può contenere nodi e parti di nodi testuali del documento dato.

-

Un range può essere creato usando il metodo createRange dell'oggetto document. Gli oggetti Range possono essere ottenuti anche usando il metodo getRangeAt dell'oggetto selection.

-

Proprietà

-
-
- collapsed
-
- Restituisce un booleano che indica se i punti d'inizio e di fine del range sono nella stessa posizione.
-
- commonAncestorContainer
-
- Restituisce il nodo più interno che contiene i nodi startContainer e endContainer.
-
- endContainer
-
- Restituisce il nodo nel quale il Range finisce.
-
- endOffset
-
- Restituisce un numero che rappresenta il punto preciso in cui il Range finisce, all'interno di endContainer.
-
- startContainer
-
- Restituisce il nodo nel quale il Range inizia.
-
- startOffset
-
- Restituisce un numero che rappresenta il punto preciso in cui il Range inizia, all'interno di startContainer.
-
-

Metodi

-

Metodi di posizionamento

-

Questi metodi impostano i punti di inizio e di fine di un range.

-
-
- setStart
-
- Imposta la posizione iniziale di un Range.
-
- setEnd
-
- Setta la posizione finale di un Range.
-
- setStartBefore
-
- Setta la posizione iniziale di un Range nel nodo precedente a quello indicato.
-
- setStartAfter
-
- Setta la posizione iniziale di un Range nel nodo successivo a quello indicato.
-
- setEndBefore
-
- Setta la posizione finale di un Range nel nodo precedente a quello indicato.
-
- setEndAfter
-
- Setta la posizione finale di un Range nel nodo successivo a quello indicato.
-
- selectNode
-
- Inserisce all'interno di un Range uno specifico nodo e il suo contenuto.
-
- selectNodeContents
-
- Inserisce all'interno di un Range esclusivamente il contenuto di uno specifico nodo.
-
- collapse
-
- Collassa un Range in uno dei punti estremi.
-
-

Metodi per modificare un Range

-

Questi metodi prendono i nodi da un range e ne modificano i contenuti.

-
-
- cloneContents
-
- Restituisce un frammento di documento copiando i nodi da un Range.
-
- deleteContents
-
- Rimuove dal documento i contenuti di un Range.
-
- extractContents
-
- Muove i contenuti di un Range dall'albero del documento in un frammento del documento.
-
- insertNode
-
- Inserisce un nodo all'inizio di un Range.
-
- surroundContents
-
- Muove il contenuto di un Range in un nuovo nodo.
-
-

Altri metodi

-
-
- compareBoundaryPoints
-
- Compara i punti estremi di due Range.
-
- cloneRange
-
- Restituisce un oggetto Range con i punti estremi identici al Range clonato.
-
- detach
-
- Rilascia un Range dall'uso, per migliorare le performance.
-
- toString
-
- Restituisce il testo di un Range.
-
-

Metodi proprietari di Gecko

-

Questa sezione descrive metodi di Range implementati in Gecko ma che non fanno parte delle specifiche DOM del W3C.

-
-
- compareNode (obsoleto)
-
- Restituisce una costante che rappresenta se il nodo viene prima, dopo o dentro il Range.
-
- comparePoint
-
- Restituisce -1, 0, o 1 per indicare se il punto viene prima, dentro o dopo il range.
-
- createContextualFragment
-
- Restituisce un frammento di documento creato a partire da una data stringa di codice.
-
- intersectsNode (obsoleto)
-
- Restituisce un booleano che indica se il nodo dato interseca il range.
-
- isPointInRange
-
- Restituisce un booleano che indica se il punto dato è interno al range.
-
diff --git a/files/it/web/api/range/insertnode/index.html b/files/it/web/api/range/insertnode/index.html deleted file mode 100644 index 6abfe0f295..0000000000 --- a/files/it/web/api/range/insertnode/index.html +++ /dev/null @@ -1,38 +0,0 @@ ---- -title: range.insertNode -slug: Web/API/Range/insertNode -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Range/insertNode ---- -
- {{APIRef}}
-
-  
-

Sommario

-

Inserisce un nodo all'inizio di un range.

-

Sintassi

-
range.insertNode(nuovoNodo);
-
-

Parameters

-
-
- nuovoNodo 
-
- è un oggetto node.
-
-

Esempio

-
range = document.createRange();
-nuovoNodo = document.createElement("p");
-nuovoNodo.appendChild(document.createTextNode("Un nuovo nodo viene inserito qui"));
-range.selectNode(document.getElementsByTagName("div").item(0));
-range.insertNode(nuovoNodo);
-
-

Note

-

nuovoNodo viene inserito al punto iniziale del Range. Se nuovoNodo deve essere aggiunto a un nodo testo, quel nodo viene diviso al punto dell'inserimento e l'aggiunta avviene tra il due nodi testo risultanti (si veda però il bug http://bugzilla.mozilla.org/show_bug.cgi?id=135922 ).

-

Se nuovoNodo è un frammento di documento, i figli del frammento vengono inseriti al suo posto.

-

Specifiche

-

insertNode

diff --git a/files/it/web/api/range/ispointinrange/index.html b/files/it/web/api/range/ispointinrange/index.html deleted file mode 100644 index 86c7e3ec43..0000000000 --- a/files/it/web/api/range/ispointinrange/index.html +++ /dev/null @@ -1,31 +0,0 @@ ---- -title: range.isPointInRange -slug: Web/API/Range/isPointInRange -translation_of: Web/API/Range/isPointInRange ---- -

{{ APIRef("DOM") }}

- -

Restituisce un valore booleano che indica se il punto passato si trova all'interno del range.

- -

Sintassi

- -
bool = range.isPointInRange( nodo )
-
- -

Parametri

- -
-
nodo 
-
Il Node da comparare con il Range.
-
- -

Esempio

- -
range = document.createRange();
-range.selectNode(document.getElementsByTagName("div").item(0));
-bool = range.isPointInRange(document.getElementsByTagName("p").item(0),1);
-
- -

Specifiche

- -

DOM Level 0. Non è parte di alcun standard.

diff --git a/files/it/web/api/range/selectnode/index.html b/files/it/web/api/range/selectnode/index.html deleted file mode 100644 index 2b08e16731..0000000000 --- a/files/it/web/api/range/selectnode/index.html +++ /dev/null @@ -1,35 +0,0 @@ ---- -title: range.selectNode -slug: Web/API/Range/selectNode -translation_of: Web/API/Range/selectNode ---- -

{{ APIRef("DOM") }}

- -

Imposta il Range in modo tale che contenga un nodo e tutti i suoi elementi.

- -

Sintassi

- -
range.selectNode(referenceNode);
-
- -

Parametri

- -
-
referenceNode 
-
Il Node da selezionare dentro un Range
-
- -

Esempio

- -
range = document.createRange();
-referenceNode = document.getElementsByTagName("div").item(0);
-range.selectNode(referenceNode);
-
- -

Note

- -

Il Node padre dell'inizio e della fine del Range sarà lo stesso del padre del referenceNode.

- -

Specifiche

- -

selectNode

diff --git a/files/it/web/api/range/selectnodecontents/index.html b/files/it/web/api/range/selectnodecontents/index.html deleted file mode 100644 index e558cf5982..0000000000 --- a/files/it/web/api/range/selectnodecontents/index.html +++ /dev/null @@ -1,37 +0,0 @@ ---- -title: range.selectNodeContents -slug: Web/API/Range/selectNodeContents -translation_of: Web/API/Range/selectNodeContents ---- -

 

- -

{{ APIRef("DOM") }}

- -

Imposta il Range perchè contenga il contenuti di un dato Node.

- -

Sintassi

- -
range.selectNodeContents(referenceNode);
-
- -

Parametri

- -
-
referenceNode 
-
Il Node i cui contenuti devono essere selezionati dentro il Range
-
- -

Esempio

- -
range = document.createRange();
-referenceNode = document.getElementsByTagName("div").item(0);
-range.selectNodeContents(referenceNode);
-
- -

Note

- -

Il Node padre dell'inizio e della fine del Range sarà referenceNode. startOffset è 0 e endOffset è il numero dei Node figli o il numero dei caratteri contenuti nel referenceNode.

- -

Specifiche

- -

selectNodeContents

diff --git a/files/it/web/api/range/setend/index.html b/files/it/web/api/range/setend/index.html deleted file mode 100644 index 02754fbedb..0000000000 --- a/files/it/web/api/range/setend/index.html +++ /dev/null @@ -1,38 +0,0 @@ ---- -title: range.setEnd -slug: Web/API/Range/setEnd -translation_of: Web/API/Range/setEnd ---- -

{{ APIRef("DOM") }}

- -

Imposta la posizione finale di un Range.

- -

Sintassi

- -
range.setEnd(endNode,endOffset);
-
- -

Parametri

- -
-
endNode 
-
Il Node che termina il Range
-
endOffset 
-
Un intero maggiore o uguale a zero che rappresenta la distanza della fine del Range dall'inizio di endNode.
-
- -

Esempio

- -
range = document.createRange();
-endNode = document.getElementsByTagName("p").item(3);
-endOffset = document.getElementsByTagName("p").item(3).childNodes.length;
-range.setEnd(endNode,endOffset);
-
- -

Note

- -

Se l'endNode è un Node di tipo Text, Comment, o CDATASection, allora endOffset è il numero di caratteri dall'inizio di endNode. Per altri tipi di Node, endOffset è il numero dei nodi figlio dall'inizio di endNode.

- -

Specifiche

- -

setEnd

diff --git a/files/it/web/api/range/setendafter/index.html b/files/it/web/api/range/setendafter/index.html deleted file mode 100644 index 7d23e74e02..0000000000 --- a/files/it/web/api/range/setendafter/index.html +++ /dev/null @@ -1,35 +0,0 @@ ---- -title: range.setEndAfter -slug: Web/API/Range/setEndAfter -translation_of: Web/API/Range/setEndAfter ---- -

{{ APIRef("DOM") }}

- -

Imposta la posizione finale di un Range relativamente a un altro Node.

- -

Syntax

- -
range.setEndAfter(referenceNode);
-
- -

Parametri

- -
-
referenceNode 
-
Il Node dopo il quale deve terminare il Range
-
- -

Esempio

- -
range = document.createRange();
-referenceNode = document.getElementsByTagName("div").item(0);
-range.setEndAfter(referenceNode);
-
- -

Note

- -

Il Node della fine del Range sarà lo stesso di referenceNode.

- -

Specification

- -

setEndAfter

diff --git a/files/it/web/api/range/setendbefore/index.html b/files/it/web/api/range/setendbefore/index.html deleted file mode 100644 index 69b3f0e961..0000000000 --- a/files/it/web/api/range/setendbefore/index.html +++ /dev/null @@ -1,35 +0,0 @@ ---- -title: range.setEndBefore -slug: Web/API/Range/setEndBefore -translation_of: Web/API/Range/setEndBefore ---- -

{{ APIRef("DOM") }}

- -

Imposta la posizione finale di un Range relativamente a un altro Node.

- -

Sintassi

- -
range.setEndBefore(referenceNode);
-
- -

Parametri

- -
-
referenceNode 
-
Il Node prima del quale deve terminare il Range
-
- -

Esempio

- -
range = document.createRange();
-referenceNode = document.getElementsByTagName("div").item(0);
-range.setEndBefore(referenceNode);
-
- -

Note

- -

Il Node padre della fine del Range sarà lo stesso di referenceNode.

- -

Specification

- -

setEndBefore

diff --git a/files/it/web/api/range/setstart/index.html b/files/it/web/api/range/setstart/index.html deleted file mode 100644 index 27623b9ea8..0000000000 --- a/files/it/web/api/range/setstart/index.html +++ /dev/null @@ -1,38 +0,0 @@ ---- -title: range.setStart -slug: Web/API/Range/setStart -translation_of: Web/API/Range/setStart ---- -

{{ APIRef("DOM") }}

- -

Imposta la posizione iniziale di un Range.

- -

Sintassi

- -
range.setStart(startNode,startOffset);
-
- -

Parametri

- -
-
startNode 
-
Il Node all'inizio del Range
-
startOffset 
-
Un numero intero molto grande rappresentante l'offset per l'inizio del Range dall'iniszio dello startNode.
-
- -

Esempio

- -
range = document.createRange();
-startNode = document.getElementsByTagName("p").item(2);
-startOffset = 0;
-range.setStart(startNode,startOffset);
-
- -

Note

- -

Se lo startNode è un Node di tipo Text, Comment, oppure CDATASection, allora lo startOffset è il numero di caratteri dall'inizio dello startNode. Per gli altri tipi di Node, lo startOffset è il numero di nodi figli tra l'inizio dello startNode.

- -

Specifiche

- -

setStart

diff --git a/files/it/web/api/range/setstartafter/index.html b/files/it/web/api/range/setstartafter/index.html deleted file mode 100644 index 4a5676a9d6..0000000000 --- a/files/it/web/api/range/setstartafter/index.html +++ /dev/null @@ -1,35 +0,0 @@ ---- -title: range.setStartAfter -slug: Web/API/Range/setStartAfter -translation_of: Web/API/Range/setStartAfter ---- -

{{ APIRef("DOM") }}

- -

Imposta la posizione iniziale di un Range relativamente a un altro Node.

- -

Sintassi

- -
range.setStartAfter(referenceNode);
-
- -

Parametri

- -
-
referenceNode 
-
Il Node dopo il quale deve iniziare il Range
-
- -

Esempio

- -
range = document.createRange();
-referenceNode = document.getElementsByTagName("div").item(0);
-range.setStartAfter(referenceNode);
-
- -

Note

- -

Il Node padre dell'inizio del Range sarà lo stesso di referenceNode.

- -

Specification

- -

setStartAfter

diff --git a/files/it/web/api/range/setstartbefore/index.html b/files/it/web/api/range/setstartbefore/index.html deleted file mode 100644 index d98800f57b..0000000000 --- a/files/it/web/api/range/setstartbefore/index.html +++ /dev/null @@ -1,35 +0,0 @@ ---- -title: range.setStartBefore -slug: Web/API/Range/setStartBefore -translation_of: Web/API/Range/setStartBefore ---- -

{{ APIRef("DOM") }}

- -

Imposta la posizione iniziale di un Range relativamente a un altro Node.

- -

Sintassi

- -
range.setStartBefore(referenceNode);
-
- -

Parametri

- -
-
referenceNode 
-
Il Node prima del quale deve iniziare il Range
-
- -

Esempio

- -
range = document.createRange();
-referenceNode = document.getElementsByTagName("div").item(0);
-range.setStartBefore(referenceNode);
-
- -

Note

- -

Il Node padre dell'inizio del Range sarà lo stesso di referenceNode.

- -

Specification

- -

setStartBefore

diff --git a/files/it/web/api/range/startcontainer/index.html b/files/it/web/api/range/startcontainer/index.html deleted file mode 100644 index e1eb8d3c7f..0000000000 --- a/files/it/web/api/range/startcontainer/index.html +++ /dev/null @@ -1,29 +0,0 @@ ---- -title: range.startContainer -slug: Web/API/Range/startContainer -translation_of: Web/API/Range/startContainer ---- -

{{ APIRef("DOM") }}

- -

Restituisce il Node dentro il quale comincia il Range.

- -

Sintassi

- -
startRangeNode = range.startContainer;
-
- -

Esempio

- -
range = document.createRange();
-range.setStart(startNode,startOffset);
-range.setEnd(endNode,endOffset);
-startRangeNode = range.startContainer;
-
- -

Note

- -

Restituisce un riferimento al Node del documento, dentro il quale comincia il Range. Questa proprietà è di sola lettura. Per modificare la posizione dell'inizio di un nodo, si utilizzi i metodi setStart.

- -

Specifiche

- -

startParent

diff --git a/files/it/web/api/range/startoffset/index.html b/files/it/web/api/range/startoffset/index.html deleted file mode 100644 index e0408fa445..0000000000 --- a/files/it/web/api/range/startoffset/index.html +++ /dev/null @@ -1,29 +0,0 @@ ---- -title: range.startOffset -slug: Web/API/Range/startOffset -translation_of: Web/API/Range/startOffset ---- -

{{ APIRef("DOM") }}

- -

Restituisce un numero che rappresenta il punto iniziale del Range all'interno di startContainer.

- -

Sintassi

- -
startRangeOffset = range.startOffset;
-
- -

Esempio

- -
range = document.createRange();
-range.setStart(startNode,startOffset);
-range.setEnd(endNode,endOffset);
-startRangeOffset = range.startOffset;
-
- -

Note

- -

startRangeOffset ha due significati. Se startContainer è un code>Node</code> di tipo Text, Comment, o CDATASection, allora startRangeOffset rappresenta il numero di caratteri dall'inizio di startContainer alla fine di Range, Per tutti gli altri tipi di Node, startRangeOffset rappresenta il numero di nodi figlio tra l'inizio di startContainer e la fine di Range. Questa proprietà è di sola lettura. Per modificare il valore startOffset di un nodo, si utilizzino i metodi setStart.

- -

Speicifiche

- -

startOffset

diff --git a/files/it/web/api/range/surroundcontents/index.html b/files/it/web/api/range/surroundcontents/index.html deleted file mode 100644 index 32b94161ef..0000000000 --- a/files/it/web/api/range/surroundcontents/index.html +++ /dev/null @@ -1,36 +0,0 @@ ---- -title: range.surroundContents -slug: Web/API/Range/surroundContents -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Range/surroundContents ---- -

{{ ApiRef() }}

-

Sommario

-

Sposta il contenuto di un Range in un nuovo nodo, piazzando il nuovo nodo all'inizio del range specificato.

-

Sintassi

-
range.surroundContents(nuovoNodo);
-
-
-
- nuovoNodo 
-
- è un nodo
-
-

Esempio

-
var range = document.createRange();
-var nuovoNodo = document.createElement("p");
-range.selectNode(document.getElementsByTagName("div").item(0));
-range.surroundContents(nuovoNodo);
-
-

Note

-

surroundContents equivale a:

-
nuovoNodo.appendChild(range.extractContents());
-range.insertNode(nuovoNodo)
-
-

Per effetto di questo metodo, i punti estremi del range includono nuovoNodo.

-

Specifiche

-

DOM Level 2 Range: Range.surroundContents

diff --git a/files/it/web/api/range/tostring/index.html b/files/it/web/api/range/tostring/index.html deleted file mode 100644 index fd3c9d3999..0000000000 --- a/files/it/web/api/range/tostring/index.html +++ /dev/null @@ -1,28 +0,0 @@ ---- -title: range.toString -slug: Web/API/Range/toString -translation_of: Web/API/Range/toString ---- -

{{ APIRef("DOM") }}

- -

Restituisce il testo del Range.

- -

Sintassi

- -
text = range.toString();
-
- -

Esempio

- -
range = document.createRange();
-range.selectNode(document.getElementsByTagName("div").item(0));
-text = range.toString();
-
- -

Note

- -

Alterare i contenuti di un Range causa una chiamata implicita di toString(), quindi comparare il Range e il testo attraverso un alert dialog è inutile.

- -

Specifiche

- -

toString

diff --git a/files/it/web/api/selection/addrange/index.html b/files/it/web/api/selection/addrange/index.html deleted file mode 100644 index cff46a4d65..0000000000 --- a/files/it/web/api/selection/addrange/index.html +++ /dev/null @@ -1,39 +0,0 @@ ---- -title: addRange -slug: Web/API/Selection/addRange -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/addRange ---- -

{{ ApiRef() }}

-

Sommario

-

Aggiunge un range alla selezione.

-

Sintassi

-
selezione.addRange(range)
-
-

Parametri

-
-
- - range -
-
- Un oggetto range che verrà aggiunto alla selezione.
-
-

Esempio

-
 /* seleziono tutti gli oggetti STRONG all'interno del documento HTML */
- var strongs = document.getElementsByTagName("strong");
- var s = window.getSelection();
- if(s.rangeCount > 0) s.removeAllRanges();
- for(var i = 0; i < strongs.length; i++) {
-  var range = document.createRange();
-  range.selectNode(strongs[i]);
-  s.addRange(range);
- }
-
-
-  
-

{{ languages( { "es": "es/DOM/Selection/addRange", "it": "it/DOM/Selection/addRange", "pl": "pl/DOM/Selection/addRange" } ) }}

diff --git a/files/it/web/api/selection/anchornode/index.html b/files/it/web/api/selection/anchornode/index.html deleted file mode 100644 index 2dcd33e119..0000000000 --- a/files/it/web/api/selection/anchornode/index.html +++ /dev/null @@ -1,21 +0,0 @@ ---- -title: anchorNode -slug: Web/API/Selection/anchorNode -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/anchorNode ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce il nodo nel quale inizia la selezione.

-

Sintassi

-
selection.anchorNode
-
-

Note

-

Un utente può creare una selezione da sinistra a destra (nell'ordine del documento) oppure da destra a sinistra (in ordine inverso rispetto al documento). L'anchor è il punto in cui l'utente ha iniziato a selezionare. Per comprendere e visualizzare questo meccanismo, si può tenere premuto il tasto SHIFT e poi premere i tasti freccia; l'anchor rimane immobile ma il focus, cioè l'altro estremo della selezione, si sposta.

-
-  
-

{{ languages( { "en": "en/DOM/Selection/anchorNode", "es": "es/DOM/Selection/anchorNode", "pl": "pl/DOM/Selection/anchorNode" } ) }}

diff --git a/files/it/web/api/selection/anchoroffset/index.html b/files/it/web/api/selection/anchoroffset/index.html deleted file mode 100644 index 0c6de4e0ed..0000000000 --- a/files/it/web/api/selection/anchoroffset/index.html +++ /dev/null @@ -1,21 +0,0 @@ ---- -title: anchorOffset -slug: Web/API/Selection/anchorOffset -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/anchorOffset ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce il numero di caratteri che separano il primo carattere della selezione (anchor), dal primo carattere del primo nodo selezionato (anchorNode).

-

Sintassi

-
selezione.anchorOffset
-
-

Note

-

Il valore restituito inizia da 0. Se la selezione comincia con il primo carattere dell'anchorNode, anchorOffset restituisce 0.

-
-  
-

{{ languages( { "en": "en/DOM/Selection/anchorOffset", "es": "es/DOM/Selection/anchorOffset", "pl": "pl/DOM/Selection/anchorOffset" } ) }}

diff --git a/files/it/web/api/selection/collapse/index.html b/files/it/web/api/selection/collapse/index.html deleted file mode 100644 index 63f2407ac1..0000000000 --- a/files/it/web/api/selection/collapse/index.html +++ /dev/null @@ -1,44 +0,0 @@ ---- -title: collapse -slug: Web/API/Selection/collapse -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/collapse ---- -

{{ ApiRef() }}

-

Sommario

-

Fa collassare la selezione corrente in un singolo punto. Il documento non viene modificato. Se il contenuto è modificabile, il cursore lampeggerà.

-

Sintassi

-
selezione.collapse(nodoPadre,offset);
-
-

Parametri

-
-
- - nodoPadre -
-
- Il cursore si troverà all'interno di questo nodo.
-
-
-
- - offset -
-
- La distanza in caratteri tra il cursore e l'inizio del testo di - - parentNode - .
-
-

Esempio

-
/* Porta il cursore all'inizio del BODY */
-var body = document.getElementsByTagName("body")[0];
-window.getSelection().collapse(body,0);
-
-
-  
-

{{ languages( { "en": "en/DOM/Selection/collapse", "es": "es/DOM/Selection/collapse", "pl": "pl/DOM/Selection/collapse" } ) }}

diff --git a/files/it/web/api/selection/collapsetoend/index.html b/files/it/web/api/selection/collapsetoend/index.html deleted file mode 100644 index b7193eb8e6..0000000000 --- a/files/it/web/api/selection/collapsetoend/index.html +++ /dev/null @@ -1,19 +0,0 @@ ---- -title: collapseToEnd -slug: Web/API/Selection/collapseToEnd -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/collapseToEnd ---- -

{{ ApiRef() }}

-

Sommario

-

Sposta l'anchor della selezione allo stesso punto in cui si trova il focus. Il focus non si muove. Se il contenuto è modificabile, il cursore lampeggerà.

-

Syntax

-
selezione.collapseToEnd()
-
-
-  
-

{{ languages( { "en": "en/DOM/Selection/collapseToEnd", "es": "es/DOM/Selection/collapseToEnd", "pl": "pl/DOM/Selection/collapseToEnd" } ) }}

diff --git a/files/it/web/api/selection/collapsetostart/index.html b/files/it/web/api/selection/collapsetostart/index.html deleted file mode 100644 index ccf6084f65..0000000000 --- a/files/it/web/api/selection/collapsetostart/index.html +++ /dev/null @@ -1,14 +0,0 @@ ---- -title: collapseToStart -slug: Web/API/Selection/collapseToStart -translation_of: Web/API/Selection/collapseToStart ---- -

Sommario

-

Sposta il focus della selezione allo stesso punto in cui si trova l'anchor. L'anchor non si muove. Se il contenuto è modificabile, il cursore lampeggerà. -

-

Sintassi

-
selezione.collapseToStart()
-
-
-
-{{ languages( { "en": "en/DOM/Selection/collapseToStart", "es": "es/DOM/Selection/collapseToStart", "pl": "pl/DOM/Selection/collapseToStart" } ) }} diff --git a/files/it/web/api/selection/containsnode/index.html b/files/it/web/api/selection/containsnode/index.html deleted file mode 100644 index b7729228b6..0000000000 --- a/files/it/web/api/selection/containsnode/index.html +++ /dev/null @@ -1,47 +0,0 @@ ---- -title: containsNode -slug: Web/API/Selection/containsNode -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/containsNode ---- -

{{ ApiRef() }}

-

Sommario

-

Indica se il nodo specificato fa parte della selezione.

-

Sintassi

-
selezione.containsNode(nodo,nodoParziale)
-
-

Parametri

-
-
- - nodo -
-
-

Il nodo da cercare all'interno della selezione

-
-
- - nodoParziale -
-
- Se è - - true - , containsNode restituisce true nel caso in cui solo una parte di nodo sia contenuta dalla selezione.
-
- Se è - - false - , containsNode restituisce false nel caso in cui solo una parte di nodo sia contenuta dalla selezione.
-
-

Esempi

-
 /* controlliamo se qualcosa all'interno dell'elemento BODY è stato selezionato */
- alert(window.getSelection().containsNode(document.body, true));
-
-
-  
-

{{ languages( { "es": "es/DOM/Selection/containsNode", "en": "en/DOM/Selection/containsNode", "pl": "pl/DOM/Selection/containsNode" } ) }}

diff --git a/files/it/web/api/selection/deletefromdocument/index.html b/files/it/web/api/selection/deletefromdocument/index.html deleted file mode 100644 index 5a065e7b37..0000000000 --- a/files/it/web/api/selection/deletefromdocument/index.html +++ /dev/null @@ -1,28 +0,0 @@ ---- -title: deleteFromDocument -slug: Web/API/Selection/deleteFromDocument -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/deleteFromDocument ---- -

{{ ApiRef }}

- -

Sommario

- -

Elimina dal documento il testo attualmente rappresentato dall'oggetto selection.

- -

Sintassi

- -
selezione.deleteFromDocument()
-
- -

Esempi

- -

Un utente seleziona il testo (immaginario) "la capra " all'interno della stringa "sotto la panca la capra crepa". L'utente poi clicca un bottone che esegue la riga JavaScript window.getSelection().deleteFromDocument(). Il testo del documento diventa "sotto la panca crepa".

- -
 
- -

{{ languages( { "en": "en/DOM/Selection/deleteFromDocument", "es": "es/DOM/Selection/deleteFromDocument", "pl": "pl/DOM/Selection/deleteFromDocument" } ) }}

diff --git a/files/it/web/api/selection/extend/index.html b/files/it/web/api/selection/extend/index.html deleted file mode 100644 index 58e022a2a9..0000000000 --- a/files/it/web/api/selection/extend/index.html +++ /dev/null @@ -1,39 +0,0 @@ ---- -title: extend -slug: Web/API/Selection/extend -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/extend ---- -

{{ ApiRef() }}

-

Sommario

-

Sposta il focus della selezione ad un punto specificato. L'anchor invece resta immobile. La selezione si estenderà dall'anchor fino al nuovo focus, indipendentemente da quale sia la direzione (cioè potrebbe essere inversa rispetto al testo).

-

Sintassi

-
selezione.extend(nodoPadre,offset)
-
-

Parametri

-
-
- - nodoPadre -
-
- Il nuovo focus, cioè il nodo fino al quale si estenderà la selezione.
-
-
-
- - offset -
-
- Il numero di caratteri che separeranno l'inizio del testo del - - nodoPadre' - dal nuovo focus.
-
-
-  
-

{{ languages( { "es": "es/DOM/Selection/extend", "en": "en/DOM/Selection/extend", "pl": "pl/DOM/Selection/extend" } ) }}

diff --git a/files/it/web/api/selection/focusnode/index.html b/files/it/web/api/selection/focusnode/index.html deleted file mode 100644 index 8c8653b829..0000000000 --- a/files/it/web/api/selection/focusnode/index.html +++ /dev/null @@ -1,21 +0,0 @@ ---- -title: focusNode -slug: Web/API/Selection/focusNode -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/focusNode ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce il nodo nel quale la selezione termina

-

Sintassi

-
selection.focusNode
-
-

Note

-

Un utente può creare una selezione da sinistra a destra (nell'ordine del documento) oppure da destra a sinistra (in ordine inverso rispetto al documento). L'anchor è il punto in cui l'utente ha iniziato a selezionare, il focus è il punto in cui la selezione è terminata. Per comprendere e visualizzare questo meccanismo, si può tenere premuto il tasto SHIFT e poi premere i tasti freccia; l'anchor rimane immobile ma il focus, cioè l'altro estremo della selezione, si sposta.

-
-  
-

{{ languages( { "en": "en/DOM/Selection/focusNode", "es": "es/DOM/Selection/focusNode", "pl": "pl/DOM/Selection/focusNode" } ) }}

diff --git a/files/it/web/api/selection/focusoffset/index.html b/files/it/web/api/selection/focusoffset/index.html deleted file mode 100644 index 92978a8dba..0000000000 --- a/files/it/web/api/selection/focusoffset/index.html +++ /dev/null @@ -1,21 +0,0 @@ ---- -title: focusOffset -slug: Web/API/Selection/focusOffset -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/focusOffset ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce il numero di caratteri che separano il primo carattere della selezione (focus) dal primo carattere dell'ultimo nodo della selezione (focusNode).

-

Sintassi

-
selezione.focusOffset
-
-

Note

-

Questo valore inizia da 0. Se la selezione termina con il primo carattere di focusNode, focusOffset restituisce 0.

-
-  
-

{{ languages( { "en": "en/DOM/Selection/focusOffset", "es": "es/DOM/Selection/focusOffset", "pl": "pl/DOM/Selection/focusOffset" } ) }}

diff --git a/files/it/web/api/selection/getrangeat/index.html b/files/it/web/api/selection/getrangeat/index.html deleted file mode 100644 index f5307b03d9..0000000000 --- a/files/it/web/api/selection/getrangeat/index.html +++ /dev/null @@ -1,37 +0,0 @@ ---- -title: getRangeAt -slug: Web/API/Selection/getRangeAt -translation_of: Web/API/Selection/getRangeAt ---- -

Sommario

-

Restituisce un oggetto range che rappresenta i nodi attualmente selezionati.

-

Sintassi

-
range =sel.getRangeAt(index)
-
-

Parametri

-
-
- range
-
- L'oggetto range che verrà restituito.
-
-
-
- - index -
-
- L'indice del range da restituire; parte da zero. Un valore negativo o un numero uguale o maggiore a rangeCount causa un errore.
-
-

Esempi

-
var ranges = [];
-
-sel = window.getSelection();
-
-for(var i = 0; i < sel.rangeCount; i++) {
- ranges[i] = sel.getRangeAt(i);
-}
-/* Ogni oggetto nei ranghi ora è un
- * oggetto range che rappresenta uno dei ranghi
- * presenti nella selezione attuale. */
-
diff --git a/files/it/web/api/selection/index.html b/files/it/web/api/selection/index.html deleted file mode 100644 index aca2185be0..0000000000 --- a/files/it/web/api/selection/index.html +++ /dev/null @@ -1,102 +0,0 @@ ---- -title: Selection -slug: Web/API/Selection -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection ---- -

{{ ApiRef() }}

- -

Sommario

- -

E' la classe dell'oggetto restituito da window.getSelection ed altri metodi.

- -

Descrizione

- -

L'oggetto selection rappresenta i range che l'utente ha selezionato. In una selezione fatte dall'utente col mouse possono esserci più range, ad esempio perchè tramite posizionamento assoluto nei CSS due contenitori(DIV) distanti fra di loro nel flusso del documento appaiono vicini sul display e vengono selezionati insieme. Per accedere ai diversi Range che formano una selezione, si usa il metodo getRangeAt().

- -

In JavaScript, l'oggetto selection può venire modificato come se fosse una stringa, ad esempio vi si può concatenare una stringa, perchè in questi casi viene automaticamente applicato il metodo toString. Ad esempio, con il codice seguente, nell'alert apparirà una stringa:

- -
selObj = window.getSelection();
-window.alert(selObj);
-
- -

ma la variabile selObj rimane un oggetto di tipo selection e non di tipo String, solo che all'occorrenza gli viene applicato il metodo toString().

- -

Glossario

- -

Altre parole chiave usate in questa sezione.

- -
-
anchor
-
Rappresenta il punto in cui inizia una selezione. Quando si fa una selezione con il mouse, l'anchor è il punto in cui il mouse è stato premuto e non cambia mentre si muove il mouse.
-
focus
-
Rappresenta il punto in cui finisce una selezione. Quando si fa una selezione con il mouse, il focus si muove in corrispondenza del mouse(mentre il tasto è premuto), e quando il tasto viene rilasciato, rappresenta il punto in cui finisce la selezione.
-
range
-
Rappresenta un insieme di nodi contigui del documento. Un range può contenere interi nodi come anche porzioni di nodi(nel caso di nodi testuali). Un range può essere recuperato da una selezione attraverso l'oggetto range, oppure può essere creato via script e aggiunto o rimosso da una selezione.
-
- -

Proprietà

- -
-
anchorNode
-
Restituisce il nodo in cui inizia la selezione.
-
anchorOffset
-
Restituisce il numero di caratteri fra l'inizio del nodo testuale e l'anchor, all'interno dell'anchorNode.
-
focusNode
-
Restituisce il nodo in cui finisce la selezione.
-
focusOffset
-
Restituisce il numero di caratteri fra l'inizio del nodo testuale e il focus, all'interno del focusNode.
-
isCollapsed
-
Restituisce un valore booleano che indica se l'anchor e il focus di una selezione si trovano nella stessa posizione.
-
rangeCount
-
Restituisce il numero di range di cui è composta una selezione.
-
- -

Metodi

- -
-
getRangeAt
-
Restituisce un oggetto range che rappresenta uno dei range attualmente selezionati.
-
collapse
-
Collassa la selezione corrente in un singolo punto.
-
extend
-
Muove il focus della selezione in uno specifico punto.
-
collapseToStart
-
Muove il focus della selezione nel punto in cui c'è l'anchor (che non viene spostata).
-
collapseToEnd
-
Muove il focus della selezione nel punto in cui c'è il focus (che non viene spostato).
-
selectAllChildren
-
Aggiunge tutti i figli del nodo specificato alla selezione.
-
addRange
-
Aggiunge un oggetto range alla selezione..
-
removeRange
-
Rimuove un range dalla selezione.
-
removeAllRanges
-
Rimuove tutti i range dalla selezione.
-
deleteFromDocument
-
Elimina dal documento il contenuto della selezione.
-
selectionLanguageChange
-
 
-
toString
-
Restituisce una stringa che rappresenta l'oggetto selection (cioè il testo attualmente selezionato).
-
containsNode
-
Indica se un certo nodo fa parte dell'oggetto selection.
-
- -

Guarda anche

- -

window.getSelection, Range

- - - - - -
 
- -

{{ languages( { "en": "en/DOM/Selection", "es": "es/DOM/Selection", "pl": "pl/DOM/Selection" } ) }}

diff --git a/files/it/web/api/selection/iscollapsed/index.html b/files/it/web/api/selection/iscollapsed/index.html deleted file mode 100644 index f91cfc5d1d..0000000000 --- a/files/it/web/api/selection/iscollapsed/index.html +++ /dev/null @@ -1,24 +0,0 @@ ---- -title: isCollapsed -slug: Web/API/Selection/isCollapsed -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/isCollapsed ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce un booleano che indica se l'inizio e la fine della selezione corrente corrispondono (cioè restituisce true se la selezione è - - collassata - ).

-

Sintassi

-
selection.isCollapsed
-
-

Note

-

Anche una selezione collassata può avere un rangeCount più grande di 0. Anche selezione.getRangeAt(0) potrebbe restituire un range collassato.

-
-  
-

{{ languages( { "en": "en/DOM/Selection/isCollapsed", "es": "es/DOM/Selection/isCollapsed", "pl": "pl/DOM/Selection/isCollapsed" } ) }}

diff --git a/files/it/web/api/selection/rangecount/index.html b/files/it/web/api/selection/rangecount/index.html deleted file mode 100644 index db26f87b6f..0000000000 --- a/files/it/web/api/selection/rangecount/index.html +++ /dev/null @@ -1,19 +0,0 @@ ---- -title: rangeCount -slug: Web/API/Selection/rangeCount -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/rangeCount ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce il numero di range presenti nella selezione.

-

Sintassi

-
selection.rangeCount
-
-

Note

-

Prima che l'utente clicchi su una pagina appena caricata, rangeCount vale 0. Un utente normalmente può selezionare un solo range alla volta, quindi rangeCount solitamente vale 1. Tramite lo script è possibile far si che la selezione contenga più di un range.

-

{{ languages( { "en": "en/DOM/Selection/rangeCount", "es": "es/DOM/Selection/rangeCount", "pl": "pl/DOM/Selection/rangeCount" } ) }}

diff --git a/files/it/web/api/selection/removeallranges/index.html b/files/it/web/api/selection/removeallranges/index.html deleted file mode 100644 index b9aa7bba25..0000000000 --- a/files/it/web/api/selection/removeallranges/index.html +++ /dev/null @@ -1,19 +0,0 @@ ---- -title: removeAllRanges -slug: Web/API/Selection/removeAllRanges -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/removeAllRanges ---- -

{{ ApiRef() }}

-

Sommario

-

Rimuove tutti i range dalla selezione, impostando le proprietà anchorNode e focusNode a null. Dopo la chiamata a questo metodo, non vi saranno elementi selezionati nella pagina.

-

Sintassi

-
selezione.removeAllRanges();
-
-
-  
-

{{ languages( { "es": "es/DOM/Selection/removeAllRanges", "en": "en/DOM/Selection/removeAllRanges", "pl": "pl/DOM/Selection/removeAllRanges" } ) }}

diff --git a/files/it/web/api/selection/removerange/index.html b/files/it/web/api/selection/removerange/index.html deleted file mode 100644 index cb4186afe9..0000000000 --- a/files/it/web/api/selection/removerange/index.html +++ /dev/null @@ -1,38 +0,0 @@ ---- -title: removeRange -slug: Web/API/Selection/removeRange -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/removeRange ---- -

{{ ApiRef() }}

-

Sommario

-

Rimuove un range dalla selezione.

-

Sintassi

-
selezione.removeRange(range)
-
-

Parametri

-
-
- - range -
-
- Un oggetto range che verrà rimosso dalla selezione.
-
-

Esempio

-
/* Da programma, è possibile selezionare più di un range.
-   Questo script li deseleziona tutti tranne il primo. */
-s = window.getSelection();
-if(s.rangeCount > 1) {
- for(var i = 1; i < s.rangeCount; i++) {
-  s.removeRange(s.getRangeAt(i));
- }
-}
-
-
-  
-

{{ languages( { "es": "es/DOM/Selection/removeRange", "en": "en/DOM/Selection/removeRange", "pl": "pl/DOM/Selection/removeRange" } ) }}

diff --git a/files/it/web/api/selection/selectallchildren/index.html b/files/it/web/api/selection/selectallchildren/index.html deleted file mode 100644 index 2df5613a3d..0000000000 --- a/files/it/web/api/selection/selectallchildren/index.html +++ /dev/null @@ -1,39 +0,0 @@ ---- -title: selectAllChildren -slug: Web/API/Selection/selectAllChildren -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/selectAllChildren ---- -

{{ ApiRef() }}

-

Sommario

-

Aggiunge alla selezione tutti i figli del nodo specificato. La selezione precedente viene perduta.

-

Sintassi

-
selezione.selectAllChildren(nodoPadre)
-
-

Parametri

-
-
- - nodoPadre -
-
- Tutti i figli di - - nodoPadre - verranno aggiunti alla selezione. - - nodoPadre - invece non verrà selezionato.
-
-

Esempio

-
pieDiPagina = document.getElementById("pieDiPagina");
-window.getSelection().selectAllChildren(pieDiPagina);
-/* ora tutto ciò che si trova a piè di pagina è selezionato */
-
-
-  
-

{{ languages( { "es": "es/DOM/Selection/selectAllChildren", "it": "it/DOM/Selection/selectAllChildren", "pl": "pl/DOM/Selection/selectAllChildren" } ) }}

diff --git a/files/it/web/api/selection/tostring/index.html b/files/it/web/api/selection/tostring/index.html deleted file mode 100644 index 17a6be112b..0000000000 --- a/files/it/web/api/selection/tostring/index.html +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: toString -slug: Web/API/Selection/toString -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Selection/toString ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce una stringa che rappresenta l'oggetto selection. Generalmente è il testo selezionato.

-

Sintassi

-
stringa =selezione.toString()
-
- -

Note

-

In JavaScript, questo metodo viene chiamato implicitamente quando un oggetto selection viene passato a un metodo o a una funzione che richiede una stringa:

-
alert(window.getSelection()) // la chiamata scritta da noi
-alert(window.getSelection().toString())  // la chiamata effettiva
-
-
-  
-

{{ languages( { "en": "en/DOM/Selection/toString", "es": "es/DOM/Selection/toString", "pl": "pl/DOM/Selection/toString" } ) }}

diff --git a/files/it/web/api/storage/clear/index.html b/files/it/web/api/storage/clear/index.html deleted file mode 100644 index e99735a34f..0000000000 --- a/files/it/web/api/storage/clear/index.html +++ /dev/null @@ -1,126 +0,0 @@ ---- -title: Storage.clear() -slug: Web/API/Storage/clear -tags: - - API - - Persistenza - - Persistenza Browser - - Riferimento - - metodo -translation_of: Web/API/Storage/clear ---- -

{{APIRef("Web Storage API")}}

- -

Il metodo clear() dell'interfaccia {{domxref("Storage")}} , quando invocato, pulisce tutte le chiavi salvate.

- -

Sintassi

- -
storage.clear();
- -

Return value

- -

{{jsxref("undefined")}}.

- -

Esempi

- -

La seguente funzione crea tre coppie chiave/valore in local storage, infine le elimina invocando il metodo clear().

- -
function populateStorage() {
-  localStorage.setItem('bgcolor', 'red');
-  localStorage.setItem('font', 'Helvetica');
-  localStorage.setItem('image', 'miGato.png');
-
-  localStorage.clear();
-}
- -
-

Note: Per un esempio reale guarda Web Storage Demo.

-
- -

Specifiche

- - - - - - - - - - - - - - -
SpecificheStatoCommento
{{SpecName('HTML WHATWG', 'webstorage.html#dom-storage-clear', 'Storage.clear')}}{{Spec2('HTML WHATWG')}} 
- -

Compatibilità browser {{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
localStorage4{{CompatVersionUnknown}}3.5810.504
sessionStorage5{{CompatUnknown}}2810.504
-
- -
- - - - - - - - - - - - - - - - - - - - - -
FunzionalitàAndroidEdgeFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support2.1{{CompatVersionUnknown}}{{ CompatUnknown }}811iOS 3.2
-
- -

Ogni browser riserva una quantità di memoria differente per localStorage e sessionStorage. Qui si trova il dettaglio di tutte le quantità di memoria per i vari browser.

- -
-

Note: da iOS 5.1, Safari Mobile persiste i dati di localStorage nella cartella cache, che è soggetta a pulizie occasionali, su ordine del sistema operativo, tipicamente in condizioni di poco spazio libero sul dispositivo.

-
- -

Vedi anche

- -

Utilizzo di Web Storage API

diff --git a/files/it/web/api/storage/getitem/index.html b/files/it/web/api/storage/getitem/index.html deleted file mode 100644 index 701fff9910..0000000000 --- a/files/it/web/api/storage/getitem/index.html +++ /dev/null @@ -1,144 +0,0 @@ ---- -title: Storage.getItem() -slug: Web/API/Storage/getItem -tags: - - API - - Memoria locale - - memoria - - metodo -translation_of: Web/API/Storage/getItem ---- -

{{APIRef("Web Storage API")}}

- -

Il metodo getItem() dell'interfaccia {{domxref("Storage")}} restituisce il valore contenuto nella chiave passata a parametro.

- -

Syntax

- -
var aValue = storage.getItem(keyName);
-
- -

Parametri

- -
-
keyName
-
Una {{domxref("DOMString")}} che contiene il nome della chiave da cui si vuole ottenerne il valore associato.
-
- -

Valore restituito

- -

Una {{domxref("DOMString")}} contenente il valore associato alla chiave. Se la chiave non esiste, null viene restituito.

- -

Esempio

- -

La funzione seguente ottiene tre elementi dalla memoria locale, per poi utilizzarli per impostare alcuni stili personalizzati nella pagina.

- -
function setStyles() {
-  var currentColor = localStorage.getItem('bgcolor');
-  var currentFont = localStorage.getItem('font');
-  var currentImage = localStorage.getItem('image');
-
-  document.getElementById('bgcolor').value = currentColor;
-  document.getElementById('font').value = currentFont;
-  document.getElementById('image').value = currentImage;
-
-  htmlElem.style.backgroundColor = '#' + currentColor;
-  pElem.style.fontFamily = currentFont;
-  imgElem.setAttribute('src', currentImage);
-}
- -
-

Nota: Per vedere questo esempio usato nel mondo reale, guarda il nostro Web Storage Demo.

-
- -

Specifiche

- - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('HTML WHATWG', 'webstorage.html#dom-storage-getitem', 'Storage.getItem')}}{{Spec2('HTML WHATWG')}} 
- -

Compatibilità browsers

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
localStorage4{{CompatVersionUnknown}}3.5810.504
sessionStorage5{{CompatUnknown}}2810.504
-
- -
- - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidEdgeFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support2.1{{CompatVersionUnknown}}{{ CompatUnknown }}811iOS 3.2
-
- -

Tutti i browser hanno differenti livelli capacitativi per entrambi localStorage e sessionStorage. Qui puoi trovare una lista dettagliata delle capacità di memoria per browser differenti.

- -
-

Nota: da iOS 5.1, Safari Mobile immagazzina i dati di localStorage nella cartella cache, che viene svuotata occasionalmente a discrezione dell'OS, solitamente quando lo spazio disponibile scarseggia.

-
- -

Vedi anche

- - diff --git a/files/it/web/api/storage/index.html b/files/it/web/api/storage/index.html deleted file mode 100644 index ab30b1de21..0000000000 --- a/files/it/web/api/storage/index.html +++ /dev/null @@ -1,161 +0,0 @@ ---- -title: Storage -slug: Web/API/Storage -tags: - - API - - Dati - - Interfaccia - - Riferimento - - Storage - - Web Storage -translation_of: Web/API/Storage ---- -

{{APIRef("Web Storage API")}}

- -

L'interfaccia Storage dell'API Web Storage fornisce accesso allo storage di sessione o allo storage locale per un dato dominio, permettendo, ad esempio, l'aggiunta, modifica o rimozione di dati salvati.

- -

Se si vuole manipolare lo storage di sessione per un dominio, va invocato il metodo {{domxref("Window.sessionStorage")}}; se si vuole manipolare lo storage locale per un dominio, va invocato {{domxref("Window.localStorage")}}.

- -

Proprietà

- -
-
{{domxref("Storage.length")}} {{readonlyInline}}
-
Ritorna un intero che rappresenta il numero di oggetti presenti in un oggetto Storage.
-
- -

Metodi

- -
-
{{domxref("Storage.key()")}}
-
Dato un numero n,  ritorna il nome dell'n-esima chiave nello storage.
-
- -
-
{{domxref("Storage.getItem()")}}
-
Dato un nome di chiave, ritorna il corrispondente valore.
-
{{domxref("Storage.setItem()")}}
-
Dati un nome di chiave e un valore, aggiunge questa chiave allo storage, o aggiorna il valore della chiave se essa esiste già.
-
{{domxref("Storage.removeItem()")}}
-
Dato un nome di chiave, rimuove quella chiave dallo storage.
-
{{domxref("Storage.clear()")}}
-
Rimuove tutte le chiavi dallo storage.
-
- -

Esempi

- -

Questo è un esempio di accesso all'oggetto Storage tramite chiamata a localStorage. In primo luogo, si verifica se lo storage locale contenga oggetti usando !localStorage.getItem('bgcolor'). Se il test passa, si invoca una funzione setStyles() che recupera gli oggetti tramite {{domxref("localStorage.getItem()")}} e ne usa i valori per aggiornare gli stili della pagina. Se il test fallisce, viene invocata un'altra funzione, populateStorage(), che usa {{domxref("localStorage.setItem()")}} per settare i valori, per poi ritornare setStyles().

- -
if(!localStorage.getItem('bgcolor')) {
-  populateStorage();
-} else {
-  setStyles();
-}
-
-function populateStorage() {
-  localStorage.setItem('bgcolor', document.getElementById('bgcolor').value);
-  localStorage.setItem('font', document.getElementById('font').value);
-  localStorage.setItem('image', document.getElementById('image').value);
-
-  setStyles();
-}
-
-function setStyles() {
-  var currentColor = localStorage.getItem('bgcolor');
-  var currentFont = localStorage.getItem('font');
-  var currentImage = localStorage.getItem('image');
-
-  document.getElementById('bgcolor').value = currentColor;
-  document.getElementById('font').value = currentFont;
-  document.getElementById('image').value = currentImage;
-
-  htmlElem.style.backgroundColor = '#' + currentColor;
-  pElem.style.fontFamily = currentFont;
-  imgElem.setAttribute('src', currentImage);
-}
- -
-

Nota: Per vedere quest'esempio girare, si veda la Web Storage Demo.

-
- -

Specifiche

- - - - - - - - - - - - - - -
SpecificaStatusCommento
{{SpecName('Web Storage', '#the-storage-interface', 'Storage')}}{{Spec2('Web Storage')}} 
- -

Compatibilità dei browser

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
localStorage43.5810.504
sessionStorage52810.504
-
- -
- - - - - - - - - - - - - - - - - - - -
FunzionalitàAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Supporto minimo2.1{{ CompatUnknown }}8113.2[1]
-
- -

[1] A partite da iOS 5.1, Safari Mobile salva i dati del localStorage in una cartella di cache, soggetta occasionalmente a pulizia su richiesta del sistema operativo, tipicamente in mancanza di spazio.

- -

I vari browser hanno diversi livelli di capacità sia per localStorage che per sessionStorage. Qui si trova un resoconto dettagliato delle capacità di immagazzinamento dei vari browser.

- -

Vedere anche

- -

Usare la API Web Storage

diff --git a/files/it/web/api/storage/setitem/index.html b/files/it/web/api/storage/setitem/index.html deleted file mode 100644 index c96e805956..0000000000 --- a/files/it/web/api/storage/setitem/index.html +++ /dev/null @@ -1,133 +0,0 @@ ---- -title: Storage.setItem() -slug: Web/API/Storage/setItem -translation_of: Web/API/Storage/setItem ---- -

{{APIRef("Web Storage API")}}

- -

Il metodo setItem(), che fa parte della funzionalità {{domxref("Storage")}} , quando passa il nome di una chiave e un valore, aggiunge questa chiave allo storage, oppure se la chiave esiste già aggiorna il valore della chiave stessa.

- -

Sintassi

- -
storage.setItem(keyName, keyValue);
- -

Parametri

- -
-
keyName
-
Il {{domxref("DOMString")}} contiene il nome della chiave che si vuole creare o aggiornare.
-
keyValue
-
Il {{domxref("DOMString")}} contiene il valore che si vuole dare alla chiave che si sta creando o aggiornando.
-
- -

Valore di ritorno

- -

{{jsxref("undefined")}}.

- -

Eccezioni

- -

setItem() potrebbe dar luogo a eccezioni se lo storage è pieno. Ad esempio, in Safari Mobile (da iOS 5) non è possibile salvare dati quando l'utente è in modalità in incognito (questo perché Safari non alloca spazio per l'utente nella modalità in incognito, al contrario degli altri browsers, i quali permettono di usare lo storage nella modalità in incognito, salvando i dati in uno spazio apposito e separato). Quindi è sempre meglio implementare delle funzioni che gestiscano le eccezioni quando si usa setItem().

- -

Esempi

- -

Le seguenti funzioni creano tre oggetti all'interno del local storage:

- -
function populateStorage() {
-  localStorage.setItem('bgcolor', 'red');
-  localStorage.setItem('font', 'Helvetica');
-  localStorage.setItem('image', 'myCat.png');
-}
- -
-

Nota: Se vuoi un esempio veritiero, dai un'occhiata alla pagina Web Storage Demo.

-
- -

Specifiche

- - - - - - - - - - - - - - -
SpecificheStatoCommento
{{SpecName('Web Storage', '#dom-storage-setitem', 'setItem()')}}{{Spec2('Web Storage')}}
- -

Compatibilità dei browser

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
localStorage4{{CompatVersionUnknown}}3.5810.504
sessionStorage5{{CompatUnknown}}2810.504
-
- -
- - - - - - - - - - - - - - - - - - - - - -
FunzionalitàAndroidEdgeFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support2.1{{CompatVersionUnknown}}{{ CompatUnknown }}811iOS 3.2
-
- -

Tutti i browser hanno diversi livelli di gestione sia del localStorage che del sessionStorage. Qui trovi ulteriori dettagli.

- -
-

Nota: da iOS 5.1, Safari Mobile memorizza i dati del localStorage nella cartella delle cache, la quale, ogni tanto, viene cancellata (ricorda che questo spazio è solitamente piccolo).

-
- -

Altre informazioni

- -

Come usare le Web Storage API

diff --git a/files/it/web/api/uievent/ischar/index.html b/files/it/web/api/uievent/ischar/index.html deleted file mode 100644 index 6440856995..0000000000 --- a/files/it/web/api/uievent/ischar/index.html +++ /dev/null @@ -1,31 +0,0 @@ ---- -title: event.isChar -slug: Web/API/UIEvent/isChar -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/UIEvent/isChar -original_slug: Web/API/Event/isChar ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce un booleano che indica se è stato premuto un tasto carattere o meno.

-

Sintassi

-
bool = event.isChar
-
- -

Esempio

-
 if e.isChar
-   ripetiInput(e.type);
- }
-
-

Note

-

Alcune combinazioni di tasti potrebbero produrre degli eventi ma non produrre alcun carattere (per esempio CTRL+b). Quando questo accade, isChar restituisce false.

-

Attenzione: attualmente isChar è afflitto da un bug, a causa del quale il risultato è sempre false. Gli sviluppatori di Mozilla potrebbero correggere questo bug, ma potrebbero anche decidere di eliminare questa proprietà non standard.

-

Specifiche

-

Non è parte di alcuna specifica.

-

{{ languages( { "en": "en/DOM/event.isChar", "pl": "pl/DOM/event.isChar" } ) }}

diff --git a/files/it/web/api/uievent/layerx/index.html b/files/it/web/api/uievent/layerx/index.html deleted file mode 100644 index 7ee4d10d26..0000000000 --- a/files/it/web/api/uievent/layerx/index.html +++ /dev/null @@ -1,103 +0,0 @@ ---- -title: event.layerX -slug: Web/API/UIEvent/layerX -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/UIEvent/layerX -original_slug: Web/API/Event/layerX ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce la coordinata orizzontale del punto in cui si è scatenato l'evento, relativamente al layer corrente.

-

Sintassi

-
X = event.layerX
-
- -

Esempio

-
<html>
-<head>
-<title>esempio di pageX/pageY e layerX/layerY</title>
-
-<script type="text/javascript">
-
-function mostraCoordinate(evt){
-  var form = document.forms.form_coords;
-  var idPadre = evt.target.parentNode.id;
-  form.idPadre.value = idPadre;
-  form.coordinataXpagina.value = evt.pageX;
-  form.coordinataYpagina.value = evt.pageY;
-  form.coordinataXlayer.value = evt.layerX;
-  form.coordinataYlayer.value = evt.layerY;
-}
-
-</script>
-
-<style type="text/css">
-
- #d1 {
-  border: solid blue 1px;
-  padding: 20px;
- }
-
- #d2 {
-  position: absolute;
-  top: 180px;
-  left: 80%;
-  right:auto;
-  width: 40%;
-  border: solid blue 1px;
-  padding: 20px;
- }
-
- #d3 {
-  position: absolute;
-  top: 240px;
-  left: 20%;
-  width: 50%;
-  border: solid blue 1px;
-  padding: 10px;
- }
-
-</style>
-</head>
-
-<body onmousedown="mostraCoordinate(event)">
-
-<p>Per visualizzare le coordinate del mouse clicca in un qualunque punto della pagina.</p>
-
-<div id="d1">
-<span>Questo è un DIV non posizionato, quindi cliccando qui i valori di layerX e layerY
-saranno simili a quelli di pageX e pageY.
-</span>
-</div>
-
-<div id="d2">
-<span>Questo è un DIV posizionato, quindi cliccando qui i valori di layerX e layerY saranno relativi all'angolo in alto a sinistra di questo elemento. Si noti che le proprietà pageX e pageY restituiscono la posizione assoluta all'interno del documento, tenendo conto dello scorrimento della pagina.
-</span>
-
-<span>Fai scorrere ancora la pagina! Questo è un DIV posizionato, quindi cliccando qui i valori di layerX e layerY saranno relativi all'angolo in alto a sinistra di questo elemento. Si noti che le proprietà pageX e pageY restituiscono la posizione assoluta all'interno del documento, tenendo conto dello scorrimento della pagina.</span>
-</div>
-
-<div id="d3">
-<form name="form_coordinate">
- Id elemento padre: <input type="text" name="idPadre" size="7" /><br />
- pageX:<input type="text" name="coordinataXpagina" size="7" />
- pageY:<input type="text" name="coordinataYpagina" size="7" /><br />
- layerX:<input type="text" name="coordinataXlayer" size="7" />
- layerY:<input type="text" name="coordinataYlayer" size="7" />
-</form>
-</div>
-
-</body>
-</html>
-
-

Note

-

layerX tiene conto di eventuali scorrimenti orizzontali avvenuti nella pagina e restituisce un valore relativo all'intero documento, a meno che l'evento non avvenga all'interno di un elemento con posizione fissa; nel qual caso il valore restituito sarà relativo all'angolo in alto a sinistra dell'elemento.

-

Specifiche

-

DOM level 0. Non è parte di alcuna specifica.

-

{{ languages( { "en": "en/DOM/event.layerX", "pl": "pl/DOM/event.layerX" } ) }}

diff --git a/files/it/web/api/uievent/layery/index.html b/files/it/web/api/uievent/layery/index.html deleted file mode 100644 index 38ae5ba878..0000000000 --- a/files/it/web/api/uievent/layery/index.html +++ /dev/null @@ -1,103 +0,0 @@ ---- -title: event.layerY -slug: Web/API/UIEvent/layerY -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/UIEvent/layerY -original_slug: Web/API/Event/layerY ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce la coordinata verticale del punto in cui si è scatenato l'evento, relativamente al layer corrente.

-

Sintassi

-
Y = event.layerY
-
- -

Esempio

-
<html>
-<head>
-<title>esempio di pageX/pageY e layerX/layerY</title>
-
-<script type="text/javascript">
-
-function mostraCoordinate(evt){
-  var form = document.forms.form_coords;
-  var idPadre = evt.target.parentNode.id;
-  form.idPadre.value = idPadre;
-  form.coordinataXpagina.value = evt.pageX;
-  form.coordinataYpagina.value = evt.pageY;
-  form.coordinataXlayer.value = evt.layerX;
-  form.coordinataYlayer.value = evt.layerY;
-}
-
-</script>
-
-<style type="text/css">
-
- #d1 {
-  border: solid blue 1px;
-  padding: 20px;
- }
-
- #d2 {
-  position: absolute;
-  top: 180px;
-  left: 80%;
-  right:auto;
-  width: 40%;
-  border: solid blue 1px;
-  padding: 20px;
- }
-
- #d3 {
-  position: absolute;
-  top: 240px;
-  left: 20%;
-  width: 50%;
-  border: solid blue 1px;
-  padding: 10px;
- }
-
-</style>
-</head>
-
-<body onmousedown="mostraCoordinate(event)">
-
-<p>Per visualizzare le coordinate del mouse clicca in un qualunque punto della pagina.</p>
-
-<div id="d1">
-<span>Questo è un DIV non posizionato, quindi cliccando qui i valori di layerX e layerY
-saranno simili a quelli di pageX e pageY.
-</span>
-</div>
-
-<div id="d2">
-<span>Questo è un DIV posizionato, quindi cliccando qui i valori di layerX e layerY saranno relativi all'angolo in alto a sinistra di questo elemento. Si noti che le proprietà pageX e pageY restituiscono la posizione assoluta all'interno del documento, tenendo conto dello scorrimento della pagina.
-</span>
-
-<span>Fai scorrere ancora la pagina! Questo è un DIV posizionato, quindi cliccando qui i valori di layerX e layerY saranno relativi all'angolo in alto a sinistra di questo elemento. Si noti che le proprietà pageX e pageY restituiscono la posizione assoluta all'interno del documento, tenendo conto dello scorrimento della pagina.</span>
-</div>
-
-<div id="d3">
-<form name="form_coordinate">
- Id elemento padre: <input type="text" name="idPadre" size="7" /><br />
- pageX:<input type="text" name="coordinataXpagina" size="7" />
- pageY:<input type="text" name="coordinataYpagina" size="7" /><br />
- layerX:<input type="text" name="coordinataXlayer" size="7" />
- layerY:<input type="text" name="coordinataYlayer" size="7" />
-</form>
-</div>
-
-</body>
-</html>
-
-

Note

-

layerY tiene conto di eventuali scorrimenti verticali avvenuti nella pagina e restituisce un valore relativo all'intero documento, a meno che l'evento non avvenga all'interno di un elemento con posizione fissa; nel qual caso il valore restituito sarà relativo all'angolo in alto a sinistra dell'elemento.

-

Specifiche

-

DOM level 0. Non è parte di alcuna specifica.

-

{{ languages( { "en": "en/DOM/event.layerX", "pl": "pl/DOM/event.layerX" } ) }}

diff --git a/files/it/web/api/uievent/pagex/index.html b/files/it/web/api/uievent/pagex/index.html deleted file mode 100644 index 6c2ad1573e..0000000000 --- a/files/it/web/api/uievent/pagex/index.html +++ /dev/null @@ -1,99 +0,0 @@ ---- -title: event.pageX -slug: Web/API/UIEvent/pageX -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/UIEvent/pageX -original_slug: Web/API/Event/pageX ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce la coordinata orizzontale dell'evento, all'interno dell'intero documento.

-

Sintassi

-
X =event.pageX;
-
-

X è un intero che rappresenta il valore in pixel della coordinata X del puntatore del mouse, relativamente all'intero documento. La coordinata fa riferimento al momento in cui l'evento si è verificato. Questa proprietà tiene conto di ogni scorrimento orizzontale che è stato effettuato all'interno del browser.

-

Esempio

-
<html>
-<head>
-<title>esempio di pageX/pageY e layerX/layerY</title>
-
-<script type="text/javascript">
-
-function mostraCoordinate(evt){
-  var form = document.forms.form_coords;
-  var idPadre = evt.target.parentNode.id;
-  form.idPadre.value = idPadre;
-  form.coordinataXpagina.value = evt.pageX;
-  form.coordinataYpagina.value = evt.pageY;
-  form.coordinataXlayer.value = evt.layerX;
-  form.coordinataYlayer.value = evt.layerY;
-}
-
-</script>
-
-<style type="text/css">
-
- #d1 {
-  border: solid blue 1px;
-  padding: 20px;
- }
-
- #d2 {
-  position: absolute;
-  top: 180px;
-  left: 80%;
-  right:auto;
-  width: 40%;
-  border: solid blue 1px;
-  padding: 20px;
- }
-
- #d3 {
-  position: absolute;
-  top: 240px;
-  left: 20%;
-  width: 50%;
-  border: solid blue 1px;
-  padding: 10px;
- }
-
-</style>
-</head>
-
-<body onmousedown="mostraCoordinate(event)">
-
-<p>Per visualizzare le coordinate del mouse clicca in un qualunque punto della pagina.</p>
-
-<div id="d1">
-<span>Questo è un DIV non posizionato, quindi cliccando qui i valori di layerX e layerY
-saranno simili a quelli di pageX e pageY.
-</span>
-</div>
-
-<div id="d2">
-<span>Questo è un DIV posizionato, quindi cliccando qui i valori di layerX e layerY saranno relativi all'angolo in alto a sinistra di questo elemento. Si noti che le proprietà pageX e pageY restituiscono la posizione assoluta all'interno del documento, tenendo conto dello scorrimento della pagina.
-</span>
-
-<span>Fai scorrere ancora la pagina! Questo è un DIV posizionato, quindi cliccando qui i valori di layerX e layerY saranno relativi all'angolo in alto a sinistra di questo elemento. Si noti che le proprietà pageX e pageY restituiscono la posizione assoluta all'interno del documento, tenendo conto dello scorrimento della pagina.</span>
-</div>
-
-<div id="d3">
-<form name="form_coordinate">
- Id elemento padre: <input type="text" name="idPadre" size="7" /><br />
- pageX:<input type="text" name="coordinataXpagina" size="7" />
- pageY:<input type="text" name="coordinataYpagina" size="7" /><br />
- layerX:<input type="text" name="coordinataXlayer" size="7" />
- layerY:<input type="text" name="coordinataYlayer" size="7" />
-</form>
-</div>
-
-</body>
-</html>
-
-

Specifiche

-

Non è parte di alcuno standard.

-

{{ languages( { "en": "en/DOM/event.pageX", "es": "es/DOM/event.pageX", "pl": "pl/DOM/event.pageX" } ) }}

diff --git a/files/it/web/api/uievent/pagey/index.html b/files/it/web/api/uievent/pagey/index.html deleted file mode 100644 index e1a2637dcd..0000000000 --- a/files/it/web/api/uievent/pagey/index.html +++ /dev/null @@ -1,99 +0,0 @@ ---- -title: event.pageY -slug: Web/API/UIEvent/pageY -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/UIEvent/pageY -original_slug: Web/API/Event/pageY ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce la coordinata verticale dell'evento, all'interno dell'intero documento.

-

Sintassi

-
Y =event.pageY;
-
-

Y è un intero che rappresenta il valore in pixel della coordinata Y del puntatore del mouse, relativamente all'intero documento. La coordinata fa riferimento al momento in cui l'evento si è verificato. Questa proprietà tiene conto di ogni scorrimento verticale che è stato effettuato all'interno del browser.

-

Esempio

-
<html>
-<head>
-<title>esempio di pageX/pageY e layerX/layerY</title>
-
-<script type="text/javascript">
-
-function mostraCoordinate(evt){
-  var form = document.forms.form_coords;
-  var idPadre = evt.target.parentNode.id;
-  form.idPadre.value = idPadre;
-  form.coordinataXpagina.value = evt.pageX;
-  form.coordinataYpagina.value = evt.pageY;
-  form.coordinataXlayer.value = evt.layerX;
-  form.coordinataYlayer.value = evt.layerY;
-}
-
-</script>
-
-<style type="text/css">
-
- #d1 {
-  border: solid blue 1px;
-  padding: 20px;
- }
-
- #d2 {
-  position: absolute;
-  top: 180px;
-  left: 80%;
-  right:auto;
-  width: 40%;
-  border: solid blue 1px;
-  padding: 20px;
- }
-
- #d3 {
-  position: absolute;
-  top: 240px;
-  left: 20%;
-  width: 50%;
-  border: solid blue 1px;
-  padding: 10px;
- }
-
-</style>
-</head>
-
-<body onmousedown="mostraCoordinate(event)">
-
-<p>Per visualizzare le coordinate del mouse clicca in un qualunque punto della pagina.</p>
-
-<div id="d1">
-<span>Questo è un DIV non posizionato, quindi cliccando qui i valori di layerX e layerY
-saranno simili a quelli di pageX e pageY.
-</span>
-</div>
-
-<div id="d2">
-<span>Questo è un DIV posizionato, quindi cliccando qui i valori di layerX e layerY saranno relativi all'angolo in alto a sinistra di questo elemento. Si noti che le proprietà pageX e pageY restituiscono la posizione assoluta all'interno del documento, tenendo conto dello scorrimento della pagina.
-</span>
-
-<span>Fai scorrere ancora la pagina! Questo è un DIV posizionato, quindi cliccando qui i valori di layerX e layerY saranno relativi all'angolo in alto a sinistra di questo elemento. Si noti che le proprietà pageX e pageY restituiscono la posizione assoluta all'interno del documento, tenendo conto dello scorrimento della pagina.</span>
-</div>
-
-<div id="d3">
-<form name="form_coordinate">
- Id elemento padre: <input type="text" name="idPadre" size="7" /><br />
- pageX:<input type="text" name="coordinataXpagina" size="7" />
- pageY:<input type="text" name="coordinataYpagina" size="7" /><br />
- layerX:<input type="text" name="coordinataXlayer" size="7" />
- layerY:<input type="text" name="coordinataYlayer" size="7" />
-</form>
-</div>
-
-</body>
-</html>
-
-

Specifiche

-

Non è parte di alcuno standard.

-

{{ languages( { "es": "es/DOM/event.pageY", "pl": "pl/DOM/event.pageY" } ) }}

diff --git a/files/it/web/api/uievent/view/index.html b/files/it/web/api/uievent/view/index.html deleted file mode 100644 index c8de66c283..0000000000 --- a/files/it/web/api/uievent/view/index.html +++ /dev/null @@ -1,23 +0,0 @@ ---- -title: event.view -slug: Web/API/UIEvent/view -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/UIEvent/view -original_slug: Web/API/Event/view ---- -

{{ ApiRef() }}

-

Sommario

-

Restituisce l'oggetto AbstractView nel quale si è verificato l'evento. Nei browser web, questo è l'oggetto window che ha generato l'evento.

-

Sintassi

-
view =event.view
-
- -

Specifiche

-

DOM Level 2 Events: UIEvent.view

-

{{ languages( { "en": "en/DOM/event.view", "pl": "pl/DOM/event.view" } ) }}

diff --git a/files/it/web/api/webgl_api/index.html b/files/it/web/api/webgl_api/index.html deleted file mode 100644 index c085be1e41..0000000000 --- a/files/it/web/api/webgl_api/index.html +++ /dev/null @@ -1,254 +0,0 @@ ---- -title: 'WebGL: Grafica 2D e 3D per il web' -slug: Web/API/WebGL_API -translation_of: Web/API/WebGL_API ---- -
{{WebGLSidebar}}
- -
-

WebGL (Web Graphics Library) is a JavaScript API for rendering high-performance interactive 3D and 2D graphics within any compatible web browser without the use of plug-ins. WebGL does so by introducing an API that closely conforms to OpenGL ES 2.0 that can be used in HTML5 {{HTMLElement("canvas")}} elements. This conformance makes it possible for the API to take advantage of hardware graphics acceleration provided by the user's device.

-
- -

Support for WebGL is present in Firefox 4+, Google Chrome 9+, Opera 12+, Safari 5.1+, Internet Explorer 11+, and Microsoft Edge build 10240+; however, the user's device must also have hardware that supports these features.

- -

The {{anch("WebGL 2")}} API introduces support for much of the OpenGL ES 3.0 feature set; it's provided through the {{domxref("WebGL2RenderingContext")}} interface.

- -

The {{HTMLElement("canvas")}} element is also used by the Canvas API to do 2D graphics on web pages.

- -

Reference

- -

Standard interfaces

- -
- -
- -

Extensions

- -
- -
- -

Events

- - - -

Constants and types

- - - -

WebGL 2

- -

WebGL 2 is a major update to WebGL which is provided through the {{domxref("WebGL2RenderingContext")}} interface. It is based on OpenGL ES 3.0 and new features include:

- - - -

See also the blog post "WebGL 2 lands in Firefox" and webglsamples.org/WebGL2Samples for a few demos.

- -

Guides and tutorials

- -

Below, you'll find an assortment of guides to help you learn WebGL concepts and tutorials that offer step-by-step lessons and examples.

- -

Guides

- -
-
Data in WebGL
-
A guide to variables, buffers, and other types of data used when writing WebGL code.
-
WebGL best practices
-
Tips and suggestions to help you improve the quality, performance, and reliability of your WebGL content.
-
Using extensions
-
A guide to using WebGL extensions.
-
- -

Tutorials

- -
-
WebGL tutorial
-
A beginner's guide to WebGL core concepts. A good place to start if you don't have previous WebGL experience.
-
- -

Examples

- -
-
A basic 2D WebGL animation example
-
This example demonstrates the simple animation of a one-color shape. Topics examined are adapting to aspect ratio differences, a function to build shader programs from sets of multiple shaders, and the basics of drawing in WebGL.
-
WebGL by example
-
A series of live samples with short explanations that showcase WebGL concepts and capabilities. The examples are sorted according to topic and level of difficulty, covering the WebGL rendering context, shader programming, textures, geometry, user interaction, and more.
-
- -

Advanced tutorials

- -
-
WebGL model view projection
-
A detailed explanation of the three core matrices that are typically used to represent a 3D object view: the model, view and projection matrices.
-
Matrix math for the web
-
A useful guide to how 3D transform matrices work, and can be used on the web — both for WebGL calculations and in CSS3 transforms.
-
- -

Resources

- - - -

Libraries

- - - -

Specifications

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('OpenGL ES 3.0')}}{{Spec2('OpenGL ES 3.0')}}
{{SpecName('OpenGL ES 2.0')}}{{Spec2('OpenGL ES 2.0')}}
{{SpecName('WebGL2')}}{{Spec2('WebGL2')}}Builds on top of WebGL 1. Based on OpenGL ES 3.0.
{{SpecName('WebGL')}}{{Spec2('WebGL')}}Initial definition. Based on OpenGL ES 2.0
- -

Browser compatibility

- -

WebGL 1

- -
- - -

{{Compat("api.WebGLRenderingContext", 0)}}

- -

WebGL 2

- - - -

{{Compat("api.WebGL2RenderingContext", 0)}}

-
- -

Compatibility notes

- -

In addition to the browser, the GPU itself also needs to support the feature. So, for example, S3 Texture Compression (S3TC) is only available on Tegra-based tablets. Most browsers make the WebGL context available through the webgl context name, but older ones need experimental-webgl as well. In addition, the upcoming WebGL 2 is fully backwards-compatible and will have the context name webgl2.

- -

Gecko notes

- -

WebGL debugging and testing

- -

Starting with Gecko 10.0 {{geckoRelease("10.0")}}, there are two preferences available which let you control the capabilities of WebGL for testing purposes:

- -
-
webgl.min_capability_mode
-
A Boolean property that, when true, enables a minimum capability mode. When in this mode, WebGL is configured to only support the bare minimum feature set and capabilities required by the WebGL specification. This lets you ensure that your WebGL code will work on any device or browser, regardless of their capabilities. This is false by default.
-
webgl.disable_extensions
-
A Boolean property that, when true, disables all WebGL extensions. This is false by default.
-
- -

See also

- - diff --git a/files/it/web/api/websocket/index.html b/files/it/web/api/websocket/index.html deleted file mode 100644 index af8738a82a..0000000000 --- a/files/it/web/api/websocket/index.html +++ /dev/null @@ -1,148 +0,0 @@ ---- -title: WebSocket -slug: Web/API/WebSocket -tags: - - API - - NeedsContent - - NeedsTranslation - - TopicStub - - WebSocket - - WebSockets -translation_of: Web/API/WebSocket ---- -
{{APIRef("Web Sockets API")}}
- -

The WebSocket object provides the API for creating and managing a WebSocket connection to a server, as well as for sending and receiving data on the connection.

- -

To construct a WebSocket, use the WebSocket() constructor.

- -

Constructor

- -
-
{{domxref("WebSocket.WebSocket", "WebSocket(url[, protocols])")}}
-
Returns a newly created WebSocket object.
-
- -

Constants

- - - - - - - - - - - - - - - - - - - - - - - - -
ConstantValue
WebSocket.CONNECTING0
WebSocket.OPEN1
WebSocket.CLOSING2
WebSocket.CLOSED3
- -

Properties

- -
-
{{domxref("WebSocket.binaryType")}}
-
The binary data type used by the connection.
-
{{domxref("WebSocket.bufferedAmount")}} {{readonlyinline}}
-
The number of bytes of queued data.
-
{{domxref("WebSocket.extensions")}} {{readonlyinline}}
-
The extensions selected by the server.
-
{{domxref("WebSocket.onclose")}}
-
An event listener to be called when the connection is closed.
-
{{domxref("WebSocket.onerror")}}
-
An event listener to be called when an error occurs.
-
{{domxref("WebSocket.onmessage")}}
-
An event listener to be called when a message is received from the server.
-
{{domxref("WebSocket.onopen")}}
-
An event listener to be called when the connection is opened.
-
{{domxref("WebSocket.protocol")}} {{readonlyinline}}
-
The sub-protocol selected by the server.
-
{{domxref("WebSocket.readyState")}} {{readonlyinline}}
-
The current state of the connection.
-
{{domxref("WebSocket.url")}} {{readonlyinline}}
-
The absolute URL of the WebSocket.
-
- -

Methods

- -
-
{{domxref("WebSocket.close", "WebSocket.close([code[, reason]])")}}
-
Closes the connection.
-
{{domxref("WebSocket.send", "WebSocket.send(data)")}}
-
Enqueues data to be transmitted.
-
- -

Events

- -

Listen to these events using addEventListener() or by assigning an event listener to the oneventname property of this interface.

- -
-
close
-
Fired when a connection with a WebSocket is closed.
- Also available via the onclose property
-
error
-
Fired when a connection with a WebSockethas been closed because of an error, such as when some data couldn't be sent.
- Also available via the onerror property.
-
message
-
Fired when data is received through a WebSocket.
- Also available via the onmessage property.
-
open
-
Fired when a connection with a WebSocketis opened.
- Also available via the onopen property.
-
- -

Examples

- -
// Create WebSocket connection.
-const socket = new WebSocket('ws://localhost:8080');
-
-// Connection opened
-socket.addEventListener('open', function (event) {
-    socket.send('Hello Server!');
-});
-
-// Listen for messages
-socket.addEventListener('message', function (event) {
-    console.log('Message from server ', event.data);
-});
- -

Specifications

- - - - - - - - - - - - -
SpecificationStatus
{{SpecName("HTML WHATWG", "#the-websocket-interface", "WebSocket")}}{{Spec2("HTML WHATWG")}}
- -

Browser compatibility

- -
- - -

{{Compat("api.WebSocket")}}

-
- -

See also

- - diff --git a/files/it/web/api/websocket/websocket/index.html b/files/it/web/api/websocket/websocket/index.html deleted file mode 100644 index 8170b8aead..0000000000 --- a/files/it/web/api/websocket/websocket/index.html +++ /dev/null @@ -1,48 +0,0 @@ ---- -title: WebSocket() -slug: Web/API/WebSocket/WebSocket -translation_of: Web/API/WebSocket/WebSocket ---- -

{{APIRef("Web Sockets API")}}

-

Il costruttore WebSocket() restituisce un nuovo oggetto WebSocket {{domxref("WebSocket")}}.

- -

Sintassi

- -
var aWebSocket = new WebSocket(url [, protocols]);
- -

Parametri

- -
-
url
-
Corrisponde al URL al quale ci si vuole connetterse, questo dovrebbe essere l'URL a cui risponderà il server WebSocket.
-
protocols {{optional_inline}}
-
una singola stringa di protocollo o un array di stringhe di protocollo. Queste stringhe vengono utilizzate per indicare i sub-protocolli, in modo che un server possa implementare più sub-protocolli WebSocket (ad esempio, è possibile che un server sia in grado di gestire diversi tipi di interazioni a seconda del protocollo specificato). Se non si specifica una stringa di protocollo, si presume una stringa vuota.
-
- -

Exceptions thrown

- -
-
SECURITY_ERR
-
La porta a cui si sta tentando la connessione risulta bloccata.
-
- -

Specifice

- - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('HTML WHATWG', '#dom-websocket', 'the WebSocket constructor')}}{{Spec2('HTML WHATWG')}}
- -

Browser compatibili

- - diff --git a/files/it/web/api/websockets_api/index.html b/files/it/web/api/websockets_api/index.html deleted file mode 100644 index 346f32119c..0000000000 --- a/files/it/web/api/websockets_api/index.html +++ /dev/null @@ -1,180 +0,0 @@ ---- -title: WebSockets -slug: Web/API/WebSockets_API -tags: - - References - - WebSockets -translation_of: Web/API/WebSockets_API -original_slug: WebSockets ---- -

I WebSockets sono una tecnologia avanzata che rende possibile aprire una sessione di comunicazione interattiva tra il browser dell'utente e un server. Con questa API si possono mandare messaggi al server e ricevere risposte event-driven senza doverle richiedere al server.

- -
-
-

Documentazione

- -
-
Scrivere applicazioni WebSocket lato client
-
Un tutorial per scrivere applicazioni WebSocket da eseguire nel browser.
-
WebSockets reference
-
Informazioni dettagliate sulla API lato client.
-
(TBD) Writing WebSocket servers
-
Una guida per scrivere applicazioni lato server che gestiscano il protocollo WebSocket.
-
- -

Visualizza tutti

-
- -
-

Strumenti

- - - - - - -
-
- -

Vedi anche

- - - -

Compatibilità tra browser

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Version -76 support {{obsolete_inline}}6{{CompatGeckoDesktop("2.0")}}{{CompatNo}}11.00 (disabled)5.0.1
Protocol version 7 support {{obsolete_inline}}{{CompatNo}}{{CompatGeckoDesktop("6.0")}}
- {{property_prefix("Moz")}}		{{CompatNo}}{{CompatNo}}{{CompatNo}}
Protocol version 10 support {{obsolete_inline}}14{{CompatGeckoDesktop("7.0")}}
- {{property_prefix("Moz")}}		HTML5 Labs{{CompatUnknown}}{{CompatUnknown}}
Standard - RFC 6455 Support16{{CompatGeckoDesktop("11.0")}}1012.106.0
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Version -76 support {{obsolete_inline}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Protocol version 7 support {{obsolete_inline}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Protocol version 8 support (IETF draft 10) {{obsolete_inline}}{{CompatUnknown}}{{CompatGeckoMobile("7.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Standard - RFC 6455 Support16 (Chrome){{CompatGeckoDesktop("11.0")}}{{CompatUnknown}}12.106.0
-
- -

Gecko notes

- -

WebSockets support in Firefox is continuing to track the evolving WebSocket specification. Firefox 6 implements version 7 of the underlying protocol, while Firefox 7 implements version 8 (as specified by IETF draft 10). Firefox mobile received WebSocket support in Firefox mobile 7.0.

- -

Gecko 6.0

- -

Prior to Gecko 6.0 {{geckoRelease("6.0")}}, there was, incorrectly, a WebSocket object that some sites were thinking implied that WebSocket services were not prefixed; this object has been renamed to MozWebSocket.

- -

Gecko 7.0

- -

Starting in Gecko 7.0 {{geckoRelease("7.0")}}, the network.websocket.max-connections preference is used to determine the maximum number of WebSocket connections that can be open at a time. The default value is 200.

- -

Gecko 8.0

- -

Starting in Gecko 8.0 {{geckoRelease("8.0")}}, the deflate-stream extension to the WebSocket protocol has been disabled, since it's been deprecated from the specification drafts. This resolves incompatibilities with some sites.

- -

Gecko 11.0

- -

Prior to Gecko 11.0, both incoming and outgoing messages were limited to 16 MB in size. They may now be up to 2 GB in size. Note, however, that memory limitations (especially on mobile devices) make that a theoretical maximum, not a practical one. In reality, transfers of that size will fail on devices that don't have enough memory.

- -

Additionally, ArrayBuffer send and receive support for binary data has been implemented.

- -

Starting in Gecko 11.0, the WebSocket API is no longer prefixed.

- -
Warning: Among other things, a key reason WebSockets was disabled by default in Firefox 4 and 5 is the discovery of a security issue in the protocol's design. This was fixed in Firefox 6 by implementing a newer version of the protocol that corrects the problem.
- -
{{HTML5ArticleTOC}}
diff --git a/files/it/web/api/websockets_api/writing_websocket_client_applications/index.html b/files/it/web/api/websockets_api/writing_websocket_client_applications/index.html deleted file mode 100644 index c7c45a3ecc..0000000000 --- a/files/it/web/api/websockets_api/writing_websocket_client_applications/index.html +++ /dev/null @@ -1,185 +0,0 @@ ---- -title: Writing WebSocket client applications -slug: Web/API/WebSockets_API/Writing_WebSocket_client_applications -tags: - - WebSocket -translation_of: Web/API/WebSockets_API/Writing_WebSocket_client_applications -original_slug: WebSockets/Writing_WebSocket_client_applications ---- -

WebSockets è una tecnologia, basata sul protocollo ws, che rende possibile stabilire una connessione continua tra un client e un server. Un client websocket può essere il browser dell'utente, ma il protocollo è indipendente dalla piattaforma, così com'è indipendente il protocollo http.

- -
Note: Abbiamo un esempio funzionante di un sistema chat/server utilizzato per gli snippet di codice che saranno resi disponibili una volta che la nostra infrastruttura sarà pronta per ospitare gli esempi di WebSocket propriamente.
- -

{{AvailableInWorkers}}

- -

Creare un oggetto WebSocket

- -

Per rendere possibile la comunicazione utilizzando il protocollo WebSocket avrai bisogno di creare un oggetto WebSocket; questo proverà automaticamente a connettersi con il server.

- -

Il costruttore del WebSocket accetta due parametri, di cui il secondo opzionale:

- -
WebSocket WebSocket(
-  in DOMString url,
-  in optional DOMString protocols
-);
-
- -
-
url
-
Lo URL a cui connettersi, questo dovrebbe essere lo URL al quale il server WebSocket risponderà.
-
protocols {{ optional_inline() }}
-
Una stringa con un singolo protocollo o un array di stringhe di protocolli. Queste stringhe sono utilizzate per indicare i sotto protocolli così che il singolo server possa implementare più sotto protocolli WebSocket (per esempio, potresti volere che un server sia capace di gestire diversi tipi di interazioni dipendentemente dal protocollo specificato). Se non specifighi il protocollo, verrà usata una stringa vuota.
-
- -

Il costruttore può lanciare un eccezione:

- -
-
SECURITY_ERR
-
La porta a cui la connessione sta provado ad accedere è bloccata.
-
- -
-
- -

Errori di connessione

- -

Se accade un errore durante un tentativo di connessione, prima un semplice evento con il nome "error" è inviato all'oggetto WebSocket (invocando così il suo gestore onerror), e poi CloseEvent (invocando così il gestore onclose) per indicare la ragione della chiusura di connessione.

- -

Da Firefox 11 tuttavia, è tipico ricevere un errore descrittivo nella console della piattaforma Mozilla e un codice di chiusura definito in RFC 6455, Section 7.4 attraverso CloseEvent.

- -

Esempi

- -

Questo semplice esempio crea un nuovo WebSocket, connettendosi al server all'indirizzo ws://www.example.com/socketserver. Un protocollo chiamato "protocolOne" è presente nella richiesta per il socket in esempio anche se omesso.

- -
var esempioSocket = new WebSocket("ws://www.example.com/socketserver", "protocolOne");
-
- -

Alla restituzione, esempioSocket.readyState è CONNECTING. Il readyState diventerà OPEN quando la connessione sarà abilitata a trasmettere dati.

- -

Se vuoi aprire una connessione e essere flessibile sui protocolli che supporti, puoi specificare un array di protocolli:

- -
var esempioSocket = new WebSocket("ws://www.example.com/socketserver", ["protocolOne", "protocolTwo"]);
-
- -

Quando la connessione è stabilita (quindi readyState è OPEN), esempioSocket.protocol ti dirà quale protocollo il server ha selezionato.

- -

Negli esempi qui sopra, ws sostituisce http, così come wss sostituisce https. Per stabilire un WebSocket ci si basa sul meccanismo di upgrade HTTP, così la richiesta per l'aggiornamento del protocollo è implicita quando richiamiamo il server HTTP come ws://www.example.com oppure wss://www.example.com.

- -

Inviare dati al server

- -

Una volta stabilita la connessione puoi trasmettere dati al server. Per farlo, chiama il metodo send() dell'oggetto WebSocket per ogni messaggio che vuoi inviare:

- -
esempioSocket.send("Ecco del testo che il server sta aspettando di ricevere!");
-
- -

Puoi inviare dati come una stringa, {{ domxref("Blob") }} o un ArrayBuffer.

- -
Note: Prima della versione 11, Firefox supportava solamente l'invio di dati come stringa.
- -

Stabilire una connessione è un'operazione di natura asincrona e quindi incline a errori. Chiamare il metodo send() immediatamente dopo la creazione del WebSocket non ne implica il successo. Possiamo assicurarci che l'invio di dati venga fatto dopo l'avvenuta connessione con un gestore onopen:

- -
esempioSocket.onopen = function (event) {
-  esempioSocket.send("Ecco del testo che il server sta aspettando di ricevere!");
-};
-
- -

Usare JSON per trasmettere oggetti

- -

Una cosa utile che puoi fare è di utilizzare JSON per inviare dati ragionevolmente complessi al server. Per esempio, un programma di chat puoi interagire con il server utilizzando pacchetti di dati JSON-incapsulati:

- -
// Invia del testo a tutti gli utenti tramite il server
-function sendText() {
-  // Costruisci un oggetto msg contenente i dati di cui il server ha bisogno per processare il messaggio dalla chat del client.
-  var msg = {
-    type: "message",
-    text: document.getElementById("text").value,
-    id:   clientID,
-    date: Date.now()
-  };
-
-  // Invia l'oggetto msg formattato come una stringa JSON.
-  esempioSocket.send(JSON.stringify(msg));
-
-  // Togli il testo dall'elemento di input, pronto a ricevere la prossima linea di testo dall'utente.
-  document.getElementById("text").value = "";
-}
-
- -

Ricevere messaggi dal server

- -

WebSockets è una API dipendente dagli eventi; quando i messaggi sono ricevuti, un evento "message" è inviato alla funzione onmessage. Per iniziare a ascoltare per la ricezione di dati puoi fare così:

- -
esempioSocket.onmessage = function (event) {
-  console.log(event.data);
-}
-
- -

Ricevere e interpretare oggetti JSON

- -

Prendiamo in considerazione l'applicazione chat sul client richiamata precedentemente in {{ anch("Usare JSON per trasmettere oggetti") }}. Ci sono diversi tipi di pacchetti di dati che il client potrebbe ricevere, come:

- - - -

Il codice che interpreta questi messaggi in arrivo potrebbe assomigliare a questo:

- -
esempioSocket.onmessage = function(event) {
-  var f = document.getElementById("chatbox").contentDocument;
-  var text = "";
-  var msg = JSON.parse(event.data);
-  var time = new Date(msg.date);
-  var timeStr = time.toLocaleTimeString();
-
-  switch(msg.type) {
-    case "id":
-      clientID = msg.id;
-      setUsername();
-      break;
-    case "username":
-      text = "<b>User <em>" + msg.name + "</em> signed in at " + timeStr + "</b><br>";
-      break;
-    case "message":
-      text = "(" + timeStr + ") <b>" + msg.name + "</b>: " + msg.text + "<br>";
-      break;
-    case "rejectusername":
-      text = "<b>Your username has been set to <em>" + msg.name + "</em> because the name you chose is in use.</b><br>"
-      break;
-    case "userlist":
-      var ul = "";
-      for (i=0; i < msg.users.length; i++) {
-        ul += msg.users[i] + "<br>";
-      }
-      document.getElementById("userlistbox").innerHTML = ul;
-      break;
-  }
-
-  if (text.length) {
-    f.write(text);
-    document.getElementById("chatbox").contentWindow.scrollByPages(1);
-  }
-};
-
- -

Qui utilizziamo JSON.parse() per convertire l'oggetto JSON all'oggetto originale, poi esaminiamo e agiamo sui suoi contenuti.

- -

Formato dati testo

- -

Il testo ricevuto attraverso una connessione WebSocket è in formato UTF-8.

- -

Prima di Gecko 9.0 {{ geckoRelease("9.0") }}, alcuni non-caratteri in UTF-8 valido causavano la chiusura della connessione. Adesso Gecko permette questi valori.

- -

Chiudere la connessione

- -

Quando hai finito di usare la connessione WebSocket, chiama il metodo close() del WebSocket:

- -
esempioSocket.close();
-
- -

Potrebbe essere utile esaminare l'attributo bufferedAmount prima di provare a chiudere la connessione per assicurarsi che non ci siano dati che devono essere ancora trasmessi al network.

- -

Considerazioni di sicurezza

- -

I WebSockets non dovrebbero essere usati in un ambiente di contenuti misti; non dovresti aprire connessioni non sicure da una pagina che carica attraverso HTTPS o viceversa. Alcuni browser lo vietano esplicitamente, compreso Firefox 8 e superiore.

diff --git a/files/it/web/api/window/alert/index.html b/files/it/web/api/window/alert/index.html deleted file mode 100644 index bfbb04052c..0000000000 --- a/files/it/web/api/window/alert/index.html +++ /dev/null @@ -1,36 +0,0 @@ ---- -title: Window.alert() -slug: Web/API/Window/alert -translation_of: Web/API/Window/alert ---- -

{{ APIRef }}

- -

Mostra una finestra di avviso contenente il testo specificato.

- -

Sintassi

- -
window.alert(messaggio);
-
- - - -

Esempio

- -
window.alert("Ciao, mondo!");
-// il prefisso "window." è opzionale, quindi
-// alert("Ciao, mondo!"); ha lo stesso effetto
-
- -

Note

- -

La finestra di avviso dovrebbe essere utilizzata per i messaggi che non richiedono alcuna risposta da parte dell'utente, se non la conferma che tale messaggio è stato letto.

- -

Le finestre di dialogo sono finestre modali, cioè impediscono all'utente di permettere al resto dell'interfaccia del programma finchè la finestra non è chiusa. Non si dovrebbe abusare delle funzioni che creano questo tipo di finestre.

- -

I programmatori che utilizzano Chrome (per esempio per le estensioni) dovrebbero utilizzare u netidi di nsIPromptService, invece di alert.

- -

Specifiche

- -

HTML5

diff --git a/files/it/web/api/window/back/index.html b/files/it/web/api/window/back/index.html deleted file mode 100644 index 7b24f97b28..0000000000 --- a/files/it/web/api/window/back/index.html +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: Window.back() -slug: Web/API/Window/back -translation_of: Web/API/Window/back ---- -
{{APIRef}}{{ Non-standard_header() }} {{ obsolete_header(31) }}
- -

Sommario

- -

Riporta la finestra corrente all'ultima pagina visitata, o alla pagina più indietro nella Cronologia del browser.

- -

Sintassi

- -
window.back()
-
- -

Esempio

- -
function vaiIndietro() {
-   if ( possoAndareIndietro )
-      window.back();
-}
-
- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/window/blur/index.html b/files/it/web/api/window/blur/index.html deleted file mode 100644 index de26372766..0000000000 --- a/files/it/web/api/window/blur/index.html +++ /dev/null @@ -1,26 +0,0 @@ ---- -title: Window.blur() -slug: Web/API/Window/blur -translation_of: Web/API/Window/blur ---- -

{{APIRef}}

- -

Deseleziona la finestra, come se l'utente avesse cliccato altrove.

- -

Sintassi

- -
window.blur()
-
- -

Esempio

- -
window.blur();
-
- -

Note

- -

Non ha effetto se la finestra non è selezionata. Si veda anche window.focus.

- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/window/close/index.html b/files/it/web/api/window/close/index.html deleted file mode 100644 index de07d87f7b..0000000000 --- a/files/it/web/api/window/close/index.html +++ /dev/null @@ -1,72 +0,0 @@ ---- -title: Window.close() -slug: Web/API/Window/close -translation_of: Web/API/Window/close ---- -

{{APIRef}}

- -

Il metodo Window.close() chiude la finestra corrente, oppure quella sulla quale è invocato.

- -

Questo metodo può essere invocato solo su finestre che sono state aperte da uno script  utilizzando il metodo {{domxref("window.open()")}}. Se la finestra non è stata aperta mediante script, nella Console JavaScript apparirà il seguente errore: Scripts may not close windows that were not opened by script.

- -

Sintassi

- -
window.close();
- -

Esempi

- -

Chiudere una finestra aperta mediante window.open()

- -

Questo esempio mostra come chiudere una finestra aperta da uno script mediante l'invocazione di {{domxref("window.open()")}}.

- -
<script>
-//Variabile globale in cui si memorizza un riferimento alla finestra aperta
-var openedWindow;
-
-function openWindow()
-{
-  openedWindow = window.open('moreinfo.htm');
-}
-
-function closeOpenedWindow()
-{
-  openedWindow.close();
-}
-</script>
-
- -

Chiudere la finestra corrente

- -

Quando si invoca direttamente il metodo close() sull'oggetto window, piuttosto che invocare close() su una istanza di window, il browser chiuderà la finestra in primo piano, indipendentemente dal fatto che uno script abbia creato quella finestra oppure no.  (Firefox 35.0.1: gli script non possono chiudere una finestra che non hanno aperto)

- -
<script>
-function closeCurrentWindow()
-{
-  window.close();
-}
-</script>
-
- -

Specifica

- - - - - - - - - - - - - - -
SpecificaStatoCommenti
{{SpecName('HTML WHATWG', '#dom-window-close', 'window.close()')}}{{Spec2('HTML WHATWG')}} 
- - -

Browser compatibility

- - - -

{{Compat("api.Window.close")}}

diff --git a/files/it/web/api/window/closed/index.html b/files/it/web/api/window/closed/index.html deleted file mode 100644 index 66152b63e7..0000000000 --- a/files/it/web/api/window/closed/index.html +++ /dev/null @@ -1,66 +0,0 @@ ---- -title: Window.closed -slug: Web/API/Window/closed -translation_of: Web/API/Window/closed ---- -
{{APIRef}}
- -

Questa proprietà indica se la finestra è chiusa.

- -

Sintassi

- -
var isClosed = window.closed;
-
- -

Questa proprietà è di sola lettura.

- -

Valori restituiti

- -
-
isClosed
-
un booleano; valori possibili:
-
- - - -

Esempi

- -

Cambiare l'URL di una finestra da una popup

- -

L'esempio seguente mostra come una finestra popup possa contenere codice JavaScript che modifichi l'URL della finestra che l'ha generata. Prima di tentare di modificare l'URL, controlleremo che la finestra corrente (la popup, appunto) abbia una "opener" utilizzando la proprietà window.opener e che l'opener non sia chiusa:

- -
// controllo che l'opener esista e non sia chiusa
-if (window.opener && !window.opener.closed) {
-  window.opener.location.href = "http://www.mozilla.org";
-}
-
- -

Si noti che le popup possono accedere solo a se stesse e alle finestre che le hanno generate.

- -

Ricaricare una popup

- -

In questo esempio la funzione aggiornaPopup() chiama il metodo reload() dell'oggetto location della popup per aggiornare il suo contenuto. Se la popup non è stata ancora aperta o l'utente l'ha chiusa, viene aperta una nuova finestra.

- -
var finestraPopup = null;
-
-function aggiornaPopup() {
-  if (popupWindow && !popupWindow.closed) {
-    // finestraPopup è aperta, la aggiorno
-    finestraPopup.location.reload(true);
-  } else {
-    // apro una nuova popup
-    finestraPopup = window.open("popup.html","miaPopup");
-  }
-}
-
- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

- -

Altre risorse

- -

MSDN window.closed

diff --git a/files/it/web/api/window/confirm/index.html b/files/it/web/api/window/confirm/index.html deleted file mode 100644 index 215e3091e5..0000000000 --- a/files/it/web/api/window/confirm/index.html +++ /dev/null @@ -1,47 +0,0 @@ ---- -title: Window.confirm() -slug: Web/API/Window/confirm -tags: - - Window - - confirm -translation_of: Web/API/Window/confirm ---- -
{{ApiRef("Window")}}
- -

Mostra una finestra di dialogo con un messaggio (opzionale) e due bottoni: OK e Annulla.

- -

Sintassi

- -
input = window.confirm(messaggio);
-
- -

Parametri

- -

messaggio
-      Una stringa che viene mostrata nella finestra di dialogo.

- -

Valore ritornato

- -

input
-      Un valore booleano che indica se è stato selezionato OK (true) o Annulla (false).

- -

Esempio

- -
if (window.confirm("vuoi vedere il mio vestito nuovo?")) {
-    window.open("vestito.html", "Il mio vestito nuovo", "");
-}
-
- -

Note

- -

Le finestre di dialogo sono finestre modali, cioè impediscono all'utente di accedere al resto dell'interfaccia del programma finchè la finestra non viene chiusa. Per questo motivo, è meglio non abusare delle funzioni che creano questo tipo di finestre.

- -

I programmatori che utilizzano Chrome (per esempio per le estensioni) dovrebbero utilizzare i metodi di nsIPromptService, invece di alert.

- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

- -

Altri metodi

- -

alert, prompt

diff --git a/files/it/web/api/window/crypto/index.html b/files/it/web/api/window/crypto/index.html deleted file mode 100644 index 65107e937c..0000000000 --- a/files/it/web/api/window/crypto/index.html +++ /dev/null @@ -1,90 +0,0 @@ ---- -title: Window.crypto -slug: Web/API/Window/crypto -translation_of: Web/API/Window/crypto ---- -
{{APIRef}}
- -

La proprietà di sola lettura {{domxref("Window.crypto")}} ritorna l'oggetto {{domxref("Crypto")}} associato all'oggetto globale. Questo oggetto permette alle pagine web di accedere al alcuni servizi si crittografia.

- -

Sintassi

- -
var cryptoObj = window.crypto || window.msCrypto; // per IE 11
-
- -

Specifiche

- - - - - - - - - - - - - - -
SpecificaStatoCommenti
{{SpecName("Web Crypto API", "#dfn-GlobalCrypto", "Window.crypto")}}{{Spec2("Web Crypto API")}}Initial definition
- -

Compatibilità con i browser

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerEdgeOperaSafari
Basic support44 {{CompatVersionUnknown}}{{CompatVersionUnknown}}6 {{property_prefix("ms")}}2019{{CompatVersionUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - - - -
FeatureChrome for AndroidFirefox MobileFirefox OSIE PhoneOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -

Guarda anche

- - diff --git a/files/it/web/api/window/defaultstatus/index.html b/files/it/web/api/window/defaultstatus/index.html deleted file mode 100644 index 5212fabcd7..0000000000 --- a/files/it/web/api/window/defaultstatus/index.html +++ /dev/null @@ -1,38 +0,0 @@ ---- -title: Window.defaultStatus -slug: Web/API/Window/defaultstatus -translation_of: Web/API/Window/defaultStatus ---- -
{{ApiRef()}}
- -

Legge o imposta il testo predefinito della barra di stato della finestra a cui si riferisce l'oggetto window.

- -

Sintassi

- -
messaggio = window.defaultStatus
-window.defaultStatus =
-messaggio
-
- -

Parameters

- - - -

Esempio

- -
<html>
- <body onload="window.defaultStatus='ciao!';"/>
-  <button onclick="window.confirm('Sei sicuro di volertene andare?');">chiudi</button>
- </body>
-</htm>
-
- -

Note

- -

Per impostare lo stato della finestra dopo che questa si è aperta, si può utilizzare window.status.

- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/window/devicemotion_event/index.html b/files/it/web/api/window/devicemotion_event/index.html deleted file mode 100644 index bbc0b22717..0000000000 --- a/files/it/web/api/window/devicemotion_event/index.html +++ /dev/null @@ -1,97 +0,0 @@ ---- -title: devicemotion -slug: Web/API/Window/devicemotion_event -translation_of: Web/API/Window/devicemotion_event ---- -

L'evento devicemotion viene attivato a intervalli regolari e indica la quantità di forza fisica dell'accellezazione che il dispositivo riceve in quel dato momento. Fornisce inoltre informazioni circa la velocità di rotazione, se disponibili.

- -

Informazioni Generali

- -
-
Specifica
-
DeviceOrientation Event
-
Interfaccia
-
DeviceMotionEvent
-
Bubbles
-
No
-
Cancellabile
-
No
-
Bersaglio
-
DefaultView (window)
-
Azione predefinita
-
nessuna
-
- -

Propietà

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyTypeDescription
target {{readonlyInline}}{{domxref("EventTarget")}}The event target (the topmost target in the DOM tree).
type {{readonlyInline}}{{domxref("DOMString")}}The type of event.
bubbles {{readonlyInline}}{{jsxref("Boolean")}}Whether the event normally bubbles or not
cancelable {{readonlyInline}}{{jsxref("Boolean")}}Whether the event is cancellable or not?
acceleration {{readonlyInline}}{{domxref("DeviceAcceleration")}}The acceleration of the device. This value has taken into account the effect of gravity and removed it from the figures. This value may not exist if the hardware doesn't know how to remove gravity from the acceleration data.
accelerationIncludingGravity {{readonlyInline}}{{domxref("DeviceAcceleration")}}The acceleration of the device. This value includes the effect of gravity, and may be the only value available on devices that don't have a gyroscope to allow them to properly remove gravity from the data.
interval {{readonlyInline}}doubleThe interval, in milliseconds, at which the DeviceMotionEvent is fired. The next event will be fired in approximately this amount of time.
rotationRate {{readonlyInline}}{{domxref("DeviceRotationRate")}}The rates of rotation of the device about all three axes.
- -

Esempio

- -
function handleMotionEvent(event) {
-
-    var x = event.accelerationIncludingGravity.x;
-    var y = event.accelerationIncludingGravity.y;
-    var z = event.accelerationIncludingGravity.z;
-
-    // Fai qualcosa di maestoso.
-}
-
-window.addEventListener("devicemotion", handleMotionEvent, true);
-
- -

Eventi correlati

- - diff --git a/files/it/web/api/window/document/index.html b/files/it/web/api/window/document/index.html deleted file mode 100644 index 5d98a10385..0000000000 --- a/files/it/web/api/window/document/index.html +++ /dev/null @@ -1,39 +0,0 @@ ---- -title: Window.document -slug: Web/API/Window/document -translation_of: Web/API/Window/document ---- -
{{APIRef}}
- -

Restituisce un riferimento al documento contenuto nella finestra.

- -

Sintassi

- -
doc = window.document
-
- -

Parametri

- - - -

Esempio

- -
<html>
-<head>
-   <title>Ciao, mondo!</title>
-</head>
-<body>
-
-<script type="text/javascript">
-   var doc = window.document;
-   alert( doc.title);    // produce: Ciao, mondo!
-</script>
-
-</body>
-</html>
- -

Specifiche

- -

HTML

diff --git a/files/it/web/api/window/domcontentloaded_event/index.html b/files/it/web/api/window/domcontentloaded_event/index.html deleted file mode 100644 index 1c25d3d6c5..0000000000 --- a/files/it/web/api/window/domcontentloaded_event/index.html +++ /dev/null @@ -1,76 +0,0 @@ ---- -title: DOMContentLoaded event -slug: Web/API/Window/DOMContentLoaded_event -tags: - - Evento - - Referenza - - Web - - eventi -translation_of: Web/API/Window/DOMContentLoaded_event -original_slug: Web/Events/DOMContentLoaded ---- -
{{APIRef}}
- -

L'evento DOMContentLoaded si attiva quando il documento HTML iniziale è stato completamente caricato e analizzato, senza attendere che i fogli di stile, le immagini e i sottoframe finiscano di caricarsi.

- - - - - - - - - - - - - - - - - - - - -
BubblingSì
CancellabileSì (anche se specificato come evento semplice che non è cancellabile)
Interfaccia{{domxref("Event")}}
Proprietà dell'handlerNessuna
- -

L'obiettivo originale per questo evento è il Document che è stato caricato. È possibile ascoltare questo evento nell'interfaccia Window per gestirlo nelle fasi di capturing o bubbling. Per i dettagli completi su questo evento, consulta la pagina sull'evento Document: DOMContentLoaded.

- -

Un evento diverso, load, dovrebbe essere utilizzato solo per rilevare una pagina completamente caricata. È un errore comune utilizzare load dove DOMContentLoaded sarebbe più appropriato.

- -

Esempi

- -

Utilizzo di base

- -
document.addEventListener('DOMContentLoaded', (event) => {
-    console.log('DOM completamente caricato e analizzato');
-});
-
- -

Specifiche

- - - - - - - - - - - - -
SpecificaStato
{{SpecName('HTML WHATWG', 'indices.html#event-domcontentloaded')}}{{Spec2('HTML WHATWG')}}
- -

Compatibilità con i browser

- - - -

{{Compat("api.Window.DOMContentLoaded_event")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/window/find/index.html b/files/it/web/api/window/find/index.html deleted file mode 100644 index 77a6a49092..0000000000 --- a/files/it/web/api/window/find/index.html +++ /dev/null @@ -1,33 +0,0 @@ ---- -title: window.find -slug: Web/API/Window/find -tags: - - DOM - - DOM0 - - Gecko - - Gecko DOM Reference -translation_of: Web/API/Window/find -original_slug: window.find ---- -

{{ ApiRef() }}

-

Sommario

-

Trova una stringa in una finestra.

-

Sintassi

-
window.find(aString, aCaseSensitive, aBackwards, aWrapAround,
-            aWholeWord, aSearchInFrames, aShowDialog);
-
- -

Returns

-

true if the string is found; otherwise, false.

-

Esempio

-

Note

-

Specifiche

-

{{ DOM0() }} This was added by with {{ Bug(9550) }}.

diff --git a/files/it/web/api/window/focus/index.html b/files/it/web/api/window/focus/index.html deleted file mode 100644 index 696383a27c..0000000000 --- a/files/it/web/api/window/focus/index.html +++ /dev/null @@ -1,26 +0,0 @@ ---- -title: Window.focus() -slug: Web/API/Window/focus -translation_of: Web/API/Window/focus ---- -
{{APIRef}}
- -

Seleziona la finestra, come se l'utente avesse cliccato su di essa.

- -

Sintassi

- -
window.focus()
-
- -

Esempio

- -
if (click) { window.focus(); }
-
- -

Note

- -

Non ha effetto se la finestra è già selezionata. Si veda anche window.blur.

- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/window/forward/index.html b/files/it/web/api/window/forward/index.html deleted file mode 100644 index e07fcaa219..0000000000 --- a/files/it/web/api/window/forward/index.html +++ /dev/null @@ -1,22 +0,0 @@ ---- -title: Window.forward() -slug: Web/API/Window/forward -translation_of: Web/API/Window/forward ---- -
{{APIRef}}
- -

Visualizza la pagina successiva che si trova nella Cronologia, come se l'utente avesse cliccato sul bottone Avanti.

- -

Sintassi

- -
window.forward()
-
- -

Esempio

- -
function vaiAvanti() { if (possoAndareAvanti) window.forward(); }
-
- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/window/getselection/index.html b/files/it/web/api/window/getselection/index.html deleted file mode 100644 index c4f561801e..0000000000 --- a/files/it/web/api/window/getselection/index.html +++ /dev/null @@ -1,46 +0,0 @@ ---- -title: Window.getSelection() -slug: Web/API/Window/getSelection -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - Tutte_le_categorie -translation_of: Web/API/Window/getSelection ---- -

{{ ApiRef() }}

- -

Restituisce un oggetto selection che rappresenta il testo selezionato dall'utente.

- -

Sintassi

- -
selection = window.getSelection() ;
-
- - - -

Esempio

- -
function esempio() {
-   var selezione = window.getSelection();
-   window.alert(selezione);
-   var range = selezione.getRangeAt(0);
-   // fai qualcosa con il range
-}
-
- -

Note

- -

In JavaScript, quando un oggetto selezione viene passato a una funzione che si aspetta una stringa (come window.alert o document.write), al suo posto viene passata una stringa, generalmente corrispondente al testo selezionato. Questo fa si che selection assomigli a una stringa, mentre invece è un normale oggetto dotato di metodi e proprietà. La stringa passata è infatti il risultato di toString().

- -

Nell'esempio sopra, selezione è automaticamente "convertito" quando viene passato a window.alert. Tuttavia per utilizzare una proprietà o un metodo della classe String, come ad esempio length o substr, occorre chiamare esplicitamente il metodo toString.

- -

Specifiche

- -

DOM Level 0. Non è parte di alcuna specifica.

- -

Vedi anche

- -

Selection, Range

diff --git a/files/it/web/api/window/history/index.html b/files/it/web/api/window/history/index.html deleted file mode 100644 index 5f087d8d0e..0000000000 --- a/files/it/web/api/window/history/index.html +++ /dev/null @@ -1,37 +0,0 @@ ---- -title: Window.history -slug: Web/API/Window/history -translation_of: Web/API/Window/history ---- -
{{APIRef}}
- -

Restituisce un riferimento all'oggetto history, che fornisce un'interfaccia per manipolare la Cronologia del browser.

- -

Sintassi

- -
oggettoHistory = window.history
-
- -

Parametri

- - - -

Esempio

- -
h = window.history;
-if ( h.length ) { // se c'è una cronologia
-    h.back();     // vai indietro nella cronologia
-}
-
- -

Note

- -

L'oggetto history fornisce la seguente interfaccia: current, length, next, previous, back(), forward(), go().

- -

E' possibile accedere a questa interfaccia dall'oggetto window chiamando, per esempio, window.history.back().

- -

Specifiche

- -

HTML5

diff --git a/files/it/web/api/window/home/index.html b/files/it/web/api/window/home/index.html deleted file mode 100644 index ab9086cc2f..0000000000 --- a/files/it/web/api/window/home/index.html +++ /dev/null @@ -1,24 +0,0 @@ ---- -title: Window.home() -slug: Web/API/Window/home -translation_of: Web/API/Window/home ---- -
{{APIRef}}{{ Non-standard_header() }} {{ obsolete_header(31) }}
- -

Rimanda il browser alla home page impostata.

- -

Sintassi

- -
window.home()
-
- -

Esempio

- -
function vai_a_casa() {
-  window.home();
-}
-
- -

Specifiche

- -

DOM Level 0. Non è parte di alcuna specifica.

diff --git a/files/it/web/api/window/index.html b/files/it/web/api/window/index.html deleted file mode 100644 index af317f6eab..0000000000 --- a/files/it/web/api/window/index.html +++ /dev/null @@ -1,686 +0,0 @@ ---- -title: Window -slug: Web/API/Window -tags: - - DOM - - Gecko - - Reference_del_DOM_di_Gecko - - SezioneIncompleta - - TraduzioneIncompleta - - Tutte_le_categorie -translation_of: Web/API/Window ---- -

{{ ApiRef() }}

- -

Introduzione

- -

Questo capitolo contiene una breve reference per tutti i metodi, proprietà, ed eventi disponibili attraverso l'oggetto window del DOM. L'oggetto window implementa l'interfacciawindow , la quale eredita dall'interfaccia AbstractView.

- -

L'oggetto window rappresenta una finestra, contenente un documento DOM. La proprietà document punta ad un DOM document ( documento DOM ) caricato in quella pagina

- -

Ogni tab che viene aperta contiene il suo personale oggetto window; ciò significa che l'oggetto window non è condiviso fra le varie tab aperte nella stessa finestra. Solo due metodi vengono condivisi dai vari oggetti window presenti in una stessa finestra, e sono i metodi window.resizeTo e window.resizeBy.

- -

Proprietà

- -
-
window.Components
-
The entry point to many XPCOM features. Some properties, e.g. classes, are only available to sufficiently privileged code.
-
- -
-
window.content and window._content
-
Returns a reference to the content element in the current window. The variant with underscore is deprecated.
-
- -
-
window.closed
-
This property indicates whether the current window is closed or not.
-
- -
-
window.controllers
-
Returns the XUL controller objects for the current chrome window.
-
- -
-
window.crypto
-
Returns the browser crypto object.
-
- -
-
window.defaultStatus
-
Gets/sets the status bar text for the given window.
-
- -
-
window.directories
-
Returns a reference to the directories toolbar in the current chrome.
-
- -
-
window.document
-
Returns a reference to the document that the window contains.
-
- -
-
window.frameElement
-
Returns the element in which the window is embedded, or null if the window is not embedded.
-
- -
-
window.frames
-
Returns an array of the subframes in the current window.
-
- -
-
window.history
-
Returns a reference to the history object.
-
- -
-
window.innerHeight
-
Gets the height of the content area of the browser window including, if rendered, the horizontal scrollbar.
-
- -
-
window.innerWidth
-
Gets the width of the content area of the browser window including, if rendered, the vertical scrollbar.
-
- -
-
window.length
-
Returns the number of frames in the window.
-
- -
-
window.location
-
Gets/sets the location, or current URL, of the window object.
-
- -
-
window.locationbar
-
Returns the locationbar object, whose visibility can be toggled in the window.
-
- -
-
window.menubar
-
Returns the menubar object, whose visibility can be toggled in the window.
-
- -
-
window.name
-
Gets/sets the name of the window.
-
- -
-
window.navigator
-
Returns a reference to the navigator object.
-
- -
-
window.navigator.appCodeName
-
Returns the internal "code" name of the current browser.
-
- -
-
window.navigator.appName
-
Returns the official name of the browser.
-
- -
-
window.navigator.appVersion
-
Returns the version of the browser as a string.
-
- -
-
window.navigator.cookieEnabled
-
Returns a boolean indicating whether cookies are enabled in the browser or not.
-
- -
-
window.navigator.javaEnabled()
-
Indicates whether Java is enabled in the host browser.
-
- -
-
window.navigator.language
-
Returns a string representing the language version of the browser.
-
- -
-
window.navigator.mimeTypes
-
Returns a list of the MIME types supported by the browser.
-
- -
-
window.navigator.oscpu
-
Returns a string that represents the current operating system.
-
- -
-
window.navigator.platform
-
Returns a string representing the platform of the browser.
-
- -
-
window.navigator.plugins
-
Returns an array of the plugins installed in the browser.
-
- -
-
window.navigator.product
-
Returns the product name of the browser (e.g. "Gecko").
-
- -
-
window.navigator.productSub
-
Returns the product version number (e.g. "5.0").
-
- -
-
window.navigator.userAgent
-
Returns the user agent string for the current browser.
-
- -
-
window.navigator.vendor
-
Returns the vendor name of the current browser (e.g. "Netscape6").
-
- -
-
window.navigator.vendorSub
-
Returns the vendor version number (e.g. "6.1").
-
- -
-
window.opener
-
Returns a reference to the window that opened this current window.
-
- -
-
window.outerHeight
-
Gets the height of the outside of the browser window.
-
- -
-
window.outerWidth
-
Gets the width of the outside of the browser window.
-
- -
-
window.pageXOffset
-
Gets the amount of content that has been hidden by scrolling to the right.
-
- -
-
window.pageYOffset
-
Gets the amount of content that has been hidden by scrolling down.
-
- -
-
window.parent
-
Returns a reference to the parent of the current window or subframe.
-
- -
-
window.personalbar
-
Returns the personalbar object, whose visibility can be toggled in the window.
-
- -
-
window.pkcs11
-
Returns the pkcs11 object, which can be used to install drivers and other software associated with the pkcs11 protocol.
-
- -
-
window.prompter
-
Returns a reference to the prompt window, if any, currently displayed.
-
- -
-
window.screen
-
Returns a reference to the screen object associated with the window.
-
- -

The following is duplicated on DOM:window.screen

- -
-
window.screen.availTop
-
Specifies the y-coordinate of the first pixel that is not allocated to permanent or semipermanent user interface features.
-
- -
-
window.screen.availLeft
-
Returns the first available pixel available from the left side of the screen.
-
- -
-
window.screen.availHeight
-
Specifies the height of the screen, in pixels, minus permanent or semipermanent user interface features displayed by the operating system, such as the Taskbar on Windows.
-
- -
-
window.screen.availWidth
-
Returns the amount of horizontal space in pixels available to the window.
-
- -
-
window.screen.colorDepth
-
Returns the color depth of the screen.
-
- -
-
window.screen.height
-
Returns the height of the screen in pixels.
-
- -
-
window.screen.left
-
Gets/sets the current distance in pixels from the left side of the screen.
-
- -
-
window.screen.pixelDepth
-
Gets the bit depth of the screen.
-
- -
-
window.screen.top
-
Gets/sets the distance from the top of the screen.
-
- -
-
window.screen.width
-
Returns the width of the screen.
-
- -

end of duplicated content

- -
-
window.screenX
-
Returns the horizontal distance of the left border of the user's browser from the left side of the screen.
-
- -
-
window.screenY
-
Returns the vertical distance of the top border of the user's browser from the top side of the screen.
-
- -
-
window.scrollbars
-
Returns the scrollbars object, whose visibility can be toggled in the window.
-
- -
-
window.scrollMaxX
-
The maximum offset that the window can be scrolled to horizontally.
-
(i.e., the document width minus the viewport width)
-
- -
-
window.scrollMaxY
-
The maximum offset that the window can be scrolled to vertically.
-
(i.e., the document height minus the viewport height)
-
- -
-
window.scrollX
-
Returns the number of pixels that the document has already been scrolled horizontally.
-
- -
-
window.scrollY
-
Returns the number of pixels that the document has already been scrolled vertically.
-
- -
-
window.self
-
Returns an object reference to the window object itself.
-
- -
-
window.sidebar
-
Returns a reference to the window object of the sidebar.
-
- -
-
window.status
-
Gets/sets the text in the statusbar at the bottom of the browser.
-
- -
-
window.statusbar
-
Returns the statusbar object, whose visibility can be toggled in the window.
-
- -
-
window.toolbar
-
Returns the toolbar object, whose visibility can be toggled in the window.
-
- -
-
window.top
-
Returns a reference to the topmost window in the window hierarchy.
-
- -
-
window.window
-
Returns a reference to the current window.
-
- -

Metodi

- -
-
window.alert
-
Displays an alert dialog.
-
- -

base64 func https://bugzilla.mozilla.org/show_bug.cgi?id=287112 (see last comments) https://bugzilla.mozilla.org/show_bug.cgi?id=123003 http://lxr.mozilla.org/seamonkey/sou...indow.cpp#4946

- -
-
window.atob
-
Decodes a string of data which has been encoded using base-64 encoding.
-
- -
-
window.back
-
Moves back one in the window history.
-
- -
-
window.blur
-
Sets focus away from the window.
-
- -
-
window.btoa
-
Creates a base-64 encoded ASCII string from a string of binary data.
-
- -
-
window.captureEvents {{ Obsolete_inline() }}
-
Registers the window to capture all events of the specified type.
-
- -
-
window.clearInterval
-
Cancels the repeated execution set using setInterval.
-
- -
-
window.clearTimeout
-
Clears a delay that's been set for a specific function.
-
- -
-
window.close
-
Closes the current window.
-
- -
-
window.confirm
-
Displays a dialog with a message that the user needs to respond to.
-
- -
-
window.dump
-
Writes a message to the console.
-
- -
-
window.escape
-
Encodes a string.
-
- -
-
window.focus
-
Sets focus on the current window.
-
- -
-
window.forward
-
Moves the window one document forward in the history.
-
- -
-
window.getAttention
-
Flashes the application icon.
-
- -
-
window.getComputedStyle
-
Gets computed style for the specified element. Computed style indicates the computed values of all CSS properties of the element.
-
- -
-
window.getSelection
-
Returns the selection object representing the selected item(s).
-
- -
-
window.home
-
Returns the browser to the home page.
-
- -
-
window.moveBy
-
Moves the current window by a specified amount.
-
- -
-
window.moveTo
-
Moves the window to the specified coordinates.
-
- -
-
window.open
-
Opens a new window.
-
- -
-
window.openDialog
-
Opens a new dialog window.
-
- -
-
window.print
-
Prints the current document.
-
- -
-
window.prompt
-
Returns the text entered by the user in a prompt dialog.
-
- -
-
window.releaseEvents {{ Obsolete_inline() }}
-
Releases the window from trapping events of a specific type.
-
- -
-
window.resizeBy
-
Resizes the current window by a certain amount.
-
- -
-
window.resizeTo
-
Dynamically resizes window.
-
- -
-
window.scroll
-
Scrolls the window to a particular place in the document.
-
- -
-
window.scrollBy
-
Scrolls the document in the window by the given amount.
-
- -
-
window.scrollByLines
-
Scrolls the document by the given number of lines.
-
- -
-
window.scrollByPages
-
Scrolls the current document by the specified number of pages.
-
- -
-
window.scrollTo
-
Scrolls to a particular set of coordinates in the document.
-
- -
-
window.setInterval
-
Execute a function each X milliseconds.
-
- -
-
window.setTimeout
-
Sets a delay for executing a function.
-
- -
-
window.sizeToContent
-
Sizes the window according to its content.
-
- -
-
window.stop
-
This method stops window loading.
-
- -
-
window.unescape
-
Unencodes a value that has been encoded in hexadecimal (e.g. a cookie).
-
- -
-
window.updateCommands
-
- -

Gestori di Eventi

- -
-
window.onabort
-
An event handler property for abort events on the window.
-
- -
-
window.onblur
-
An event handler property for blur events on the window.
-
- -
-
window.onchange
-
An event handler property for change events on the window.
-
- -
-
window.onclick
-
An event handler property for click events on the window.
-
- -
-
window.onclose
-
An event handler property for handling the window close event.
-
- -
-
window.ondragdrop
-
An event handler property for drag and drop events on the window.
-
- -
-
window.onerror
-
An event handler property for errors raised on the window.
-
- -
-
window.onfocus
-
An event handler property for focus events on the window.
-
- -
-
window.onkeydown
-
An event handler property for keydown events on the window.
-
- -
-
window.onkeypress
-
An event handler property for keypress events on the window.
-
- -
-
window.onkeyup
-
An event handler property for keyup events on the window.
-
- -
-
window.onload
-
An event handler property for window loading.
-
- -
-
window.onmousedown
-
An event handler property for mousedown events on the window.
-
- -
-
window.onmousemove
-
An event handler property for mousemove events on the window.
-
- -
-
window.onmouseout
-
An event handler property for mouseout events on the window.
-
- -
-
window.onmouseover
-
An event handler property for mouseover events on the window.
-
- -
-
window.onmouseup
-
An event handler property for mouseup events on the window.
-
- -
-
window.onpaint
-
An event handler property for paint events on the window.
-
- -
-
window.onreset
-
An event handler property for reset events on the window.
-
- -
-
window.onresize
-
An event handler property for window resizing.
-
- -
-
window.onscroll
-
An event handler property for window scrolling.
-
- -
-
window.onselect
-
An event handler property for window selection.
-
- -
-
window.onsubmit
-
An event handler property for submits on window forms.
-
- -
-
window.onunload
-
An event handler property for unload events on the window.
-
- -

{{ languages( { "fr": "fr/DOM/window", "pl": "pl/DOM/window", "en": "en/DOM/window" } ) }}

diff --git a/files/it/web/api/window/load_event/index.html b/files/it/web/api/window/load_event/index.html deleted file mode 100644 index 145b79e867..0000000000 --- a/files/it/web/api/window/load_event/index.html +++ /dev/null @@ -1,124 +0,0 @@ ---- -title: load -slug: Web/API/Window/load_event -tags: - - CompatibilitàBrowser - - Evento -translation_of: Web/API/Window/load_event -original_slug: Web/Events/load ---- -

L'evento load si attiva quando una risorsa e le sue risorse dipendenti hanno completato il caricamento.

- -

Esempi

- -

Window

- -
<script>
-  window.addEventListener("load", function(event) {
-    console.log("Tutte le risorse hanno terminato il caricamento!");
-  });
-</script>
- -

L'elemento script

- -
<script>
-  var script = document.createElement("script");
-  script.addEventListener("load", function(event) {
-    console.log("Lo script ha terminato il caricamento e l'esecuzione");
-  });
-  script.src = "http://example.com/example.js";
-  script.async = true;
-  document.getElementsByTagName("script")[0].parentNode.appendChild(script);
-</script>
- -

Info generali

- -
-
Specifica
-
DOM L3
-
Interfaccia
-
UIEvent
-
Bubbles
-
No
-
Cancelable
-
No
-
Target
-
Window, Document, Element
-
Azione predefinita
-
Nessuna.
-
- -

Proprietà

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
ProprietàTipoDescrizione
target {{readonlyInline}}{{domxref("EventTarget")}}Il target dell'evento (l'obiettivo più in alto nell'albero del DOM).
type {{readonlyInline}}{{domxref("DOMString")}}Il tipo di evento.
bubbles {{readonlyInline}}{{domxref("Boolean")}}Se l'evento normalmente bolle o no.
cancelable {{readonlyInline}}{{domxref("Boolean")}}Se l'evento è cancellabile o meno.
view {{readonlyInline}}{{domxref("WindowProxy")}}{{domxref("Document.defaultView", "document.defaultView")}} (window del documento)
detail {{readonlyInline}}long (float)0
- -

Specifiche

- - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('UI Events', '#event-type-load', 'load')}}{{Spec2('UI Events')}} 
{{SpecName('HTML WHATWG', 'parsing.html#the-end:event-load', 'Load event')}}{{Spec2('HTML WHATWG')}}Questo collega alla sezione nei passaggi che vengono eseguiti alla fine del caricamento di un documento. gli eventi di "caricamento" vengono attivati anche a molti elementi. E nota che ci sono molti punti nelle specifiche che fanno riferimento a cose che possono "ritardare l'evento load".
- -

Eventi correlati

- - diff --git a/files/it/web/api/window/localstorage/index.html b/files/it/web/api/window/localstorage/index.html deleted file mode 100644 index f17f5cece8..0000000000 --- a/files/it/web/api/window/localstorage/index.html +++ /dev/null @@ -1,138 +0,0 @@ ---- -title: Window.localStorage -slug: Web/API/Window/localStorage -translation_of: Web/API/Window/localStorage ---- -

{{APIRef()}}

- -

La proprietà read-only localStorage ti permette di accedere all'oggetto {{domxref("Storage")}} per l'origine del {{domxref("Document")}}; i dati persistono anche tra diverse sessioni browser. localStorage è simile a sessionStorage, ma si differenzia dal fatto che i dati salvati con localStoragenon hanno  expiration time, i dati salvati in sessionStorage vengono cancellati al termine della sessione della pagina — cioé, quando la pagina viene chiusa.

- -

Si dovrebbe notare che i dati salvati in entrambi localStorage o sessionStorage sono specifici rispetto al protocollo della pagina.

- -

Sintassi

- -
myStorage = window.localStorage;
- -

Valore

- -

L'oggetto {{domxref("Storage")}} che puo essere usato per accedere alla memoria del localStorage.

- -

Eccezioni

- -
-
SecurityError
-
La richiesta viola la policy decision, o l'origine non è un valido scheme/host/port tuple (può succedere, per esempio, se l'origine usa lo schemafile: o data: ). Per esempio, l'utente può aver il browser configurato a negare i permessi di dati persistenti.
-
- -

Esempi

- -

Il seguente snippet accede all'oggetto local {{domxref("Storage")}} del dominio e aggiunge i dati usando {{domxref("Storage.setItem()")}}.

- -
localStorage.setItem('myCat', 'Tom');
- -

La sintassi per leggere localStorage è la seguente:

- -
var cat = localStorage.getItem("myCat");
- -

La sintassi per rimuovere dati da localStorage è la seguente:

- -
localStorage.removeItem("myCat");
- -
-

Note: Riferimenti di esempi completi all'articolo: Usare lo Web Storage API.

-
- -

Specifiche

- - - - - - - - - - - - - - -
SpecificheStatusCommento
{{SpecName('HTML WHATWG', 'webstorage.html#dom-localstorage', 'localStorage')}}{{Spec2('HTML WHATWG')}} 
- -

Compatibilità browser

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
localStorage4{{CompatVersionUnknown}}3.5810.504
sessionStorage5{{CompatVersionUnknown}}2810.504
-
- -
- - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidEdgeFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support2.1{{CompatVersionUnknown}}{{ CompatUnknown }}811iOS 3.2
-
- -

Tutti i browsers hanno livelli di capacità vari per entrambilocalStorage e {{domxref("sessionStorage")}}. Qui una dettagliata lista di tutte le capacità di vari browser.

- -
-

Note: A partire da iOS 5.1, Safari Mobile salva i dati di localStorage nella cartella cache, che è soggetta a rimozioni occasionali. Safari Mobile in Private mode previene la scrittura al localStorage.

-
- -

Consulta anche

- - diff --git a/files/it/web/api/window/locationbar/index.html b/files/it/web/api/window/locationbar/index.html deleted file mode 100644 index 583c6def10..0000000000 --- a/files/it/web/api/window/locationbar/index.html +++ /dev/null @@ -1,43 +0,0 @@ ---- -title: Window.locationbar -slug: Web/API/Window/locationbar -translation_of: Web/API/Window/locationbar ---- -
{{APIRef}}
- -

Restituisce l'oggetto locationbar, che può essere reso invisibile.

- -

Sintassi

- -
oggetto = window.locationbar
-
- -

Esempio

- -

Il seguente esempio completo mostra un possibile modo per utilizzare la proprietà visible dei vari oggetti "bar" (quelli che rappresentano una qualsiasi barra); mostra anche come cambiare i privilegi necessari per modificare tale proprietà.

- -

The following complete HTML example shows way that the visible property of the various "bar" objects is used, and also the change to the privileges necessary to write to the visible property of any of the bars on an existing window.

- -
<html>
-<head>
-  <title>Esperimenti sul DOM</title>
-  <script>
-    // modifico lo stato della barra in questa finestra
-    netscape.security.PrivilegeManager.
-        enablePrivilege("UniversalBrowserWrite");
-    window.statusbar.visible=!window.statusbar.visible;
-  </script>
-</head>
-<body>
-  <p>Esperimenti sul DOM</p>
-</body>
-</html>
-
- -

Note

- -

Quando si carica l'esempio sopra riportato, il browser mostra una finestra di avviso. Si veda anche: window.menubar, window.personalbar, window.scrollbars, window.statusbar, window.toolbar

- -

Specifiche

- -

HTML5

diff --git a/files/it/web/api/window/matchmedia/index.html b/files/it/web/api/window/matchmedia/index.html deleted file mode 100644 index a4dc984d9a..0000000000 --- a/files/it/web/api/window/matchmedia/index.html +++ /dev/null @@ -1,91 +0,0 @@ ---- -title: Window.matchMedia() -slug: Web/API/Window/matchMedia -translation_of: Web/API/Window/matchMedia ---- -

Sommario

- -

Restituisce un nuovo oggetto {{domxref("MediaQueryList")}} che rappresenta i risultati dell'anaisi effettuta in base alla  stringa media query specificata.

- -

Sintassi

- -
mql = window.matchMedia(mediaQueryString)
- -

dove QueryString è una stringa che rappresenta la ricerca media query per la quale restituire il nuovo oggetto {{domxref("MediaQueryList")}} .

- -

Esempio

- -
if (window.matchMedia("(min-width: 400px)").matches) {
-  /* the viewport is at least 400 pixels wide */
-} else {
-  /* the viewport is less than 400 pixels wide */
-}
- -

Questo codice permette di gestire la pagina in modo diverso quando la finestra è molto piccola.

- -

Vedere Using media queries from code per altri esempi.

- -

Compatibilità browser

- -

{{CompatibilityTable()}}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support9{{CompatGeckoDesktop("6.0")}}1012.15.1
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support3.0{{CompatGeckoMobile("6.0")}}{{CompatNo}}12.15
-
- -

Specifica

- - - -

Vedere anche

- - diff --git a/files/it/web/api/window/moveby/index.html b/files/it/web/api/window/moveby/index.html deleted file mode 100644 index 41f373f9eb..0000000000 --- a/files/it/web/api/window/moveby/index.html +++ /dev/null @@ -1,36 +0,0 @@ ---- -title: Window.moveBy() -slug: Web/API/Window/moveBy -translation_of: Web/API/Window/moveBy ---- -
{{APIRef}}
- -

Sposta la finestra di un certo numero di pixel.

- -

Sintassi

- -
window.moveBy(x,
-y)
-
- -

Parametri

- - - -

Esempio

- -
 function in_alto_a_destra() {
-    moveBy(10, -10);
- }
-
- -

Note

- -

E' possibile utilizzare numeri negativi come parametri. Questa funzione esegue uno spostamento della finestra relativamente alla sua posizione attuale, mentre window.moveTo la sposta in un punto assoluto.

- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/window/moveto/index.html b/files/it/web/api/window/moveto/index.html deleted file mode 100644 index 5e9b2c271c..0000000000 --- a/files/it/web/api/window/moveto/index.html +++ /dev/null @@ -1,37 +0,0 @@ ---- -title: Window.moveTo() -slug: Web/API/Window/moveTo -translation_of: Web/API/Window/moveTo ---- -
{{APIRef}}
- -

Sposta la finestra alle coordinate specificate.

- -

Sintassi

- -
window.moveTo(x,
-y)
-
- -

Parametri

- - - -

Esempio

- -
 function origine() {
-    // sposta la finestra all'angolo in alto a sinistra
-    window.moveTo(0, 0)
- }
-
- -

Note

- -

Le coordinate iniziali sono 0, 0 e rappresentano l'angolo in alto a sinistra dello schermo. Questa funzione sposta la finestra in un punto assoluto, mentre window.moveBy la sposta relativamente alla sua posizione attuale.

- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/window/name/index.html b/files/it/web/api/window/name/index.html deleted file mode 100644 index 8127d67285..0000000000 --- a/files/it/web/api/window/name/index.html +++ /dev/null @@ -1,23 +0,0 @@ ---- -title: Window.name -slug: Web/API/Window/name -translation_of: Web/API/Window/name ---- -

{{APIRef}}
- Restituisce o imposta il nome della finestra.

- -

Sintassi

- -
stringa = window.name
- window.name =
-stringa
-
- -

Esempio

- -
window.name = "vista1";
-
- -

Note

- -

Il nome della finestra viene utilizzato soprattutto per impostare i target dei link e dei form. In realtà una finestra non deve necessariamente avere un nome.

diff --git a/files/it/web/api/window/opener/index.html b/files/it/web/api/window/opener/index.html deleted file mode 100644 index 368b0a2f74..0000000000 --- a/files/it/web/api/window/opener/index.html +++ /dev/null @@ -1,24 +0,0 @@ ---- -title: Window.opener -slug: Web/API/Window/opener -translation_of: Web/API/Window/opener ---- -
{{APIRef}}
- -

Restituisce un riferimento alla finestra che ha aperto la finestra corrente.

- -

Sintassi

- -
oggetto = window.opener
-
- -

Esempio

- -
 if window.opener != finestraPrincipale {
-     vaiInizio(window.opener);
- }
-
- -

Note

- -

Quando una finestra viene aperta come popup da un'altra finestra, mantiene un riferimento a quest'ultima a cui si può accedere con window.opener. Se la finestra corrente non ha un "opener", questo metodo restituisce null.

diff --git a/files/it/web/api/window/orientationchange_event/index.html b/files/it/web/api/window/orientationchange_event/index.html deleted file mode 100644 index ba6e0dc550..0000000000 --- a/files/it/web/api/window/orientationchange_event/index.html +++ /dev/null @@ -1,66 +0,0 @@ ---- -title: orientationchange -slug: Web/API/Window/orientationchange_event -translation_of: Web/API/Window/orientationchange_event ---- -

L'evento orientationchange si scatena quando viene modificato l'orientamento del dispositivo.

- -

Informazioni generali

- -
-
Specification
-
Compatibility Living Standard
-
Interface
-
Event
-
Bubbles
-
No
-
Cancelable
-
No
-
Target
-
Screen
-
Default Action
-
None
-
- -

Properties

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyTypeDescription
target {{readonlyInline}}{{domxref("EventTarget")}}The event target (the topmost target in the DOM tree).
type {{readonlyInline}}{{domxref("DOMString")}}The type of event.
bubbles {{readonlyInline}}{{jsxref("Boolean")}}Whether the event normally bubbles or not.
cancelable {{readonlyInline}}{{jsxref("Boolean")}}Whether the event is cancellable or not.
- -

Example

- -
// Note that "orientationchange" and screen.orientation are unprefixed in the following
-// code although this API is still vendor-prefixed browsers implementing it.
-window.addEventListener("orientationchange", function() {
-    alert("the orientation of the device is now " + screen.orientation.angle);
-});
-
diff --git a/files/it/web/api/window/print/index.html b/files/it/web/api/window/print/index.html deleted file mode 100644 index 87f63a0b44..0000000000 --- a/files/it/web/api/window/print/index.html +++ /dev/null @@ -1,17 +0,0 @@ ---- -title: Window.print() -slug: Web/API/Window/print -translation_of: Web/API/Window/print ---- -
{{APIRef}}
- -

Apre una finestra di stampa per stampare il documento corrente.

- -

Sintassi

- -
window.print()
-
- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/window/prompt/index.html b/files/it/web/api/window/prompt/index.html deleted file mode 100644 index a3336c95be..0000000000 --- a/files/it/web/api/window/prompt/index.html +++ /dev/null @@ -1,51 +0,0 @@ ---- -title: Window.prompt() -slug: Web/API/Window/prompt -translation_of: Web/API/Window/prompt ---- -
{{APIRef}}
- -

Mostra una finestra di dialogo che chiede all'utente di inserire del testo.

- -

Sintassi

- -
input = window.prompt(
-testo,
-valore);
-
- - - -

Esempio

- -
var segno = prompt("Di che segno sei?");
-if (segno.toLowerCase() == "scorpione")
-   alert("Ma dai!.. anch'io!!!");
-
- -

Quando l'utente clicca il bottone OK, viene restituito il testo che ha digitato. Se l'utente clicca su OK senza aver inserito del testo, viene restituita una stringa vuota. Se invece l'utente clicca su Cancella, la funzione restituisce null.

- -

Note

- -

Una finestra di dialogo contiene un campo di testo di una sola riga, un bottone OK e un bottone Cancella. La funzione restituisce il testo (eventualmente vuoto) inserito dall'utente nel campo di testo.

- -

A prompt dialog contains a single-line textbox, a Cancel button, and an OK button, and returns the (possibly empty) text the user inputted into that textbox.

- -

Le finestre di dialogo sono finestre modali, cioè impediscono all'utente di permettere al resto dell'interfaccia del programma finchè la finestra non è chiusa. Non si dovrebbe abusare delle funzioni che creano questo tipo di finestre.

- -

I programmatori che utilizzano Chrome (per esempio per le estensioni) dovrebbero utilizzare u netidi di nsIPromptService, invece di alert.

- -

Specifiche

- -

HTML5

- -

Altri metodi

- - diff --git a/files/it/web/api/window/requestanimationframe/index.html b/files/it/web/api/window/requestanimationframe/index.html deleted file mode 100644 index f3c835b671..0000000000 --- a/files/it/web/api/window/requestanimationframe/index.html +++ /dev/null @@ -1,115 +0,0 @@ ---- -title: window.requestAnimationFrame() -slug: Web/API/Window/requestAnimationFrame -tags: - - API - - Animations - - Animazioni - - DOM - - DOM Reference - - Drawing - - Graphics - - Performance - - Reference - - Window - - requestAnimationFrame -translation_of: Web/API/window/requestAnimationFrame ---- -
{{APIRef}}
- -
Il metodo window.requestAnimationFrame()indica al browser che intendi eseguire un'animazione e desideri che il browser richiami una funzione specifica per aggiornare un'animazione prima che venga eseguito nuovamente il render del browser. Il metodo accetta una funzione di callback come argomento che verrà eseguita prima del nuovo render del browser.
- -
 
- -
Nota: la funzione di callback deve chiamare a sua volta requestAnimationFrame() se vuoi animare un'altro frame alla successiva azione di render del browser.
- -

Dovresti chiamare questo metodo ogni qualvolta intendi aggiornare lo stato della tua animazione sul monitor. In questo modo la tua richiesta verrà eseguita prima che il browser esegua nuvamente il render della pagina. Il numero di esecuzioni della callback è generalmente di 60 volte al secondo, ma di solito rispetta il refresh-rate del display per quasi tutti i browser secondo le raccomandazioni W3C.
- L'esecuzione di requestAnimationFrame() vengono messe in pausa in quasi tutti i browser quando la pagina è eseguita in un tab non visibile on in un {{ HTMLElement("iframe") }} non visibile in modo da migliorare le performance e l'utilizzo della batteria.

- -

Alla funzione di callback viene passato come singolo argomento il parametro {{domxref("DOMHighResTimeStamp")}} che indica i momento corrente in cui viene eseguito dalla coda di requestAnimationFrame()
- Nel caso di callback multiple in un singolo frame, ogni funzione riceve lo stesso timestamp anche se è trascorso del tempo durante il calcolo di ogni processo.
- Il timestamp è un numero decimale, in millisecondi, con una precisione di 1ms (1000µs).

- -

Sintassi

- -
window.requestAnimationFrame(callback);
-
- -

Parametri

- -
-
callback
-
Il parametro che specifica la funzione di callback da richiamare prima che venga eseguito il render successivo della pagina.
- La funzione accetta un solo parametro, {{domxref("DOMHighResTimeStamp")}}, che indica il momento esatto (nel formato {{domxref('performance.now()')}}) in cui requestAnimationFrame() inizia la sua esecuzione.
-
- -

Valori di ritorno

- -

Un valore intero di tipo long, l'id della richiesta che identifica univocamente la callback specifica nella lista di callback. Questo è un valore assoluto, ma non dovresti fare nessun tipo di ragionamento sulla base di questo valore. Puoi, però, usare questo valore per passarlo a {{domxref("window.cancelAnimationFrame()")}} in modo da  rimuovere/cancellare la callback dalla coda di richieste da eseguire.

- -

Esempio

- -
var start = null;
-var element = document.getElementById('SomeElementYouWantToAnimate');
-element.style.position = 'absolute';
-
-function step(timestamp) {
-  if (!start) start = timestamp;
-  var progress = timestamp - start;
-  element.style.left = Math.min(progress / 10, 200) + 'px';
-  if (progress < 2000) {
-    window.requestAnimationFrame(step);
-  }
-}
-
-window.requestAnimationFrame(step);
-
- -

Specifiche

- - - - - - - - - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('HTML WHATWG', '#animation-frames', 'requestAnimationFrame')}}{{Spec2('HTML WHATWG')}} -

Nessun cambiamento. Sostituisce il precedente.

-
{{SpecName('RequestAnimationFrame', '#dom-windowanimationtiming-requestanimationframe', 'requestAnimationFrame')}}{{Spec2('RequestAnimationFrame')}} -

Definizione iniziale

-
- -

Compatibilità del Browser

- -
- - -

{{Compat("api.Window.requestAnimationFrame")}}

-
- -

Leggi anche

- - diff --git a/files/it/web/api/window/resizeby/index.html b/files/it/web/api/window/resizeby/index.html deleted file mode 100644 index ee662251c4..0000000000 --- a/files/it/web/api/window/resizeby/index.html +++ /dev/null @@ -1,35 +0,0 @@ ---- -title: Window.resizeBy() -slug: Web/API/Window/resizeBy -translation_of: Web/API/Window/resizeBy ---- -

{{APIRef}}

- -

Aumenta o diminuisce le dimensioni della finestra di un certo numero di pixel.

- -

Sintassi

- -
window.resizeBy(xDelta,
-yDelta)
-
- -

Parametri

- - - -

Esempio

- -
// rimpicciolisce la finestra
-window.resizeBy(-200, -200);
-
- -

Note

- -

Questo metodo ridimensiona la finestra relativamente alle sue dimensioni attuali. Per ridimensionare la finestra in termini assoluti, è possibile utilizzare window.resizeTo.

- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/window/resizeto/index.html b/files/it/web/api/window/resizeto/index.html deleted file mode 100644 index c716aa0411..0000000000 --- a/files/it/web/api/window/resizeto/index.html +++ /dev/null @@ -1,39 +0,0 @@ ---- -title: Window.resizeTo() -slug: Web/API/Window/resizeTo -translation_of: Web/API/Window/resizeTo ---- -

{{APIRef}}

- -

Ridimensiona la finestra dinamicamente.

- -

Sintassi

- -
window.resizeTo(larghezza,
-altezza)
-
- -

Parameters

- - - -

Esempio

- -
 // questa funzione ridimensiona la finestra
- // e fa in modo che occupi metà dello schermo
- function ridimensiona() {
-   window.resizeTo(window.screen.availWidth/2,
-      window.screen.availHeight/2);
- }
-
- -

Note

- -

Si veda anche window.resizeBy.

- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/window/sessionstorage/index.html b/files/it/web/api/window/sessionstorage/index.html deleted file mode 100644 index 06c3b48c4a..0000000000 --- a/files/it/web/api/window/sessionstorage/index.html +++ /dev/null @@ -1,138 +0,0 @@ ---- -title: Window.sessionStorage -slug: Web/API/Window/sessionStorage -translation_of: Web/API/Window/sessionStorage ---- -

{{APIRef()}}

- -

La proprietà sessionStorage permette di accedere all'oggetto di sessione {{domxref("Storage")}}. sessionStorage è simile a  {{domxref("Window.localStorage")}}, l'unica differenza è che mentre i dati salvati in localStorage non hanno scadenza, i dati in sessionStorage vengono ripuliti ogniqualvolta la sessione della pagina termina. La sessione della pagina dura fino a quando il browser è aperto e sopravvive alla ricarica della pagina e al ripristino. L'apertura di una pagina in un nuovo tab o in una nuova finestra implica l'apertura di una nuova sessione, il che differisce da come funzionano i cookie di sessione.

- -

Va ricordato che i dati memorizzati nel sessionStorage o localStorage sono specifici per il protocollo della pagina.

- -
// Salva i dati nel sessionStorage
-sessionStorage.setItem('key', 'value');
-
-// Recupare i dati dal sessionStorage
-var data = sessionStorage.getItem('key');
- -

Value

- -

Un oggetto {{domxref("Storage")}}.

- -

Example

- -

Il seguente esempio accede all'oggetto di sessione corrente  {{domxref("Storage")}} e vi aggiunge un elemento tramite  {{domxref("Storage.setItem()")}}.

- -
sessionStorage.setItem('myCat', 'Tom');
- -

Il seguente esempio salva automaticamente il contenuto di un campo di testo e se la pagina del browser viene ricaricata, ripristina il contenuto del campo di testo in modo da non perdere nessuna digitazione.

- -
// Ottiene il campo di testo
-var field = document.getElementById("field");
-
-// Verifica se ha un valore di salvataggio automatico (autosave)
-// (succederò solo se la pagina viene ricaricata accidentalmente)
-if (sessionStorage.getItem("autosave")) {
-  // Ripristina il contenuto del campo di testo
-  field.value = sessionStorage.getItem("autosave");
-}
-
-// Rimane in ascolto di cambiamenti sul campo di testo
-field.addEventListener("change", function() {
-  // E salva i risultati nell'oggetto sessionStorage
-  sessionStorage.setItem("autosave", field.value);
-});
- -

 

- -
-

Nota: Fare riferimento a Using the Web Storage API per un esempio completo.

-
- -

Specifiche

- - - - - - - - - - - - - - -
SpecificaStatoComment
{{SpecName('Web Storage', '#the-sessionstorage-attribute', 'sessionStorage')}}{{Spec2('Web Storage')}} 
- -

Compatibilità dei browser

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
localStorage43.5810.504
sessionStorage52810.504
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Supporto Base2.1{{ CompatUnknown }}811iOS 3.2
-
- -

Ogni browser ha un livello di supporto differente per localStorage e sessionStorage. 

- -
-

Nota: da iOS 5.1, Safari Mobile salva i dati del localStorage nella directory cache, che è soggetta a pulizie occasinonali, tipicamente quando lo c'è poco spazio disponibile.

-
- -

Vedere anche

- - diff --git a/files/it/web/api/window/sidebar/index.html b/files/it/web/api/window/sidebar/index.html deleted file mode 100644 index 280b5dcce3..0000000000 --- a/files/it/web/api/window/sidebar/index.html +++ /dev/null @@ -1,56 +0,0 @@ ---- -title: Window.sidebar -slug: Web/API/Window/sidebar -tags: - - DOM - - NeedsTranslation - - Non-standard - - Property - - Reference - - TopicStub - - Window -translation_of: Web/API/Window/sidebar ---- -
{{APIRef}} {{Non-standard_header}}
- -

Returns a sidebar object, which contains several methods for registering add-ons with the browser.

- -

Notes

- -

The sidebar object returned has the following methods:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
MethodDescription (SeaMonkey)Description (Firefox)
addPanel(title, contentURL, "")Adds a sidebar panel.Obsolete since Firefox 23 (only present in SeaMonkey).
- End users can use the "load this bookmark in the sidebar" option instead. Also see Creating a Firefox sidebar.
addPersistentPanel(title, contentURL, "")Adds a sidebar panel, which is able to work in the background.
AddSearchProvider(descriptionURL)Installs a search provider (OpenSearch). Adding OpenSearch search engines contains more details. Added in Firefox 2.
addSearchEngine(engineURL, iconURL, suggestedTitle, suggestedCategory) {{Obsolete_inline(44)}}Installs a search engine (Sherlock). Adding Sherlock search engines contains more details.
IsSearchProviderInstalled(descriptionURL)Indicates if a specific search provider (OpenSearch) is installed.
- -

Specification

- -

Mozilla-specific. Not part of any standard.

diff --git a/files/it/web/api/window/sizetocontent/index.html b/files/it/web/api/window/sizetocontent/index.html deleted file mode 100644 index 4880ff9fbd..0000000000 --- a/files/it/web/api/window/sizetocontent/index.html +++ /dev/null @@ -1,15 +0,0 @@ ---- -title: window.sizeToContent -slug: Web/API/Window/sizeToContent -translation_of: Web/API/Window/sizeToContent ---- -

Sommario

-

Ridimensiona automaticamente la finestra perchè si adatti al suo contenuto.

-

Sintassi

-
window.sizeToContent()
-
-

Esempio

-
window.sizeToContent();
-
-

Specifiche

-

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/window/status/index.html b/files/it/web/api/window/status/index.html deleted file mode 100644 index 4b008c0afc..0000000000 --- a/files/it/web/api/window/status/index.html +++ /dev/null @@ -1,26 +0,0 @@ ---- -title: Window.status -slug: Web/API/Window/status -translation_of: Web/API/Window/status ---- -
{{APIRef("DOM")}}
- -

Legge o imposta il testo della barra di stato della finestra a cui si riferisce l'oggetto window.

- -

Sintassi

- -
stringa = window.status
-window.status =
-stringa
-
- -

Esempio

- -
while ( attesa ) {
-   window.status = "Sto caricando...";
-}
-
- -

Specifiche

- -

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/window/statusbar/index.html b/files/it/web/api/window/statusbar/index.html deleted file mode 100644 index 6eb17fc2d8..0000000000 --- a/files/it/web/api/window/statusbar/index.html +++ /dev/null @@ -1,32 +0,0 @@ ---- -title: window.statusbar -slug: Web/API/Window/statusbar -translation_of: Web/API/Window/statusbar ---- -

Sommario

-

Restituisce l'oggetto statusbar, che rappresenta la barra di stato, la cui visibilità può essere disabilitata nel browser.

-

Sintassi

-
oggetto = window.statusbar
-
-

Esempio

-

Il seguente esempio completo mostra un possibile modo per utilizzare la proprietà visible dei vari oggetti "bar" (quelli che rappresentano una qualsiasi barra); mostra anche come cambiare i privilegi necessari per modificare tale proprietà.

-
<html>
-<head>
-  <title>Esperimenti sul DOM</title>
-  <script>
-    // modifico lo stato della barra in questa finestra
-    netscape.security.PrivilegeManager.
-        enablePrivilege("UniversalBrowserWrite");
-    window.statusbar.visible=!window.statusbar.visible;
-  </script>
-</head>
-<body>
-  <p>Esperimenti sul DOM</p>
-</body>
-</html>
-
-

Note

-

Quando si carica l'esempio sopra riportato, il browser mostra una finestra di avviso.

-

Si veda anche: window.locationbar, window.menubar, window.personalbar, window.scrollbars, window.toolbar

-

Specifiche

-

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/window/stop/index.html b/files/it/web/api/window/stop/index.html deleted file mode 100644 index f807d3b843..0000000000 --- a/files/it/web/api/window/stop/index.html +++ /dev/null @@ -1,17 +0,0 @@ ---- -title: window.stop -slug: Web/API/Window/stop -translation_of: Web/API/Window/stop ---- -

Sommario

-

Ferma il caricamento del documento corrente.

-

Sintassi

-
window.stop()
-
-

Esempio

-
window.stop();
-
-

Note

-

Il metodo stop() riproduce ciò che accade quando l'utente clicca sul bottone stop del browser. Per via dell'ordine in cui vengono caricati gli script, questo metodo non può fermare il caricamento del documento in cui è contenuto, ma può fermare il caricamento di grandi immagini, nuove finestre e altri oggetti collegati al documento.

-

Specifiche

-

DOM Level 0. Non è parte di alcuno standard.

diff --git a/files/it/web/api/window/top/index.html b/files/it/web/api/window/top/index.html deleted file mode 100644 index e884cc29d3..0000000000 --- a/files/it/web/api/window/top/index.html +++ /dev/null @@ -1,87 +0,0 @@ ---- -title: Window.top -slug: Web/API/Window/top -tags: - - API - - DOM - - Property - - Reference - - Window -translation_of: Web/API/Window/top ---- -

{{ APIRef }}

- -

Sommario

- -

Ritorna un riferimento all'oggetto window più esterno nella gerarchia.

- -

Sintassi

- -
var topWindow = window.top;
-
- -

Note

- -

Mentre proprietà  window.parent restituisce un rifermiento alla window direttamente superiore, la proprietà window.top restituisce un riferimento alla window più alta nella gerarchia delle windows (la più esterna)

- -

Questa proprietà è particolarmente utile quando quando si sta lavorando da una window che può avere una o più windows che la contengono, in questo modo è possibile avere un riferimento alla window più esterna

- -

Specifica

- -

HTML5

- -

Compatibilità con i browser

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
-
- -

Gecko notes

- -
-

Note: dalla versione {{Gecko ("6.0")}}, questa proprietà è read only.

-
diff --git a/files/it/web/api/windoworworkerglobalscope/clearinterval/index.html b/files/it/web/api/windoworworkerglobalscope/clearinterval/index.html deleted file mode 100644 index 952361f23b..0000000000 --- a/files/it/web/api/windoworworkerglobalscope/clearinterval/index.html +++ /dev/null @@ -1,49 +0,0 @@ ---- -title: WindowTimers.clearInterval() -slug: Web/API/WindowOrWorkerGlobalScope/clearInterval -translation_of: Web/API/WindowOrWorkerGlobalScope/clearInterval -original_slug: Web/API/WindowTimers/clearInterval ---- -
-
{{APIRef("HTML DOM")}}
-
- -

Interrompe l'azione ripetuta dall'utilizzo del comando {{domxref("window.setInterval", "setInterval")}}.

- -

Sintassi

- -
window.clearInterval(intervalID)
-
- -

intervalID è un identificatore dell'azione ripetuta che vuoi cancellare. Questo ID viene passato con il return di setInterval().

- -

Esempio

- -

Vedi setInterval() example.

- -

Specifiche

- - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('HTML WHATWG', 'timers.html#timers', 'clearInterval')}}{{Spec2('HTML WHATWG')}}
- -

Vedi anche

- - diff --git a/files/it/web/api/windoworworkerglobalscope/fetch/index.html b/files/it/web/api/windoworworkerglobalscope/fetch/index.html deleted file mode 100644 index 057ab069a2..0000000000 --- a/files/it/web/api/windoworworkerglobalscope/fetch/index.html +++ /dev/null @@ -1,167 +0,0 @@ ---- -title: WindowOrWorkerGlobalScope.fetch() -slug: Web/API/WindowOrWorkerGlobalScope/fetch -translation_of: Web/API/WindowOrWorkerGlobalScope/fetch ---- -
{{APIRef("Fetch API")}}
- -

Il metodo fetch() del mixin {{domxref("WindowOrWorkerGlobalScope")}} avvia il processo di recupero di una risorsa dalla rete. Questo ritorna una "promise" che si risolve all'oggetto {{domxref("Response")}} che rappresenta la risposta alla tua richiesta.

- -

WorkerOrGlobalScope è implementato sia da {{domxref("Window")}} sia da {{domxref("WorkerGlobalScope")}}, ciò significa che il metodo fetch() è disponibile in quasi tutti i contesti nei quali potresti voler recuperare risorse..

- -

Una promise {{domxref("WindowOrWorkerGlobalScope.fetch","fetch()")}} responge con un {{jsxref("TypeError")}} quando viene incontrato un errore di rete, sebbene questo stia spesso a significare un errore di permessi o simili. Un controllo accurato per un fetch() di successo richiederebbe di controllare che la promise si sia risolta,  e anche il controllo che la proprietà {{domxref("Response.ok")}} ha valore true. Uno stato HTTP 404 non costituisce un errore di rete.

- -

Il metodo fetch() è controllato dalla direttiva connect-src della Content Security Policy piuttosto che dalla direttiva delle risorse che sta recuperando.

- -
-

Nota: I parametri del metodo fetch() sono identici a quelli del costruttore {{domxref("Request.Request","Request()")}}.

-
- -

Sintassi

- -
Promise<Response> fetch(input[, init]);
- -

Parametri

- -
-
input
-
Definisce la risorsa ceh vuoi recuperare. Questa può essere: -
    -
  • Una {{domxref("USVString")}} contenente l'URL diretto della risorsa che vuoi recuperare. Alcuni browsers accettano blob: e data: come schemi.
    • -
  • Un oggetto {{domxref("Request")}}.
    • -
-
-
init {{Optional_inline}}
-
Un oggetto opzioni contenente qualsiasi impostazione personalizzata che si vuole applicare alla richiesta. Le opzioni possibili sono: -
    -
  • method: Il metodo di richiesta, es., GET, POST.
    • -
  • headers: Qualsiasi header si voglia aggiungere alla richiesta, contenuto in un oggetto {{domxref("Headers")}} o un oggetto letterale con valori {{domxref("ByteString")}}.
    • -
  • body: Qualsiasi corpo si voglia aggiungere alla richiesta: può essere un oggetto {{domxref("Blob")}}, {{domxref("BufferSource")}}, {{domxref("FormData")}}, {{domxref("URLSearchParams")}}, o {{domxref("USVString")}}. Si noti che una richiesta che usa il metodo GET o HEAD non può avere un corpo.
    • -
  • mode: La modalità che si vuole usare per la richiesta, es., cors, no-cors, o same-origin.
    • -
  • credentials: Le credenziali che si vuole vengano usate per la richiesta: omit, same-origin, o include. Per inviare automaticamente dei cookies per il dominio corrente, questa opzione deve essere indicata. Iniziando da Chrome 50, questa proprietà accetta anche un'istanza {{domxref("FederatedCredential")}} o {{domxref("PasswordCredential")}}.
    • -
  • cache: La modalità cache ceh si vuole usare per la richiesta: default, no-store, reload, no-cache, force-cache, o only-if-cached.
    • -
  • redirect: Il metodo di reindirizzamento: follow (seguire automaticamente i reindirizzamenti), error (interrompere con un errore se avviene un reindirizzamento), o manual (gestire manualmente i reindirizzamento). In Chrome il valore di default è follow (prima di Chrome 47 era impostato a manual).
    • -
  • referrer: Una {{domxref("USVString")}} che specifica no-referrer, client, o una URL. Il valore predefinito è client.
    • -
  • referrerPolicy: Specifica il valore dello header HTTP del referente. Può essere: no-referrer, no-referrer-when-downgrade, origin, origin-when-cross-origin, unsafe-url.
    • -
  • integrity: Contiene il valore di integrità della sottorisorsa (subresource integrity) della richiesta (es., sha256-BpfBw7ivV8q2jLiT13fxDYAe2tJllusRSZ273h2nFSE=).
    • -
  • keepalive: L'opzione keepalive può essere usata per premettere alla richiesta di sopravvivere alla pagina. Il recupero di una risorsa con l'opzione keepalive sostituisce l'API {{domxref("Navigator.sendBeacon()")}}. 
    • -
  • signal: Un'istanza oggetto {{domxref("AbortSignal")}}; permette di comunicare con una richiesta di recupero e di interromperla se lo si desidera con un {{domxref("AbortController")}}.
    • -
-
-
- -

Valore di ritorno

- -

Una {{domxref("Promise")}} che risolve ad un oggetto {{domxref("Response")}}.

- -

Eccezioni

- - - - - - - - - - - - - - - - - - -
TipoDescrizione
AbortErrorLa richiesta è stata interrotta (tramite {{domxref("AbortController.abort()")}}).
TypeErrorDa Firefox 43, fetch() produrrà un TypeError se la URL possiede credenziali, come http://user:password@example.com.
- -

Esempi

- -

Nel nostro esempio Fetch Request (vedi Fetch Request live) viene creata un nuovo oggetto {{domxref("Request")}} usando il costruttore relativo, per poi recuperarlo con una chiamata fetch(). Siccome stiamo recuperando un'immagine, eseguiamo {{domxref("Body.blob()")}} alla risposta per dargli il tipo MIME adeguato in modo che venga gestito correttamente, poi creiamo un Oggetto URL dello stesso e lo mostriamo in un elemento {{htmlelement("img")}}.

- -
var myImage = document.querySelector('img');
-
-var myRequest = new Request('flowers.jpg');
-
-fetch(myRequest).then(function(response) {
-  return response.blob();
-}).then(function(response) {
-  var objectURL = URL.createObjectURL(response);
-  myImage.src = objectURL;
-});
- -

Nel nostro esempio Fetch with init then Request (vedi Fetch Request init live) facciamo la stessa cosa eccetto che passiamo un oggetto per l'inizializzazione quando invochiamo fetch():

- -
var myImage = document.querySelector('img');
-
-var myHeaders = new Headers();
-myHeaders.append('Content-Type', 'image/jpeg');
-
-var myInit = { method: 'GET',
-               headers: myHeaders,
-               mode: 'cors',
-               cache: 'default' };
-
-var myRequest = new Request('flowers.jpg');
-
-fetch(myRequest,myInit).then(function(response) {
-  ...
-});
- -

Si noti che si può passare l'oggetto per l'inizializzazione insieme al costruttore Request per ottenere lo stesso effetto, es.:

- -
var myRequest = new Request('flowers.jpg', myInit);
- -

Si può anche usare un oggetto letterale come headers in init.

- -
var myInit = { method: 'GET',
-               headers: {
-                   'Content-Type': 'image/jpeg'
-               },
-               mode: 'cors',
-               cache: 'default' };
-
-var myRequest = new Request('flowers.jpg', myInit);
-
- -

Specificazioni

- - - - - - - - - - - - - - - - - - - - - - - - -
SpecificazioniStatusComment
{{SpecName('Fetch','#fetch-method','fetch()')}}{{Spec2('Fetch')}}Definito in un WindowOrWorkerGlobalScope parziale nella specifica più recente.
{{SpecName('Fetch','#dom-global-fetch','fetch()')}}{{Spec2('Fetch')}}Definizione iniziale
{{SpecName('Credential Management')}}{{Spec2('Credential Management')}}Aggiunge l'istanza {{domxref("FederatedCredential")}} o {{domxref("PasswordCredential")}} com un valore possibile per init.credentials.
- -

Compatibilità Browser

- - - -

{{Compat("api.WindowOrWorkerGlobalScope.fetch")}}

- -

Vedi anche

- - diff --git a/files/it/web/api/windoworworkerglobalscope/index.html b/files/it/web/api/windoworworkerglobalscope/index.html deleted file mode 100644 index f7151242c7..0000000000 --- a/files/it/web/api/windoworworkerglobalscope/index.html +++ /dev/null @@ -1,115 +0,0 @@ ---- -title: WindowOrWorkerGlobalScope -slug: Web/API/WindowOrWorkerGlobalScope -tags: - - API - - DOM - - DOM API - - NeedsTranslation - - Service Worker - - TopicStub - - Window - - WindowOrWorkerGlobalScope - - Worker - - WorkerGlobalScope -translation_of: Web/API/WindowOrWorkerGlobalScope ---- -
{{ApiRef()}}
- -

The WindowOrWorkerGlobalScope mixin describes several features common to the {{domxref("Window")}} and {{domxref("WorkerGlobalScope")}} interfaces. Each of these interfaces can, of course, add more features in addition to the ones listed below.

- -
-

Note: WindowOrWorkerGlobalScope is a mixin and not an interface; you can't actually create an object of type WindowOrWorkerGlobalScope.

-
- -

Properties

- -

These properties are defined on the {{domxref("WindowOrWorkerGlobalScope")}} mixin, and implemented by {{domxref("Window")}} and {{domxref("WorkerGlobalScope")}}.

- -
-
-
{{domxref("WindowOrWorkerGlobalScope.caches")}} {{readOnlyinline}}
-
Returns the {{domxref("CacheStorage")}} object associated with the current context. This object enables functionality such as storing assets for offline use, and generating custom responses to requests.
-
{{domxref("WindowOrWorkerGlobalScope.indexedDB")}} {{readonlyInline}}
-
Provides a mechanism for applications to asynchronously access capabilities of indexed databases; returns an {{domxref("IDBFactory")}} object.
-
{{domxref("WindowOrWorkerGlobalScope.isSecureContext")}} {{readOnlyinline}}
-
Returns a boolean indicating whether the current context is secure (true) or not (false).
-
{{domxref("WindowOrWorkerGlobalScope.origin")}} {{readOnlyinline}}
-
Returns the origin of the global scope, serialized as a string.
-
-
- -

Methods

- -

These properties are defined on the {{domxref("WindowOrWorkerGlobalScope")}} mixin, and implemented by {{domxref("Window")}} and {{domxref("WorkerGlobalScope")}}.

- -
-
{{domxref("WindowOrWorkerGlobalScope.atob()")}}
-
Decodes a string of data which has been encoded using base-64 encoding.
-
{{domxref("WindowOrWorkerGlobalScope.btoa()")}}
-
Creates a base-64 encoded ASCII string from a string of binary data.
-
{{domxref("WindowOrWorkerGlobalScope.clearInterval()")}}
-
Cancels the repeated execution set using {{domxref("WindowOrWorkerGlobalScope.setInterval()")}}.
-
{{domxref("WindowOrWorkerGlobalScope.clearTimeout()")}}
-
Cancels the delayed execution set using {{domxref("WindowOrWorkerGlobalScope.setTimeout()")}}.
-
{{domxref("WindowOrWorkerGlobalScope.createImageBitmap()")}}
-
Accepts a variety of different image sources, and returns a {{domxref("Promise")}} which resolves to an {{domxref("ImageBitmap")}}. Optionally the source is cropped to the rectangle of pixels originating at (sx, sy) with width sw, and height sh.
-
{{domxref("WindowOrWorkerGlobalScope.fetch()")}}
-
Starts the process of fetching a resource from the network.
-
{{domxref("WindowOrWorkerGlobalScope.setInterval()")}}
-
Schedules a function to execute every time a given number of milliseconds elapses.
-
{{domxref("WindowOrWorkerGlobalScope.setTimeout()")}}
-
Schedules a function to execute in a given amount of time.
-
- -

Specifications

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName("HTML WHATWG",'webappapis.html#windoworworkerglobalscope-mixin', 'WindowOrWorkerGlobalScope mixin')}}{{Spec2('HTML WHATWG')}}This is where the main mixin is defined.
{{SpecName('Fetch','#fetch-method','fetch()')}}{{Spec2('Fetch')}}Definition of the fetch() method.
{{SpecName('Service Workers', '#self-caches', 'caches')}}{{Spec2('Service Workers')}}Definition of the caches property.
{{SpecName('IndexedDB 2', '#dom-windoworworkerglobalscope-indexeddb', 'indexedDB')}}{{Spec2('IndexedDB 2')}}Definition of the indexedDB property.
{{SpecName('Secure Contexts', '#dom-windoworworkerglobalscope-issecurecontext', 'isSecureContext')}}{{Spec2('Secure Contexts')}}Definition of the isSecureContext property.
- -

Browser compatibility

- - - -

{{Compat("api.WindowOrWorkerGlobalScope")}}

- -

See also

- - diff --git a/files/it/web/api/worker/index.html b/files/it/web/api/worker/index.html deleted file mode 100644 index 5b8c7518a7..0000000000 --- a/files/it/web/api/worker/index.html +++ /dev/null @@ -1,107 +0,0 @@ ---- -title: Worker -slug: Web/API/Worker -tags: - - API - - DOM -translation_of: Web/API/Worker ---- -

{{APIRef("Web Workers API")}}

- -

L'interfaccia Worker delle Web Workers API rappresenta un processo in background che può essere facilmente generato e in grado di inviare messaggi al creatore. Per creare un worker basta specificare nel metodo costruttore Worker() lo script che sarà incaricato di eseguire.

- -

I Workers saranno poi in grado di inizializzare ulteriori workers fintanto che questi workers hanno la stessa origine della pagina su cui sono ospitati (NB: l'annidamento di workers non è ancora implementato in Blink).  I workers possono tuttavia usare XMLHttpRequest per richiamare risorse esterne, a patto che gli attributi responseXML e channel di XMLHttpRequest restituiscano null.

- -

Non tutte le interfacce nè i metodi sono disponibili nel contesto dello script interpretato da un Worker.

- -

Se si vuole utilizzare i workers nelle estensioni per Firefox ed avere accesso a js-ctypes, bisogna utilizzare l'interfaccia {{ domxref("ChromeWorker") }}.

- -

Costruttori

- -
-
{{domxref("Worker.Worker", "Worker()")}}
-
Crea un  worker che eseguirà lo script specificato nella URL. I Workers possono essere anche invocati tramite Blobs.
-
- -

Proprietà

- -

Eredita proprietà dal suo parent, {{domxref("EventTarget")}}, e implementa quelle di {{domxref("AbstractWorker")}}.

- -

Eventi gestiti

- -
-
{{domxref("AbstractWorker.onerror")}}
-
Un {{ domxref("EventListener") }} invocato quando un {{domxref("ErrorEvent")}} di tipo error arriva al worker. Questo evento è ereditato da {{domxref("AbstractWorker")}}.
-
{{domxref("Worker.onmessage")}}
-
Un {{ domxref("EventListener") }} invocato quando  un {{domxref("MessageEvent")}} di tipo message arriva al worker — Per esempio quando un messaggio viene inviato al documento parent da un worker tramite {{domxref("DedicatedWorkerGlobalScope.postMessage")}}. Il messaggio viene salvato nella proprietà {{domxref("MessageEvent.data", "data")}} dell'evento.
-
{{domxref("Worker.onmessageerror")}}
-
Un {{domxref("EventHandler")}} che rappresenta il codice da invocare quando l'evento {{event("messageerror")}} è invocato.
-
- -
-
- -

Metodi

- -

Eredita i metodi del suo parent, {{domxref("EventTarget")}}, e quelli di {{domxref("AbstractWorker")}}.

- -
-
{{domxref("Worker.postMessage()")}}
-
Invia un messaggio (any JavaScript object) al contesto interno del worker.
-
{{domxref("Worker.terminate()")}}
-
Termina immediatamente il worker troncando qualsiasi operazione in corso. Le istanze di ServiceWorker non supportano questo metodo.
-
- -

Esempio

- -

Il codice che segue mostra la creazione di un oggetto {{domxref("Worker")}} usando il costruttore {{domxref("Worker.Worker", "Worker()")}} e l'invio di un messaggio:

- -
var myWorker = new Worker('worker.js');
-var first = document.querySelector('#number1');
-var second = document.querySelector('#number2');
-
-first.onchange = function() {
-  myWorker.postMessage([first.value,second.value]);
-  console.log('Messaggio inviato al worker');
-}
- -

Per un esempio completo: Esempio worker ( esegui worker).

- -


- Specifiche

- - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('HTML WHATWG', "#worker", "Worker")}}{{Spec2('HTML WHATWG')}} 
- -

Compatibilità Browser

- -

Il supporto dipende per ciascun tipo di worker. Controlla le pagine dei singoli worker per avere maggiori dettagli.

- - - -

{{Compat("api.Worker")}}

- -

Cross-origin worker, comportamento in caso di errore

- -

Nelle prime implementazioni browser caricare uno script cross-origin per un worker causava un errore SecurityError; nelle implementazioni piu' recenti invece viene generato un evento {{event("error")}} per rispettare le specifiche. Puoi trovare maggiori informazioni su come gestire queste situazioni qui: Loading cross-origin worker now fires error event instead of throwing; worker in sandboxed iframe no longer allowed.

- -

Vedi Anche

- - diff --git a/files/it/web/api/xmlhttprequest/index.html b/files/it/web/api/xmlhttprequest/index.html deleted file mode 100644 index 634bd2ea10..0000000000 --- a/files/it/web/api/xmlhttprequest/index.html +++ /dev/null @@ -1,173 +0,0 @@ ---- -title: XMLHttpRequest -slug: Web/API/XMLHttpRequest -tags: - - AJAX API HTTP XMLHttpRequest -translation_of: Web/API/XMLHttpRequest ---- -
{{outdated()}}
- -

Questo oggetto è il cuore di AJAX: è infatti lo strumento che JavaScript utilizza per accedere a un documento XML.

- -

Il W3C ha pubblicato una bozza di standard per questo oggetto il 5 aprile 2006.

- -

Seguono alcuni link:

- - - - - -
{{APIRef("XMLHttpRequest")}}
- -

XMLHttpRequest è una API (interfaccia alla progammazione) la quale fornisce al client le funzionalità di trasferire bidirezionalmente dati tra esso ed il server in maniera sincrona od asincrona senza che il browser richieda al server una porzione di dati senza necessariamente effettuar l'aggiornamento della pagina.

- -

Nonostante il nome dato, XMLHttpRequest, originariamente sviluppato da Microsoft e successivamente adottato dalle altre case di sviluppo browser attraverso il suo standard, supporta protocolli HTTP (inclusi quelli di tipo file ed ftp) oltre che l'XML.

- -

Struttura di controllo

- -
-
{{domxref("XMLHttpRequest.XMLHttpRequest", "XMLHttpRequest()")}}
-
La struttura di controllo viene inizializzata con la funzione XMLHttpRequest() e necessita la sua chiamata prima di ogni altro suo metodo.
-
- -

Proprietà

- -

XMLHttpRequest eredita le proprietà di {{domxref("XMLHttpRequestEventTarget")}} e di {{domxref("EventTarget")}}:

- -
-
{{domxref("XMLHttpRequest.onreadystatechange")}}
-
E' un {{domxref("EventHandler")}} chiamato al mutare di un readyState (stato di un evento).
-
{{domxref("XMLHttpRequest.readyState")}} {{readonlyinline}}
-
Restituisce un unsigned short, rappresentante lo stato della richiesta.
-
{{domxref("XMLHttpRequest.response")}} {{readonlyinline}}
-
Restituisce dati di tipo {{domxref("ArrayBuffer")}}, {{domxref("Blob")}}, {{domxref("Document")}},  oggetti JavaScript, od una {{domxref("DOMString")}}, a seconda del valore {{domxref("XMLHttpRequest.responseType")}}. la quale descrive l'entità del corpo della richiesta.
-
{{domxref("XMLHttpRequest.responseText")}} {{readonlyinline}}
-
Restituisce una {{domxref("DOMString")}} la quale contiene l'esito della chiamata sotto forma testuale oppure null se la richiesta non ha riscontri o nel caso non sia stata ancora operata.
-
{{domxref("XMLHttpRequest.responseType")}}
-
E' un valore enumerato il quale definisce il tipo del risultato della chiamata.
-
{{domxref("XMLHttpRequest.responseURL")}} {{readonlyinline}}
-
Restituisce l'URL serializzato dell'esito della chiamata (in una stringa vuota se l'URL è vacante).
-
{{domxref("XMLHttpRequest.responseXML")}} {{readonlyinline}}
-
Restituisce un {{domxref("Documento")}} contenente l'esito della chiamata (di tipo null nei casi in cui la richiesta non abbia esito, non sia stata inviata, o non possa essere convertita in XML o HTML). Not available in workers.
-
{{domxref("XMLHttpRequest.status")}} {{readonlyinline}}
-
Restituisce un dato di tipo unsigned short rappresentante lo stato dell'esito della chiamata.
-
{{domxref("XMLHttpRequest.statusText")}} {{readonlyinline}}
-
Restituisce una {{domxref("DOMString")}} contentente l'esito (in forma di stringa) fornita dal server HTTP. A differenza di {{domxref("XMLHTTPRequest.status")}}, include l'intero testo del messaggio in risposta (es. "200 OK").
-
{{domxref("XMLHttpRequest.timeout")}}
-
Restituisce un unsigned long rappresentante il numero (espresso in millisecondi) rimanente alla chiamata prima che questa venga automaticamente soppressa.
-
{{domxref("XMLHttpRequestEventTarget.ontimeout")}}
-
E' un {{domxref("EventHandler")}} (gestore di eventi) che può occorrere quando una richiesta termina in timeout. {{gecko_minversion_inline("12.0")}}
-
{{domxref("XMLHttpRequest.upload")}} {{readonlyinline}}
-
{{domxref("XMLHttpRequestUpload")}}, rappresenta un processo di upload.
-
{{domxref("XMLHttpRequest.withCredentials")}}
-
Fornisce uno stato {{jsxref("Boolean")}} che indica quando //that indicates whether or not cross-site Access-Control requests should be made using credentials such as cookies or authorization headers.
-
 
-
-

Proprietà non-standard

-
-
{{domxref("XMLHttpRequest.channel")}}{{ReadOnlyInline}}
-
{{Interface("nsIChannel")}}. Definisce il canale utilizzato dall'oggetto quando effettua la chiamata.
-
{{domxref("XMLHttpRequest.mozAnon")}}{{ReadOnlyInline}}
-
Restituisce un dato boolenao, true nel caso la chiamata venga inviata priva di cookie e/o dati di autenticazione nell'header.
-
{{domxref("XMLHttpRequest.mozSystem")}}{{ReadOnlyInline}}
-
Restituisce un dato booleano true nel caso in cui gli stessi parametri di origine non siano comparati dalla chiamata.
-
{{domxref("XMLHttpRequest.mozBackgroundRequest")}}
-
Restituisce un valore booleano indicante se l'oggetto rappresenta una chiamata attiva latente.
-
{{domxref("XMLHttpRequest.mozResponseArrayBuffer")}}{{gecko_minversion_inline("2.0")}} {{obsolete_inline("6")}} {{ReadOnlyInline}}
-
E' un ArrayBuffer. contentente il risultato della chiamata in forma di un array JavaScript tipizzato.
-
{{domxref("XMLHttpRequest.multipart")}}{{obsolete_inline("22")}}
-
Questa funzione Gecko-only , booleana, è stata rimossa a partire da Firefox/Gecko 22. In sostituzione si veda Server-Sent Events, Web Sockets, o responseText per il monitoraggio dei progressi degli eventi.
-
-

Gestori degli eventi

- -

onreadystatechange come proprietà dell'istanza XMLHttpRequest è supportata in ogni browser.

- -

In virtù di ciò, un numero sempre maggiore di trigger degli eventi è stata implementata in vari browser (onload, onerror, onprogress, etc.). Ognuno di questi è supportato da Firefox, in particolare si veda nsIXMLHttpRequestEventTarget e Using XMLHttpRequest.

- -

Molte versioni recenti di browser, Firefox e derivate incluse, supportano la ricezione degli eventi XMLHttpRequest mediante le API standard addEventListener in aggiunta alle proprietà aggiuntive applicate ai metodi dei gestori degli eventi.

- -

Metodi

-
-
     {{domxref("XMLHttpRequest.abort()")}}
-
 
-
Interrompe la chiamata se è stata già inviata.
-
{{domxref("XMLHttpRequest.getAllResponseHeaders()")}}
-
Restituisce tutti gli header in risposta, separati da CRLF, sottoforma di stringa o null se non viene ricevuto nessun risultato.
-
{{domxref("XMLHttpRequest.getResponseHeader()")}}
-
Restituisce la stringa contenente il testo dell'header specifico o null se anche il risultato non è stato ricevuto o l'header non esiste.
-
{{domxref("XMLHttpRequest.open()")}}
-
Inizializza una chiamata. Questa funzione è derivante da codice Javascript; per inizializzare una chiamata dal codice nativo si veda openRequest().
-
{{domxref("XMLHttpRequest.overrideMimeType()")}}
-
Revoca il MIME type inviato dal server.
-
{{domxref("XMLHttpRequest.send()")}}
-
Invia la richiesta. Se la richiesta è asincrona (come è di default) questo metodo risponde non appena terminato l'invio della richiesta attiva.
-
{{domxref("XMLHttpRequest.setRequestHeader()")}}
-
Stabilisce il valore di un header HTTP di richiesta. E' preferibile chiamare setRequestHeader()dopo open(), ma prima di send().
-
-

Metodi non-standard

-
-
{{domxref("XMLHttpRequest.init()")}}
-
Inizializza l'oggetto da usare in codice C++.
-
-
Attenzione: Questo metodo non deve essere eseguito da JavaScript.
-
-
{{domxref("XMLHttpRequest.openRequest()")}}
-
Inizializza una richiesta. Questo metodo è derivante da codice nativo; per inizializzare una richiesta da JavaScript si utilizzi invece open().
-
{{domxref("XMLHttpRequest.sendAsBinary()")}}{{deprecated_inline()}}
-
Una variante del metodo send() il quale invia dati binari.
-
-

Specifiche

- - - - - - - - - - - - - - -
SpecificheStatoCommenti
{{SpecName('XMLHttpRequest')}}{{Spec2('XMLHttpRequest')}}Live standard, ultima versione
-
-
- -

Compatibilità

- -

 

- - - -
{{Compat("api.XMLHttpRequest")}}
- -

Voci correlate

- - diff --git a/files/it/web/api/xmlhttprequest/onreadystatechange/index.html b/files/it/web/api/xmlhttprequest/onreadystatechange/index.html deleted file mode 100644 index 1bbfb02852..0000000000 --- a/files/it/web/api/xmlhttprequest/onreadystatechange/index.html +++ /dev/null @@ -1,119 +0,0 @@ ---- -title: XMLHttpRequest.onreadystatechange -slug: Web/API/XMLHttpRequest/onreadystatechange -translation_of: Web/API/XMLHttpRequest/onreadystatechange ---- -
{{APIRef}}
- -

UN EventHandler  che è invocato ogni volta che l'attributo readyState cambia. la callback è invocata dal thread dell'interfaccia utente. 

- -

La proprietà XMLHttpRequest.onreadystatechange  contiene l'event handler che deve essere invocato quando l'evento {{event("readystatechange")}} si verifica, ovvero ogni volta in cui la proprietà {{domxref("XMLHttpRequest.readyState", "readyState")}} del {{domxref("XMLHttpRequest")}} viene modificata.

- -
-

Warning: This should not be used with synchronous requests and must not be used from native code. .

-
- -

L'evento readystatechange non si verificherà se una richiesta XMLHttpRequest viene cancellata utilizzando il metodo abort().

- -
-

UPDATE: it's firing in the latest version of browsers (Firefox 51.0.1, Opera 43.0.2442.991, Safari 10.0.3 (12602.4.8), Chrome 54.0.2840.71, Edge, IE11). Example here - just reaload page few times.

-
- -

Syntax

- -
XMLHttpRequest.onreadystatechange = callback;
- -

Values

- - - -

Example

- -
var xhr = new XMLHttpRequest(),
-    method = "GET",
-    url = "https://developer.mozilla.org/";
-
-xhr.open(method, url, true);
-xhr.onreadystatechange = function () {
-  if(xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {
-    console.log(xhr.responseText);
-  }
-};
-xhr.send();
- -

Specifications

- - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('XMLHttpRequest', '#handler-xhr-onreadystatechange')}}{{Spec2('XMLHttpRequest')}}WHATWG living standard
- -

Browser compatibility

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - - - -
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatChrome(1)}}{{CompatVersionUnknown}}{{CompatGeckoDesktop(1.0)}}{{CompatIe(7)}}[1]{{CompatVersionUnknown}}{{CompatSafari(1.2)}}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidChrome for AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatUnknown}}1.0{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
-
- -

[1] Internet Explorer version 5 and 6 supported ajax calls using ActiveXObject().

diff --git a/files/it/web/api/xmlhttprequest/open/index.html b/files/it/web/api/xmlhttprequest/open/index.html deleted file mode 100644 index b4786aecc6..0000000000 --- a/files/it/web/api/xmlhttprequest/open/index.html +++ /dev/null @@ -1,115 +0,0 @@ ---- -title: XMLHttpRequest.open() -slug: Web/API/XMLHttpRequest/open -translation_of: Web/API/XMLHttpRequest/open ---- -

{{APIRef('XMLHttpRequest')}}

- -

Il metodo XMLHttpRequest.open() inizializza una richiesta. Questo metodo è utilizzato da codice JavaScript; invece, per inizializzare una richiesta da codice nativo, usare openRequest().

- -
Nota: Chiamare questo metodo da una richiesta già attiva (una in cui open() o openRequest() è stata già chiamata) è equivalente a chiamare abort().
- -

Sintassi

- -
XMLHttpRequest.open(metodo, url)
-XMLHttpRequest.open(metodo, url, async)
-XMLHttpRequest.open(metodo, url, async, utente)
-XMLHttpRequest.open(metodo, url, async, utente, password)
-
- -

Parameters

- -
-
metodo
-
Il metodo HTTP da utilizzare, come "GET", "POST", "PUT", "DELETE", ecc. Campo ignorato per URL non-HTTP(S).
-
url
-
{{domxref("DOMString")}} che rappresenta l'URL a cui inviare la richiesta.
-
async {{optional_inline}}
-
Un parametro opzionale Booleano, true in maniera predefinita, indicante se effettuare o meno l'operazione in modalità asincrona. Se questo valore è false, il metodo send() non ritornerà finchè la risposta non sarà ricevuta. Se true, la notifica di una transazione completata è fornita utilizzando gli event listener. Questo must essere true se l'attributo multipart è true, o partirà un eccezione. -
Nota: Da Gecko 30.0 {{geckoRelease("30.0")}}, le richieste sincrone sul thread principale sono state deprecate a causa di effetti negativi sull'esperienza utente.
-
-
utente {{optional_inline}}
-
Il valore opzionale del nome dell'utente da utilizzare per scopi di autenticazione; il valore predefinito è null.
-
password {{optional_inline}}
-
La password opzionale da utilizzare per scopi di autenticaziones; il valore predefinito è null.
-
- -

Specifiche

- - - - - - - - - - - - - - -
SpecificaStatoCommento
{{SpecName('XMLHttpRequest', '#the-open()-method', 'open()')}}{{Spec2('XMLHttpRequest')}}WHATWG living standard
- -

Compatibilità fra browser

- -
{{CompatibilityTable}}
- -
- - - - - - - - - - - - - - - - - - - - - -
FunzionalitàChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(1)}}{{CompatVersionUnknown}}{{ CompatVersionUnknown}}{{CompatIe('5')}}[1]
- {{CompatIe('7')}}		{{CompatVersionUnknown}}{{CompatSafari('1.2')}}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - -
FunzionalitàAndroidChrome for AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Supporto di base{{ CompatVersionUnknown}}1.0{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{ CompatVersionUnknown}}{{ CompatVersionUnknown}}{{ CompatVersionUnknown}}
-
- -

[1] Questa funzionalità è stata implementata attraverso ActiveXObject(). Internet Explorer implementa lo standard XMLHttpRequest dalla versione 7.

- -

Vedi anche

- -

Utilizzare XMLHttpRequest

diff --git a/files/it/web/api/xmlhttprequest/readystate/index.html b/files/it/web/api/xmlhttprequest/readystate/index.html deleted file mode 100644 index a37fa1e1db..0000000000 --- a/files/it/web/api/xmlhttprequest/readystate/index.html +++ /dev/null @@ -1,152 +0,0 @@ ---- -title: XMLHttpRequest.readyState -slug: Web/API/XMLHttpRequest/readyState -translation_of: Web/API/XMLHttpRequest/readyState ---- -

{{APIRef('XMLHttpRequest')}}

- -

la proprietà XMLHttpRequest.readyState restituisce lo stato nel quale si trova il client di una richiesta XMLHttpRequest. Un client XHR si può trovare in uno degli stati seguenti:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
ValueStateDescription
0UNSENTIl Client è stato creato, ma il metodo open() della XHR non è stato ancora invocato.
1OPENEDIl metodo open() è stato invocato.
2HEADERS_RECEIVEDIl metodo send() della XHR è stato invocato, e sono già disponibili lo status della risposta HTTP ed il suo header. 
3LOADINGSta avvenendo il download dei dati; responseText contiene dati parziali.
4DONEL'operazione è stata completata.
- -
-
UNSENT
-
Il Client è stato creato, ma il metodo open() della XHR non è stato ancora invocato.
-
OPENED
-
Il metodo open() della XHR è stato invocato. In questo stato è possibile settare l' header della richiesta HTTP utilizzando il metodo setRequestHeader(); può essere invocato il metodo send(), che inizia il fetch della richiesta.
-
HEADERS_RECEIVED
-
Il metodo send() è stato invocato e sono stati ricevuto gli headers della risposta; è possibile conoscere il codice della risposta HTTP ed i suoi metadati.
-
LOADING
-
Sta avvenendo il download del body della risposta HTTP; se il responseType è "text" o vuoto, responseText conterrà un testo parziale.
-
DONE
-
L'operazione di fetch è terminata; Questo può significare sia che il trasferimento dei dati è stato un successo e questi sono completamente disponibili o che è fallito.
-
- -
-

The state names are different in Internet Explorer. Instead of UNSENT, OPENED, HEADERS_RECEIVED, LOADING and DONE, the names READYSTATE_UNINITIALIZED (0), READYSTATE_LOADING (1), READYSTATE_LOADED (2), READYSTATE_INTERACTIVE (3) and READYSTATE_COMPLETE (4) are used.

-
- -

Example

- -
var xhr = new XMLHttpRequest();
-console.log('UNSENT', xhr.readyState); // readyState sarà pari a 0
-
-xhr.open('GET', '/api', true);
-console.log('OPENED', xhr.readyState); // readyState sarà pari a 1
-
-xhr.onprogress = function () {
-    console.log('LOADING', xhr.readyState); // readyState sarà pari a 3
-};
-
-xhr.onload = function () {
-    console.log('DONE', xhr.readyState); // readyState sarà pari a 4
-};
-
-xhr.send(null);
-
- -

Specifications

- - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('XMLHttpRequest', '#states')}}{{Spec2('XMLHttpRequest')}}WHATWG living standard
- -

Browser compatibility

- -
{{CompatibilityTable}}
- -
- - - - - - - - - - - - - - - - - - - - - -
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(1)}}{{CompatVersionUnknown}}{{CompatGeckoDesktop("1.0")}}[1]{{CompatIe(7)}}{{CompatVersionUnknown}}{{CompatSafari("1.2")}}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidChrome for AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatUnknown}}1.0{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
-
diff --git a/files/it/web/api/xmlhttprequest/using_xmlhttprequest/index.html b/files/it/web/api/xmlhttprequest/using_xmlhttprequest/index.html deleted file mode 100644 index ced11585b7..0000000000 --- a/files/it/web/api/xmlhttprequest/using_xmlhttprequest/index.html +++ /dev/null @@ -1,742 +0,0 @@ ---- -title: Usare XMLHttpRequest -slug: Web/API/XMLHttpRequest/Using_XMLHttpRequest -translation_of: Web/API/XMLHttpRequest/Using_XMLHttpRequest -original_slug: Web/API/XMLHttpRequest/Usare_XMLHttpRequest ---- -

Per inviare una richiesta HTTP, crea  un oggetto {{domxref("XMLHttpRequest")}}, apri un URL, ed invia la richiesta. Dopo che la transazione è completata, l'oggetto conterrà informazioni utili come il testo di risposta e lo stato HTTP. Questa pagina illustra alcuni dei più comuni e oscuri casi d'uso di questo potente oggetto XMLHttpRequest.

- -
function reqListener () {
-  console.log(this.responseText);
-}
-
-var oReq = new XMLHttpRequest();
-oReq.onload = reqListener;
-oReq.open("GET", "http://www.example.org/example.txt");
-oReq.send();
- -

Tipi di Richieste

- -

Una richiesta inviata con XMLHttpRequest può essere restituita in due modi, sincrona o asincrona. Il tipo di richiesta viene deciso dall'argomento opzionale async (il terzo argomento) che viene impostato nel metodo open() di {{domxref("XMLHttpRequest.open()")}}. Se l'argomento è true o se non è specificato, il XMLHttpRequest è processato in maniera asincrona, in caso contrario è processato in maniera sincrona. Una discussione dettagliata è una dimostrazione di queste due tipologie di richieste possono essere trovate nella pagina richieste sincrone ed asincrone. In generale, dovresti usare raramente le richieste sincrone, se mai ne farai uso.

- -
Nota: Da Gecko 30.0 {{ geckoRelease("30.0") }}, le richieste sincrone sul thread principale sono state deprecate a causa degli effetti negativi sull'esperienza utente.
- -

Gestire le risposte

- -

Ci sono vari tipi di attributi di risposta definite dallo standard W3C sul costruttore XMLHttpRequest. Questi sono in grado di fornire al client che effettua la richiesta importanti informazioni sullo stato della risposta. In alcuni casi in cui si lavora con risposte di tipo non testuale possono riguardare alcuni elementi di analisi e manipulazioni come evidenziato dai paragrafi seguenti.

- -

Analizzare e modificare la proprietà  responseXML

- -

Se si usa l'oggetto XMLHttpRequest per ricevere il contenuto di un documento XML remoto, la proprietà responseXML dell'oggetto stesso sarà assegnata a un oggetto DOM contentente un il documento XML a cui è stata effettuata una operazione di parsing. Se si lavora con tale proprietà può essere difficile analizzare e modificare tale proprietà. Di seguito sono riportate i quattro principali metodi per lavorare con tale documento XML:

- -
    -
  1. Utilizzare XPath per indirizzare (cioè puntare a) parti di esso.
    2. -
  2. Usare JXON per convertire il documento in un albero JavaScript Object.
    3. -
  3. Effettuare il Parsing e la serializzazione XML manualmente su stringhe e oggetti.
    4. -
  4. Utilizzare un XMLSerializer per serializzare alberi DOM su stringhe o file.
    5. -
  5. RegExp possono essere utilizzate se si conosce sempre il contenuto del documento XML a priori. In tal caso, se si utilizzano delle espressioni regolari con coscienza dei ritorni di riga, può essere necessario o consigliato di rimuovere le interruzioni di riga. In ogni caso è sempre sconsigliato utilizzare questo metodo e di considerarlo solo come "ultima spiaggia" in quanto se il documento XML dovesse cambiare anche in modo irrisorio questa metodologia potrebbe fallire.
    6. -
- -

Analizzare e manipolare una proprietà responseText contenentente un documento HTML

- -
Nota: La W3C XMLHttpRequest specification permette il parse del codice HTML tramite la proprietà XMLHttpRequest.responseXML. SI legga l'articolo a riguardo HTML in XMLHttpRequest per dettagli.
- -

Se si utilizza l'oggetto XMLHttpRequest per ottenere il contenuto di una pagina HTML remota, la proprietà responseText conterrà un amalgama di tutti i tag HTML. Ciò può essere difficile da manipolare e analizzare. Ci sono principalmente tre divere metodologie per analizzare questo insieme:

- -
    -
  1. Utilizzare la proprietà XMLHttpRequest.responseXML.
    2. -
  2. Iniettare il contenuto nel corpo di un document fragment attraverso la proprietà fragment.body.innerHTML e navigare il codice DOM del fragment.
    3. -
  3. Ancora una volta RegExp possono essere utlizzate se si conosce sempre il contenuto della risposta HTML. Questo metodo è, comuqnue, sconsigliato perchè anche una piccola modifica del codice HTML sorgente potrebbe protare questa metodologia a fallire.
    4. -
- -

Gestire dati binari

- -

Nonostante l'oggetto XMLHttpRequest è principalmente utilizzato per ricevere e inviare dati testuali, può essere utilizzato per inviare e ricevere dati dal contenuto binario. Esistono svariati metodi ben testati per fare sì che l'oggetto in questione invii dati binari. Questi metodo prevedono l'utilizzo del metodo .overrideMimeType(...) sull'oggetto.

- -
var oReq = new XMLHttpRequest();
-oReq.open("GET", url, true);
-// riceve dei dati non porcessati come una stringa binaria
-oReq.overrideMimeType("text/plain; charset=x-user-defined");
-/* ... */
-
- -

La XMLHttpRequest Level 2 Specification aggiunge un nuovo attributo responseType che permette di inviare e ricevere dati binari in modo molto più semplice.

- -
var oReq = new XMLHttpRequest();
-
-oReq.open("GET", url, true);
-oReq.responseType = "arraybuffer";
-oReq.onload = function(e) {
-  var arraybuffer = oReq.response; // non responseText
-  /* ... */
-}
-oReq.send();
-
- -

Per più esempi si veda la pagina Sending and Receiving Binary Data.

- -

Monitoraggio del progresso

- -

L'oggetto XMLHttpRequest fornisce la possibilità di ascoltare svariati eventi che possono occorrere mentre la richiesta è processata. Questo inclulde periodici aggiornamenti sul progresso, notificazione di errori e così via.

- -

Il supporto agli eventi di monitoraggio del progresso DOM dell'oggetto XMLHttpRequest ripetta le API specification progress events: tali eventi implementano l'interfaccia {{domxref("ProgressEvent")}}.

- -
var oReq = new XMLHttpRequest();
-
-oReq.addEventListener("progress", updateProgress, false);
-oReq.addEventListener("load", transferComplete, false);
-oReq.addEventListener("error", transferFailed, false);
-oReq.addEventListener("abort", transferCanceled, false);
-
-oReq.open();
-
-// ...
-
-// progress on transfers from the server to the client (downloads)
-function updateProgress (oEvent) {
-  if (oEvent.lengthComputable) {
-    var percentComplete = oEvent.loaded / oEvent.total;
-    // ...
-  } else {
-    // Impossibile elaborare il progresso perche' non si conosce la grandezza totale
-  }
-}
-
-function transferComplete(evt) {
-  alert("Trasferimento completato!");
-}
-
-function transferFailed(evt) {
-  alert("E' avvenuto un errore nel trasferimento");
-}
-
-function transferCanceled(evt) {
-  alert("Il trasferimento è stato cancellato dall'utente");
-}
- -

Le linee 3-6 aggiungono degli event listener per i vari eventi che sono inviati mentre si performa un trasferimento di dati con l'oggetto XMLHttpRequest.

- -
Nota: Quando si assegnano degli event listeners è necessario farlo prima di chiamare il metodo open() sulla richiesta. Se ciò non viene effettuato gli eventi non vengono inviati.
- -

L'event handler per il progresso, specificato dalla funzione updateProgress() in questo esempio, riceve il numero totale di byte da trasferire e il numero di byte trasferiti finora nei campi total e loaded rispettivamente. In ogni caso, se il campo lengthComputable risulta falsa, la lunghezza totale risulta sconosciuta e sarà riportata come zero.

- -

Gli eventi di progresso esistono sia per il download che per l'upload. Gli eventi di download sono notificati sull'oggetto XMLHttpRequest stesso, come indicato dall'esempio sopra. Quelli di upload, invece, sono notificati sull'attributo XMLHttpRequest.upload come mostrato sotto:

- -
var oReq = new XMLHttpRequest();
-
-oReq.upload.addEventListener("progress", updateProgress, false);
-oReq.upload.addEventListener("load", transferComplete, false);
-oReq.upload.addEventListener("error", transferFailed, false);
-oReq.upload.addEventListener("abort", transferCanceled, false);
-
-oReq.open();
-
- -
Nota: Gli eventi di progresso non sono disponibili per il protocollo file://.
- -
Nota: Correntemente ci sono dei bug aperti per gli eventi di progresso che affliggono la versione 25 di Firefox su OS X e Linux.
- -
-

Nota: A partire da {{Gecko("9.0")}}, gli eventi di progresso possono essere lanciati per ogni parte di dato ricevuta, inclusa l'ultima parte dove l'ultimo pacchetto è ricevuto e la connesione chiusa prima che l'evento di progresso sia notificato. In questo caso l'evento di progresso è notificato automaticamente quando occorre l'evento di "load" per tale pacchetto. Questo permette di creare un monitoraggio affidabile solamente osservando gli eventi di progresso.

-
- -
-

Nota: A partire da  {{Gecko("12.0")}}, se l'evento di progresso è chiamato con un responseType di tipo moz-blob, il valore di risposta sarà un {{domxref("Blob")}} contenente i dati ricevuti fino a quel punto.

-
- -

Si puà anche rilevare tutti e tre le tipologie di terminazione del caricamento(abort, load o error) utilizzando l'evento loadend:

- -
req.addEventListener("loadend", loadEnd, false);
-
-function loadEnd(e) {
-  alert("Trasferimento terminato (anche se non sappiamo come).");
-}
-
- -

Si noti che non c'è modo di essere sicuri di conoscere con le informazioni ricevute dall'evento loadend quali condizioni hanno causato il termine dell'operazione. In ogni caso si può usare questo per gestire operazioni che devono essere eseguite al termine del trasferimento.

- -

Inviare form e caricare file

- -

Istanze di un oggetto XMLHttpRequest possono essere usate per inviare form in principalmente due modi:

- - - -

Il secondo modo (utilizzando l'oggetto FormData) è il più semplice e veloce, ma ha lo svantaggio che i dati raccolto non possono essere trasformati in stringa.
- Il primo modo, invece, è più complesso, ma è anche in cambio più potente e flessibile.

- -

Usando l'oggetto XMLHttpRequest

- -

Inviare form senza le API dell'oggetto FormData non richiede l'utilizzo di altre API tranne nel caso di FileReader nel caso si voglia caricare più di un file.

- -

Una breve introduzione del metodo submit

- -

Un html {{ HTMLElement("form") }} può essere inviata in quattro possibili modi:

- - - -

Ora, si consideri di inviare una form contenente solo due campi, chiamati foo e baz. Se si sta utilizzando il metodo POST il server riceverà una stringa simile a una delle seguenti tre linee a seconda del tipo di encoding utilizzato:

- - - -

Invece, se si utilizza un metodo GET una stringa simile alla seguente sarà semplicemente aggiunta all'URL:

- -
?foo=bar&baz=The%20first%20line.%0AThe%20second%20line.
- -

Un piccolo framwork vanilla

- -

Tutte queste cose sono eseguite automaticamente dal web browser ogni volta che si esegue il submit di una {{ HTMLElement("form") }}. Ma se si vuole fare lo stesso usando JavaScript bisogna istruire l'interprete su tutte le operazioni da eseguire. Inviare delle form in AJAX puro risulta troppo complesso per essere spiegato qui; per questa ragione abbiamo creato un framework completo (ma comunque puramente didattico) che possa essere usato in tutti e quattro i metodi di submit e anche per caricare dei file.

- -
-
<!doctype html>
-<html>
-<head>
-<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
-<title>Sending forms with pure AJAX &ndash; MDN</title>
-<script type="text/javascript">
-
-"use strict";
-
-/*\
-|*|
-|*|  :: XMLHttpRequest.prototype.sendAsBinary() Polyfill ::
-|*|
-|*|  https://developer.mozilla.org/en-US/docs/DOM/XMLHttpRequest#sendAsBinary()
-\*/
-
-if (!XMLHttpRequest.prototype.sendAsBinary) {
-  XMLHttpRequest.prototype.sendAsBinary = function(sData) {
-    var nBytes = sData.length, ui8Data = new Uint8Array(nBytes);
-    for (var nIdx = 0; nIdx < nBytes; nIdx++) {
-      ui8Data[nIdx] = sData.charCodeAt(nIdx) & 0xff;
-    }
-    /* send as ArrayBufferView...: */
-    this.send(ui8Data);
-    /* ...or as ArrayBuffer (legacy)...: this.send(ui8Data.buffer); */
-  };
-}
-
-/*\
-|*|
-|*|  :: AJAX Form Submit Framework ::
-|*|
-|*|  https://developer.mozilla.org/en-US/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest
-|*|
-|*|  This framework is released under the GNU Public License, version 3 or later.
-|*|  http://www.gnu.org/licenses/gpl-3.0-standalone.html
-|*|
-|*|  Syntax:
-|*|
-|*|   AJAXSubmit(HTMLFormElement);
-\*/
-
-var AJAXSubmit = (function () {
-
-  function ajaxSuccess () {
-    /* console.log("AJAXSubmit - Success!"); */
-    alert(this.responseText);
-    /* you can get the serialized data through the "submittedData" custom property: */
-    /* alert(JSON.stringify(this.submittedData)); */
-  }
-
-  function submitData (oData) {
-    /* the AJAX request... */
-    var oAjaxReq = new XMLHttpRequest();
-    oAjaxReq.submittedData = oData;
-    oAjaxReq.onload = ajaxSuccess;
-    if (oData.technique === 0) {
-      /* method is GET */
-      oAjaxReq.open("get", oData.receiver.replace(/(?:\?.*)?$/, oData.segments.length > 0 ? "?" + oData.segments.join("&") : ""), true);
-      oAjaxReq.send(null);
-    } else {
-      /* method is POST */
-      oAjaxReq.open("post", oData.receiver, true);
-      if (oData.technique === 3) {
-        /* enctype is multipart/form-data */
-        var sBoundary = "---------------------------" + Date.now().toString(16);
-        oAjaxReq.setRequestHeader("Content-Type", "multipart\/form-data; boundary=" + sBoundary);
-        oAjaxReq.sendAsBinary("--" + sBoundary + "\r\n" + oData.segments.join("--" + sBoundary + "\r\n") + "--" + sBoundary + "--\r\n");
-      } else {
-        /* enctype is application/x-www-form-urlencoded or text/plain */
-        oAjaxReq.setRequestHeader("Content-Type", oData.contentType);
-        oAjaxReq.send(oData.segments.join(oData.technique === 2 ? "\r\n" : "&"));
-      }
-    }
-  }
-
-  function processStatus (oData) {
-    if (oData.status > 0) { return; }
-    /* the form is now totally serialized! do something before sending it to the server... */
-    /* doSomething(oData); */
-    /* console.log("AJAXSubmit - The form is now serialized. Submitting..."); */
-    submitData (oData);
-  }
-
-  function pushSegment (oFREvt) {
-    this.owner.segments[this.segmentIdx] += oFREvt.target.result + "\r\n";
-    this.owner.status--;
-    processStatus(this.owner);
-  }
-
-  function plainEscape (sText) {
-    /* how should I treat a text/plain form encoding? what characters are not allowed? this is what I suppose...: */
-    /* "4\3\7 - Einstein said E=mc2" ----> "4\\3\\7\ -\ Einstein\ said\ E\=mc2" */
-    return sText.replace(/[\s\=\\]/g, "\\$&");
-  }
-
-  function SubmitRequest (oTarget) {
-    var nFile, sFieldType, oField, oSegmReq, oFile, bIsPost = oTarget.method.toLowerCase() === "post";
-    /* console.log("AJAXSubmit - Serializing form..."); */
-    this.contentType = bIsPost && oTarget.enctype ? oTarget.enctype : "application\/x-www-form-urlencoded";
-    this.technique = bIsPost ? this.contentType === "multipart\/form-data" ? 3 : this.contentType === "text\/plain" ? 2 : 1 : 0;
-    this.receiver = oTarget.action;
-    this.status = 0;
-    this.segments = [];
-    var fFilter = this.technique === 2 ? plainEscape : escape;
-    for (var nItem = 0; nItem < oTarget.elements.length; nItem++) {
-      oField = oTarget.elements[nItem];
-      if (!oField.hasAttribute("name")) { continue; }
-      sFieldType = oField.nodeName.toUpperCase() === "INPUT" ? oField.getAttribute("type").toUpperCase() : "TEXT";
-      if (sFieldType === "FILE" && oField.files.length > 0) {
-        if (this.technique === 3) {
-          /* enctype is multipart/form-data */
-          for (nFile = 0; nFile < oField.files.length; nFile++) {
-            oFile = oField.files[nFile];
-            oSegmReq = new FileReader();
-            /* (custom properties:) */
-            oSegmReq.segmentIdx = this.segments.length;
-            oSegmReq.owner = this;
-            /* (end of custom properties) */
-            oSegmReq.onload = pushSegment;
-            this.segments.push("Content-Disposition: form-data; name=\"" + oField.name + "\"; filename=\""+ oFile.name + "\"\r\nContent-Type: " + oFile.type + "\r\n\r\n");
-            this.status++;
-            oSegmReq.readAsBinaryString(oFile);
-          }
-        } else {
-          /* enctype is application/x-www-form-urlencoded or text/plain or method is GET: files will not be sent! */
-          for (nFile = 0; nFile < oField.files.length; this.segments.push(fFilter(oField.name) + "=" + fFilter(oField.files[nFile++].name)));
-        }
-      } else if ((sFieldType !== "RADIO" && sFieldType !== "CHECKBOX") || oField.checked) {
-        /* field type is not FILE or is FILE but is empty */
-        this.segments.push(
-          this.technique === 3 ? /* enctype is multipart/form-data */
-            "Content-Disposition: form-data; name=\"" + oField.name + "\"\r\n\r\n" + oField.value + "\r\n"
-          : /* enctype is application/x-www-form-urlencoded or text/plain or method is GET */
-            fFilter(oField.name) + "=" + fFilter(oField.value)
-        );
-      }
-    }
-    processStatus(this);
-  }
-
-  return function (oFormElement) {
-    if (!oFormElement.action) { return; }
-    new SubmitRequest(oFormElement);
-  };
-
-})();
-
-</script>
-</head>
-<body>
-
-<h1>Sending forms with pure AJAX</h1>
-
-<h2>Using the GET method</h2>
-
-<form action="register.php" method="get" onsubmit="AJAXSubmit(this); return false;">
-  <fieldset>
-    <legend>Registration example</legend>
-    <p>
-      First name: <input type="text" name="firstname" /><br />
-      Last name: <input type="text" name="lastname" />
-    </p>
-    <p>
-      <input type="submit" value="Submit" />
-    </p>
-  </fieldset>
-</form>
-
-<h2>Using the POST method</h2>
-<h3>Enctype: application/x-www-form-urlencoded (default)</h3>
-
-<form action="register.php" method="post" onsubmit="AJAXSubmit(this); return false;">
-  <fieldset>
-    <legend>Registration example</legend>
-    <p>
-      First name: <input type="text" name="firstname" /><br />
-      Last name: <input type="text" name="lastname" />
-    </p>
-    <p>
-      <input type="submit" value="Submit" />
-    </p>
-  </fieldset>
-</form>
-
-<h3>Enctype: text/plain</h3>
-
-<form action="register.php" method="post" enctype="text/plain" onsubmit="AJAXSubmit(this); return false;">
-  <fieldset>
-    <legend>Registration example</legend>
-    <p>
-      Your name: <input type="text" name="user" />
-    </p>
-    <p>
-      Your message:<br />
-      <textarea name="message" cols="40" rows="8"></textarea>
-    </p>
-    <p>
-      <input type="submit" value="Submit" />
-    </p>
-  </fieldset>
-</form>
-
-<h3>Enctype: multipart/form-data</h3>
-
-<form action="register.php" method="post" enctype="multipart/form-data" onsubmit="AJAXSubmit(this); return false;">
-  <fieldset>
-    <legend>Upload example</legend>
-    <p>
-      First name: <input type="text" name="firstname" /><br />
-      Last name: <input type="text" name="lastname" /><br />
-      Sex:
-      <input id="sex_male" type="radio" name="sex" value="male" /> <label for="sex_male">Male</label>
-      <input id="sex_female" type="radio" name="sex" value="female" /> <label for="sex_female">Female</label><br />
-      Password: <input type="password" name="secret" /><br />
-      What do you prefer:
-      <select name="image_type">
-        <option>Books</option>
-        <option>Cinema</option>
-        <option>TV</option>
-      </select>
-    </p>
-    <p>
-      Post your photos:
-      <input type="file" multiple name="photos[]">
-    </p>
-    <p>
-      <input id="vehicle_bike" type="checkbox" name="vehicle[]" value="Bike" /> <label for="vehicle_bike">I have a bike</label><br />
-      <input id="vehicle_car" type="checkbox" name="vehicle[]" value="Car" /> <label for="vehicle_car">I have a car</label>
-    </p>
-    <p>
-      Describe yourself:<br />
-      <textarea name="description" cols="50" rows="8"></textarea>
-    </p>
-    <p>
-      <input type="submit" value="Submit" />
-    </p>
-  </fieldset>
-</form>
-
-</body>
-</html>
-
- -

Per testarlo, create una pagina chiamata register.php (al quale fanno riferimento gli attributi action di queste form) e inserite il seguente contenuto.

- -
<?php
-/* register.php */
-
-header("Content-type: text/plain");
-
-/*
-NOTE: You should never use `print_r()` in production scripts, or
-otherwise output client-submitted data without sanitizing it first.
-Failing to sanitize can lead to cross-site scripting vulnerabilities.
-*/
-
-echo ":: data received via GET ::\n\n";
-print_r($_GET);
-
-echo "\n\n:: Data received via POST ::\n\n";
-print_r($_POST);
-
-echo "\n\n:: Data received as \"raw\" (text/plain encoding) ::\n\n";
-if (isset($HTTP_RAW_POST_DATA)) { echo $HTTP_RAW_POST_DATA; }
-
-echo "\n\n:: Files received ::\n\n";
-print_r($_FILES);
-
-
- -

La sintassi per attivare lo script è semplicemente:

- -
AJAXSubmit(myForm);
- -
Nota: Questo framework utilizza l'API FileReader per eseguire l'upload dei file. QUesta è una API recente e non ancora implementata nei browser come IE9 o inferiori. Per questa ragione l'upload AJAX-only è considerato una  tecnica sperimentale. Se non si ha bisogno dell'upload di file binari questo framework funzionera egregiamente nella maggior parte dei browser.
- -
Nota: Il modo migliore per inviare dei contenuti binari è attraverso ArrayBuffers o Blobs attraverso il metodo send() e possibilmente il metodo readAsArrayBuffer() dell'API FileReader. Ma, siccome l'obiettivo di questo script è di fuonzionare con dei dati  stringifiabli, si è usato il metodo sendAsBinary() assieme al metodo readAsBinaryString() delle API FileReader. Per questo, lo script sopra funziona sono quando si stanno gestendo file di piccole dimensioni. Se non si intende caricare del contenuto binario, considerare anche l'utilizzo delle API FormData.
- -

Usare oggetti FormData

- -

Il costruttore FormData permette di compliare una serie di coppie chiave/valore da inviare utilizzando una XMLHttpRequest. Si utilizza principalmente per inviare dati in una form, ma può essere usato indipendentemente dalle form per inviare dei dati con chiavi. I dati trasmessi sono gli stessi del formato utilizzato dal metodo submit() che le form usano per inviare i dati se il tipo encoding indicato è "multipart/form-data". Gli oggetti FormData possono essere utilizzati in uno svariato numero possibile con una XMLHttpRequest. Per esempi o speigazioni di come utilizzare una FormData con XMLHttpRequest si veda la pagina Usare l'oggetto FormData. Per fini didattici di seguito una traduzione dell'esempio precedente modificato per accettare l'API delle FormData. Si noti la brevità del codice.

- -
-
<!doctype html>
-<html>
-<head>
-<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
-<title>Sending forms with FormData &ndash; MDN</title>
-<script type="text/javascript">
-"use strict";
-
-function ajaxSuccess () {
-  alert(this.responseText);
-}
-
-function AJAXSubmit (oFormElement) {
-  if (!oFormElement.action) { return; }
-  var oReq = new XMLHttpRequest();
-  oReq.onload = ajaxSuccess;
-  if (oFormElement.method.toLowerCase() === "post") {
-    oReq.open("post", oFormElement.action, true);
-    oReq.send(new FormData(oFormElement));
-  } else {
-    var oField, sFieldType, nFile, sSearch = "";
-    for (var nItem = 0; nItem < oFormElement.elements.length; nItem++) {
-      oField = oFormElement.elements[nItem];
-      if (!oField.hasAttribute("name")) { continue; }
-      sFieldType = oField.nodeName.toUpperCase() === "INPUT" ? oField.getAttribute("type").toUpperCase() : "TEXT";
-      if (sFieldType === "FILE") {
-        for (nFile = 0; nFile < oField.files.length; sSearch += "&" + escape(oField.name) + "=" + escape(oField.files[nFile++].name));
-      } else if ((sFieldType !== "RADIO" && sFieldType !== "CHECKBOX") || oField.checked) {
-        sSearch += "&" + escape(oField.name) + "=" + escape(oField.value);
-      }
-    }
-    oReq.open("get", oFormElement.action.replace(/(?:\?.*)?$/, sSearch.replace(/^&/, "?")), true);
-    oReq.send(null);
-  }
-}
-</script>
-</head>
-<body>
-
-<h1>Sending forms with FormData</h1>
-
-<h2>Using the GET method</h2>
-
-<form action="register.php" method="get" onsubmit="AJAXSubmit(this); return false;">
-  <fieldset>
-    <legend>Registration example</legend>
-    <p>
-      First name: <input type="text" name="firstname" /><br />
-      Last name: <input type="text" name="lastname" />
-    </p>
-    <p>
-      <input type="submit" value="Submit" />
-    </p>
-  </fieldset>
-</form>
-
-<h2>Using the POST method</h2>
-<h3>Enctype: application/x-www-form-urlencoded (default)</h3>
-
-<form action="register.php" method="post" onsubmit="AJAXSubmit(this); return false;">
-  <fieldset>
-    <legend>Registration example</legend>
-    <p>
-      First name: <input type="text" name="firstname" /><br />
-      Last name: <input type="text" name="lastname" />
-    </p>
-    <p>
-      <input type="submit" value="Submit" />
-    </p>
-  </fieldset>
-</form>
-
-<h3>Enctype: text/plain</h3>
-
-<p>The text/plain encoding is not supported by the FormData API.</p>
-
-<h3>Enctype: multipart/form-data</h3>
-
-<form action="register.php" method="post" enctype="multipart/form-data" onsubmit="AJAXSubmit(this); return false;">
-  <fieldset>
-    <legend>Upload example</legend>
-    <p>
-      First name: <input type="text" name="firstname" /><br />
-      Last name: <input type="text" name="lastname" /><br />
-      Sex:
-      <input id="sex_male" type="radio" name="sex" value="male" /> <label for="sex_male">Male</label>
-      <input id="sex_female" type="radio" name="sex" value="female" /> <label for="sex_female">Female</label><br />
-      Password: <input type="password" name="secret" /><br />
-      What do you prefer:
-      <select name="image_type">
-        <option>Books</option>
-        <option>Cinema</option>
-        <option>TV</option>
-      </select>
-    </p>
-    <p>
-      Post your photos:
-      <input type="file" multiple name="photos[]">
-    </p>
-    <p>
-      <input id="vehicle_bike" type="checkbox" name="vehicle[]" value="Bike" /> <label for="vehicle_bike">I have a bike</label><br />
-      <input id="vehicle_car" type="checkbox" name="vehicle[]" value="Car" /> <label for="vehicle_car">I have a car</label>
-    </p>
-    <p>
-      Describe yourself:<br />
-      <textarea name="description" cols="50" rows="8"></textarea>
-    </p>
-    <p>
-      <input type="submit" value="Submit" />
-    </p>
-  </fieldset>
-</form>
-
-</body>
-</html>
-
- -
Nota: Come si è detto,gli oggetti {{domxref("FormData")}} non sono stringifiabli. Se si desidera porre in stringa dei dati inviati, utilizzare il precedente esempio in AJAX puro. Si noti che ci sono degli elementi file nel campo {{ HTMLElement("input") }}, quando si invia una form attraverso l'API FormData API non è necessario utilizzare le API FileReader: i file sono automaticamente caricati.
- -

Get last modified date

- -
function getHeaderTime () {
-  alert(this.getResponseHeader("Last-Modified"));  /* A valid GMTString date or null */
-}
-
-var oReq = new XMLHttpRequest();
-oReq.open("HEAD" /* use HEAD if you only need the headers! */, "yourpage.html", true);
-oReq.onload = getHeaderTime;
-oReq.send();
- -

Do something when last modified date changes

- -

Let's create these two functions:

- -
function getHeaderTime () {
-
-  var
-    nLastVisit = parseFloat(window.localStorage.getItem('lm_' + this.filepath)),
-    nLastModif = Date.parse(this.getResponseHeader("Last-Modified"));
-
-  if (isNaN(nLastVisit) || nLastModif > nLastVisit) {
-    window.localStorage.setItem('lm_' + this.filepath, Date.now());
-    isFinite(nLastVisit) && this.callback(nLastModif, nLastVisit);
-  }
-
-}
-
-function ifHasChanged(sURL, fCallback) {
-  var oReq = new XMLHttpRequest();
-  oReq.open("HEAD" /* use HEAD - we only need the headers! */, sURL, true);
-  oReq.callback = fCallback;
-  oReq.filepath = sURL;
-  oReq.onload = getHeaderTime;
-  oReq.send();
-}
- -

Test:

- -
/* Let's test the file "yourpage.html"... */
-
-ifHasChanged("yourpage.html", function (nModif, nVisit) {
-  alert("The page '" + this.filepath + "' has been changed on " + (new Date(nModif)).toLocaleString() + "!");
-});
- -

If you want to know whether the current page has changed, please read the article about document.lastModified.

- -

Cross-site XMLHttpRequest

- -

Modern browsers support cross-site requests by implementing the web applications working group's Access Control for Cross-Site Requests standard.  As long as the server is configured to allow requests from your web application's origin, XMLHttpRequest will work.  Otherwise, an INVALID_ACCESS_ERR exception is thrown.

- -

Bypassing the cache

- -

A, cross-browser compatible approach to bypassing the cache is to append a timestamp to the URL, being sure to include a "?" or "&" as appropriate.  For example:

- -
http://foo.com/bar.html -> http://foo.com/bar.html?12345
-http://foo.com/bar.html?foobar=baz -> http://foo.com/bar.html?foobar=baz&12345
-
- -

Since the local cache is indexed by URL, this causes every request to be unique, thereby bypassing the cache.

- -

You can automatically adjust URLs using the following code:

- -
var oReq = new XMLHttpRequest();
-
-oReq.open("GET", url + ((/\?/).test(url) ? "&" : "?") + (new Date()).getTime(), true);
-oReq.send(null);
- -

Security

- -

{{fx_minversion_note(3, "Versions of Firefox prior to Firefox 3 allowed you to set the preference capability.policy.<policyname>.XMLHttpRequest.open</policyname> to allAccess to give specific sites cross-site access.  This is no longer supported.")}}

- -

{{fx_minversion_note(5, "Versions of Firefox prior to Firefox 5 could use netscape.security.PrivilegeManager.enablePrivilege(\"UniversalBrowserRead\"); to request cross-site access. This is no longer supported, even though it produces no warning and permission dialog is still presented.")}}

- -

The recommended way to enable cross-site scripting is to use the Access-Control-Allow-Origin HTTP header in the response to the XMLHttpRequest.

- -

XMLHttpRequests being stopped

- -

If you end up with an XMLHttpRequest having status=0 and statusText=null, it means that the request was not allowed to be performed. It was UNSENT. A likely cause for this is when the XMLHttpRequest origin (at the creation of the XMLHttpRequest) has changed when the XMLHttpRequest is then open(). This case can happen for example when one has an XMLHttpRequest that gets fired on an onunload event for a window: the XMLHttpRequest gets in fact created when the window to be closed is still there, and then the request is sent (ie open()) when this window has lost its focus and potentially different window has gained focus. The way to avoid this problem is to set a listener on the new window "activate" event that gets set when the old window has its "unload" event fired.

- -

Using XMLHttpRequest from JavaScript modules / XPCOM components

- -

Instantiating XMLHttpRequest from a JavaScript module or an XPCOM component works a little differently; it can't be instantiated using the XMLHttpRequest() constructor. The constructor is not defined inside components and the code results in an error. The best way to work around this is to use the XPCOM component constructor.

- -
const XMLHttpRequest = Components.Constructor("@mozilla.org/xmlextras/xmlhttprequest;1", "nsIXMLHttpRequest");
-
- -

Unfortunately in versions of Gecko prior to Gecko 16 there is a bug which can cause requests created this way to be cancelled for no reason.  If you need your code to work on Gecko 15 or earlier, you can get the XMLHttpRequest constructor from the hidden DOM window like so.

- -
const { XMLHttpRequest } = Components.classes["@mozilla.org/appshell/appShellService;1"]
-                                     .getService(Components.interfaces.nsIAppShellService)
-                                     .hiddenDOMWindow;
-var oReq = new XMLHttpRequest();
- -

See also

- -
    -
  1. MDN AJAX introduction
    2. -
  2. HTTP access control
    3. -
  3. How to check the security state of an XMLHTTPRequest over SSL
    4. -
  4. XMLHttpRequest - REST and the Rich User Experience
    5. -
  5. Microsoft documentation
    6. -
  6. Apple developers' reference
    7. -
  7. "Using the XMLHttpRequest Object" (jibbering.com)
    8. -
  8. The XMLHttpRequest Object: W3C Specification
    9. -
  9. Web Progress Events specification
    10. -
  10. -
diff --git a/files/it/web/api/xmlhttprequest/xmlhttprequest/index.html b/files/it/web/api/xmlhttprequest/xmlhttprequest/index.html deleted file mode 100644 index bb54418a41..0000000000 --- a/files/it/web/api/xmlhttprequest/xmlhttprequest/index.html +++ /dev/null @@ -1,50 +0,0 @@ ---- -title: XMLHttpRequest() -slug: Web/API/XMLHttpRequest/XMLHttpRequest -translation_of: Web/API/XMLHttpRequest/XMLHttpRequest ---- -
{{draft}}{{APIRef('XMLHttpRequest')}}
- -

Il costruttore XMLHttpRequest() crea una nuova {{domxref("XMLHttpRequest")}}.

- -

Per ulteriori dettagli sull'utilizzo di XMLHttpRequest, si veda Come usare XMLHttpRequest.

- -

Sintassi

- -
constrichiesta = new XMLHttpRequest();
-
- -

Parametri

- -

Nessuno.

- -

Valore di ritorno

- -

Un nuovo oggetto {{domxref("XMLHttpRequest")}}. Prima di chiamare {{domxref("XMLHttpRequest.send", "send()")}}, che invia la richiesta al server, l'oggetto va predisposto inizializzandolo, chiamando almeno {{domxref("XMLHttpRequest.open", "open()")}}.

- -

Sintassi non-standard di Firefox

- -

Firefox 16 ha aggiunto al costruttore un parametro non-standard che permette di abilitare la modalità anonima (si veda {{Bug("692677")}}). Assegnare il valore true alla flag mozAnon equivale all'atto pratico al costruttore AnonXMLHttpRequest() descritto nelle versioni precedenti delle specifiche di XMLHttpRequest.

- -
constrichiesta = new XMLHttpRequest(dizParametri);
- -

Parametri (non-standard)

- -
-
objParameters {{gecko_minversion_inline("16.0")}}
-
Sono disponibili due flag: -
-
mozAnon
-
Booleano: assegnando true a questa flag il browser non esporrà né l'{{Glossary("origine")}} né le credenziali dell'utente durante il recupero delle risorse. Ciò significa soprattutto che non verrà inviato alcun {{Glossary("Cookie", "cookie")}} a meno di non aggiungerlo esplicitamente attraverso setRequestHeader.
-
mozSystem
-
Booleano: assegnando true a questa flag vengono permesse connessioni inter-sito senza il consenso del server di destinazione dato attraverso {{Glossary("CORS")}}. Richiede anche mozAnon: true, ovvero non si possono inviare cookie od altre credenziali dell'utente usando questo metodo. Questa flag funziona solo in app con privilegi, cioé sottoposte a riesame ({{Bug("692677")}}); non funziona su qualsivoglia pagine caricate da Firefox.
-
-
-
- -

Voci correlate

- - -- cgit v1.2.3-54-g00ecf