From 43a5cac2eff22c21071800e13bef12af9d3a37d0 Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 13:12:08 +0100 Subject: unslug zh-tw: move --- .../learn/html/introduction_to_html/index.html | 90 +++ .../learn/javascript/objects/index.html | 394 ++++++++++++ .../learn/server-side/django/index.html | 66 ++ .../web/api/canvas_api/tutorial/index.html | 162 +++++ .../web/api/document_object_model/index.html | 22 + .../web/api/html_drag_and_drop_api/index.html | 5 + files/zh-tw/conflicting/web/api/index.html | 127 ++++ .../conflicting/web/api/websockets_api/index.html | 26 + .../web/api/windoworworkerglobalscope/index.html | 114 ++++ .../index.html | 115 ++++ .../zh-tw/conflicting/web/css/@viewport/index.html | 121 ++++ files/zh-tw/conflicting/web/guide/index.html | 5 + .../index.html | 16 + files/zh-tw/conflicting/web/http/cors/index.html | 213 +++++++ .../control_flow_and_error_handling/index.html | 34 + .../index.html | 104 ++++ .../index.html | 21 + .../index.html | 16 + .../guide/details_of_the_object_model/index.html | 28 + .../index.html | 46 ++ .../index.html | 57 ++ .../index.html | 42 ++ .../index.html | 58 ++ .../index.html | 14 + .../index.html | 145 +++++ .../guide/expressions_and_operators/index.html | 16 + .../index.html | 20 + .../index.html | 31 + .../index.html | 43 ++ .../index.html | 186 ++++++ .../index.html | 30 + .../index.html | 65 ++ .../index.html | 12 + .../web/javascript/guide/functions/index.html | 34 + .../index.html | 36 ++ .../index.html | 15 + .../index.html | 26 + .../index.html | 24 + .../index.html | 21 + .../index.html | 17 + .../javascript/guide/grammar_and_types/index.html | 33 + .../index.html | 30 + .../index.html | 118 ++++ .../index.html | 28 + .../index.html | 57 ++ .../conflicting/web/javascript/guide/index.html | 452 ++++++++++++++ .../guide/regular_expressions/index.html | 59 ++ .../index.html | 44 ++ .../index.html | 37 ++ .../guide/working_with_objects/index.html | 43 ++ .../index.html | 13 + .../global_objects/arraybuffer/index.html | 111 ++++ .../reference/global_objects/date/index.html | 246 ++++++++ .../reference/global_objects/function/index.html | 139 +++++ .../reference/global_objects/number/index.html | 85 +++ .../reference/global_objects/object/index.html | 219 +++++++ .../reference/global_objects/promise/index.html | 65 ++ .../reference/global_objects/string/index.html | 177 ++++++ .../web/javascript/reference/operators/index.html | 309 +++++++++ .../index.html | 284 +++++++++ .../index.html | 555 +++++++++++++++++ .../index.html | 244 ++++++++ .../zh-tw/conflicting/web/media/formats/index.html | 467 ++++++++++++++ files/zh-tw/conflicting/web/opensearch/index.html | 36 ++ .../index.html" | 9 - files/zh-tw/cross-site_xmlhttprequest/index.html | 108 ---- .../index.html" | 5 - files/zh-tw/dragdrop/index.html | 5 - .../index.html" | 240 ------- .../index.html" | 48 -- files/zh-tw/glossary/xhtml/index.html | 29 + .../zh-tw/html5_cross_browser_polyfills/index.html | 34 - files/zh-tw/learn/css/howto/css_faq/index.html | 165 +++++ .../forms/how_to_structure_a_web_form/index.html | 315 ++++++++++ files/zh-tw/learn/forms/index.html | 359 +++++++++++ files/zh-tw/learn/how_to_contribute/index.html | 81 --- .../forms/how_to_structure_an_html_form/index.html | 315 ---------- files/zh-tw/learn/html/forms/index.html | 359 ----------- .../index.html" | 502 --------------- .../images_in_html/index.html | 502 +++++++++++++++ .../other_embedding_technologies/index.html | 386 ++++++++++++ .../index.html" | 386 ------------ files/zh-tw/learn/html/tables/basics/index.html | 568 +++++++++++++++++ .../tables/\345\237\272\347\244\216/index.html" | 568 ----------------- .../javascript/building_blocks/events/index.html | 85 +++ .../zh-tw/learn/performance/multimedia/index.html | 130 ++++ .../index.html" | 130 ---- .../first_steps/introduction/index.html | 225 +++++++ .../\344\273\213\347\264\271/index.html" | 225 ------- files/zh-tw/mdn/at_ten/index.html | 37 ++ files/zh-tw/mdn/community/index.html | 52 -- .../community/\350\253\226\345\243\207/index.html" | 53 -- .../howto/create_an_mdn_account/index.html | 34 - .../howto/do_a_technical_review/index.html | 50 -- .../howto/do_an_editorial_review/index.html | 55 -- .../howto/set_the_summary_for_a_page/index.html | 50 -- files/zh-tw/mdn/editor/basics/index.html | 55 -- files/zh-tw/mdn/editor/edit_box/index.html | 134 ---- files/zh-tw/mdn/editor/index.html | 23 - files/zh-tw/mdn/kuma/index.html | 26 - files/zh-tw/mdn/yari/index.html | 26 + files/zh-tw/mdn_at_ten/index.html | 37 -- .../index.html" | 228 ------- .../index.html" | 9 + .../orphaned/cross-site_xmlhttprequest/index.html | 108 ++++ .../index.html" | 5 + .../index.html" | 240 +++++++ .../index.html" | 48 ++ .../html5_cross_browser_polyfills/index.html | 34 + .../orphaned/learn/how_to_contribute/index.html | 81 +++ .../learn/html/forms/html5_updates/index.html | 83 +++ .../mdn/community/conversations/index.html | 53 ++ files/zh-tw/orphaned/mdn/community/index.html | 52 ++ .../howto/create_an_mdn_account/index.html | 34 + .../howto/do_a_technical_review/index.html | 50 ++ .../howto/do_an_editorial_review/index.html | 55 ++ .../howto/set_the_summary_for_a_page/index.html | 50 ++ files/zh-tw/orphaned/mdn/editor/basics/index.html | 55 ++ files/zh-tw/orphaned/mdn/editor/index.html | 23 + .../mdn/editor/keyboard_shortcuts/index.html | 134 ++++ .../index.html" | 228 +++++++ .../web/css/border-image/border-image/index.html | 111 ++++ .../index.html" | 43 ++ .../index.html" | 11 + .../index.html" | 39 ++ .../throw_\350\252\236\346\263\225/index.html" | 34 + .../index.html" | 162 +++++ .../index.html" | 42 ++ .../index.html" | 9 + .../break_\350\252\236\346\263\225/index.html" | 27 + .../continue_\350\252\236\346\263\225/index.html" | 49 ++ .../index.html" | 22 + .../for_\350\252\236\346\263\225/index.html" | 53 ++ .../label_\350\252\236\346\263\225/index.html" | 22 + .../while_\350\252\236\346\263\225/index.html" | 38 ++ .../index.html" | 110 ++++ .../index.html" | 18 + .../index.html" | 27 + .../index.html" | 21 + .../index.html" | 58 ++ .../index.html" | 40 ++ .../index.html" | 23 + .../index.html" | 10 + .../index.html" | 12 + .../index.html" | 184 ++++++ .../index.html" | 34 + .../index.html" | 114 ++++ .../index.html" | 53 ++ .../\347\271\274\346\211\277/index.html" | 146 +++++ .../index.html" | 31 + .../index.html" | 14 + .../index.html" | 19 + .../index.html" | 24 + .../index.html" | 135 ++++ .../index.html" | 293 +++++++++ .../index.html" | 14 + .../index.html" | 227 +++++++ .../\351\227\234\346\226\274/index.html" | 47 ++ .../index.html" | 21 + .../array_\347\211\251\344\273\266/index.html" | 151 +++++ .../boolean_\347\211\251\344\273\266/index.html" | 12 + .../date_\347\211\251\344\273\266/index.html" | 82 +++ .../function_\347\211\251\344\273\266/index.html" | 45 ++ .../math_\347\211\251\344\273\266/index.html" | 69 ++ .../number_\347\211\251\344\273\266/index.html" | 80 +++ .../regexp_\347\211\251\344\273\266/index.html" | 9 + .../string_\347\211\251\344\273\266/index.html" | 88 +++ .../web/svg/\346\225\231\345\255\270/index.html" | 13 + files/zh-tw/orphaned/xpcnativewrapper/index.html | 237 +++++++ files/zh-tw/orphaned/zh-tw/index.html | 5 + .../index.html" | 10 + .../index.html" | 6 + files/zh-tw/python/index.html | 66 -- files/zh-tw/svg/tutorial/basic_shapes/index.html | 150 ----- .../web_console/opening_the_web_console/index.html | 23 - files/zh-tw/tools/web_console/ui_tour/index.html | 23 + .../drawing_graphics_with_canvas/index.html | 162 ----- files/zh-tw/web/api/closeevent/index.html | 145 +++++ .../web/api/document.createtreewalker/index.html | 224 ------- .../zh-tw/web/api/document/createevent/index.html | 30 + .../web/api/document/createtreewalker/index.html | 224 +++++++ .../api/document_object_model/events/index.html | 69 ++ .../\344\272\213\344\273\266/index.html" | 69 -- .../web/api/elementcssinlinestyle/style/index.html | 79 +++ files/zh-tw/web/api/event/createevent/index.html | 30 - .../api/geolocation/using_geolocation/index.html | 251 -------- files/zh-tw/web/api/geolocation_api/index.html | 251 ++++++++ files/zh-tw/web/api/htmlelement/dataset/index.html | 167 ----- .../zh-tw/web/api/htmlelement/innertext/index.html | 86 +++ files/zh-tw/web/api/htmlelement/style/index.html | 79 --- .../api/htmlmediaelement/abort_event/index.html | 68 ++ .../api/htmlorforeignelement/dataset/index.html | 167 +++++ files/zh-tw/web/api/messageevent/index.html | 80 +++ files/zh-tw/web/api/node/innertext/index.html | 86 --- files/zh-tw/web/api/performance.timing/index.html | 56 -- files/zh-tw/web/api/performance/timing/index.html | 56 ++ files/zh-tw/web/api/permissions_api/index.html | 85 +++ .../api/web_video_text_tracks_format/index.html | 691 --------------------- files/zh-tw/web/api/websocket/index.html | 276 ++++++++ files/zh-tw/web/api/websockets_api/index.html | 155 +++++ .../index.html | 179 ++++++ files/zh-tw/web/api/webvtt_api/index.html | 691 +++++++++++++++++++++ files/zh-tw/web/api/window.history/index.html | 51 -- files/zh-tw/web/api/window.onpopstate/index.html | 57 -- .../api/window.requestanimationframe/index.html | 94 --- .../api/window/domcontentloaded_event/index.html | 133 ++++ files/zh-tw/web/api/window/history/index.html | 51 ++ files/zh-tw/web/api/window/load_event/index.html | 88 +++ .../api/window/requestanimationframe/index.html | 94 +++ .../index.html | 36 -- files/zh-tw/web/api/windowbase64/index.html | 114 ---- .../api/windoweventhandlers/onpopstate/index.html | 57 ++ files/zh-tw/web/api/windowtimers/index.html | 115 ---- files/zh-tw/web/css/@viewport/height/index.html | 121 ---- .../web/css/border-image/border-image/index.html | 111 ---- .../zh-tw/web/css/common_css_questions/index.html | 165 ----- .../web/css/css_background_and_borders/index.html | 153 ----- .../using_css_multiple_backgrounds/index.html | 85 --- .../web/css/css_backgrounds_and_borders/index.html | 153 +++++ .../using_multiple_backgrounds/index.html | 85 +++ files/zh-tw/web/css/css_color/index.html | 120 ++++ files/zh-tw/web/css/css_colors/index.html | 120 ---- .../basic_concepts_of_flexbox/index.html | 383 ++++++++++++ .../using_css_flexible_boxes/index.html | 383 ------------ files/zh-tw/web/events/abort/index.html | 68 -- files/zh-tw/web/events/domcontentloaded/index.html | 133 ---- files/zh-tw/web/events/load/index.html | 88 --- files/zh-tw/web/guide/dom/index.html | 22 - .../web/guide/html/event_attributes/index.html | 85 --- files/zh-tw/web/html/forms_in_html/index.html | 83 --- .../web/html/supported_media_formats/index.html | 467 -------------- .../web/http/basics_of_http/data_uris/index.html | 128 ++++ files/zh-tw/web/http/data_uris/index.html | 128 ---- .../web/http/server-side_access_control/index.html | 213 ------- files/zh-tw/web/http/status/418/index.html | 45 ++ .../web/http/status/418_i_m_a_teapot/index.html | 45 -- .../index.html | 394 ------------ .../index.html" | 43 -- .../index.html" | 11 - .../obsolete_pages/unicode/index.html | 33 - .../index.html" | 28 - .../index.html" | 39 -- .../throw_\350\252\236\346\263\225/index.html" | 34 - .../index.html" | 162 ----- .../obsolete_pages/\345\200\274/index.html" | 30 - .../index.html" | 14 - .../index.html" | 46 -- .../index.html" | 57 -- .../index.html" | 58 -- .../index.html" | 42 -- .../index.html" | 34 - .../index.html" | 42 -- .../index.html" | 34 - .../index.html" | 118 ---- .../\345\270\270\346\225\270/index.html" | 28 - .../index.html" | 9 - .../break_\350\252\236\346\263\225/index.html" | 27 - .../continue_\350\252\236\346\263\225/index.html" | 49 -- .../index.html" | 22 - .../for_\350\252\236\346\263\225/index.html" | 53 -- .../index.html" | 16 - .../label_\350\252\236\346\263\225/index.html" | 22 - .../while_\350\252\236\346\263\225/index.html" | 38 -- .../index.html" | 110 ---- .../index.html" | 18 - .../index.html" | 27 - .../index.html" | 21 - .../index.html" | 58 -- .../index.html" | 40 -- .../index.html" | 23 - .../index.html" | 10 - .../index.html" | 12 - .../index.html" | 104 ---- .../index.html" | 184 ------ .../index.html" | 34 - .../index.html" | 59 -- .../index.html" | 37 -- .../index.html" | 44 -- .../index.html" | 114 ---- .../index.html" | 43 -- .../index.html" | 53 -- .../\347\271\274\346\211\277/index.html" | 146 ----- .../index.html" | 31 - .../index.html" | 145 ----- .../index.html" | 14 - .../index.html" | 19 - .../index.html" | 24 - .../index.html" | 135 ---- .../index.html" | 16 - .../\350\250\273\350\247\243/index.html" | 21 - .../\350\256\212\346\225\270/index.html" | 57 -- .../index.html" | 293 --------- .../index.html" | 30 - .../index.html" | 65 -- .../index.html" | 31 - .../index.html" | 12 - .../index.html" | 14 - .../index.html" | 186 ------ .../index.html" | 20 - .../index.html" | 43 -- .../index.html" | 227 ------- .../\351\227\234\346\226\274/index.html" | 47 -- .../index.html" | 452 -------------- .../index.html" | 21 - .../eval_\345\207\275\346\225\270/index.html" | 17 - .../index.html" | 15 - .../isfinite_\345\207\275\346\225\270/index.html" | 24 - .../isnan_\345\207\275\346\225\270/index.html" | 26 - .../index.html" | 36 -- .../index.html" | 21 - .../array_\347\211\251\344\273\266/index.html" | 151 ----- .../boolean_\347\211\251\344\273\266/index.html" | 12 - .../date_\347\211\251\344\273\266/index.html" | 82 --- .../function_\347\211\251\344\273\266/index.html" | 45 -- .../index.html" | 13 - .../math_\347\211\251\344\273\266/index.html" | 69 -- .../number_\347\211\251\344\273\266/index.html" | 80 --- .../regexp_\347\211\251\344\273\266/index.html" | 9 - .../string_\347\211\251\344\273\266/index.html" | 88 --- .../arraybuffer/prototype/index.html | 111 ---- .../global_objects/date/prototype/index.html | 246 -------- .../global_objects/function/prototype/index.html | 139 ----- .../global_objects/number/prototype/index.html | 85 --- .../global_objects/object/prototype/index.html | 219 ------- .../global_objects/promise/prototype/index.html | 65 -- .../global_objects/string/prototype/index.html | 177 ------ .../operators/arithmetic_operators/index.html | 309 --------- .../operators/bitwise_operators/index.html | 555 ----------------- .../operators/comparison_operators/index.html | 284 --------- .../operators/logical_operators/index.html | 244 -------- files/zh-tw/web/performance/index.html | 481 ++++++++++++++ .../zh-tw/web/svg/tutorial/basic_shapes/index.html | 150 +++++ files/zh-tw/web/svg/tutorial/paths/index.html | 239 +++++++ .../tutorial/\350\267\257\345\276\204/index.html" | 239 ------- .../web/svg/\346\225\231\345\255\270/index.html" | 13 - .../zh-tw/web/\346\200\247\350\203\275/index.html" | 481 -------------- files/zh-tw/web_development/index.html | 5 - .../historical_artifacts_to_avoid/index.html" | 90 --- .../zh-tw/web_\351\226\213\347\231\274/index.html" | 16 - files/zh-tw/webapi/index.html | 127 ---- files/zh-tw/webapi/permissions/index.html | 85 --- files/zh-tw/websockets/index.html | 155 ----- .../websockets_reference/closeevent/index.html | 145 ----- .../websockets/websockets_reference/index.html | 26 - .../websockets_reference/messageevent/index.html | 80 --- .../websockets_reference/websocket/index.html | 276 -------- .../index.html | 179 ------ files/zh-tw/xhtml/index.html | 29 - files/zh-tw/xpcnativewrapper/index.html | 237 ------- files/zh-tw/zh-tw/index.html | 5 - .../index.html" | 10 - .../index.html" | 6 - 352 files changed, 18652 insertions(+), 18652 deletions(-) create mode 100644 files/zh-tw/conflicting/learn/html/introduction_to_html/index.html create mode 100644 files/zh-tw/conflicting/learn/javascript/objects/index.html create mode 100644 files/zh-tw/conflicting/learn/server-side/django/index.html create mode 100644 files/zh-tw/conflicting/web/api/canvas_api/tutorial/index.html create mode 100644 files/zh-tw/conflicting/web/api/document_object_model/index.html create mode 100644 files/zh-tw/conflicting/web/api/html_drag_and_drop_api/index.html create mode 100644 files/zh-tw/conflicting/web/api/index.html create mode 100644 files/zh-tw/conflicting/web/api/websockets_api/index.html create mode 100644 files/zh-tw/conflicting/web/api/windoworworkerglobalscope/index.html create mode 100644 files/zh-tw/conflicting/web/api/windoworworkerglobalscope_e2691f7ad05781a30c5fc5bb3b3f633a/index.html create mode 100644 files/zh-tw/conflicting/web/css/@viewport/index.html create mode 100644 files/zh-tw/conflicting/web/guide/index.html create mode 100644 files/zh-tw/conflicting/web/guide_6b4b72e1fc91461bde34734ce07b1c08/index.html create mode 100644 files/zh-tw/conflicting/web/http/cors/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_74154e098f4b1e7026df3945ceb0fa4a/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_a2d11ceeaeb3cb8c43292be7771f9b23/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_3193ca1e5a7bdb78e9d9418a947916aa/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_483bbc3a620ead7b721647d1a2cb216f/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_60d6c39d4282c67c117db9fdaf83be08/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_8898a6dd437cc51f48b4e8cade0385ac/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_937645e235e25783cc4e9b0d7a1f6d76/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_b021bd32308e4c421518cdd7104ac7bc/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_05717c12b1ecaebc9d68cf43524d31b1/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_11969cb29fead65c26360f554426c217/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_351a6d9e4d31b32eff9762ef5deead93/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_952d66f1fe521bc0574c89750f5b406e/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e6fc14473511cf01e7062dfb7751f49d/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e70c1f2655520c542321ddbdb2c4f28d/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_eb65eb8f4e6b3c16f08b95149183cfb8/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/functions/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/functions_536f6bf46bbdf38cc1a0b28ca1bc41b9/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/functions_587eb671a310bac0771e73a91b0abe6d/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/functions_925b2d10050621507a9c990cb803dcca/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/functions_b2cd05cbfe188215dc2e3f972d293ed6/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/functions_ceaa4b2a55bb67388c2728af1ff890f5/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/functions_effb9b1bcc102a5f6df7f1785ce89033/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/grammar_and_types/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_5c6f30ff8e011c45a011b9c8f3b5bcea/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_d57082c2207b466127d8dc34a980addf/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_e5a53691c318855e3342ad91feb78f2e/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_ef6fc79abc28f5eadd6c126341df5e49/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/regular_expressions/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/regular_expressions_24eb6498b86da57e7fb5337fd8fa04a6/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/regular_expressions_38b32725e0e3217a5542b1b4ee122407/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide/working_with_objects/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/guide_dc05b578fe0c2f7d9a89ed82daab4e65/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/reference/global_objects/arraybuffer/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/reference/global_objects/date/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/reference/global_objects/function/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/reference/global_objects/number/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/reference/global_objects/object/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/reference/global_objects/promise/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/reference/global_objects/string/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/reference/operators/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/reference/operators_310dc67549939233c3d18a8fa2cdbb23/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/reference/operators_7c8eb9475d97a4a734c5991857698560/index.html create mode 100644 files/zh-tw/conflicting/web/javascript/reference/operators_f71733c8e7001a29c3ec40d8522a4aca/index.html create mode 100644 files/zh-tw/conflicting/web/media/formats/index.html create mode 100644 files/zh-tw/conflicting/web/opensearch/index.html delete mode 100644 "files/zh-tw/core_javascript_1.5_\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" delete mode 100644 files/zh-tw/cross-site_xmlhttprequest/index.html delete mode 100644 "files/zh-tw/dom_\350\247\200\345\257\237\345\231\250/index.html" delete mode 100644 files/zh-tw/dragdrop/index.html delete mode 100644 "files/zh-tw/firefox_3.5_\346\212\200\350\241\223\346\226\207\344\273\266/index.html" delete mode 100644 "files/zh-tw/firefox_\344\270\255\347\232\204\351\233\242\347\267\232\350\263\207\346\272\220/index.html" create mode 100644 files/zh-tw/glossary/xhtml/index.html delete mode 100644 files/zh-tw/html5_cross_browser_polyfills/index.html create mode 100644 files/zh-tw/learn/css/howto/css_faq/index.html create mode 100644 files/zh-tw/learn/forms/how_to_structure_a_web_form/index.html create mode 100644 files/zh-tw/learn/forms/index.html delete mode 100644 files/zh-tw/learn/how_to_contribute/index.html delete mode 100644 files/zh-tw/learn/html/forms/how_to_structure_an_html_form/index.html delete mode 100644 files/zh-tw/learn/html/forms/index.html delete mode 100644 "files/zh-tw/learn/html/multimedia_and_embedding/html\344\270\255\347\232\204\345\234\226\347\211\207/index.html" create mode 100644 files/zh-tw/learn/html/multimedia_and_embedding/images_in_html/index.html create mode 100644 files/zh-tw/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html delete mode 100644 "files/zh-tw/learn/html/multimedia_and_embedding/\345\205\266\344\273\226_\345\265\214\345\205\245_\346\212\200\350\241\223/index.html" create mode 100644 files/zh-tw/learn/html/tables/basics/index.html delete mode 100644 "files/zh-tw/learn/html/tables/\345\237\272\347\244\216/index.html" create mode 100644 files/zh-tw/learn/javascript/building_blocks/events/index.html create mode 100644 files/zh-tw/learn/performance/multimedia/index.html delete mode 100644 "files/zh-tw/learn/performance/\345\244\232\345\252\222\351\253\224/index.html" create mode 100644 files/zh-tw/learn/server-side/first_steps/introduction/index.html delete mode 100644 "files/zh-tw/learn/server-side/first_steps/\344\273\213\347\264\271/index.html" create mode 100644 files/zh-tw/mdn/at_ten/index.html delete mode 100644 files/zh-tw/mdn/community/index.html delete mode 100644 "files/zh-tw/mdn/community/\350\253\226\345\243\207/index.html" delete mode 100644 files/zh-tw/mdn/contribute/howto/create_an_mdn_account/index.html delete mode 100644 files/zh-tw/mdn/contribute/howto/do_a_technical_review/index.html delete mode 100644 files/zh-tw/mdn/contribute/howto/do_an_editorial_review/index.html delete mode 100644 files/zh-tw/mdn/contribute/howto/set_the_summary_for_a_page/index.html delete mode 100644 files/zh-tw/mdn/editor/basics/index.html delete mode 100644 files/zh-tw/mdn/editor/edit_box/index.html delete mode 100644 files/zh-tw/mdn/editor/index.html delete mode 100644 files/zh-tw/mdn/kuma/index.html create mode 100644 files/zh-tw/mdn/yari/index.html delete mode 100644 files/zh-tw/mdn_at_ten/index.html delete mode 100644 "files/zh-tw/mozilla/firefox/releases/4/firefox_4_\351\226\213\347\231\274\350\200\205\346\226\260\345\212\237\350\203\275\346\246\202\350\246\275/index.html" create mode 100644 "files/zh-tw/orphaned/core_javascript_1.5_\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" create mode 100644 files/zh-tw/orphaned/cross-site_xmlhttprequest/index.html create mode 100644 "files/zh-tw/orphaned/dom_\350\247\200\345\257\237\345\231\250/index.html" create mode 100644 "files/zh-tw/orphaned/firefox_3.5_\346\212\200\350\241\223\346\226\207\344\273\266/index.html" create mode 100644 "files/zh-tw/orphaned/firefox_\344\270\255\347\232\204\351\233\242\347\267\232\350\263\207\346\272\220/index.html" create mode 100644 files/zh-tw/orphaned/html5_cross_browser_polyfills/index.html create mode 100644 files/zh-tw/orphaned/learn/how_to_contribute/index.html create mode 100644 files/zh-tw/orphaned/learn/html/forms/html5_updates/index.html create mode 100644 files/zh-tw/orphaned/mdn/community/conversations/index.html create mode 100644 files/zh-tw/orphaned/mdn/community/index.html create mode 100644 files/zh-tw/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html create mode 100644 files/zh-tw/orphaned/mdn/contribute/howto/do_a_technical_review/index.html create mode 100644 files/zh-tw/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html create mode 100644 files/zh-tw/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html create mode 100644 files/zh-tw/orphaned/mdn/editor/basics/index.html create mode 100644 files/zh-tw/orphaned/mdn/editor/index.html create mode 100644 files/zh-tw/orphaned/mdn/editor/keyboard_shortcuts/index.html create mode 100644 "files/zh-tw/orphaned/mozilla/firefox/releases/4/firefox_4_\351\226\213\347\231\274\350\200\205\346\226\260\345\212\237\350\203\275\346\246\202\350\246\275/index.html" create mode 100644 files/zh-tw/orphaned/web/css/border-image/border-image/index.html create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/javascript_\346\246\202\350\246\201/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/liveconnect_\346\246\202\350\246\201/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/throw_\350\252\236\346\263\225/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/try...catch_\350\252\236\346\263\225/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\256\232\347\276\251/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\273\272\347\253\213\346\226\260\347\232\204\347\211\251\344\273\266/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/break_\350\252\236\346\263\225/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/continue_\350\252\236\346\263\225/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/do...while_\350\252\236\346\263\225/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/for_\350\252\236\346\263\225/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/label_\350\252\236\346\263\225/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/while_\350\252\236\346\263\225/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/getter_\345\222\214_setter_\347\232\204\345\256\232\347\276\251/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\344\275\277\347\224\250_this_\345\217\226\345\276\227\347\211\251\344\273\266\347\232\204\345\217\203\350\200\203/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\261\254\346\200\247\347\232\204\345\210\252\351\231\244/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\273\272\346\247\213\345\255\220\345\207\275\346\225\270\347\232\204\344\275\277\347\224\250/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\346\226\271\346\263\225\347\232\204\345\256\232\347\276\251/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\210\235\345\247\213\345\214\226\345\255\220\347\232\204\344\275\277\347\224\250/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\261\254\346\200\247\347\232\204\347\264\242\345\274\225/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\351\207\235\345\260\215\347\211\251\344\273\266\347\232\204\351\241\236\345\236\213\345\256\232\347\276\251\345\261\254\346\200\247/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\346\250\241\345\274\217\347\232\204\347\267\250\345\257\253/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\347\257\204\344\276\213/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\347\232\204\346\223\215\344\275\234\350\252\236\346\263\225/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\271\274\346\211\277/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\345\212\240\345\205\245/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\351\232\216\345\261\244\347\232\204\345\273\272\347\253\213/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\277\255\344\273\243\345\231\250\345\222\214\347\224\242\347\224\237\345\231\250/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\346\257\224\350\274\203\351\201\213\347\256\227\345\255\220/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\226\211\345\214\205\347\232\204\351\201\213\347\224\250/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\227\234\346\226\274/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/parseint_\345\222\214_parsefloat_\345\207\275\346\225\270/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/array_\347\211\251\344\273\266/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/boolean_\347\211\251\344\273\266/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/date_\347\211\251\344\273\266/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/function_\347\211\251\344\273\266/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/math_\347\211\251\344\273\266/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/number_\347\211\251\344\273\266/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/regexp_\347\211\251\344\273\266/index.html" create mode 100644 "files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/string_\347\211\251\344\273\266/index.html" create mode 100644 "files/zh-tw/orphaned/web/svg/\346\225\231\345\255\270/index.html" create mode 100644 files/zh-tw/orphaned/xpcnativewrapper/index.html create mode 100644 files/zh-tw/orphaned/zh-tw/index.html create mode 100644 "files/zh-tw/orphaned/\345\217\203\350\210\207_mozilla_\345\260\210\346\241\210/index.html" create mode 100644 "files/zh-tw/orphaned/\345\273\272\347\253\213\346\223\264\345\205\205\345\245\227\344\273\266/index.html" delete mode 100644 files/zh-tw/python/index.html delete mode 100644 files/zh-tw/svg/tutorial/basic_shapes/index.html delete mode 100644 files/zh-tw/tools/web_console/opening_the_web_console/index.html create mode 100644 files/zh-tw/tools/web_console/ui_tour/index.html delete mode 100644 files/zh-tw/web/api/canvas_api/drawing_graphics_with_canvas/index.html create mode 100644 files/zh-tw/web/api/closeevent/index.html delete mode 100644 files/zh-tw/web/api/document.createtreewalker/index.html create mode 100644 files/zh-tw/web/api/document/createevent/index.html create mode 100644 files/zh-tw/web/api/document/createtreewalker/index.html create mode 100644 files/zh-tw/web/api/document_object_model/events/index.html delete mode 100644 "files/zh-tw/web/api/document_object_model/\344\272\213\344\273\266/index.html" create mode 100644 files/zh-tw/web/api/elementcssinlinestyle/style/index.html delete mode 100644 files/zh-tw/web/api/event/createevent/index.html delete mode 100644 files/zh-tw/web/api/geolocation/using_geolocation/index.html create mode 100644 files/zh-tw/web/api/geolocation_api/index.html delete mode 100644 files/zh-tw/web/api/htmlelement/dataset/index.html create mode 100644 files/zh-tw/web/api/htmlelement/innertext/index.html delete mode 100644 files/zh-tw/web/api/htmlelement/style/index.html create mode 100644 files/zh-tw/web/api/htmlmediaelement/abort_event/index.html create mode 100644 files/zh-tw/web/api/htmlorforeignelement/dataset/index.html create mode 100644 files/zh-tw/web/api/messageevent/index.html delete mode 100644 files/zh-tw/web/api/node/innertext/index.html delete mode 100644 files/zh-tw/web/api/performance.timing/index.html create mode 100644 files/zh-tw/web/api/performance/timing/index.html create mode 100644 files/zh-tw/web/api/permissions_api/index.html delete mode 100644 files/zh-tw/web/api/web_video_text_tracks_format/index.html create mode 100644 files/zh-tw/web/api/websocket/index.html create mode 100644 files/zh-tw/web/api/websockets_api/index.html create mode 100644 files/zh-tw/web/api/websockets_api/writing_websocket_client_applications/index.html create mode 100644 files/zh-tw/web/api/webvtt_api/index.html delete mode 100644 files/zh-tw/web/api/window.history/index.html delete mode 100644 files/zh-tw/web/api/window.onpopstate/index.html delete mode 100644 files/zh-tw/web/api/window.requestanimationframe/index.html create mode 100644 files/zh-tw/web/api/window/domcontentloaded_event/index.html create mode 100644 files/zh-tw/web/api/window/history/index.html create mode 100644 files/zh-tw/web/api/window/load_event/index.html create mode 100644 files/zh-tw/web/api/window/requestanimationframe/index.html delete mode 100644 files/zh-tw/web/api/window/sidebar/adding_search_engines_from_web_pages/index.html delete mode 100644 files/zh-tw/web/api/windowbase64/index.html create mode 100644 files/zh-tw/web/api/windoweventhandlers/onpopstate/index.html delete mode 100644 files/zh-tw/web/api/windowtimers/index.html delete mode 100644 files/zh-tw/web/css/@viewport/height/index.html delete mode 100644 files/zh-tw/web/css/border-image/border-image/index.html delete mode 100644 files/zh-tw/web/css/common_css_questions/index.html delete mode 100644 files/zh-tw/web/css/css_background_and_borders/index.html delete mode 100644 files/zh-tw/web/css/css_background_and_borders/using_css_multiple_backgrounds/index.html create mode 100644 files/zh-tw/web/css/css_backgrounds_and_borders/index.html create mode 100644 files/zh-tw/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html create mode 100644 files/zh-tw/web/css/css_color/index.html delete mode 100644 files/zh-tw/web/css/css_colors/index.html create mode 100644 files/zh-tw/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html delete mode 100644 files/zh-tw/web/css/css_flexible_box_layout/using_css_flexible_boxes/index.html delete mode 100644 files/zh-tw/web/events/abort/index.html delete mode 100644 files/zh-tw/web/events/domcontentloaded/index.html delete mode 100644 files/zh-tw/web/events/load/index.html delete mode 100644 files/zh-tw/web/guide/dom/index.html delete mode 100644 files/zh-tw/web/guide/html/event_attributes/index.html delete mode 100644 files/zh-tw/web/html/forms_in_html/index.html delete mode 100644 files/zh-tw/web/html/supported_media_formats/index.html create mode 100644 files/zh-tw/web/http/basics_of_http/data_uris/index.html delete mode 100644 files/zh-tw/web/http/data_uris/index.html delete mode 100644 files/zh-tw/web/http/server-side_access_control/index.html create mode 100644 files/zh-tw/web/http/status/418/index.html delete mode 100644 files/zh-tw/web/http/status/418_i_m_a_teapot/index.html delete mode 100644 files/zh-tw/web/javascript/introduction_to_object-oriented_javascript/index.html delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/javascript_\346\246\202\350\246\201/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/liveconnect_\346\246\202\350\246\201/index.html" delete mode 100644 files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/unicode/index.html delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\273\245\351\241\236\345\210\245\347\202\272\345\237\272\347\244\216\347\232\204\350\252\236\350\250\200_vs._\344\273\245\345\216\237\345\236\213\347\202\272\345\237\272\347\244\216\347\232\204\350\252\236\350\250\200/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/throw_\350\252\236\346\263\225/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/try...catch_\350\252\236\346\263\225/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\200\274/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\345\257\246\351\253\224\351\227\234\344\277\202\347\232\204\347\242\272\345\256\232/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\345\261\200\345\237\237\345\200\274\345\222\214\347\271\274\346\211\277\345\200\274/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\345\273\272\346\247\213\345\255\220\344\270\255\347\232\204\345\205\250\345\237\237\350\263\207\350\250\212/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\346\262\222\346\234\211\345\244\232\351\207\215\347\271\274\346\211\277/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\221\274\345\217\253/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\256\232\347\276\251/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\215\200\345\241\212\350\252\236\346\263\225/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\255\227\351\235\242\350\241\250\351\201\224/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\270\270\346\225\270/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\273\272\347\253\213\346\226\260\347\232\204\347\211\251\344\273\266/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/break_\350\252\236\346\263\225/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/continue_\350\252\236\346\263\225/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/do...while_\350\252\236\346\263\225/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/for_\350\252\236\346\263\225/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/label_\350\252\236\346\263\225/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/while_\350\252\236\346\263\225/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/getter_\345\222\214_setter_\347\232\204\345\256\232\347\276\251/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\344\275\277\347\224\250_this_\345\217\226\345\276\227\347\211\251\344\273\266\347\232\204\345\217\203\350\200\203/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\261\254\346\200\247\347\232\204\345\210\252\351\231\244/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\273\272\346\247\213\345\255\220\345\207\275\346\225\270\347\232\204\344\275\277\347\224\250/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\346\226\271\346\263\225\347\232\204\345\256\232\347\276\251/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\210\235\345\247\213\345\214\226\345\255\220\347\232\204\344\275\277\347\224\250/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\261\254\346\200\247\347\232\204\347\264\242\345\274\225/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\351\207\235\345\260\215\347\211\251\344\273\266\347\232\204\351\241\236\345\236\213\345\256\232\347\276\251\345\261\254\346\200\247/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\242\235\344\273\266\350\252\236\346\263\225/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\346\250\241\345\274\217\347\232\204\347\267\250\345\257\253/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\344\275\277\347\224\250\346\250\231\350\252\214\347\232\204\351\200\262\351\232\216\346\220\234\345\260\213/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\213\254\345\274\247\345\255\220\345\255\227\344\270\262\347\232\204\346\257\224\345\260\215\347\265\220\346\236\234\347\232\204\351\201\213\347\224\250/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\347\257\204\344\276\213/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\345\222\214\345\261\254\346\200\247/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\347\232\204\346\223\215\344\275\234\350\252\236\346\263\225/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\271\274\346\211\277/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\346\233\264\351\235\210\346\264\273\347\232\204\345\273\272\346\247\213\345\255\220/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\345\212\240\345\205\245/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\351\232\216\345\261\244\347\232\204\345\273\272\347\253\213/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\241\250\351\201\224\345\274\217/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\250\273\350\247\243/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\256\212\346\225\270/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\277\255\344\273\243\345\231\250\345\222\214\347\224\242\347\224\237\345\231\250/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\344\273\243\345\205\245\351\201\213\347\256\227\345\255\220/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\344\275\215\345\205\203\351\201\213\347\256\227\345\255\220/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\345\255\227\344\270\262\351\201\213\347\256\227\345\255\220/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\346\257\224\350\274\203\351\201\213\347\256\227\345\255\220/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\347\211\271\346\256\212\351\201\213\347\256\227\345\255\220/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\347\256\227\350\241\223\351\201\213\347\256\227\345\255\220/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\351\202\217\350\274\257\351\201\213\347\256\227\345\255\220/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\226\211\345\214\205\347\232\204\351\201\213\347\224\250/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\227\234\346\226\274/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\231\243\345\210\227\347\232\204\351\201\213\347\224\250/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/escape_\345\222\214_unescape_\345\207\275\346\225\270/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/eval_\345\207\275\346\225\270/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/isfinite_\345\207\275\346\225\270/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/isnan_\345\207\275\346\225\270/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/number_\345\222\214_string_\345\207\275\346\225\270/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/parseint_\345\222\214_parsefloat_\345\207\275\346\225\270/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/array_\347\211\251\344\273\266/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/boolean_\347\211\251\344\273\266/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/date_\347\211\251\344\273\266/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/function_\347\211\251\344\273\266/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/math_\347\211\251\344\273\266/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/number_\347\211\251\344\273\266/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/regexp_\347\211\251\344\273\266/index.html" delete mode 100644 "files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/string_\347\211\251\344\273\266/index.html" delete mode 100644 files/zh-tw/web/javascript/reference/global_objects/arraybuffer/prototype/index.html delete mode 100644 files/zh-tw/web/javascript/reference/global_objects/date/prototype/index.html delete mode 100644 files/zh-tw/web/javascript/reference/global_objects/function/prototype/index.html delete mode 100644 files/zh-tw/web/javascript/reference/global_objects/number/prototype/index.html delete mode 100644 files/zh-tw/web/javascript/reference/global_objects/object/prototype/index.html delete mode 100644 files/zh-tw/web/javascript/reference/global_objects/promise/prototype/index.html delete mode 100644 files/zh-tw/web/javascript/reference/global_objects/string/prototype/index.html delete mode 100644 files/zh-tw/web/javascript/reference/operators/arithmetic_operators/index.html delete mode 100644 files/zh-tw/web/javascript/reference/operators/bitwise_operators/index.html delete mode 100644 files/zh-tw/web/javascript/reference/operators/comparison_operators/index.html delete mode 100644 files/zh-tw/web/javascript/reference/operators/logical_operators/index.html create mode 100644 files/zh-tw/web/performance/index.html create mode 100644 files/zh-tw/web/svg/tutorial/basic_shapes/index.html create mode 100644 files/zh-tw/web/svg/tutorial/paths/index.html delete mode 100644 "files/zh-tw/web/svg/tutorial/\350\267\257\345\276\204/index.html" delete mode 100644 "files/zh-tw/web/svg/\346\225\231\345\255\270/index.html" delete mode 100644 "files/zh-tw/web/\346\200\247\350\203\275/index.html" delete mode 100644 files/zh-tw/web_development/index.html delete mode 100644 "files/zh-tw/web_\351\226\213\347\231\274/historical_artifacts_to_avoid/index.html" delete mode 100644 "files/zh-tw/web_\351\226\213\347\231\274/index.html" delete mode 100644 files/zh-tw/webapi/index.html delete mode 100644 files/zh-tw/webapi/permissions/index.html delete mode 100644 files/zh-tw/websockets/index.html delete mode 100644 files/zh-tw/websockets/websockets_reference/closeevent/index.html delete mode 100644 files/zh-tw/websockets/websockets_reference/index.html delete mode 100644 files/zh-tw/websockets/websockets_reference/messageevent/index.html delete mode 100644 files/zh-tw/websockets/websockets_reference/websocket/index.html delete mode 100644 files/zh-tw/websockets/writing_websocket_client_applications/index.html delete mode 100644 files/zh-tw/xhtml/index.html delete mode 100644 files/zh-tw/xpcnativewrapper/index.html delete mode 100644 files/zh-tw/zh-tw/index.html delete mode 100644 "files/zh-tw/\345\217\203\350\210\207_mozilla_\345\260\210\346\241\210/index.html" delete mode 100644 "files/zh-tw/\345\273\272\347\253\213\346\223\264\345\205\205\345\245\227\344\273\266/index.html" diff --git a/files/zh-tw/conflicting/learn/html/introduction_to_html/index.html b/files/zh-tw/conflicting/learn/html/introduction_to_html/index.html new file mode 100644 index 0000000000..29c2532f6f --- /dev/null +++ b/files/zh-tw/conflicting/learn/html/introduction_to_html/index.html @@ -0,0 +1,90 @@ +--- +title: 應該避免的過時語法 +slug: Web_開發/Historical_artifacts_to_avoid +translation_of: Learn/HTML/Introduction_to_HTML +translation_of_original: Web/Guide/HTML/Obsolete_things_to_avoid +--- +

介紹

+ +

許多人藉由觀看原始碼，然後複製貼上來學習 HTML、CSS 及 JavaScript。然而他們並沒有考慮到原本的網站，是否正確實做過。這意味著他們延續了一些過去必要，但現在不需要的程式慣例。這篇文章就是要列出那些隨著時間，變得不必要、或糟糕的程式語法。

+ +

Doctype

+ +

大約有十來種 (X)HTML文件類型描述（doctype），他們之間的差異非常細微（甚至沒差別），我們建議你使用以下 HTML5 的文件類型宣告：

+ +
<!DOCTYPE html>
+ +

如此會觸發所有瀏覽器使用標準模式（甚至包含 Internet Explorer 6）。

+ +

<meta> 元素與 charset 屬性

+ +

如同以下的原始碼寫法並不少見：

+ +
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+ +

然而，就算你把它縮減成這樣，所有的瀏覽器還是會做出相同判定（甚至包括Internet Explorer 6）：

+ +
<meta charset="UTF-8" />
+
+ +

這些知識已經透過逆向工程（reverse engineering）與實用主義（pragmatism）證實。用就對了。

+ +

不存在的 <meta> 元素

+ +

許多被棄用或不標準的值，常常因為從某個頁面被複製到另個頁面，而延續了它們的利用。儘管這些元件被廣為利用，它們其實不符合規範、也不會有效用。特別是，不要去使用：

+ + + +

HTML 腳本的註解

+ +

曾經有一段時間有些瀏覽器了解 {{ HTMLElement("script") }} 標籤，但有些則否。這有時導致瀏覽器把應該作為腳本的文字，解讀成純文字。有個自然的想法，使得腳本成為 HTML 的註解。這方法，可以讓能執行腳本的瀏覽器做動、而不了解的瀏覽器忽略。

+ +

從這時起，我們繼承了：

+ +
<script>
+<!--
+var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+document.write(unescape("%3Cscript src='" + gaJsHost + "bla.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+//-->
+</script>
+
+ +

或是：

+ +
<script type="text/javascript">
+<!--//--><![CDATA[//><!--
+Blabla.extend(MyFramework.settings, { "basePath": "/" });
+//--><!]]>
+</script>
+
+ +

如今，這只會在 strict XML 驗證下，因為註解避開不帶引號標記的誤報，而有所幫助。除此之外，是完全無用的。甚至不執行腳本的瀏覽器，也只會忽略 {{ HTMLElement("script") }} 標籤。簡單起見，只要把你的腳本寫在 {{ HTMLElement("script") }} 的開頭與結尾之間就行。更理想的話，把你的腳本變成獨立的檔案，並透過 {{ htmlattrxref("src", "script") }} 屬性連結。如果你在寫腳本，考慮使用 HTML5 {{ htmlattrxref("async", "script") }} 與 {{ htmlattrxref("defer", "script") }} 屬性。

+ +

不應再使用的元素

+ +

font, basefont

+ +

這些元素不應再使用。針對元素排版外觀，應當優先考慮 CSS，並藉由元素、ID、或 class 屬性控制目標。

+ +

b, i, u

+ +

這些往往比較有爭議，但是當有相應的話，盡量去使用個別的 {{ HTMLElement("strong") }}、{{ HTMLElement("em") }} 或是 {{ HTMLElement("span") }} 和 CSS (text-decoration:underline)。

+ +

斟酌考慮使用哪個元素。有些以發展為導向的頁面，建議以簡單的 {{ HTMLElement("strong") }} 取代 {{ HTMLElement("b") }}、還有 {{ HTMLElement("em") }} 取代 {{ HTMLElement("i") }}。遵從這個建議不是好主意。{{ HTMLElement("strong") }} 是用作強調陳述，而 {{ HTMLElement("em") }} 只是加粗文字。例如，使用 {{ HTMLElement("em") }} 去簡單完成斜體不是好主意。非強調的斜體文字可以透過你頁面 CSS 的 font-style:italic 完成。類似的，書的標題和藝術作品傳統上都被轉成斜體，但針對這些東西使用 {{ HTMLElement("cite") }} 元素可以給出比 {{ HTMLElement("em") }} 或 {{ HTMLElement("i") }} 更語意的標記。

+ +

acronym

+ +

acronym 元素不應該再使用。要表示縮寫應當用 {{ HTMLElement("abbr") }}。

+ +

tt, xmp

+ +

不要使用這些元素。要表現出電腦程式碼的片段，使用 {{ HTMLElement("code") }}。要表現出預格式化的文字，使用 {{ HTMLElement("pre") }}。如果只是想要 monospace 字型，在 CSS 使用 font-family: monospace。

+ +

applet

+ +

這個元素不應再使用。更通用的 {{ HTMLElement("object") }} 才是首選。

diff --git a/files/zh-tw/conflicting/learn/javascript/objects/index.html b/files/zh-tw/conflicting/learn/javascript/objects/index.html new file mode 100644 index 0000000000..292229d00d --- /dev/null +++ b/files/zh-tw/conflicting/learn/javascript/objects/index.html @@ -0,0 +1,394 @@ +--- +title: JavaScript 物件導向介紹 +slug: Web/JavaScript/Introduction_to_Object-Oriented_JavaScript +tags: + - 中階 + - 命名空間 + - 封裝 + - 建構子 + - 成員 + - 物件 + - 物件導向 + - 物件導向程式設計 +translation_of: Learn/JavaScript/Objects +translation_of_original: Web/JavaScript/Introduction_to_Object-Oriented_JavaScript +--- +
{{jsSidebar("Introductory")}}
+ +

深入淺出物件導向，JavaScript 支援強大、彈性的物件導向程式設計 ({{Glossary("OOP")}})。本篇文章會先介紹物件導向程式設計，然後複習 JavaScript 物件模型，最後示範在 JavaScript 物件導向程式設計的概念。本篇文章並不會介紹 在 ECMAScript 6 的物件導向程式設計 的新語法。

+ +

複習 JavaScript

+ +

若您對 JavaScript 變數、型態、函數及作用範圍的觀念並不是很有信心，您可以閱讀 重新膫解 JavaScript 中相關的主題。您也可以參考 JavaScript 指南。

+ +

物件導向程式設計

+ +

物件導向程式設計 (Object-oriented programming, OOP) 是一種使用 {{glossary("abstraction")}} 概念表達現實世界的程式設計方式。物件導向程式設計運用數個先前所建立的技術所組成，包含模組化 ({{glossary("modularity")}})、多型 ({{glossary("polymorphism")}}) 以及封裝 ({{glossary("encapsulation")}}) 。直到今天許多主流的程式語言 (如 Java, JavaScript, C#, C++, Python, PHP, Ruby 與 Objective-C) 也都支援物件導向程式設計。

+ +

物件導向程式設計是將軟體想像成由一群物件交互合作所組成，而非以往以函數 (Function) 或簡單的指令集交互合作所組成。在物件導向的架構中，每個物件都具有接收訊息，處理資料以及發送訊息給其他物件的能力。每個物件都可視為獨一無二的個體，他們扮演不同的角色並有不同的能力及責任。

+ +

物作導向程式設計提出了一個一個更有彈性且易於維護的設計方法，且廣泛被許多大型軟體工程所採用。由於物件導向程式設計強調模組化，因為物件導向的程式碼變的較為容易開發且易於理解。與較少模組化的程式設計技術相比，物件導向的程式碼更能更直接分析、編寫、理解複雜的情況與程序。1

+ +

JavaScript 是一個以雛型為基礎 (Prototype-based) 的程式設計語言 (或更準確的說是以雛型為基礎的腳本語言)，它採用了複製的模式而非繼承。以雛型為基礎的程式設計語言是一種物件導向程式設計，使用了函數來當做類別 (Class) 的建構子 (Constructor)，儘管 JavaScript 擁有類別 (Class) 的關鍵字，但它沒有類別敘述，當要拿 JavaScript 與其他物件導向程式語言相比時，這是很重要的區別。

+ +

專門用語

+ +
+
{{Glossary("Namespace")}}
+
可讓開發人員包裝所有功能到一個獨一無二、特定應用程式名稱的容器。
+
{{Glossary("Class")}}
+
用來定義物件的特徵，類別 (Class) 是物件屬性與方法的藍圖。
+
{{Glossary("Object")}}
+
類別 (Class) 的實際案例。
+
{{Glossary("Property")}}
+
物件 (Object) 的特徵，例如：顏色。
+
{{Glossary("Method")}}
+
物件 (Object) 的功能，例如：行走。它是與類別相關的子程序或函數。
+
{{Glossary("Constructor")}}
+
一個在物件產生時會被呼叫的方法。通常會使用與其所在類別 (Class) 相同的名稱。
+
{{Glossary("Inheritance")}}
+
一個類別 (Class) 可以繼承另一個類別的特徵與功能。
+
{{Glossary("Encapsulation")}}
+
可以將資料與方法包裝在一起使用的技術。
+
{{Glossary("Abstraction")}}
+
結合物件的複雜繼承關係、方法與屬性來充分反映現實的模型。
+
{{Glossary("Polymorphism")}}
+
Poly 指的是 "多" 而 Morphism 指的是 "型"。是指不同的類別可以定義相同的方法或屬性。
+
+ +

要了解物件導向程式設計更廣泛的說明，請參考維基百科的  {{interwiki("wikipedia", "Object-oriented programming")}}。

+ +

以雛型為基礎 (Prototype-based) 的程式設計

+ +

以雛型為基礎的程式設計是一種不使用類別的物件導向程式設計模式，但它是第一個透過修改 (或者擴充) 既有的 prototype 來達到類別的功能並可重複使用 (等同在以類別為基礎的程式語言中的繼承)。 又稱作無類別 (Classless)、雛型導向 (Prototype-oriented) 或以實例為基的程式語言 (Instance-based programming)。

+ +

最早 (最典型) 以雛型為基礎的程式語言的典範是由 David Ungar 與 Randall Smith 所開發的 {{interwiki("wikipedia", "Self (programming language)", "Self")}}。近年來無類別 (Class-less) 的程式設計風格越來越流行，並且被 JavaScript, Cecil, NewtonScript, Io, MOO, REBOL, Kevo, Squeak (在使用 Viewer 框架來處理 Morphic 元件時)，還有許多其他程式語言所採用。2

+ +

JavaScript 物件導向程式設計

+ +

命名空間

+ +

命名空間是一個可讓開發人員包裝所有功能到一個獨一無二、特定應用程式名稱的容器。在 JavaScript 中命名空間其實是另一個包含方法、屬性及物件的物件。

+ +
+

注意，在 JavaScript 中一般物件與命名空間並無語法上的差異，這於其他許多物件導向的語言並不相同，可能是初學 JavaScript 的程式設計師容易混淆的地方。

+
+ +

在 JavaScript 建立一個命名空間背後的概念非常的簡單：建立一個全域的物件，然後將所有的變數、方法及函數設為該物件的屬性。使用命名空間可以減少應用程式中名稱衝突發生的機率，由於每個應用程式的物件皆會是應用程式定義的全域物件的屬性。

+ +

讓我們來建立一個叫做 MYAPP 全域物件：

+ +
// 全域命名空間
+var MYAPP = MYAPP || {};
+ +

在上述程式範例，我們會先檢查 MYAPP 是否已經定義過 (不論是定義在同一檔案或在其他檔案)。若已定義過，便會使用現有的 MYAPP 全域物件，否則會建一個稱作 MYAPP 的空物件來包裝方法、函數、變數及物件。

+ +

我們也可以建立子命名空間 (要注意，全域物件必須已事先定義)：

+ +
// 子命名空間
+MYAPP.event = {};
+ +

以下的程式碼會建立一個命名空間並加入變數、函數以及一個方法：

+ +
// 建立一個稱作 MYAPP.commonMethod 的容器來存放常用方法與屬性
+MYAPP.commonMethod = {
+  regExForName: "", // define regex for name validation
+  regExForPhone: "", // define regex for phone no validation
+  validateName: function(name){
+    // Do something with name, you can access regExForName variable
+    // using "this.regExForName"
+  },
+
+  validatePhoneNo: function(phoneNo){
+    // do something with phone number
+  }
+}
+
+// 物件與方法宣告
+MYAPP.event = {
+    addListener: function(el, type, fn) {
+    // code stuff
+    },
+    removeListener: function(el, type, fn) {
+    // code stuff
+    },
+    getEvent: function(e) {
+    // code stuff
+    }
+
+    // 可以加入其他方法與屬性
+}
+
+// 使用 addListener 方法的語法：
+MYAPP.event.addListener("yourel", "type", callback);
+ +

標準內建物件

+ +

 JavaScript 的核心內建了許多物件，例如有 {{jsxref("Math")}}, {{jsxref("Object")}}, {{jsxref("Array")}} 以及 {{jsxref("String")}}。以下範例將示範如何使用 Math 物件中的 random() 方法來取得一個隨機的數字。

+ +
console.log(Math.random());
+
+ +
注意：這個例子及之後的例子會假設全域已經有定義名稱為 {{domxref("console.log()")}} 的函數。console.log() 函數並不算是 JavaScript 的一部份，但是有許多瀏覽器會實作這個功能來協助除錯使用。
+ +

請參考 JavaScript 參考: 標準內建物件 來取得在 JavaScript 中所有核心物件的清單。

+ +

每個在 JavaScript 中的物件均為物件 Object 的實例 (Instance)，因此會繼承其所有的屬性與方法。

+ +

自訂物件

+ +

類別 (Class)

+ +

JavaScript 是以雛形為基礎的程式語言，並沒有像在 C++ 或 Java 中看以到的 class 敘述句，這有時會讓習慣使用有 class 敘述句的程式設計師混淆。JavaScript 使用函數來作為類別 (Class) 的建構子 (Constructor)，要定義一個類別 (Class) 如同定義一個函數 (Function)一樣簡單，以下例子中我們使用空的建構子來定義了一個新的 Person 類別。

+ +
var Person = function () {};
+
+ +

物件 (Object) - 類別的實例 (Instance)

+ +

要建立物件 obj 的新實例，我們可以使用 new obj 敘述句，並將結果 (型態為 obj) 指派 (Assign) 到一個變數方便之後存取。

+ +

在先前範例中我們定義了一個名稱為 Person 的類別 (Class)。在以下的例子我們會建立兩個實例 (person1 與 person2)。

+ +
var person1 = new Person();
+var person2 = new Person();
+
+ +
+

請參考 {{jsxref("Object.create()")}} 來了解建立未初始化實例的實例化新方法。

+
+ +

建構子 (Constructor)

+ +

建構子會在實例化 (Instantiation) 時被呼叫 (建立物件實例被建立時)。建構子是類別的一個方法，在 JavaScript 中會以函數來當做物件的建構子，因此無須明確的定義建構子方法，而每個在類別中宣告的動作均會在實例化時被執行。

+ +

建構子會用來設定物件的屬性 (Property) 或是呼叫要準備讓物件可以使用的方法 (Method)。增加類別的方法及定義會使用另一種語法，在本文稍後會說明。

+ +

在以下例之中，類別 Person 的建構子在 Person 實例化時會記錄下一個訊息。

+ +
var Person = function () {
+  console.log('instance created');
+};
+
+var person1 = new Person(); // 會記錄 "instance created"
+var person2 = new Person(); // 會記錄 "instance created"
+
+ +

屬性 (Property) - 物件的屬性

+ +

屬性即為在類別中的變數，每個物件的實例都會有同樣的屬性。屬性會在類別的建構子 (函數) 中設定，所以屬性在每個實例產生時才會產生。

+ +

關鍵字 this 可以引用目前的物件，讓您使用在該類別中的其他屬性。存取 (讀寫或寫入) 一個在類別之外的屬性可以用語法：InstanceName.Property，如同在 C++, Java 以及其他語言。 (在類別內會使用語法 this.Property 來取得或設定屬性的數值。)

+ +

在以下例子中，我們會在實例化時定義 Person 類別的 firstName 屬性：

+ +
var Person = function (firstName) {
+  this.firstName = firstName;
+  console.log('Person instantiated');
+};
+
+var person1 = new Person('Alice'); // 會記錄 "Person instantiated"
+var person2 = new Person('Bob'); // 會記錄 "Person instantiated"
+
+// 顯示物件的 firstName 屬性
+console.log('person1 is ' + person1.firstName); // 會記錄 "person1 is Alice"
+console.log('person2 is ' + person2.firstName); // 會記錄 "person2 is Bob"
+
+ +

方法 (Method)

+ +

方法即為函數 (也如同函數般定義)，但是依照屬性的邏輯來運作，呼叫一個方法如同存取一個屬性，但您需要在函數名稱後加上 () ，並有可能會有參數。要定義一個方法，只需將函數指定 (Assign) 給類別的 prototype 屬性中一個已命名的屬性，接著，您便可用剛指定的屬性名稱來呼叫該物件的方法。

+ +

以下範例中，我們為 Person  類別定義了方法 sayHello() 並使用。

+ +
var Person = function (firstName) {
+  this.firstName = firstName;
+};
+
+Person.prototype.sayHello = function() {
+  console.log("Hello, I'm " + this.firstName);
+};
+
+var person1 = new Person("Alice");
+var person2 = new Person("Bob");
+
+// 呼叫 Person sayHello 方法。
+person1.sayHello(); // 會記錄 "Hello, I'm Alice"
+person2.sayHello(); // 會記錄 "Hello, I'm Bob"
+
+ +

在 JavaScript 中，方法其實是一般的函數物件 (Function object) 連結到一個物件的屬性，這意謂著您可以在  "物件之外" 呼叫方法。請看以下範例程式碼：

+ +
var Person = function (firstName) {
+  this.firstName = firstName;
+};
+
+Person.prototype.sayHello = function() {
+  console.log("Hello, I'm " + this.firstName);
+};
+
+var person1 = new Person("Alice");
+var person2 = new Person("Bob");
+var helloFunction = person1.sayHello;
+
+// 會記錄 "Hello, I'm Alice"
+person1.sayHello();
+
+// 會記錄 "Hello, I'm Bob"
+person2.sayHello();
+
+// 會記錄 "Hello, I'm undefined" (或在 Strict
+// 模式會出現 TypeError)
+helloFunction();
+
+// 會記錄 true
+console.log(helloFunction === person1.sayHello);
+
+// 會記錄 true
+console.log(helloFunction === Person.prototype.sayHello);
+
+// 會記錄 "Hello, I'm Alice"
+helloFunction.call(person1);
+ +

如範例中所示，我們讓所有的參考均指向 sayHello 函數 — 一個在 person1、一個在 Person.prototype、另一個在 helloFunction 變數 — 這些均參考相同的函數。在呼叫的過程中 this 的值會根據我們如何呼叫來決定，最常見的地方是：我們取得函數的物件屬性所在，在表示法中呼叫 this — person1.sayHello()— 會設定 this 為我們取得函數的地方 (person1)，這也是 person1.sayHello() 顯示的名稱為 "Alice" 以及 person2.sayHello() 顯示的名稱為 "Bob" 的原因。但如果我們以其他的方式來呼叫，那麼 this 結果將截然不同：在變數中呼叫 this — helloFunction()— 會設定 this 為所在的全域物件 (在瀏覽器即為 window)。由於物件 (可能) 並沒有 firstName 屬性，因此會得到 "Hello, I'm undefined" 這樣的結果 (在 Loose 模式才有這樣的結果，若在 strict mode 則會不同 [會出現錯誤]，為了避免混淆，此處將不會再詳述)。 或者我們可以像最後一個例子使用 call (或 apply) 來明確的設定 this。

+ +
注意：請參考 call 及 apply 來取得更多有關 this 的資訊
+ +

繼承

+ +

繼承是一種用一個或多個類別建立一個特殊版本類別的方式 (JavaScript 僅支援單一繼承)。這個特殊的類別通常稱做子類別，而其引用的類別則通常稱作父類別。在 JavaScript 您可以指定父類別的實例到子類別來做到這件事。在最近的瀏覽器中您也可以使用 Object.create 來實作繼承。

+ +
+

注意：JavaScript 不會偵測子類別的 prototype.constructor (請參考 Object.prototype)，所以我們必須手動處理。請參考在 Stackoverflow 的問題 "為什麼一定要設定 prototype 的建構子?"。

+
+ +

於以下範例，我們會定義類別 Student 做為 Person 的子類別。然後我們會重新定義 sayHello() 方法然後加入 sayGoodBye() 方法。

+ +
// 定義 Person 建構子
+var Person = function(firstName) {
+  this.firstName = firstName;
+};
+
+// 加入兩個方法到 Person.prototype
+Person.prototype.walk = function(){
+  console.log("I am walking!");
+};
+
+Person.prototype.sayHello = function(){
+  console.log("Hello, I'm " + this.firstName);
+};
+
+// 定義 Student 建構子
+function Student(firstName, subject) {
+  // Call the parent constructor, making sure (using call)
+  // that "this" is set correctly during the call
+  Person.call(this, firstName);
+
+  // Initialize our Student-specific properties
+  this.subject = subject;
+}
+
+// 建立 Student.prototype 物件來繼承 Person.prototype。
+// 注意: 在此處經常見的錯誤是使用 "new Person()" 來建立
+// Student.prototype。不正確的原因許多個，尤其是
+// 我們沒有給予 Person 任何 "firstName" 的參數。
+// 呼叫 Person 的正確位置在上方，也就是我們呼叫 Student
+// 的地方。
+Student.prototype = Object.create(Person.prototype); // 詳見以下說明
+
+// 設定 "constructor" 屬性參考 Student
+Student.prototype.constructor = Student;
+
+// 替換 "sayHello" 方法
+Student.prototype.sayHello = function(){
+  console.log("Hello, I'm " + this.firstName + ". I'm studying "
+              + this.subject + ".");
+};
+
+// 加入"sayGoodBye" 方法
+Student.prototype.sayGoodBye = function(){
+  console.log("Goodbye!");
+};
+
+// 範例用法:
+var student1 = new Student("Janet", "Applied Physics");
+student1.sayHello();   // "Hello, I'm Janet. I'm studying Applied Physics."
+student1.walk();       // "I am walking!"
+student1.sayGoodBye(); // "Goodbye!"
+
+// 檢查 instanceof 可正常運作
+console.log(student1 instanceof Person);  // true
+console.log(student1 instanceof Student); // true
+
+ +

於 Student.prototype = Object.create(Person.prototype); 一行：在舊版的 JavaScript 引擎沒有 Object.create，可以使用 "polyfill" (又稱 "shim"，請參考以下文章連結) 或使用函數來達到同樣的效果，如：

+ +
function createObject(proto) {
+    function ctor() { }
+    ctor.prototype = proto;
+    return new ctor();
+}
+
+// 用法:
+Student.prototype = createObject(Person.prototype);
+
+ +
注意： 請參考 Object.create 來了解其功能與舊引擎使用的 shim。
+ +

要在不管物件如何實例化的情況下確保 this 指向正確的地方並不簡單，儘管如此，這裡仍有一個簡單的習慣用法讓這件事變的較簡單。

+ +
var Person = function(firstName) {
+  if (this instanceof Person) {
+    this.firstName = firstName;
+  } else {
+    return new Person(firstName);
+  }
+}
+
+ +

封裝

+ +

於上述例子中 Student 並不需要知道 Person 類別的 walk() 方法實作的方式，但仍可以使用該方法，除非我們想要更改該函數，否則 Student 類別並不需要明確的定義該函數。這樣的概念稱就叫作封裝 (Encapsulation)，透過將每個類別的資料與方法包裝成一個單位。

+ +

隱藏資訊在其他語言是常見的功能，通當會使用私有 (Private) 與保護 (Protected) 方法/屬性。既使如此，您仍可在 JavaScript 模擬類似的操作，這並不是物件導向程式設計必要的功能。3

+ +

抽象化

+ +

抽象化是一個機制能讓您將工作問題的目前部份進行建立模型，不論是用繼承 (特殊化) 或是組合的方式。JavaScript 可以透過繼承達到特殊化 (Specialization)，並可讓類別實例成為其他物件的屬性來達到組合 (Composition)。

+ +

JavaScript 的 Function 類別繼承 Object 類別 (這示範了模型的特殊化) 而 {{jsxref("Function.prototype")}} 屬性是 {{jsxref("Object")}} 的實例 (這示範了組合)。

+ +
var foo = function () {};
+
+// 會記錄 "foo is a Function: true"
+console.log('foo is a Function: ' + (foo instanceof Function));
+
+// 會記錄 "foo.prototype is an Object: true"
+console.log('foo.prototype is an Object: ' + (foo.prototype instanceof Object));
+ +

多型

+ +

如同所有方法與屬性會定義在 prototype 之中，不同的類別可以定義相同名稱的方法，而這些方法的有效範圍其所在的類別之中，除非兩個類別之間有父子關係 (例如，其中一個類別是繼承另一個類別而來)。

+ +

注意

+ +

在 JavaScript 並不是只有這些方式可以實作物件導向程式設計，JavaScript 在這方面非常有彈性。另外，在此處示範的方法並沒有使用任何語言特殊技巧，也沒有模仿其他語言的物件理論來實作。

+ +

在 JavaScript 也有其他的方式可以做更進階的物件導向程式設計，但已超出本篇簡介的範圍。

+ +

參考文獻

+ +
    +
  1. Wikipedia - Object-oriented programming
    2. +
  2. Wikipedia - Prototype-based programming
    3. +
  3. Wikipedia - Encapsulation (object-oriented programming)
    4. +
+ +

相關資料

+ + diff --git a/files/zh-tw/conflicting/learn/server-side/django/index.html b/files/zh-tw/conflicting/learn/server-side/django/index.html new file mode 100644 index 0000000000..11e3c03038 --- /dev/null +++ b/files/zh-tw/conflicting/learn/server-side/django/index.html @@ -0,0 +1,66 @@ +--- +title: Python +slug: Python +tags: + - Python +translation_of: Learn/Server-side/Django +translation_of_original: Python +--- +

Python 是一種直譯式的腳本語言，是一個跨平台的的語言，可以在各個平台上面使用，如：Linux、Mac OS X、以及Microsoft Windows.

+

學習 Python

+

免費的電子書

+

如果是初學 Python，可以考慮看 Dive Into Python，雖然他最後是更新的時間是2004年，但依然是一部免費而且很棒的教程。它含括了幾乎所有 Python 的基本元素，還有一些平常使用 Python 可以執行什麼任務，像是網頁的請求，檔案的處理。如果對於 Python 基礎已經基礎的概念，就可以參考 Text Processing In Python ，這本書將會對於 Python 有更進階的介紹。

+

其他相關的免費電子書或是線上資源 :

+ +

當了解基礎的 Python，Code Like a Pythonista: Idiomatic Python 將幫助你了解一些 Python 特別的地方，還有跟別的語言的差異。

+

Free Online Courses

+ +

Python in Mozilla-based applications

+

XPCOM in Mozilla is used to support inter-language communication. Out-of-box it only supports C++ <-> JavaScript communication. The Python XPCOM package (also called PyXPCOM) is the low-level glue that ties Python and Mozilla together, letting XPCOM components written in JavaScript or C++ to be used from Python and vice versa. PyXPCOM is not included in the default Firefox build, so you'll need to use a third-party build or build yourself to use it. The most known consumer of PyXPCOM is the Komodo family of products.

+

Starting with Mozilla 1.9, Python DOM (PyDOM) bindings are implemented. This lets chrome XUL and HTML authors use Python in their <script> tags (again, not in the official Firefox/Thunderbird builds).

+

Python-based tools for Mozilla development

+

Python is used by Mozillians for tools that do various things with Mozilla apps and infrastructure. It would be useful to have a document on Python Environment and Tools for Mozilla.

+

Tools are listed here: http://k0s.org/toolbox/?language=python

+

Use of Python at Mozilla

+

Mozilla has considerable infrastructure based on python:

+ +

Python packaging

+

Python uses setup.py files to record metadata and installation instructions for python packages. Running (e.g.) python setup.py install will install the package, making its modules available on python's import path. For python 2.x, several distribution/installation modules exist. distutils is the only distribution package available in python's standard library. distutils has ability to upload to the python package index and to install python packages. See the Python documentation on distutils for details.

+

While distutils is built in to python's standard library, setuptools is a third-party ad hoc standard for packaging and distribution. It is mostly compatible with distutils, but importantly adds the ability for packages to include dependencies that are installed as prerequisites at the time setup.py is invoked as well as the ability to install python packages in development mode. This allows the files to be edited in place via .pth files which is handy if you are actively working on a project. setuptools also provides an easy_install script for installing packages and their dependencies through the web from PyPI. For instance, in order to install the PyYAML package, just run

+
easy_install PyYAML
+
+

Since setuptools is not included with python, you will need to install it in order to use it. You may install it from the setuptools PyPI page by downloading, extracting, and running python setup.py install. Or you can use the ez_setup.py script. You can download and run it with python (with root/Administrator privileges), or if you're in a bash shell, you can run

+
sudo python <(curl http://peak.telecommunity.com/dist/ez_setup.py)
+
+

setuptools is also provided with instances of virtualenv, so if you use virtualenvs for developing you may not need to install setuptools globally. distribute is a fork of setuptools written by Mozilla's own Tarek Ziade. It is compatible with setuptools and fixes a few bugs there.

+
+ Note: It's highly recommended that you use virtualenv for development!
+

The Python Package Index (PyPI) is the standard distribution point for python packages. If you need some functionality in python, it is a good place to look!

+

See also: http://k0s.org/portfolio/packaging.html

+

See also

+ diff --git a/files/zh-tw/conflicting/web/api/canvas_api/tutorial/index.html b/files/zh-tw/conflicting/web/api/canvas_api/tutorial/index.html new file mode 100644 index 0000000000..63bd0017fc --- /dev/null +++ b/files/zh-tw/conflicting/web/api/canvas_api/tutorial/index.html @@ -0,0 +1,162 @@ +--- +title: Drawing graphics with canvas +slug: Web/API/Canvas_API/Drawing_graphics_with_canvas +translation_of: Web/API/Canvas_API/Tutorial +translation_of_original: Web/API/Canvas_API/Drawing_graphics_with_canvas +--- +
+

Most of this content (but not the documentation on drawWindow) has been rolled into the more expansive Canvas tutorial, this page should probably be redirected there as it's now redundant but some information may still be relevant.

+
+

介紹

+

  在 Firefox 1.5, Firefox 引入了新的 HTML 元素 <canvas> 來繪製圖形。<canvas> 是基於 WHATWG canvas specification 的技術 (其發軔於蘋果公司在 Safari 上的實做)。 我們可以用它來在使用者端進行圖形和 UI 元件的渲染。

+

  <canvas> 創建了一個具有一致多個 rendering contexts 的區域。在本文中，我們著重於 2D rendering context 的部份。對於 3D 圖形，您可以參考 WebGL rendering context。

+

2D Rendering Context

+

先來個簡單的範例

+

  以下的程式碼做了一個簡單的展示：繪製兩個部份交疊的矩形 (其中一個矩形有透明屬性) :

+
function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+
+  ctx.fillStyle = "rgb(200,0,0)";
+  ctx.fillRect (10, 10, 55, 50);
+
+  ctx.fillStyle = "rgba(0, 0, 200, 0.5)";
+  ctx.fillRect (30, 30, 55, 50);
+}
+
+ +

{{EmbedLiveSample('A_Simple_Example','150','150','/@api/deki/files/602/=Canvas_ex1.png')}}

+

  這個名為 draw 的函式從 canvas element 取得 2d context。物件 ctx 可以被用來在 canvas 上頭繪製圖形。從程式碼可以看出，我們簡單的藉由設定 fillStyle 繪製了兩個顏色不同的矩形，並透過 fillRect 設定其位置。此外，第二個矩形透過 rgba() 配置了透明屬性。

+

  關於更複雜的圖形繪製，我們可以使用 fillRect, strokeRect 和 clearRect，他們分別可以畫出填滿的矩形, 僅有外框的矩形以及矩形區域清除。

+

路徑的使用

+

  beginPath 函式用來初始一段路徑的繪製，並且可以透過 moveTo, lineTo, arcTo, arc 以及相關的函式來描述路徑內容。要結束的時候呼叫 closePath 即可。一旦路徑描述完畢，就可以透過 fill 或 stroke 來渲染該路徑在 canvas 上。

+
function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+
+  ctx.fillStyle = "red";
+
+  ctx.beginPath();
+  ctx.moveTo(30, 30);
+  ctx.lineTo(150, 150);
+  // was: ctx.quadraticCurveTo(60, 70, 70, 150); which is wrong.
+  ctx.bezierCurveTo(60, 70, 60, 70, 70, 150); // <- this is right formula for the image on the right ->
+  ctx.lineTo(30, 30);
+  ctx.fill();
+}
+
+ +

{{EmbedLiveSample('Using_Paths','190','190','/@api/deki/files/603/=Canvas_ex2.png')}}

+

  呼叫 fill() 或 stroke() 代表該路徑已經被使用。若要重新進行填滿等動作，則需要重頭創造一次路徑。

+

圖像狀態

+

  fillStyle, strokeStyle, lineWidth 和 lineJoin 等屬性是 graphics state 的一部分。關於這些屬性的修改，您可以透過 save() 及 restore() 來進行操作。

+

一個更為複雜的範例

+

  接著我們來看一個稍微複雜一點的範例，它同時引入了路徑, 狀態的修改以及變換矩陣。

+
function drawBowtie(ctx, fillStyle) {
+
+  ctx.fillStyle = "rgba(200,200,200,0.3)";
+  ctx.fillRect(-30, -30, 60, 60);
+
+  ctx.fillStyle = fillStyle;
+  ctx.globalAlpha = 1.0;
+  ctx.beginPath();
+  ctx.moveTo(25, 25);
+  ctx.lineTo(-25, -25);
+  ctx.lineTo(25, -25);
+  ctx.lineTo(-25, 25);
+  ctx.closePath();
+  ctx.fill();
+}
+
+function dot(ctx) {
+  ctx.save();
+  ctx.fillStyle = "black";
+  ctx.fillRect(-2, -2, 4, 4);
+  ctx.restore();
+}
+
+function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+
+  // note that all other translates are relative to this one
+  ctx.translate(45, 45);
+
+  ctx.save();
+  //ctx.translate(0, 0); // unnecessary
+  drawBowtie(ctx, "red");
+  dot(ctx);
+  ctx.restore();
+
+  ctx.save();
+  ctx.translate(85, 0);
+  ctx.rotate(45 * Math.PI / 180);
+  drawBowtie(ctx, "green");
+  dot(ctx);
+  ctx.restore();
+
+  ctx.save();
+  ctx.translate(0, 85);
+  ctx.rotate(135 * Math.PI / 180);
+  drawBowtie(ctx, "blue");
+  dot(ctx);
+  ctx.restore();
+
+  ctx.save();
+  ctx.translate(85, 85);
+  ctx.rotate(90 * Math.PI / 180);
+  drawBowtie(ctx, "yellow");
+  dot(ctx);
+  ctx.restore();
+}
+
+ +

{{EmbedLiveSample('A_More_Complicated_Example','215','215','/@api/deki/files/604/=Canvas_ex3.png')}}

+

  我們自定義了兩個函式： drawBowtie 以及 dot，並且個別呼叫了四次。在呼叫他們之前，我們使用了 translate() 和 rotate() 來設定接著要繪製圖形的 transformation matrix，這將改變最終 dot 和 bowtie 的位置。dot 繪製了一個以 (0, 0) 為中心的小黑正方形，而 drawBowtie 產生了一個填滿的蝴蝶結樣貌的圖形。

+

  save() 和 restore() 規範了一系列動作的初始和結尾。一個值得注意的地方是，旋轉的動作是基於該圖形當下所在的位置， 所以 translate() -> rotate() -> translate() 的結果會和 translate() -> translate() -> rotate() 不同。

+

和 Apple <canvas> 的相容性

+

For the most part, <canvas> is compatible with Apple's and other implementations. There are, however, a few issues to be aware of, described here.

+

</canvas> tag 是必要的

+

In the Apple Safari implementation, <canvas> is an element implemented in much the same way <img> is; it does not have an end tag. However, for <canvas> to have widespread use on the web, some facility for fallback content must be provided. Therefore, Mozilla's implementation has a required end tag.

+

If fallback content is not needed, a simple <canvas id="foo" ...></canvas> will be fully compatible with both Safari and Mozilla -- Safari will simply ignore the end tag.

+

If fallback content is desired, some CSS tricks must be employed to mask the fallback content from Safari (which should render just the canvas), and also to mask the CSS tricks themselves from IE (which should render the fallback content).

+
canvas {
+  font-size: 0.00001px !ie;
+}
+

其他特性

+

藉由 Canvas 渲染網頁內容

+
+ This feature is only available for code running with Chrome privileges. It is not allowed in normal HTML pages. Read why.
+

Mozilla's canvas is extended with the drawWindow() method. This method draws a snapshot of the contents of a DOM window into the canvas. For example,

+
ctx.drawWindow(window, 0, 0, 100, 200, "rgb(255,255,255)");
+
+

would draw the contents of the current window, in the rectangle (0,0,100,200) in pixels relative to the top-left of the viewport, on a white background, into the canvas. By specifying "rgba(255,255,255,0)" as the color, the contents would be drawn with a transparent background (which would be slower).

+

It is usually a bad idea to use any background other than pure white "rgb(255,255,255)" or transparent, as this is what all browsers do, and many websites expect that transparent parts of their interface will be drawn on white background.

+

With this method, it is possible to fill a hidden IFRAME with arbitrary content (e.g., CSS-styled HTML text, or SVG) and draw it into a canvas. It will be scaled, rotated and so on according to the current transformation.

+

Ted Mielczarek's tab preview extension uses this technique in chrome to provide thumbnails of web pages, and the source is available for reference.

+
+ Note: Using canvas.drawWindow() while handling a document's onload event doesn't work. In Firefox 3.5 or later, you can do this in a handler for the MozAfterPaint event to successfully draw HTML content into a canvas on page load.
+

更多資訊

+ diff --git a/files/zh-tw/conflicting/web/api/document_object_model/index.html b/files/zh-tw/conflicting/web/api/document_object_model/index.html new file mode 100644 index 0000000000..fc26bc0bee --- /dev/null +++ b/files/zh-tw/conflicting/web/api/document_object_model/index.html @@ -0,0 +1,22 @@ +--- +title: DOM developer guide +slug: Web/Guide/DOM +tags: + - API + - DOM + - Guide + - NeedsTranslation + - TopicStub +translation_of: Web/API/Document_Object_Model +translation_of_original: Web/Guide/API/DOM +--- +

{{draft}}

+

The Document Object Model is an API for HTML and XML documents. It provides a structural representation of the document, enabling the developer to modify its content and visual presentation. Essentially, it connects web pages to scripts or programming languages.

+

All of the properties, methods, and events available to the web developer for manipulating and creating web pages are organized into objects (e.g., the document object that represents the document itself, the table object that represents a HTML table element, and so forth). Those objects are accessible via scripting languages in most recent web browsers.

+

The DOM is most often used in conjunction with JavaScript. However, the DOM was designed to be independent of any particular programming language, making the structural representation of the document available from a single, consistent API. Though we focus on JavaScript throughout this site, implementations of the DOM can be built for any language.

+

The World Wide Web Consortium establishes a standard for the DOM, called the W3C DOM. It should, now that the most important browsers correctly implement it, enable powerful cross-browser applications.

+

Why is the DOM important?

+

"Dynamic HTML" (DHTML) is a term used by some vendors to describe the combination of HTML, style sheets and scripts that allows documents to be animated. The W3C DOM Working Group is working hard to make sure interoperable and language-neutral solutions are agreed upon (see also the W3C FAQ). As Mozilla claims the title of "Web Application Platform", support for the DOM is one of the most requested features, and a necessary one if Mozilla wants to be a viable alternative to the other browsers.

+

Even more important is the fact that the user interface of Mozilla (also Firefox and Thunderbird) is built using XUL, using the DOM to manipulate its own UI.

+

More about the DOM

+

{{LandingPageListSubpages}}

diff --git a/files/zh-tw/conflicting/web/api/html_drag_and_drop_api/index.html b/files/zh-tw/conflicting/web/api/html_drag_and_drop_api/index.html new file mode 100644 index 0000000000..8113a786ec --- /dev/null +++ b/files/zh-tw/conflicting/web/api/html_drag_and_drop_api/index.html @@ -0,0 +1,5 @@ +--- +title: DragDrop +slug: DragDrop +--- +This page was auto-generated because a user created a sub-page to this page. diff --git a/files/zh-tw/conflicting/web/api/index.html b/files/zh-tw/conflicting/web/api/index.html new file mode 100644 index 0000000000..c606a94846 --- /dev/null +++ b/files/zh-tw/conflicting/web/api/index.html @@ -0,0 +1,127 @@ +--- +title: WebAPI +slug: WebAPI +translation_of: Web/API +translation_of_original: WebAPI +--- +

WebAPI 是指一系列的存取與裝置相容性 API，讓 Web App 及其內容能夠存取裝置的硬體 (例如電池狀態或裝置的振動硬體)，亦可存取裝置所儲存的資料 (例如行事曆或聯絡人清單)。在添加這些 API 之後，我們希望 Web 能跳脫目前的功能，並打破專利平台的限制。

+ +
+

注意：我們實際撰寫的內容，其實比本頁所列出的 API 還多，而且仍有許多連結尚未補齊。我們將持續補完相關內容，以提供更完整的資訊。可參閱 WebAPI 文件狀態頁面，隨時追蹤目前的 WebAPI 說明文件。

+
+ +
+

注意：若要了解小標圖的意義，可先參閱《封裝式 (Packaged) App》一文。

+
+ +
+
+

通訊 API

+ +
+
Network Information API
+
提供目前網路連線的基本資訊，如連線速度。
+
Bluetooth
+
The WebBluetooth API provides low-level access to the device's Bluetooth hardware.
+
Mobile Connection API {{NonStandardBadge}}
+
Exposes information about the device's cellular connectivity, such as signal strength, operator information, and so forth.
+
Network Stats API {{NonStandardBadge}}
+
監控資料使用情形，並將此資料提供給 Privileged App。
+
TCP Socket API {{NonStandardBadge}}
+
提供初階的 Socket 與 SSL 支援功能。
+
Telephony {{NonStandardBadge}}
+
讓 App 可撥/接電話，並使用內建電話的使用者介面。
+
WebSMS {{NonStandardBadge}}
+
讓 App 能收/發 SMS 文字簡訊，並能存取/管理裝置所儲存的訊息。
+
WiFi Information API {{NonStandardBadge}}
+
A privileged API which provides information about signal strength, the name of the current network, available WiFi networks, and so forth.
+
+ +

硬體存取 API

+ +
+
Ambient Light Sensor API
+
可存取環境光線感測器，讓 App 可偵測裝置四周的環境光線強度。
+
Battery Status API
+
不論是否插電進行充電，均將提供電池充電容量的相關資訊。
+
Geolocation API
+
提供裝置實際位置的相關資訊。
+
Pointer Lock API
+
讓 App 能鎖定存取滑鼠，並取得「隨著時間推移的滑鼠位移 (即 deltas)」，而不只是絕對座標而已。特別適用遊戲類 App。
+
Proximity API
+
測得裝置與物體 (如使用者的臉部) 之間的距離。
+
Device Orientation API
+
當裝置的方向改變時，送出通知。
+
Screen Orientation API
+
在畫面方向改變時發出通知。另透過此 API，可讓 App 呈現其所偏好的方向。
+
Vibration API
+
可讓 App 控制裝置上的振動硬體，用於如遊戲中的觸控回饋。此 API 並非用於如「通知」的振動事件。若需要通知的振動事件，請參閱 Alarm API。
+
Camera API {{NonStandardBadge}}
+
讓 App 透過裝置內建的相機，即可拍照或錄製影片。
+
Power Management API {{NonStandardBadge}}
+
讓 App 能開/關 CPU、螢幕、裝置電力，與類似資源。另可進一步監聽或檢視資源鎖定事件。
+
+ +

View All...

+
+ +
+

資料管理 API

+ +
+
FileHandle API
+
支援可寫入的檔案，並搭配鎖存功能。
+
IndexedDB
+
於用戶端儲存結構性的資料，並支援高效率的搜尋功能。
+
Settings API {{NonStandardBadge}}
+
App 可檢查並更改系統的相關設定；而這些設定選項均屬於永久儲存性質。
+
+ +

其他 API

+ +
+
Alarm API
+
App 可排定通知，亦可於特定時間自行啟動 App。
+
Simple Push API
+
讓平台傳送通知訊息至特定 App。
+
Web Notifications
+
讓 App 傳送通知並於系統層級顯示。
+
Apps API {{NonStandardBadge}}
+
Open WebApps API 可安裝並管理 Web App。此外，亦可讓 App 決定付款資訊。
+
Web Activities {{NonStandardBadge}}
+
讓 App 可委派某個 Activity 給其他 App。舉例來說，XX App 可能要求 YY App 選擇並回傳相片。使用者一般均可設定 Activity 所應搭配使用的  App。
+
Browser API {{NonStandardBadge}}
+
完全透過 Web 技術，支援建構 Web 瀏覽器 (可說是瀏覽器中再建構出瀏覽器)。
+
+ +
+
Idle API
+
使用者並未使用裝置時，讓 App 接收通知。
+
Permissions API {{NonStandardBadge}}
+
集中管理 App 的權限 (Permission)。由設定類 (Settings) 的 App 所使用。
+
Time/Clock API {{NonStandardBadge}}
+
可設定目前時間。另透過 Settings API 設定時區。
+
+ +

WebAPI 社群

+ +

如果需要這些 API 的相關協助，則有許多方法可諮詢其他開發人員。

+ +
    +
  • 在 WebAPI 討論區中提出問題： {{DiscussionList("dev-webapi", "mozilla.dev.webapi")}}
    • +
  • 到 WebAPI IRC channel 逛逛：#webapi
    • +
+ +

Don't forget about the netiquette...

+ + + + +
+
+ +

 

diff --git a/files/zh-tw/conflicting/web/api/websockets_api/index.html b/files/zh-tw/conflicting/web/api/websockets_api/index.html new file mode 100644 index 0000000000..8ba3337205 --- /dev/null +++ b/files/zh-tw/conflicting/web/api/websockets_api/index.html @@ -0,0 +1,26 @@ +--- +title: WebSockets 參考 +slug: WebSockets/WebSockets_reference +tags: + - WebSockets +translation_of: Web/API/WebSockets_API +translation_of_original: Web/API/WebSockets_API/WebSockets_reference +--- +

{{ draft() }}

+

下述文章是 WebSocket API 各介面的說明文件，本頁面為暫時的佔位文件。

+
+
+ WebSocket
+
+ 與 WebSocket 伺服器連接，傳送、接收資料的主介面。.
+
+ CloseEvent
+
+ 當連線關閉時 WebSocket 物件送出的事件。
+
+ MessageEvent
+
+ 當伺服器傳來資料時 WebSocket 物送送出的事件。
+
+

 

+

{{ languages ( {"en": "en/WebSockets/WebSockets_reference"} ) }}

diff --git a/files/zh-tw/conflicting/web/api/windoworworkerglobalscope/index.html b/files/zh-tw/conflicting/web/api/windoworworkerglobalscope/index.html new file mode 100644 index 0000000000..6cf618070e --- /dev/null +++ b/files/zh-tw/conflicting/web/api/windoworworkerglobalscope/index.html @@ -0,0 +1,114 @@ +--- +title: WindowBase64 +slug: Web/API/WindowBase64 +translation_of: Web/API/WindowOrWorkerGlobalScope +translation_of_original: Web/API/WindowBase64 +--- +

{{APIRef("HTML DOM")}}

+ +

The WindowBase64 helper contains utility methods to convert data to and from base64, a binary-to-text encoding scheme. For example it is used in data URIs.

+ +

There is no object of this type, though the context object, either the {{domxref("Window")}} for regular browsing scope, or the {{domxref("WorkerGlobalScope")}}  for workers, implements it.

+ +

屬性

+ +

This helper neither defines nor inherits any properties.

+ +

方法

+ +

This helper does not inherit any methods.

+ +
+
{{domxref("WindowBase64.atob()")}}
+
Decodes a string of data which has been encoded using base-64 encoding.
+
{{domxref("WindowBase64.btoa()")}}
+
Creates a base-64 encoded ASCII string from a string of binary data.
+
+ +

規範

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG', '#windowbase64', 'WindowBase64')}}{{Spec2('HTML WHATWG')}}No change since the latest snapshot, {{SpecName("HTML5.1")}}.
{{SpecName('HTML5.1', '#windowbase64', 'WindowBase64')}}{{Spec2('HTML5.1')}}Snapshot of {{SpecName("HTML WHATWG")}}. No change.
{{SpecName("HTML5 W3C", "#windowbase64", "WindowBase64")}}{{Spec2('HTML5 W3C')}}Snapshot of {{SpecName("HTML WHATWG")}}. Creation of WindowBase64 (properties where on the target before it).
+ +

瀏覽器相容性

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Basic support{{CompatGeckoDesktop(1)}} [1]{{CompatVersionUnknown}}10.0{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureFirefox Mobile (Gecko)AndroidIE MobileOpera MobileSafari Mobile
Basic support{{CompatGeckoMobile(1)}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

[1]  atob() is also available to XPCOM components implemented in JavaScript, even though {{domxref("Window")}} is not the global object in components.

+ +

參見

+ + diff --git a/files/zh-tw/conflicting/web/api/windoworworkerglobalscope_e2691f7ad05781a30c5fc5bb3b3f633a/index.html b/files/zh-tw/conflicting/web/api/windoworworkerglobalscope_e2691f7ad05781a30c5fc5bb3b3f633a/index.html new file mode 100644 index 0000000000..c38c15b821 --- /dev/null +++ b/files/zh-tw/conflicting/web/api/windoworworkerglobalscope_e2691f7ad05781a30c5fc5bb3b3f633a/index.html @@ -0,0 +1,115 @@ +--- +title: WindowTimers +slug: Web/API/WindowTimers +translation_of: Web/API/WindowOrWorkerGlobalScope +translation_of_original: Web/API/WindowTimers +--- +
{{APIRef("HTML DOM")}}
+ +

WindowTimers is a mixin used to provide utility methods which set and clear timers. No objects of this type exist; instead, its methods are available on {{domxref("Window")}} for the standard browsing scope, or on {{domxref("WorkerGlobalScope")}} for workers.

+ +

屬性

+ +

WindowTimers 介面沒有繼承也沒有定義任何屬性。

+ +

方法

+ +

除以下自身方法外，WindowTimers 介面提沒有任何繼承方法。

+ +
+
{{domxref("WindowTimers.clearInterval()")}}
+
Cancels the repeated execution set using {{domxref("WindowTimers.setInterval()")}}.
+
{{domxref("WindowTimers.clearTimeout()")}}
+
Cancels the delayed execution set using {{domxref("WindowTimers.setTimeout()")}}.
+
{{domxref("WindowTimers.setInterval()")}}
+
Schedules a function to execute every time a given number of milliseconds elapses.
+
{{domxref("WindowTimers.setTimeout()")}}
+
Schedules a function to execute in a given amount of time.
+
+ +

規範

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG', '#windowtimers', 'WindowTimers')}}{{Spec2('HTML WHATWG')}}No change since the latest snapshot, {{SpecName("HTML5.1")}}.
{{SpecName('HTML5.1', '#windowtimers', 'WindowTimers')}}{{Spec2('HTML5.1')}}Snapshot of {{SpecName("HTML WHATWG")}}. No change.
{{SpecName("HTML5 W3C", "#windowtimers", "WindowTimers")}}{{Spec2('HTML5 W3C')}}Snapshot of {{SpecName("HTML WHATWG")}}. Creation of WindowBase64 (properties where on the target before it).
+ +

瀏覽器相容性

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Basic support{{CompatGeckoDesktop(1)}}1.04.04.01.0
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureFirefox Mobile (Gecko)AndroidIE MobileOpera MobileSafari Mobile
Basic support{{CompatGeckoMobile(1)}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

 

+ +

參見

+ + diff --git a/files/zh-tw/conflicting/web/css/@viewport/index.html b/files/zh-tw/conflicting/web/css/@viewport/index.html new file mode 100644 index 0000000000..78d80ee35b --- /dev/null +++ b/files/zh-tw/conflicting/web/css/@viewport/index.html @@ -0,0 +1,121 @@ +--- +title: height +slug: Web/CSS/@viewport/height +translation_of: Web/CSS/@viewport +translation_of_original: Web/CSS/@viewport/height +--- +
{{CSSRef}}
+ +

概要

+ +

高度 的 CSS 描述符是用於設定兩者的簡易描述符 {{cssxref("@viewport/min-height", "min-height")}} 與 {{cssxref("@viewport/max-height", "max-height")}} 的可視區域(viewport)。提供一個可視區域的長度值，將設定兩者的最小高度與最大高度的值。

+ +

如果提供了兩個可視區域(viewport)，第一個值將設定為最小高度，而第二個值將設定為最大高度。

+ +

語法

+ +
/* One value */
+height: auto;
+height: 320px;
+height: 15em;
+
+/* Two values */
+height: 320px 200px;
+
+ +

值

+ +
+
auto
+
使用 CSS 描述符來進行值的計算。
+
<length>
+
非負絕對值或相對長度。
+
<percentage>
+
初始可視區域的相對寬度或相對高度百分比的縮放係數為 1.0，且必須是非負數。
+
+ +

正式語法

+ +
{{csssyntax}}
+
+ +

舉例

+ +
@viewport {
+  height: 500px;
+}
+ +

格式

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('CSS3 Device', '#descdef-viewport-height', '"height" descriptor')}}{{Spec2('CSS3 Device')}}Initial definition
+ +

瀏覽器兼容性

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support29 (behind a flag){{CompatNo}}10 {{property_prefix("-ms")}}11.10
+ Removed in 15
+ Reintroduced behind a flag in 16		{{CompatNo}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support4.429{{CompatNo}}10{{property_prefix("-ms")}}11.10
+ Removed in 15
+ Reintroduced behind a flag in 16		{{CompatNo}}
+
diff --git a/files/zh-tw/conflicting/web/guide/index.html b/files/zh-tw/conflicting/web/guide/index.html new file mode 100644 index 0000000000..2644dd50c6 --- /dev/null +++ b/files/zh-tw/conflicting/web/guide/index.html @@ -0,0 +1,5 @@ +--- +title: Web development +slug: Web_development +--- +This page was auto-generated because a user created a sub-page to this page. diff --git a/files/zh-tw/conflicting/web/guide_6b4b72e1fc91461bde34734ce07b1c08/index.html b/files/zh-tw/conflicting/web/guide_6b4b72e1fc91461bde34734ce07b1c08/index.html new file mode 100644 index 0000000000..45d12b6e0f --- /dev/null +++ b/files/zh-tw/conflicting/web/guide_6b4b72e1fc91461bde34734ce07b1c08/index.html @@ -0,0 +1,16 @@ +--- +title: Web 開發 +slug: Web_開發 +translation_of: Web/Guide +translation_of_original: Web_Development +--- +

Web 開發包括開發 Web 網站或 Web 應用程式的各方面。

+

學習如何建立從簡單到複雜、互動性高的 Web 網站，閱讀此處的文章，採用最新 Web 技術。

+
+ +

文件主題
Web 開發入門
如何開發 Web 的學習指南。
HTML
超文字標記語言是建立 Web 頁面和顯示在瀏覽器中的各種文件的基礎語言。
JavaScript
JavaScript 是開發 Web 應用程式中最常使用的 Script 語言。也可用於開發以 Mozilla 為基礎的軟體。
CSS
層疊樣式表使你能在 Web 上安排布局和頁面設計。
AJAX
非同步 JavaScript 和 XML 不是一項技術，而是各種技術的結合。使用 JavaScript 配合各種現代 Web 技術，建立動態 Web 應用程式。
Web 標準
學習如何藉由開放式 Web 和相容性，使你的 Web 網站或應用程式延伸至最大數量的使用者。
DOM
文件物件模型是用於 HTML 和 XML 的 API，提供文件的結構化表達方式，以改變文件的呈現。
XHTML
可擴展超文字標記語言是一種以 XML 為基礎、類似 HTML 的語言，提供比 HTML 還嚴格的語法。
SVG
可縮放向量圖形是一種 XML 標記語言，用於描述 2D 向量圖形。
Mozilla Web 開發者 FAQ
來自 Web 開發者的問答集。附有解答！

檢視全部...

社群

工具
+
+

Categories

+

Interwiki Language Links

+

 

+

{{ languages( { "en": "en/Web_Development", "de": "de/Webentwicklung", "es": "es/Desarrollo_Web", "fr": "fr/D\u00e9veloppement_Web", "it": "it/Sviluppo_Web", "ja": "ja/Web_Development", "pl": "pl/Programowanie_WWW","zh-cn": "cn/Web_Development" } ) }}

diff --git a/files/zh-tw/conflicting/web/http/cors/index.html b/files/zh-tw/conflicting/web/http/cors/index.html new file mode 100644 index 0000000000..29ba4ef791 --- /dev/null +++ b/files/zh-tw/conflicting/web/http/cors/index.html @@ -0,0 +1,213 @@ +--- +title: 伺服器端存取控制（CORS） +slug: Web/HTTP/Server-Side_Access_Control +translation_of: Web/HTTP/CORS +translation_of_original: Web/HTTP/Server-Side_Access_Control +--- +

存取控制系統是執行授權識別、認證、存取核可的實體，也負責透過登入來進行驗證，包含密碼、個人身份識別碼（personal identification numbers，PINs）、生物辨識掃描，以及物理或電子的金鑰。

+ +

存取控制是用於規範計算環境之資源可供哪些人或單位觀看、使用的一種安全技術。

+ +

{{HTTPSidebar}}

+ +

瀏覽器透過 {{domxref("XMLHttpRequest")}} 或 Fetch API 所發起的跨網域請求（cross-site request），會在寄送時使用特定的 HTTP 標頭。同樣的，由伺服器回傳的跨網域回應（cross-site response）中也能看到特定的 HTTP 標頭。關於這些特定標頭的簡介，包括使用 JavaScript 發起請求與處理來自伺服器回應的範例以及每一個標頭的討論，可以在 HTTP 存取控制（CORS）一文中找到，並應該搭配本文一起閱讀。這篇文章包含使用 PHP 處理存取控制請求與建立存取控制回應。本文的目標讀者為伺服器端程式設計師或管理員。僅管本篇範例使用的是 PHP，但類似的概念也適用於 ASP.net、Perl、Python、Java 等等其他語言；一般來說，這些概念也能套用在任何處理 HTTP 請求及動態建立 HTTP 回應的伺服器端程式環境中。

+ +

HTTP 標頭討論

+ +

討論到同時涵蓋客戶端及伺服器端使用的 HTTP 標頭的文章在此，建議先閱讀該篇文章。

+ +

可執行的程式碼範例

+ +

隨後章節的 PHP 程式碼片段（以及 JavaScript 呼叫伺服器）可以在這裡取得。這些程式在實作了跨網域 {{domxref("XMLHttpRequest")}} 的瀏覽器中都可以運作。

+ +

簡單跨網域請求

+ +

簡單存取控制請求會在以下情況下被建立發起：

+ + + +

在此情況下，回傳回應需要考慮以下條件：

+ + + +

在 HTTP 存取控制（CORS）一文的簡單存取控制請求章節示範了客戶端與伺服器端之間標頭的交流。下面是一個處理簡單請求的 PHP 程式碼片段：

+ +
<?php
+
+// 我們僅授權讓 arunranga.com 網域來存取資源
+// 因為我們認為該網域存取本 application/xml 資源是安全的
+
+if($_SERVER['HTTP_ORIGIN'] == "http://arunranga.com") {
+    header('Access-Control-Allow-Origin: http://arunranga.com');
+    header('Content-type: application/xml');
+    readfile('arunerDotNetResource.xml');
+} else {
+  header('Content-Type: text/html');
+  echo "<html>";
+  echo "<head>";
+  echo "   <title>Another Resource</title>";
+  echo "</head>";
+  echo "<body>",
+       "<p>This resource behaves two-fold:";
+  echo "<ul>",
+         "<li>If accessed from <code>http://arunranga.com</code> it returns an XML document</li>";
+  echo   "<li>If accessed from any other origin including from simply typing in the URL into the browser's address bar,";
+  echo   "you get this HTML document</li>",
+       "</ul>",
+     "</body>",
+   "</html>";
+}
+?>
+
+ +

以上的程式會檢查由瀏覽器所送出之請求的 {{HTTPHeader("Origin")}} 標頭（透過取得 $_SERVER['HTTP_ORIGIN']）是否為「http://arunranga.com」。若相符，則回傳之回應中加入 {{HTTPHeader("Access-Control-Allow-Origin")}}: http://arunranga.com 標頭值。這個範例可以在這裡看到執行的情形。

+ +

預檢請求

+ +

預檢存取控制請求在以下情況下發起：

+ + + +

在 HTTP 存取控制（CORS）一文的預檢存取控制請求章節示範了客戶端與伺服器端之間標頭的交流。一個伺服器資源要回應預檢（preflighted）請求必須能夠進行以下的判斷：

+ + + +

下面是一個使用 PHP 實作之處理預檢請求的範例：

+ +
<?php
+
+if($_SERVER['REQUEST_METHOD'] == "GET") {
+
+  header('Content-Type: text/plain');
+  echo "This HTTP resource is designed to handle POSTed XML input";
+  echo "from arunranga.com and not be retrieved with GET";
+
+} elseif($_SERVER['REQUEST_METHOD'] == "OPTIONS") {
+  // 告訴客戶端我們支援來自 arunranga.com 的呼叫
+  // 以及這個預檢請求的有效期限僅有 20 天
+
+  if($_SERVER['HTTP_ORIGIN'] == "http://arunranga.com") {
+    header('Access-Control-Allow-Origin: http://arunranga.com');
+    header('Access-Control-Allow-Methods: POST, GET, OPTIONS');
+    header('Access-Control-Allow-Headers: X-PINGARUNER');
+    header('Access-Control-Max-Age: 1728000');
+    header("Content-Length: 0");
+    header("Content-Type: text/plain");
+    //exit(0);
+  } else {
+    header("HTTP/1.1 403 Access Forbidden");
+    header("Content-Type: text/plain");
+    echo "You cannot repeat this request";
+  }
+
+} elseif($_SERVER['REQUEST_METHOD'] == "POST") {
+  // 處理 POST 請求，第一步為取得 POST 請求中 blob 型態的 XML
+  // 並且對其做一些處理，再傳送結果給客戶端
+
+  if($_SERVER['HTTP_ORIGIN'] == "http://arunranga.com") {
+    $postData = file_get_contents('php://input');
+    $document = simplexml_load_string($postData);
+
+    // 對 POST 請求的資料做一些處理
+
+    $ping = $_SERVER['HTTP_X_PINGARUNER'];
+
+    header('Access-Control-Allow-Origin: http://arunranga.com');
+    header('Content-Type: text/plain');
+    echo // 在處理之後要回傳的一些回應字串
+  } else {
+    die("POSTing Only Allowed from arunranga.com");
+  }
+} else {
+    die("No Other Methods Allowed");
+}
+?>
+
+ +

注意範例中在回應 {{HTTPMethod("OPTIONS")}} 預檢（preflighted）請求與回應 {{HTTPMethod("POST")}} 請求時都會回傳相對應的 HTTP 標頭值，因此一個伺服器資源可以處理預檢以及實際（actual）請求。在回應 OPTIONS 預檢請求之回應標頭中，伺服器告知客戶端可以使用 POST 方法發送實際（actual）請求，並且能於實際（actual）請求的 HTTP 標頭欄位中帶上 X-PINGARUNER 及其值。這個範例可以在這裡看到執行的情形。

+ +

身分驗證請求

+ +

身分驗證存取控制請求——即請求可以附帶 Cookies 或 HTTP 認證（Authentication）訊息（並期望回應攜帶 Cookies）——可以是簡單或預檢請求，根據請求使用之 HTTP 方法而定。

+ +

於簡單請求情境中，請求將會連同 Cookies 一起發送（例如當 withCredentials 旗標被設置於 {{domxref("XMLHttpRequest")}} 時）。假如伺服器以附帶了 {{HTTPHeader("Access-Control-Allow-Credentials")}}: true 標頭值的身分驗證回應來回傳，則回應會被客戶端接受並且可被用於網頁內容中。在預檢請求中，伺服器可以用 Access-Control-Allow-Credentials: true 標頭來回應 OPTIONS 預檢請求。

+ +

以下為一些處理身分驗證請求的 PHP 程式片段：

+ +
<?php
+
+if($_SERVER['REQUEST_METHOD'] == "GET") {
+  header('Access-Control-Allow-Origin: http://arunranga.com');
+  header('Access-Control-Allow-Credentials: true');
+  header('Cache-Control: no-cache');
+  header('Pragma: no-cache');
+  header('Content-Type: text/plain');
+
+  // 檢查有沒有 Cookie，若沒有則當作是第一次訪問
+  if (!isset($_COOKIE["pageAccess"])) {
+    setcookie("pageAccess", 1, time()+2592000);
+    echo 'I do not know you or anyone like you so I am going to';
+    echo 'mark you with a Cookie :-)';
+  } else {
+    $accesses = $_COOKIE['pageAccess'];
+    setcookie('pageAccess', ++$accesses, time()+2592000);
+    echo 'Hello -- I know you or something a lot like you!';
+    echo 'You have been to ', $_SERVER['SERVER_NAME'], ';
+    echo 'at least ', $accesses-1, ' time(s) before!';
+  }
+} elseif($_SERVER['REQUEST_METHOD'] == "OPTIONS") {
+  // 告訴客戶端這個預檢請求的有效期限僅有 20 天
+  if($_SERVER['HTTP_ORIGIN'] == "http://arunranga.com") {
+    header('Access-Control-Allow-Origin: http://arunranga.com');
+    header('Access-Control-Allow-Methods: GET, OPTIONS');
+    header('Access-Control-Allow-Credentials: true');
+    header('Access-Control-Max-Age: 1728000');
+    header("Content-Length: 0");
+    header("Content-Type: text/plain");
+  } else {
+    header("HTTP/1.1 403 Access Forbidden");
+    header("Content-Type: text/plain");
+    echo "You cannot repeat this request";
+  }
+} else {
+  die("This HTTP Resource can ONLY be accessed with GET or OPTIONS");
+}
+?>
+
+ +

注意此範例中的身分驗證請求，其中的 Access-Control-Allow-Origin: 標頭值不得是萬用字元（wildcard）「*」。此標頭值必須為一個有效的的來源網域（origin domain）。以上的範例可以在這裡看到執行的情形。

+ +

Apache 範例

+ +

限制存取某些 URI

+ +

一個實用的訣竅是使用 Apache rewrite 環境變數（environment variable），並且讓 HTTP 標頭套用 Access-Control-Allow-* 至某些 URI。這相當有用，例如要限制跨來源（cross-origin）請求 GET /api(.*).json 為不帶身分驗證的請求：

+ +
RewriteRule ^/api(.*)\.json$ /api$1.json [CORS=True]
+Header set Access-Control-Allow-Origin "*" env=CORS
+Header set Access-Control-Allow-Methods "GET" env=CORS
+Header set Access-Control-Allow-Credentials "false" env=CORS
+
+ +

參見

+ + diff --git a/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling/index.html b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling/index.html new file mode 100644 index 0000000000..24484bb5b3 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling/index.html @@ -0,0 +1,34 @@ +--- +title: 區塊語法 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊語法 +translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Block_Statement +--- +

區塊語法

+

區塊語法用於把語句群組化。區塊的範圍是由一對大括號所界定︰

+
{
+   statement_1
+   statement_2
+   .
+   .
+   .
+   statement_n
+}
+
+

範例
區塊語法通常和流程控制語法（例如 if、for、while）一併使用。

+
while (x < 10) {
+   x++;
+}
+
+

此處，{ x++; } 就是區塊語法。

+

重要: JavaScript 並沒有 區塊作用域。區塊裡的變數其作用域相當於函數或 Script，對變數的設定會一直持續到區塊本身之外。換言之，區塊語法並沒有作用域。儘管“單獨”的區塊仍是有效的句法，你也不會想要在 JavaScript 中使用單獨的區塊，因為這樣做並不會產生任何你所期待的機能，譬如說如果你期待類似 C 或 Java 而這樣做的話。例如︰

+
var x = 1;
+{
+   var x = 2;
+}
+alert(x); // 輸出 2
+
+

這樣會輸出 2，因為在區塊之內的 var x 語法，其作用域如同沒有區塊的 var x 語法。而在 C 或 Java 中，同樣的代碼將會輸出 1。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:正規表達式的運用:正規表達式的範例", "Core_JavaScript_1.5_教學:條件語法") }}

+
+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Block_Statement", "fr": "fr/Guide_JavaScript_1.5/D\u00e9claration_de_blocs", "ja": "ja/Core_JavaScript_1.5_Guide/Block_Statement", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Blok_instrukcji" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5/index.html b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5/index.html new file mode 100644 index 0000000000..c9f263afe1 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5/index.html @@ -0,0 +1,104 @@ +--- +title: 條件語法 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件語法 +translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Conditional_Statements +--- +

條件語法

+

條件語法是在當指定的條件為 true 時，就執行一整組指令。JavaScript 支援兩種條件語法︰if...else 和 switch。

+

if...else 語法

+

如果邏輯條件為 true 時，就執行 if 語法裡的語句。如果條件為 false 的話，可以使用選用性的 else 子句來執行語句。if 語法如下︰

+
if (condition)
+   statement_1
+[else
+   statement_2]
+
+

condition 可以是任何可求值為 true 或 false 的表達式。如果 condition 的求值為 true，就會執行 statement_1，否則執行 statement_2。statement_1 和 statement_2 可以是任何的語句，包括嵌套的 if 語法。

+

你也可以使用 else if 來組合語句，並依序測試各個條件，如下︰

+
if (condition)
+   statement_1
+[else if (condition_2)
+   statement_2]
+...
+[else if (condition_n_1)
+   statement_n_1]
+[else
+   statement_n]
+
+

要執行多個語句，就使用區塊語法（{ ... }）把語句群組化。一般來說，固定使用區塊語法是非常好的作法，尤其是當代碼內部還有嵌套的 if 語法時︰

+
if (condition) {
+   statements_1
+} else {
+   statements_2
+}
+
+

不要在條件表達式裡使用簡單的代入動作會比較明智，因為在快速瀏覽代碼時，代入和相等很容易彼此混淆。例如，不要使用如下代碼︰

+
if (x = y) {
+   /* 做一些事 */
+}
+
+

如果你需要在條件表達式中使用代入的話，常見的作法是在代入語句加上額外的括弧。例如︰

+
if ((x = y)) {
+   /* 做一些事 */
+}
+
+

不要把 Boolean 物件的 true、false 值和原始的布林值 true、false 相混淆。任何值只要不是 undefined、null、0、NaN、空字串 ("")、物件，即使是含有 false 值的 Boolean 物件，傳給條件語法的求值結果也會是 true。例如︰

+
var b = new Boolean(false);
+if (b) // 這個條件的求值結果為 true
+
+

範例
+在以下的範例中，如果在 Text 物件裡的字元數目為 3，函數 checkData 就返回 true。否則，他會顯示警報並返回 false。

+
function checkData() {
+   if (document.form1.threeChar.value.length == 3) {
+      return true;
+   } else {
+      alert("Enter exactly three characters. " +
+         document.form1.threeChar.value + " is not valid.");
+      return false;
+   }
+}
+

switch 語法

+

switch 語法可讓程式對表達式求值，並試著以表達式的值來一一比對 case 標籤。如果發現比對符合，程式就會執行與之關聯的語句。switch 語法如下︰

+
switch (expression) {
+   case label_1:
+      statements_1
+      [break;]
+   case label_2:
+      statements_2
+      [break;]
+   ...
+   default:
+      statements_def
+      [break;]
+}
+
+

程式首先從附有標籤的 case 子句找出能夠符合表達式的值的標籤，然後把控制權轉移到那個子句，並執行與之相關的語句。如果找不到相符的標籤，程式就會尋找選用性的 default 子句，如果找到的話，就把控制權轉移到那個子句，並執行與之相關的語句。如果找不到 default 子句，程式就會繼續執行 switch 語法後面的語句。根據慣例，default 語句一定是最後一個子句，但是並非只能這樣使用。

+

可用在每一個 case 子句的選用性 break 語法，可確實從 switch 裡已執行完且後面還有其他語句的符合語句中跳出。如果省略 break，程式就會繼續執行 switch 語法裡的下一個語法。

+

範例
+在以下範例中，如果 fruittype 求值為 "Bananas"，程式就會比對出 case "Bananas" 的值，並執行相聯的語句。如果遇到 break，程式就會終止 switch 並執行 switch 後面的語句。如果省略了 break，case "Cherries" 裡的語句也會被執行。

+
switch (fruittype) {
+   case "Oranges":
+      document.write("Oranges are $0.59 a pound.<br>");
+      break;
+   case "Apples":
+      document.write("Apples are $0.32 a pound.<br>");
+      break;
+   case "Bananas":
+      document.write("Bananas are $0.48 a pound.<br>");
+      break;
+   case "Cherries":
+      document.write("Cherries are $3.00 a pound.<br>");
+      break;
+   case "Mangoes":
+   case "Papayas":
+      document.write("Mangoes and papayas are $2.79 a pound.<br>");
+      break;
+   default:
+      document.write("Sorry, we are out of " + fruittype + ".<br>");
+}
+document.write("Is there anything else you'd like?<br>");
+
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:區塊語法", "Core_JavaScript_1.5_教學:循環語法") }}

+
+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Conditional_Statements", "fr": "fr/Guide_JavaScript_1.5/Instructions_conditionnelles", "ja": "ja/Core_JavaScript_1.5_Guide/Conditional_Statements", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Instrukcje_warunkowe" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_74154e098f4b1e7026df3945ceb0fa4a/index.html b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_74154e098f4b1e7026df3945ceb0fa4a/index.html new file mode 100644 index 0000000000..1e922b72f2 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_74154e098f4b1e7026df3945ceb0fa4a/index.html @@ -0,0 +1,21 @@ +--- +title: 註解 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/註解 +translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Comments +--- +

註解

+

註解是作者用來解釋 Script 在做什麼的標記符號。註解會被解譯器忽略。JavaScript 支援 Java 和 C++ 形式的註解︰

+ +

範例
+以下範例示範這兩種註解︰

+
// 這是單行註解。
+
+/* 這是多行註解。不管是什麼長度都可以，你也
+可以在任何你喜歡的地方使用。 */
+
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:物件的操作語法", "Core_JavaScript_1.5_教學:例外處理語法") }}

+
+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Comments", "es": "es/Gu\u00eda_JavaScript_1.5/Sentencias_para_comentarios", "fr": "fr/Guide_JavaScript_1.5/Commentaires", "ja": "ja/Core_JavaScript_1.5_Guide/Comments", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Instrukcje_komentarzy" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_a2d11ceeaeb3cb8c43292be7771f9b23/index.html b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_a2d11ceeaeb3cb8c43292be7771f9b23/index.html new file mode 100644 index 0000000000..af67cbfa03 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_a2d11ceeaeb3cb8c43292be7771f9b23/index.html @@ -0,0 +1,16 @@ +--- +title: 循環語法 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法 +translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Loop_Statements +--- +

循環語法

+

循環（或稱迴圈）是一組反覆執行的指令，直到滿足指定的條件為止。JavaScript 支援 for、do while、while 循環語法，除了 label 以外（label 本身不是循環語法，但經常和循環語法一起使用）。此外，你也可以在循環語法內部使用 break 和 continue 語法。

+

還有另一種語法 for...in 反覆執行語句，但是只用於物件的操作。參閱 物件的操作語法。

+

循環語法如下︰

+ +
+

{{ PreviousNext("Core_JavaScript_1.5_教學:條件語法", "Core_JavaScript_1.5_教學:循環語法:for_語法") }}

+
+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Loop_Statements", "es": "es/Gu\u00eda_JavaScript_1.5/Sentencias_de_bucle", "fr": "fr/Guide_JavaScript_1.5/Boucles", "ja": "ja/Core_JavaScript_1.5_Guide/Loop_Statements", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Instrukcje_p\u0119tli" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model/index.html b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model/index.html new file mode 100644 index 0000000000..45678e3bdb --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model/index.html @@ -0,0 +1,28 @@ +--- +title: 以類別為基礎的語言 vs. 以原型為基礎的語言 +slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/以類別為基礎的語言_vs._以原型為基礎的語言 +translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Class-Based_vs._Prototype-Based_Languages +--- +

以類別為基礎的語言 vs. 以原型為基礎的語言

+

以類別為基礎的語言，如 Java 和 C++，是以兩種不同實體的概念為根基︰類別（Class）和實體（Instance）。

+ +

以原型為基礎的語言，如 JavaScript，並沒有這些分別︰他簡單到只有物件。以原型為基礎的語言具有原型物件的概念。物件被當作模板來使用，從中取得最初的屬性以提供給新物件。不論是在你建立物件或執行時期的時候，任何物件都可以指定他自己的屬性。此外，任何物件都可以作為其他物件的原型而連繫起來，讓第二個物件共用第一個物件的屬性。

+

類別的定義

+

在以類別為基礎的語言中，你會在獨立的類別定義中定義類別。在這些定義中，你可以指定稱為建構子的特殊方法，用來建立類別的實體。建構子方法可以為實體的屬性指定初始值，並進行在建立時期的其他適當處理。你會使用 new 運算子配合建構子方法來建立類別的實體。

+

JavaScript 遵從類似的模型，但是建構子和其他類別的定義並沒有分別。取而代之，你會定義建構子函數來建立帶有特定初始值的一組屬性和值的物件。任何的 JavaScript 函數都可以用作建構子。你會使用 new 運算子配合建構子函數來建立新的物件。

+

子類別和繼承

+

在以類別為基礎的語言中，你會建立出類別定義整體的類別階層。在類別的定義中，你可以把新的類別指定為另一個既存類別的子類別。這個子類別會繼承親類別所有的屬性，也可以另外加入新的屬性或修改繼承下來的。例如，假定 Employee 類別只含有 name 和 dept 屬性，而 Manager 是 Employee 的子類別，且加入了 reports 屬性。在這個情況下，Manager 類別的實體將具有全部的三個屬性︰name、dept、reports。

+

JavaScript 可讓你把任意的建構子函數和原型物件連結在一起，以此實現繼承。因此，你可以準確的建立出 Employee 和 Manager 的範例，但是你會使用有點不一樣的術語。首先，你會定義 Employee 的建構子函數，指定 name 和 dept 屬性。接著，你會定義 Manager 的建構子函數，指定 reports 屬性。最後，你會把新的 Employee 物件作為原型代入給 Manager 的建構子函數。然後，當你建立新的 Manager 的時候，他就會從 Employee 物件繼承 name 和 dept 屬性。

+

屬性的加入和移除

+

在以類別為基礎的語言中，你通常會在編譯時期建立類別，然後你會在編譯時期或執行時期實體化類別的實體。在你定義了類別以後，你就不能改變類別的屬性的類型或數目。然而在JavaScript 中，你可以在執行時期加入或移除任何物件的屬性。如果你把屬性加入到用作為一整群物件的原型的物件裡，使用同一個原型的物件也會得到新的屬性。

+

不同點的摘要

+

下表給出了這些不同點的簡短摘要。本章的剩餘部分描述了使用 JavaScript 的建構子和原型來建立物件的階層，並和 Java 的做法來做比較。

+ +
以類別為基礎 (Java) 以原型為基礎 (JavaScript)
類別和實體這兩者有分別。 所有的物件都是實體。
使用類別定義來定義類別；使用建構子方法來把類別實體化。 使用建構子函數來定義並建立一整群物件。
使用 new 運算子來建立單一的物件。 相同。
使用類別定義來建構物件的階層，用以定義既存類別的子類。 藉由代入，把作為原型的物件和建構子函數連結起來，來建構出物件的階層。
藉由遵從類別鏈來繼承屬性。 藉由遵從原型鏈來繼承屬性。
類別定義指定了類別的所有實體的所有屬性。不能在執行時期動態的加入屬性。 建構子函數或原型指定並初始化了一系列屬性。可以給單獨的物件或一整組物件來動態的加入或移除屬性。
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:迭代器和產生器", "Core_JavaScript_1.5_教學:職員的例子") }}

+
+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Class-Based_vs._Prototype-Based_Languages", "es": "es/Gu\u00eda_JavaScript_1.5/Lenguajes_basados_en_clases_frente_a_basados_en_prototipos", "fr": "fr/Guide_JavaScript_1.5/Langages_bas\u00e9s_sur_les_classes_et_langages_bas\u00e9s_sur_les_prototypes", "ja": "ja/Core_JavaScript_1.5_Guide/Class-Based_vs._Prototype-Based_Languages", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/J\u0119zyki_oparte_na_klasach_vs._oparte_na_prototypach", "zh-cn": "cn/Core_JavaScript_1.5_Guide/Class-Based_vs._Prototype-Based_Languages" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_3193ca1e5a7bdb78e9d9418a947916aa/index.html b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_3193ca1e5a7bdb78e9d9418a947916aa/index.html new file mode 100644 index 0000000000..451fa3036e --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_3193ca1e5a7bdb78e9d9418a947916aa/index.html @@ -0,0 +1,46 @@ +--- +title: 實體關係的確定 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/實體關係的確定 +translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model +translation_of_original: >- + Web/JavaScript/Guide/Obsolete_Pages/Property_Inheritance_Revisited/Determining_Instance_Relationships +--- +

實體關係的確定

+

Javascript 搜尋屬性時，會先從物件內部所擁有的屬性開始，如果找不到屬性的名稱，就會從特殊的物件屬性 __proto__ 內部搜尋。不斷反覆執行；這個過程就稱為〝在原型鏈中搜尋〞。

+

當物件建構完成時，就會設定這個特殊的屬性 __proto__；他會被設成建構子的 prototype 屬性的值。因此，表達式 new Foo() 會以 __proto__ == Foo.prototype 來建立物件。因此，變更 Foo.prototype 的屬性，就會改變所有由 new Foo() 所建立的物件的屬性的搜尋。

+

每一個物件都有 __proto__ 物件屬性（除了 Object 以外）；每一個函數都有 prototype 物件屬性。所以物件可藉由“原型的繼承”與其他物件建立起關係。你可以藉由物件的 __proto__ 與函數的 prototype 物件的比較來對繼承進行測試。JavaScript 也提供了便捷方式︰instanceof 運算子會對照函數以檢測物件，如果這個物件繼承自函數的原型，就返回 true。例如，

+
var f = new Foo();
+var isTrue = (f instanceof Foo);
+

舉個更詳細的例子，假設你有顯示在 屬性的繼承 中的同一組定義。並建立 Engineer 物件如下︰

+
chris = new Engineer("Pigman, Chris", ["jsd"], "fiji");
+
+

對於這個物件，以下語句全部為 true︰

+
chris.__proto__ == Engineer.prototype;
+chris.__proto__.__proto__ == WorkerBee.prototype;
+chris.__proto__.__proto__.__proto__ == Employee.prototype;
+chris.__proto__.__proto__.__proto__.__proto__ == Object.prototype;
+chris.__proto__.__proto__.__proto__.__proto__.__proto__ == null;
+
+

有鑑於此，你可以編寫 instanceOf 函數如下︰

+
function instanceOf(object, constructor) {
+   while (object != null) {
+      if (object == constructor.prototype)
+         return true;
+      object = object.__proto__;
+   }
+   return false;
+}
+
+

根據這個定義，以下語句全部為 true︰

+
instanceOf (chris, Engineer)
+instanceOf (chris, WorkerBee)
+instanceOf (chris, Employee)
+instanceOf (chris, Object)
+
+

但下面的表達式是 false︰

+
instanceOf (chris, SalesPerson)
+
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:再談屬性的繼承:局域值和繼承值", "Core_JavaScript_1.5_教學:再談屬性的繼承:建構子中的全域資訊") }}

+
+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/Determining_Instance_Relationships", "es": "es/Gu\u00eda_JavaScript_1.5/M\u00e1s_sobre_la_herencia_de_propiedades/Determinando_relaciones_de_instancia", "ja": "ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/Determining_Instance_Relationships", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Powr\u00f3t_dziedziczenia_w\u0142asno\u015bci/Okre\u015blanie_wzajemnych_relacji_obiektu" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_483bbc3a620ead7b721647d1a2cb216f/index.html b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_483bbc3a620ead7b721647d1a2cb216f/index.html new file mode 100644 index 0000000000..e042494b71 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_483bbc3a620ead7b721647d1a2cb216f/index.html @@ -0,0 +1,57 @@ +--- +title: 局域值和繼承值 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/局域值和繼承值 +translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model +translation_of_original: >- + Web/JavaScript/Guide/Obsolete_Pages/Property_Inheritance_Revisited/Local_versus_Inherited_Values +--- +

局域值和繼承值

+

當你存取物件屬性的時候，JavaScript 會進行這些步驟，如同本章前面所提到過的︰

+
  1. 檢查局域值是否存在。如果存在，就返回局域值。
  2. 如果局域值不存在，就檢查原型鏈（使用 __proto__ 屬性）。
  3. 如果在原型鏈上的物件具有所求的指定屬性，就返回這個屬性的值。
  4. 如果找不到這樣的屬性，這個物件就不具有這個屬性。
    5. +
+

這些步驟之後的結果，取決於你如何循著這個方式來定義。一開始的例子有這些定義︰

+
function Employee () {
+this.name = "";
+this.dept = "general";
+}
+
+function WorkerBee () {
+this.projects = [];
+}
+WorkerBee.prototype = new Employee;
+
+

藉由這些定義，假定你以如下語句建立 amy 作為 WorkerBee 的實體︰

+
amy = new WorkerBee;
+
+

amy 物件具有一個局域的屬性，projects。name 和 dept 屬性的值並不是 amy 的局域值，所以是從 amy 物件的 __proto__ 屬性得來的。因此，amy 具有這些屬性值︰

+
amy.name == "";
+amy.dept == "general";
+amy.projects == [];
+
+

現在假定你在與 Employee 連結的原型改變 name 屬性的值︰

+
Employee.prototype.name = "Unknown"
+
+

乍看之下，你可能會預期新的值會被向下傳播給 Employee 所有的實體。然而，事情並不如此。

+

當你建立 Employee 物件的任何實體，這些實體會取得 name 屬性的局域值（空字串的那個）。這意味著當你使用新建立的 Employee 物件來設定 WorkerBee 原型的時候，WorkerBee.prototype 就具有 name 屬性的局域值。因此，當 JavaScript 找到 amy 物件（WorkerBee 的實體）的 name 屬性的時候，JavaScript 在 WorkerBee.prototype 找到了這些屬性的局域值。也因此並不會進一步在鏈的上一層 Employee.prototype 裡尋找。

+

如果你想要在執行時期改變物件屬性的值，而且希望新的值能被這個物件的所有子孫所繼承，你就不能在物件的建構子函數中定義這個屬性。相對的，你要把這個屬性加入到與建構子相連結的原型。例如，假定你修改前面的代碼如下︰

+
function Employee () {
+   this.dept = "general";
+}
+Employee.prototype.name = "";
+
+function WorkerBee () {
+this.projects = [];
+}
+WorkerBee.prototype = new Employee;
+
+amy = new WorkerBee;
+
+Employee.prototype.name = "Unknown";
+
+

在這個情況下，amy 的 name 屬性就會變成 "Unknown"。

+

如同這些範例所示，如果你希望物件的屬性有預設值，而且還希望能夠在執行時期修改這些預設值，你就應該在建構子的原型中設定這些屬性，而不是在建構子函數本身。

+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:再談屬性的繼承", "Core_JavaScript_1.5_教學:再談屬性的繼承:實體關係的確定") }}

+
+ +

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/Local_versus_Inherited_Values", "es": "es/Gu\u00eda_JavaScript_1.5/M\u00e1s_sobre_la_herencia_de_propiedades/Valores_locales_frente_a_los_heredados", "ja": "ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/Local_versus_Inherited_Values", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Powr\u00f3t_dziedziczenia_w\u0142asno\u015bci/Warto\u015bci_lokalne_vs._dziedziczone" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_60d6c39d4282c67c117db9fdaf83be08/index.html b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_60d6c39d4282c67c117db9fdaf83be08/index.html new file mode 100644 index 0000000000..b787de8dd0 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_60d6c39d4282c67c117db9fdaf83be08/index.html @@ -0,0 +1,42 @@ +--- +title: 沒有多重繼承 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/沒有多重繼承 +translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model +translation_of_original: >- + Web/JavaScript/Guide/Obsolete_Pages/Property_Inheritance_Revisited/No_Multiple_Inheritance +--- +

沒有多重繼承

+

部分物件導向語言允許多重繼承。也就是說，物件可以從互不相關的親物件繼承屬性和值。不過 JavaScript 並不支援多重繼承。

+

屬性值的繼承發生在執行時期，由 JavaScript 搜尋物件的原型鏈以找出繼承值。由於物件只有單一的已連結原型，因此 JavaScript 並不能從多於一個以上的原型鏈中動態的繼承。

+

在 JavaScript 中，建構子函數的內部可以有很多個其他的建構子函數的呼叫。如此可提供多重繼承的假象。例如，思考下面的語句︰

+
function Hobbyist (hobby) {
+   this.hobby = hobby || "scuba";
+}
+
+function Engineer (name, projs, mach, hobby) {
+   this.base1 = WorkerBee;
+   this.base1(name, "engineering", projs);
+   this.base2 = Hobbyist;
+   this.base2(hobby);
+   this.machine = mach || "";
+}
+Engineer.prototype = new WorkerBee;
+
+dennis = new Engineer("Doe, Dennis", ["collabra"], "hugo")
+
+

接著假定 WorkerBee 的定義使用的是本章先前的內容。在這個情況下，dennis 物件就有了這些屬性︰

+
dennis.name == "Doe, Dennis"
+dennis.dept == "engineering"
+dennis.projects == ["collabra"]
+dennis.machine == "hugo"
+dennis.hobby == "scuba"
+
+

所以 dennis 從 Hobbyist 建構子中得到了 hobby 的屬性。然而，假定你稍後把新的屬性加入到 Hobbyist 建構子的原型︰

+
Hobbyist.prototype.equipment = ["mask", "fins", "regulator", "bcd"]
+
+

dennis 物件並未繼承到這個新的屬性。

+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:再談屬性的繼承:建構子中的全域資訊", "Core_JavaScript_1.5_教學:LiveConnect_概要") }}

+
+ +

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/No_Multiple_Inheritance", "es": "es/Gu\u00eda_JavaScript_1.5/M\u00e1s_sobre_la_herencia_de_propiedades/Herencia_no_m\u00faltiple", "ja": "ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/No_Multiple_Inheritance", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Powr\u00f3t_dziedziczenia_w\u0142asno\u015bci/Brak_wielokrotnego_dziedziczenia" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_8898a6dd437cc51f48b4e8cade0385ac/index.html b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_8898a6dd437cc51f48b4e8cade0385ac/index.html new file mode 100644 index 0000000000..cece6b5a66 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_8898a6dd437cc51f48b4e8cade0385ac/index.html @@ -0,0 +1,58 @@ +--- +title: 建構子中的全域資訊 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/建構子中的全域資訊 +translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model +translation_of_original: >- + Web/JavaScript/Guide/Obsolete_Pages/Property_Inheritance_Revisited/Global_Information_in_Constructors +--- +

建構子中的全域資訊

+

當你建立建構子的時候，如果你在建構子中設定全域資訊，需要很小心。例如，假定你想要自動的給每一個新的職員指定一個專有的 ID。你可以給 Employee 使用下面的定義︰

+
var idCounter = 1;
+
+function Employee (name, dept) {
+   this.name = name || "";
+   this.dept = dept || "general";
+   this.id = idCounter++;
+}
+
+

根據這個定義，當你建立新的 Employee 的時候，建構子會依序把下一個 ID 指定給他，然後增加全域 ID 的計數器。因此，如果你的下一條語句如下，victoria.id 為 1，且 harry.id 為 2︰

+
victoria = new Employee("Pigbert, Victoria", "pubs")
+harry = new Employee("Tschopik, Harry", "sales")
+
+

乍看之下很好。然而，idCounter 會在每一次建立 Employee 物件的時候遞增，而不問用途。如果你建立顯示在本章中的整個 Employee 階層結構，Employee 建構子會在你每一次設定原型的時候被呼叫。假設你有下面的代碼︰

+
var idCounter = 1;
+
+function Employee (name, dept) {
+   this.name = name || "";
+   this.dept = dept || "general";
+   this.id = idCounter++;
+}
+
+function Manager (name, dept, reports) {...}
+Manager.prototype = new Employee;
+
+function WorkerBee (name, dept, projs) {...}
+WorkerBee.prototype = new Employee;
+
+function Engineer (name, projs, mach) {...}
+Engineer.prototype = new WorkerBee;
+
+function SalesPerson (name, projs, quota) {...}
+SalesPerson.prototype = new WorkerBee;
+
+mac = new Engineer("Wood, Mac");
+
+

在此略過 base 屬性的定義，並呼叫原型鏈中在他們之上的建構子。在這個情況下，等到 mac 物件被建立的時候，mac.id 是 5。

+

根據應用程式而定，計數器遞增了額外的次數，這也許重要，也許不重要。如果你很在意計數器額外的數值，有一個可能的解決方案是改用下面的建構子來代替︰

+
function Employee (name, dept) {
+   this.name = name || "";
+   this.dept = dept || "general";
+   if (name)
+      this.id = idCounter++;
+}
+
+

當你建立用作為原型的 Employee 實體時候，你並不需要提供參數給建構子。使用這個定義的建構子，當你並未提供參數時，建構子並不會把值代入給 id，也不會更新計數器。因此，若要 Employee 取得指定的 id，你就必須為職員指定名稱。在這個範例中，mac.id 將會是 1。

+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:再談屬性的繼承:實體關係的確定", "Core_JavaScript_1.5_教學:再談屬性的繼承:沒有多重繼承") }}

+
+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/Global_Information_in_Constructors", "es": "es/Gu\u00eda_JavaScript_1.5/M\u00e1s_sobre_la_herencia_de_propiedades/Informaci\u00f3n_global_en_los_constructores", "ja": "ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/Global_Information_in_Constructors", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Powr\u00f3t_dziedziczenia_w\u0142asno\u015bci/Globalne_informacje_w_konstruktorach" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_937645e235e25783cc4e9b0d7a1f6d76/index.html b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_937645e235e25783cc4e9b0d7a1f6d76/index.html new file mode 100644 index 0000000000..3bba16f786 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_937645e235e25783cc4e9b0d7a1f6d76/index.html @@ -0,0 +1,14 @@ +--- +title: 再談屬性的繼承 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承 +translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Property_Inheritance_Revisited +--- +

再談屬性的繼承

+

前面的章節說明了 JavaScript 建構子和原型如何提供階層組織和實體。本節將會討論一些稍早的討論中所看不到的細微差別。

+ +
+

{{ PreviousNext("Core_JavaScript_1.5_教學:職員的例子:更靈活的建構子", "Core_JavaScript_1.5_教學:再談屬性的繼承:局域值和繼承值") }}

+
+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited", "es": "es/Gu\u00eda_JavaScript_1.5/M\u00e1s_sobre_la_herencia_de_propiedades", "ja": "ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Powr\u00f3t_dziedziczenia_w\u0142asno\u015bci" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_b021bd32308e4c421518cdd7104ac7bc/index.html b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_b021bd32308e4c421518cdd7104ac7bc/index.html new file mode 100644 index 0000000000..5f071f0b00 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_b021bd32308e4c421518cdd7104ac7bc/index.html @@ -0,0 +1,145 @@ +--- +title: 更靈活的建構子 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/更靈活的建構子 +translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model +translation_of_original: >- + Web/JavaScript/Guide/Obsolete_Pages/The_Employee_Example/More_Flexible_Constructors +--- +

更靈活的建構子

+

目前為止所介紹的建構子函數並不能讓你在建立實體的時候指定屬性值。如同 Java 一般，你可以提供參數給建構子來為實體初始化屬性值。下圖顯示了做到這點的其中一個方式。

+

Image:hier05.gif
+圖 8.5: 在建構子中指定屬性，之一

+

下表顯示出 Java 和 JavaScript 對這些物件的定義。

+ +
JavaScript Java 
+function Employee (name, dept) {
+  this.name = name || "";
+  this.dept = dept || "general";
+}
+
 
+public class Employee {
+   public String name;
+   public String dept;
+   public Employee () {
+      this("", "general");
+   }
+   public Employee (String name) {
+      this(name, "general");
+   }
+   public Employee (String name, String dept) {
+      this.name = name;
+      this.dept = dept;
+   }
+}
+
 
+function WorkerBee (projs) {
+  this.projects = projs || [];
+}
+WorkerBee.prototype = new Employee;
+
 
+import java.util.List;
+import java.util.ArrayList;
+
+public class WorkerBee extends Employee {
+   public List<String> projects;
+   public WorkerBee () {
+      this(new ArrayList<String>());
+   }
+   public WorkerBee (List<String> projs) {
+      projects = projs;
+   }
+}
+
+
 
+
+function Engineer (mach) {
+   this.dept = "engineering";
+   this.machine = mach || "";
+}
+Engineer.prototype = new WorkerBee;
+
 
+public class Engineer extends WorkerBee {
+   public String machine;
+   public Engineer () {
+      dept = "engineering";
+      machine = "";
+   }
+   public Engineer (String mach) {
+      dept = "engineering";
+      machine = mach;
+   }
+}
+
+


+JavaScript 的這些定義使用了特殊的用語來設定預設值︰

+
this.name = name || "";
+
+

JavaScript 的邏輯 OR 運算子 (||) 會對他的第一參數求值。如果參數轉換為 true，運算子就返回這個參數。否則，運算子返回第二個參數的值。因此，這一行測試代碼可以看成，如果 name 具有對 name 屬性而言有用的值。如果是的話，他就把 this.name 設定成這個值。否則，他就把 this.name 設定成空字串。為簡單起見，本章使用這個用語；然而，第一眼看到這種用法的時候會使人迷惑不解。請注意︰這個用法在數字或布林參數中，可能不會如預期般運作，例如 0（零）和 false 會導致預設值被選取；在這種情況下，你將會需要使用下面更為冗長的用語，他會使所有的資料類型都發生預期般的行為︰

+
this.authorized = typeof(authorized) !== 'undefined' ? authorized : true;
+
+

當你使用這個定義來建立物件的實體的時候，你可以為在局域中定義的屬性來指定值。如同圖 8.5 所示，你可以使用如下語句來建立新的 Engineer︰

+
jane = new Engineer("belau");
+
+

 Jane 的屬性現在是︰

+
jane.name == "";
+jane.dept == "engineering";
+jane.projects == [];
+jane.machine == "belau"
+
+

注意這些定義，你不能為像 name 這種繼承下來的屬性指定初始值。如果你想要在 JavaScript 中，給繼承下來的屬性指定初始值，你就需要加入更多的代碼到建構子函數中。

+

截至目前為止，建構子函數建立了通用的物件，然後為新物件指定局域的屬性和值。你的建構子也可以直接呼叫建構子函數，來為原型鏈中較高層的物件加入更多的屬性。下圖顯示了這些定義。

+

Image:hier06.gif
+圖 8.6 在建構子中指定屬性，之二

+

讓我們來更仔細的觀察其中一個定義。這是 Engineer 建構子的新定義︰

+
function Engineer (name, projs, mach) {
+  this.base = WorkerBee;
+  this.base(name, "engineering", projs);
+  this.machine = mach || "";
+}
+
+

假設你如下建立新的 Engineer 物件︰

+
jane = new Engineer("Doe, Jane", ["navigator", "javascript"], "belau");
+
+

JavaScript 遵循以下步驟︰

+
  1. new 運算子建立通用物件，並且把他的 __proto__ 屬性設定為 Engineer.prototype。
  2. new 運算子把新物件傳遞給 Engineer 建構子當作 this 關鍵字的值。
  3. 建構子為這個物件建立稱為 base 的新屬性，並且把 WorkerBee 建構子的值代入給 base 屬性。這會使 WorkerBee 建構子成為 Engineer 物件的一個方法。base 屬性的名稱並無特別之處。你可以使用任意的有效的屬性名稱；base 這個名稱只是簡單的為了他的用途而取的。
  4. 建構子呼叫 base 方法，把傳入給建構子的其中兩個參數（"Doe, Jane" 以及 {{ mediawiki.external('\"navigator\", \"javascript\"') }}）以及字串 "engineering" 當作自己的參數傳入。在建構子中明確的使用 "engineering"，表明了所有 Engineer 物件所繼承下來的 dept 屬性都有相同的值，而且這個值會覆蓋繼承自 Employee 的值。
  5. 因為 base 是 Engineer 的方法，base 呼叫端的內部是 JavaScript 在步驟 1 時和新建立的物件綁在一起的 this 關鍵字。因此，WorkerBee 函數依序把 "Doe, Jane" 以及 {{ mediawiki.external('\"navigator\", \"javascript\"') }} 參數傳遞給 Employee 建構子函數。從 Employee 建構子函數返回以後，WorkerBee 函數使用剩下的參數來設定 projects 屬性。
  6. 從 base 方法返回以後，Engineer 建構子把物件的 machine 屬性初始化成 "belau"。
  7. 從建構子返回以後，JavaScript 就把新物件代入給 jane 變數。
    8. +
+

你可能在想，要從 Engineer 建構子的內部呼叫 WorkerBee 的建構子，明明你已經為 Engineer 物件設置適當的繼承了。實際情形並非如此。呼叫 WorkerBee 建構子可以確保，與已指定屬性的 Engineer 物件一起開始的所有建構子函數都會被呼叫。然而，如果你稍後把屬性加入到 Employee 或者 WorkerBee 屬性，這些屬性並不會被 Engineer 物件所繼承。例如，假設你使用如下語句︰

+
function Engineer (name, projs, mach) {
+  this.base = WorkerBee;
+  this.base(name, "engineering", projs);
+  this.machine = mach || "";
+}
+jane = new Engineer("Doe, Jane", ["navigator", "javascript"], "belau");
+Employee.prototype.specialty = "none";
+
+

jane 物件並未繼承 specialty 屬性。你仍然需要明確的設置原型，以確保動態繼承。假設你改用這些語句︰

+
function Engineer (name, projs, mach) {
+  this.base = WorkerBee;
+  this.base(name, "engineering", projs);
+  this.machine = mach || "";
+}
+Engineer.prototype = new WorkerBee;
+jane = new Engineer("Doe, Jane", ["navigator", "javascript"], "belau");
+Employee.prototype.specialty = "none";
+
+

現在 jane 物件的 specialty 屬性的值是 "none"。

+
+

另一種繼承的方式是使用 .call/.apply 方法。以下兩者是等價的︰

+ +
+function Engineer (name, projs, mach) {
+  this.base = WorkerBee;
+  this.base(name, "engineering", projs);
+  this.machine = mach || "";
+}
+
 
+function Engineer (name, projs, mach) {
+  WorkerBee.call(this, name, "engineering", projs);
+  this.machine = mach || "";
+}
+
+

使用 Javascript 的 .call 方法可以產生較為簡潔的實作，因為不再需要 ".base"。

+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:職員的例子:物件的屬性:屬性的加入", "Core_JavaScript_1.5_教學:再談屬性的繼承") }}

+
+

{{ languages( {"en": "en/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors", "es": "es/Gu\u00eda_JavaScript_1.5/El_ejemplo_Employee/Constructores_m\u00e1s_flexibles", "ja": "ja/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Praca_z_przyk\u0142adem/Wi\u0119cej_elastycznych_konstruktor\u00f3w" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators/index.html new file mode 100644 index 0000000000..0d694e88f8 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators/index.html @@ -0,0 +1,16 @@ +--- +title: 表達式 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/表達式 +translation_of: Web/JavaScript/Guide/Expressions_and_Operators +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Expressions +--- +

 

+

表達式

+

表達式即任何有效的一組字面表達、變數、運算子、可求值的單一的值，值可以使用數字、字串、或邏輯值。

+

大致上來說，表達式可分為兩種︰把值代入給變數，和單純的持有值。例如，表達式 x = 7 是把值 7 代入給 x 的表達式。表達式本身的求值結果是 7。這些表達式使用代入運算子。換句話說，表達式 3 + 4 單純的求值結果為 7，且沒有代入動作。這些表達式使用的運算子又可以簡單的稱為運算子。

+

JavaScript 有以下幾種表達式︰

+ +

{{ PreviousNext("Core_JavaScript_1.5_教學:Unicode", "Core_JavaScript_1.5_教學:運算子") }}

+ +

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Expressions", "fr": "fr/Guide_JavaScript_1.5/Expressions", "ja": "ja/Core_JavaScript_1.5_Guide/Expressions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Wyra\u017cenia" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_05717c12b1ecaebc9d68cf43524d31b1/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_05717c12b1ecaebc9d68cf43524d31b1/index.html new file mode 100644 index 0000000000..e00a0e612b --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_05717c12b1ecaebc9d68cf43524d31b1/index.html @@ -0,0 +1,20 @@ +--- +title: 算術運算子 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/算術運算子 +translation_of: Web/JavaScript/Guide/Expressions_and_Operators +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Arithmetic_Operators +--- +

 

+

算術運算子

+

算術運算子把數值（字面表達或變數其中一種）作為運算元，並返回 1 個數值。標準的算術運算子有加法 (+)、減法 (-)、乘法 (*)、除法 (/)。這些運算子在大部分的程式語言中，都以原來的方式運作。當使用於浮點數時（須特別注意，除以零會產生 NaN）︰

+
1 / 2      // 在 JavaScript 中返回 0.5
+1 / 2      // 在 Java 中返回 0（這兩個數並未明確表示為浮點數）
+
+1.0 / 2.0  // 在 JavaScript 和 Java 中都返回 0.5
+
+

此外，JavaScript 提供了列於下表的算術運算子。

+ +
運算子 說明 範例
%（模數） 二元運算子。返回兩數相除之後的整數餘數。 12 % 5 返回 2。
++（遞增） 一元運算子。運算元加 1。如果用作為前綴運算子 (++x)，返回運算元加 1 之後的值；如果用作為後綴運算子 (x++)，返回運算元加 1 之前的值。 如果 x 是 3，然後 ++x 把 x 設為 4 並返回 4，反之 x++ 返回 3，然後把 x 設為 4。
--（遞減） 一元運算子。運算元減 1。返回的值和遞增運算子類似。 如果 x 是 3，然後 --x 把 x 設為 2 並返回 2，反之 x-- 返回 3，然後把 x 設為 2。
-（正負反轉） 一元運算子。返回將運算子的正負號反轉的值。 如果 x 是 3，然後 -x 返回 -3。
+

表 3.4: 算術運算子

+

{{ PreviousNext("Core_JavaScript_1.5_教學:運算子:比較運算子", "Core_JavaScript_1.5_教學:運算子:位元運算子") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators", "es": "es/Gu\u00eda_JavaScript_1.5/Operadores/Operadores_aritm\u00e9ticos", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_arithm\u00e9tiques", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators", "ko": "ko/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operatory_arytmetyczne" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_11969cb29fead65c26360f554426c217/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_11969cb29fead65c26360f554426c217/index.html new file mode 100644 index 0000000000..6109b2d6e3 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_11969cb29fead65c26360f554426c217/index.html @@ -0,0 +1,31 @@ +--- +title: 位元運算子 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/位元運算子 +translation_of: Web/JavaScript/Guide/Expressions_and_Operators +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Bitwise_Operators +--- +

 

+

 

+

位元運算子

+

位元運算子把他們的運算元視為一組 32 位元的集合（零或一），而非十進制、十六進制、八進制。例如，十進制數 9 的二進制表示法為 1001。位元運算子對這些二進制表示法進行運算，並返回標準的 JavaScript 數值。

+

下表解說 JavaScript 的位元運算子。

+ +
運算子 用法 說明
位元 AND a & b 每一個對應至同一位元位置的兩個運算元兩者為 1 時，返回 1。
位元 OR a | b 每一個對應至同一位元位置的兩個運算元兩者或其中一者為 1 時，返回 1。
位元 XOR a ^ b 每一個對應至同一位元位置的兩個運算元其中一者而非兩者為 1 時，返回 1。
位元 NOT ~ a 反轉運算元的位元。
左移 a << b 往左移動 a 的二進制表示法 b 位元，從右邊補 0。
維持符號右移 a >> b 往右移動 a 的二進制表示法 b 位元，丟棄移出的位元。
填 0 右移 a >>> b 往右移動 a 的二進制表示法 b 位元，丟棄移出的位元，並從左邊補 0。
+

表 3.5: 位元運算子

+

位元邏輯運算子

+

大致上，位元邏輯運算子的運作如下︰

+ +

舉個例子，9 的二進制表示法是 1001，15 的二進制表示法是 1111。因此，當位元的運算子套用到這些值上時，結果如下︰

+ +

位元位移運算子

+

位元位移運算子有兩個運算元︰第一個是被移動的數值，第二個指定第一個運算元要移動的位元位置的數目。位移運算元的方向是以使用的運算元來控制。

+

位移運算子轉換這些運算元為 32 位元整數，並返回與左邊運算元同類型的結果。

+

位移運算子列於下表。

+ +
運算子 說明 範例
<<（左移） 這個運算子把第一個運算元向左移動指定的位元數。丟棄向左移出的多餘位元。從右邊填補 0 的位元。 9<<2 的結果是 36，因為 1001 向左移動 2 位元而變成 100100，此即 36。
>>（維持符號右移） 這個運算子把第一個運算元向右移動指定的位元數。丟棄向右移出的多餘位元。從左邊填補在最左邊複製的位元。 9>>2 的結果是 2，因為 1001 向右移動 2 位元而變成 10，此即 2。同樣的，-9>>2 的結果是 -3，因為保留了正負號。
>>>（填 0 右移） 這個運算子把第一個運算元向右移動指定的位元數。丟棄向右移出的多餘位元。從右邊填補 0 的位元。 19>>>2 的結果是 4，因為 10011 向右移動 2 位元而變成 100，此即 4。對於非負數而言，補 0 右移和維持符號右移的結果相同。
+

表 3.6: 位元位移運算子

+

{{ PreviousNext("Core_JavaScript_1.5_教學:運算子:算術運算子", "Core_JavaScript_1.5_教學:運算子:邏輯運算子") }}

+ +

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/Bitwise_Operators", "es": "es/Gu\u00eda_JavaScript_1.5/Operadores/Operadores_sobre_bits", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_bit-\u00e0-bit", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/Bitwise_Operators", "ko": "ko/Core_JavaScript_1.5_Guide/Operators/Bitwise_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operatory_bitowe" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_351a6d9e4d31b32eff9762ef5deead93/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_351a6d9e4d31b32eff9762ef5deead93/index.html new file mode 100644 index 0000000000..7ba467a3cf --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_351a6d9e4d31b32eff9762ef5deead93/index.html @@ -0,0 +1,43 @@ +--- +title: 邏輯運算子 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/邏輯運算子 +translation_of: Web/JavaScript/Guide/Expressions_and_Operators +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Logical_Operators +--- +

 

+

邏輯運算子

+

邏輯運算子通常和布林（邏輯）值一起使用，並返回布林值。然而，&& 和 || 運算子實際上返回的是指定的運算元的其中一個的值，所以如果這些運算子與非布林值一起使用，有可能返回非布林值。邏輯運算子的說明如下表。

+ +
運算子 用法 說明
&& expr1 && expr2 （邏輯 AND）如果 expr1 可以轉換為 false，就返回 expr1。否則返回 expr2。所以，當使用於布林值時，如果兩個運算元都為 true，&& 返回 true。否則返回 false。
|| expr1 || expr2 （邏輯 OR）如果 expr1 可以轉換為 true，就返回 expr1。否則返回 expr2。所以，當使用於布林值時，如果其中一個運算元為 true，|| 返回 true，如果兩個運算元都為 false，就返回 false。
! !expr （邏輯 NOT）如果運算元可以轉換為 true，就返回 false。否則返回 true。
+

表 3.7: 邏輯運算子

+

可以轉換成 false 的表達式的例子有︰對 null、0、空字串 ("") 或 undefined 求值。

+

以下代碼為 &&（邏輯 AND）運算子的範例。

+
a1=true && true       // t && t 返回 true
+a2=true && false      // t && f 返回 false
+a3=false && true      // f && t 返回 false
+a4=false && (3 == 4)  // f && f 返回 false
+a5="Cat" && "Dog"     // t && t 返回 Dog
+a6=false && "Cat"     // f && t 返回 false
+a7="Cat" && false     // t && f 返回 false
+
+

以下代碼為 ||（邏輯 OR）運算子的範例。

+
o1=true || true       // t || t 返回 true
+o2=false || true      // f || t 返回 true
+o3=true || false      // t || f 返回 true
+o4=false || (3 == 4)  // f || f 返回 false
+o5="Cat" || "Dog"     // t || t 返回 Cat
+o6=false || "Cat"     // f || t 返回 Cat
+o7="Cat" || false     // t || f 返回 Cat
+
+

以下代碼為 !（邏輯 NOT）運算子的範例。

+
n1=!true              // !t 返回 false
+n2=!false             // !f 返回 true
+n3=!"Cat"             // !t 返回 false
+
+

求值的最短路徑

+

由於邏輯表達式是由左往右求值，他們使用以下規則來測試，儘可能以“最短路徑”求值︰

+ +

這些邏輯規則保證求出的值永遠正確。注意，上述表達式中的 anything 部分並未求值，因此所有未求值的部分都不會產生作用。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:運算子:位元運算子", "Core_JavaScript_1.5_教學:運算子:字串運算子") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/Logical_Operators", "es": "es/Gu\u00eda_JavaScript_1.5/Operadores/Operadores_l\u00f3gicos", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_logiques", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/Logical_Operators", "ko": "ko/Core_JavaScript_1.5_Guide/Operators/Logical_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operatory_logiczne" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_952d66f1fe521bc0574c89750f5b406e/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_952d66f1fe521bc0574c89750f5b406e/index.html new file mode 100644 index 0000000000..a37ea47e50 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_952d66f1fe521bc0574c89750f5b406e/index.html @@ -0,0 +1,186 @@ +--- +title: 特殊運算子 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/特殊運算子 +translation_of: Web/JavaScript/Guide/Expressions_and_Operators +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Special_Operators +--- +

 

+

特殊運算子

+

JavaScript 提供下列的特殊運算子︰

+ +

條件運算子

+

條件運算子是 JavaScript 唯一使用三個運算元的運算子。運算子根據條件得到兩個值的其中一個。語法為︰

+
condition ? val1 : val2
+
+

如果 condition 為 true，運算子得到 val1 的值。否則得到 val2 的值。你可以在條件運算子上使用標準運算子。

+

例如，

+
status = (age >= 18) ? "adult" : "minor"
+
+

這個語句把“adult”的值代入給變數 status，只要 age 是 18 以上。否則，把“minor”的值代入給 status。

+

逗號運算子

+

逗號運算子 (,) 簡單的對他的兩個運算元求值，並返回第二個運算元的值。這個運算子主要用在 for 迴圈內部，使多個變數可在每一次的循環中更新。

+

例如，如果 a 是各邊含有 10 個元素的二維陣列，以下代碼使用逗號運算子同時遞增兩個變數。這個代碼在陣列裡輸出斜三角元素︰

+
for (var i=0, j=9; i <= 9; i++, j--)
+   document.writeln("a["+i+"]["+j+"]= " + a[i][j])
+
+

delete

+

delete 運算子可刪除物件、物件的屬性、陣列中指定索引的元素。語法為︰

+
delete objectName
+delete objectName.property
+delete objectName[index]
+delete property // 只在 with 語法之內有效
+
+

此處的 objectName 是指物件的名稱，property 是指現存的屬性，index 是指陣列中以整數表示的元素位置。

+

第四種於物件中刪除屬性的形式，只在 with 語法之內有效。

+

你可以使用 delete 運算子刪除以隱式宣告、沒有使用 var 語法的變數。

+

如果 delete 運算子成功的話，他會把屬性或元素設定為 undefined。如果操作是可行的話，delete 運算子返回 true；如果操作不可行，就返回 false。

+
x=42
+var y= 43
+myobj=new Number()
+myobj.h=4      // 建立屬性 h
+delete x       // 返回 true（如果以隱式宣告，就可以刪除）
+delete y       // 返回 false（如果以 var 宣告，就不能刪除）
+delete Math.PI // 返回 false（預先定義的屬性不能刪除）
+delete myobj.h // 返回 true（使用者定義的屬性可以刪除）
+delete myobj   // 返回 true（如果以隱式宣告，就可以刪除）
+

刪除陣列裡的元素
+當你刪除陣列元素時，陣列的長度並不受影響。舉例來說，如果你刪除 a{{ mediawiki.external(3) }}，a{{ mediawiki.external(4) }} 仍然是 {{ mediawiki.external(4) }}，a{{ mediawiki.external(3) }} 則是 undefined。

+

當 delete 運算子移除陣列的元素時，這個元素便不復存在於陣列之中。在以下範例中，使用 delete 移除 trees{{ mediawiki.external(3) }}。

+
trees=new Array("redwood","bay","cedar","oak","maple")
+delete trees[3]
+if (3 in trees) {
+   // 此處不會被執行
+}
+
+

如果你希望陣列元素存在、且元素的值是未定義，就使用 undefined 關鍵字取代 delete 運算子。在以下範例中，trees{{ mediawiki.external(3) }} 的值被代入為 undefined，而陣列元素仍然存在︰

+
trees=new Array("redwood","bay","cedar","oak","maple")
+trees[3]=undefined
+if (3 in trees) {
+   // 此處會被執行
+}
+

in

+

如果指定的屬性存在於指定的物件中，in 運算子返回 true。語法為︰

+
propNameOrNumber in objectName
+
+

此處 propNameOrNumber 是指表示為屬性名的字串、或表示為陣列索引的數值的表達式，objectName 是指物件的名稱。

+

以下範例示範 in 運算子的使用方法。

+
// 陣列
+trees=new Array("redwood","bay","cedar","oak","maple")
+0 in trees        // 返回 true
+3 in trees        // 返回 true
+6 in trees        // 返回 false
+"bay" in trees    // 返回 false（你必須指定索引編號，而不是索引上的值）
+"length" in trees // 返回 true（length 是 Array 的屬性）
+
+// 預先定義的物件
+"PI" in Math          // 返回 true
+myString=new String("coral")
+"length" in myString  // 返回 true
+
+// 自訂的物件
+mycar = {make:"Honda",model:"Accord",year:1998}
+"make" in mycar  // 返回 true
+"model" in mycar // 返回 true
+

instanceof

+

如果指定的物件屬於指定的物件的類型，instanceof 運算子返回 true。語法為︰

+
objectName instanceof objectType
+
+

此處 objectName 是指用來和 objectType 作比較的物件的名稱，objectType 是指物件的類型，如 Date 或 Array。

+

當你需要確認執行中物件的類型時，就使用 instanceof。舉個例子，當接受到例外時，你可以根據被拋出的例外來決定要執行哪一條例外處理。

+

例如，以下代碼使用 instanceof 確認 theDay 是否屬於 Date 物件。由於 theDay 屬於 Date 物件，所以會執行 if 語法裡的語句。

+
theDay=new Date(1995, 12, 17)
+if (theDay instanceof Date) {
+   // 被執行的語句
+}
+

new

+

你可以使用 new 運算子來建立使用者定義的物件類型的實體，或建立預先定義的物件類型 Array、Boolean、Date、Function、Image、Number、Object、Option、RegExp、String 其中之一。在伺服器上，你也可以用於 DbPool、Lock、File、SendMail。new 的使用方法如下︰

+
objectName = new objectType ( param1 [,param2] ...[,paramN] )
+
+

你也可以使用物件的初始化子來建立物件，如同 物件初始化子的使用 所述。

+

參閱 Core JavaScript 參考中的 new 運算子 頁面，以取得更多資訊。

this

+

使用 this 關鍵字可參考目前所使用的物件。一般而言，this 是在方法裡、並參考了呼叫這個方法的物件。this 的使用方法如下︰

+
this[propertyName]
+
+

範例 1
+假設有一個稱為 validate 的函數可驗證某一物件的 value 屬性，並以物件和上限、下限值作為參數︰

+
function validate(obj, lowval, hival) {
+   if ((obj.value < lowval) || (obj.value > hival))
+      alert("Invalid Value!")
+}
+
+

你可以在每一個表單元素的 onChange 事件處理器中呼叫 validate，並使用 this 傳送表單元素，如下範例︰

+
<B>Enter a number between 18 and 99:</B>
+<INPUT TYPE = "text" NAME = "age" SIZE = 3
+   onChange="validate(this, 18, 99)">
+
+

範例 2
+結合 form 屬性時，this 也可以參考目前所使用的物件的親表單。在以下範例中，表單 myForm 內含一個 Text 物件和按鈕。當使用者點擊按鈕，Text 物件的值便設定為表單的名稱。按鈕的 onClick 事件處理器使用 this.form 來參考親表單 myForm。

+
<FORM NAME="myForm">
+Form name:<INPUT TYPE="text" NAME="text1" VALUE="Beluga">
+<P>
+<INPUT NAME="button1" TYPE="button" VALUE="Show Form Name"
+   onClick="this.form.text1.value=this.form.name">
+</FORM>
+
+

typeof

+

typeof 運算子可按下列兩種方式來使用︰

+
1. typeof operand
+2. typeof (operand)
+
+

typeof 運算子可返回字串，這些字串指出未求值的運算元的類型。operand 是指字串、變數、關鍵字、物件，其類型可被 typeof 返回。括弧並非必要的。

+

假設你定義了以下變數︰

+
var myFun = new Function("5+2")
+var shape="round"
+var size=1
+var today=new Date()
+
+

typeof 運算子對以下變數返回以下結果︰

+
typeof myFun 返回的是 function
+typeof shape 返回的是 string
+typeof size 返回的是 number
+typeof today 返回的是 object
+typeof dontExist 返回的是 undefined
+
+

對於 true 和 null 關鍵字而言，typeof 運算子返回以下結果︰

+
typeof true 返回的是 boolean
+typeof null 返回的是 object
+
+

對於數字或字串而言，typeof 運算子返回以下結果︰

+
typeof 62 返回的是 number
+typeof 'Hello world' 返回的是 string
+
+

對於屬性值而言，typeof 運算子返回屬性裡的值的類型︰

+
typeof document.lastModified 返回的是 string
+typeof window.length 返回的是 number
+typeof Math.LN2 返回的是 number
+
+

對於方法和函數而言，typeof 運算子返回以下結果︰

+
typeof blur 返回的是 function
+typeof eval 返回的是 function
+typeof parseInt 返回的是 function
+typeof shape.split 返回的是 function
+
+

對於預先定義的物件而言，typeof 運算子返回以下結果︰

+
typeof Date 返回的是 function
+typeof Function 返回的是 function
+typeof Math 返回的是 function
+typeof Option 返回的是 function
+typeof String 返回的是 function
+
+

void

+

void 運算子可按下列兩種方式來使用︰

+
1. void (expression)
+2. void expression
+
+

void 運算子表示表達式求值之後不必把值返回。expression 是指可供求值的 JavaScript 表達式。表達式兩邊的圓括號並不是必要的，但圓括號的使用對閱讀有利。

+

你可以把 void 運算子使用於當作超連結的表達式。表達式會被求值，但不會被載入而取代目前的文件。

+

以下代碼建立了什麼也不做的超連結。當使用者點擊連結時，void(0) 的求值為 undefined，這在 JavaScript 中並沒有作用。

+
<A HREF="javascript:void(0)">Click here to do nothing</A>
+
+

以下代碼建立了超連結，當使用者點擊時，就傳送表單。

+
<A HREF="javascript:void(document.form.submit())">
+Click here to submit</A>
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:運算子:字串運算子", "Core_JavaScript_1.5_教學:正規表達式的建立") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/Special_Operators", "es": "es/Gu\u00eda_JavaScript_1.5/Operadores/Operadores_especiales", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_sp\u00e9ciaux", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/Special_Operators", "ko": "ko/Core_JavaScript_1.5_Guide/Operators/Special_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operatory_specjalne" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e6fc14473511cf01e7062dfb7751f49d/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e6fc14473511cf01e7062dfb7751f49d/index.html new file mode 100644 index 0000000000..5c6eb2fb16 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e6fc14473511cf01e7062dfb7751f49d/index.html @@ -0,0 +1,30 @@ +--- +title: 運算子 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子 +translation_of: Web/JavaScript/Guide/Expressions_and_Operators +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators +--- +

 

+

運算子

+

JavaScript 有以下幾種運算子。本節說明運算子，且包含有關運算子優先順序的資訊。

+ +

JavaScript 有一元和二元兩種運算子，以及特殊的三元運算子，也就是條件運算子。二元運算子需要兩個運算元，一個在運算子之前，一個在運算子之後︰

+
operand1 operator operand2
+
+

例如，3+4 或 x*y。

+

一元運算子需要一個運算元，可以運算子之前或之後︰

+
operator operand
+
+

或

+
operand operator
+
+

例如，x++ 或 ++x。

+

運算子的優先順序

+

按照相關的討論，本表採用由高到低的優先順序。

+ +
運算子類型 單獨的運算子
成員 .  []
呼叫 / 建立實體 ()  new
反轉 / 遞增 !  ~  -  +  ++  --  typeof  void  delete
乘法 / 除法 *  /  %
加法 / 減法 +  -
位元位移 <<  >>  >>>
關係 <  <=  >  >=  in  instanceof
等價 ==  !=  ===  !==
位元 AND &
位元 XOR ^
位元 OR |
邏輯 AND &&
邏輯 OR ||
條件 ?:
代入 =  +=  -=  *=  /=  %=  <<=  >>=  >>>=  &=  ^=  |=
逗號 ,
+

表 3.1: 運算子的優先順序

+

有關本表的詳細版本，且附有關於運算子的完整細節，請參閱 參考的章節。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:表達式", "Core_JavaScript_1.5_教學:運算子:代入運算子") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators", "es": "es/Gu\u00eda_JavaScript_1.5/Operadores", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs", "ja": "ja/Core_JavaScript_1.5_Guide/Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e70c1f2655520c542321ddbdb2c4f28d/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e70c1f2655520c542321ddbdb2c4f28d/index.html new file mode 100644 index 0000000000..31b103c23f --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e70c1f2655520c542321ddbdb2c4f28d/index.html @@ -0,0 +1,65 @@ +--- +title: 代入運算子 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/代入運算子 +translation_of: Web/JavaScript/Guide/Expressions_and_Operators +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Comparison_Operators +--- +

 

+

代入運算子

+

代入運算子根據右邊運算元的值，把值代入給左邊運算元的值。最基本的代入運算子是等號 (=)，他會把右邊運算元的值代入給左邊運算元的值。也就是說，x = y 就是把 y 的值代入給 x。

+

其餘的代入運算子只是標準運算子的簡記法，如下表所示。

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
運算子的簡記法意義
x += yx = x + y
x -= yx = x - y
x *= yx = x * y
x /= yx = x / y
x %= yx = x % y
x <<= yx = x << y
x >>= yx = x >> y
x >>>= yx = x >>> y
x &= yx = x & y
x ^= yx = x ^ y
x |= yx = x | y
+

表 3.2: 代入運算子

+

{{ PreviousNext("Core_JavaScript_1.5_教學:運算子", "Core_JavaScript_1.5_教學:運算子:比較運算子") }}

+

 

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_eb65eb8f4e6b3c16f08b95149183cfb8/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_eb65eb8f4e6b3c16f08b95149183cfb8/index.html new file mode 100644 index 0000000000..0589aefd73 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_eb65eb8f4e6b3c16f08b95149183cfb8/index.html @@ -0,0 +1,12 @@ +--- +title: 字串運算子 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/字串運算子 +translation_of: Web/JavaScript/Guide/Expressions_and_Operators +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/String_Operators +--- +

 

+

字串運算子

+

除了比較運算子可以用於字串值以外，連結運算子 (+) 把兩個字串值串連在一起，返回另一個以兩個運算元字串連結的字串。例如，"my " + "string" 返回 "my string" 字串。

+

代入運算子 += 的簡記法也可用於連結字串。例如，如果變數 mystring 內有 "alpha" 值，mystring += "bet" 表達式的求值為“alphabet”，並把這個值代入到 mystring。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:運算子:邏輯運算子", "Core_JavaScript_1.5_教學:運算子:特殊運算子") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/String_Operators", "es": "es/Gu\u00eda_JavaScript_1.5/Operadores/Operadores_de_cadenas_de_caracteres_(string)", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_li\u00e9s_aux_cha\u00eenes", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/String_Operators", "ko": "ko/Core_JavaScript_1.5_Guide/Operators/String_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operacje_na_\u0142a\u0144cuchach" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/functions/index.html b/files/zh-tw/conflicting/web/javascript/guide/functions/index.html new file mode 100644 index 0000000000..8999a04084 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/functions/index.html @@ -0,0 +1,34 @@ +--- +title: 函數的呼叫 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的呼叫 +translation_of: Web/JavaScript/Guide/Functions +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Calling_Functions +--- +

 

+
+

函數的呼叫

+

定義函數並不會執行函數。函數的定義只是簡單的給函數命名，並指定當函數被呼叫的時候要做些什麼。函數的呼叫會以指定的參數真正的執行指定的動作。例如，如果你定義了函數 square，你可以如下呼叫。

+
square(5)
+
+

上面的語句以 5 為參數呼叫函數。函數執行他的語句，並返回 25 的值。

+

函數的參數並不限於字串和數字。你也可以傳遞一整個物件給函數。show_props 函數（定義在 物件和屬性）即是接收一個物件作為參數的函數的範例。

+

函數甚至可以遞歸循環，也就是他可以呼叫他自己。例如，這裡有個計算階乘的函數︰

+
function factorial(n) {
+   if ((n == 0) || (n == 1))
+      return 1;
+   else {
+      var result = (n * factorial(n-1) );
+      return result;
+   }
+}
+
+

你可以計算一到五的階乘如下︰

+
a=factorial(1); // 返回 1
+b=factorial(2); // 返回 2
+c=factorial(3); // 返回 6
+d=factorial(4); // 返回 24
+e=factorial(5); // 返回 120
+
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:函數的定義", "Core_JavaScript_1.5_教學:arguments_物件的使用") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Calling_Functions", "fr": "fr/Guide_JavaScript_1.5/Appel_de_fonctions", "ja": "ja/Core_JavaScript_1.5_Guide/Calling_Functions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Wywo\u0142anie_funkcji" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/functions_536f6bf46bbdf38cc1a0b28ca1bc41b9/index.html b/files/zh-tw/conflicting/web/javascript/guide/functions_536f6bf46bbdf38cc1a0b28ca1bc41b9/index.html new file mode 100644 index 0000000000..0b44186a97 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/functions_536f6bf46bbdf38cc1a0b28ca1bc41b9/index.html @@ -0,0 +1,36 @@ +--- +title: Number 和 String 函數 +slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/Number_和_String_函數 +translation_of: Web/JavaScript/Guide/Functions +translation_of_original: >- + Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions/parseInt_and_parseFloat_Functions +--- +

Number 和 String 函數

+
+

Number 和 String 函數讓你把物件轉換為數字或字串。這些函數的語句是︰

+
var objRef=Number(objRef);
+var objRef=String(objRef);
+
+

此處的 objRef 就是物件的參考。

+

以下的範例把 Date 物件轉換為可讀的字串。

+
var D = new Date (430054663215);
+// 返回以下字串
+// "Thu Aug 18 04:37:43 GMT-0700 (Pacific Daylight Time) 1983"
+var x = String(D);
+
+
+

 

+

以下範例把 String 物件轉換為 Number 物件。

+
var str="12";
+var num=Number(str);
+
+

你可以使用 DOM 的方法 write() 和 JavaScript 的 typeof 運算子來檢驗。

+
var str="12";
+document.write(typeof str);
+document.write("<br/>");
+var num=Number(str);
+document.write(typeof num);
+
+

 {{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的函數:parseInt_和_parseFloat_函數", "Core_JavaScript_1.5_教學:預先定義的函數:escape_和_unescape_函數") }}

+

{{ languages( {"en": "en/Core_JavaScript_1.5_Guide/Predefined_Functions/Number_and_String_Functions", "es": "es/Gu\u00eda_JavaScript_1.5/Funciones_predefinidas/Funciones_Number_y_String", "fr": "fr/Guide_JavaScript_1.5/Fonctions_pr\u00e9d\u00e9finies/Les_fonctions_Number_et_String", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Functions/Number_and_String_Functions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Funkcje_predefiniowane/Funkcje_Number_i_String" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/functions_587eb671a310bac0771e73a91b0abe6d/index.html b/files/zh-tw/conflicting/web/javascript/guide/functions_587eb671a310bac0771e73a91b0abe6d/index.html new file mode 100644 index 0000000000..b44b292eb8 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/functions_587eb671a310bac0771e73a91b0abe6d/index.html @@ -0,0 +1,15 @@ +--- +title: 預先定義的函數 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數 +translation_of: Web/JavaScript/Guide/Functions +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions +--- +

 

+
+

預先定義的函數

+

JavaScript 有一些最頂層的已預先定義的函數︰

+ +
+

{{ PreviousNext("Core_JavaScript_1.5_教學:arguments_物件的使用", "Core_JavaScript_1.5_教學:預先定義的函數:eval_函數") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Predefined_Functions", "fr": "fr/Guide_JavaScript_1.5/Fonctions_pr\u00e9d\u00e9finies", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Functions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Funkcje_predefiniowane" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/functions_925b2d10050621507a9c990cb803dcca/index.html b/files/zh-tw/conflicting/web/javascript/guide/functions_925b2d10050621507a9c990cb803dcca/index.html new file mode 100644 index 0000000000..d2ea7c4a46 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/functions_925b2d10050621507a9c990cb803dcca/index.html @@ -0,0 +1,26 @@ +--- +title: isNaN 函數 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isNaN_函數 +translation_of: Web/JavaScript/Guide/Functions +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions/isNaN_Function +--- +

 

+
+

isNaN 函數

+

isNaN 函數對參數求值，來判斷是不是〝NaN〞（不是數字，not a number）。isNaN 的語句如下︰

+
isNaN(testValue)
+
+

此處的 testValue 就是你想要求值的值。

+

parseFloat 和 parseInt 函數會在求出來的值不是數字的時候返回〝NaN〞。如果傳入的是〝NaN〞，isNaN 返回 true，否則為 false。

+

以下的代碼會對 floatValue 求值，來判斷這是不是數字，然後呼叫相應的程序︰

+
floatValue=parseFloat(toFloat)
+
+if (isNaN(floatValue)) {
+   notFloat()
+} else {
+   isFloat()
+}
+
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的函數:isFinite_函數", "Core_JavaScript_1.5_教學:預先定義的函數:parseInt_和_parseFloat_函數") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Predefined_Functions/isNaN_Function", "fr": "fr/Guide_JavaScript_1.5/Fonctions_pr\u00e9d\u00e9finies/La_fonction_isNaN", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isNaN_Function", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Funkcje_predefiniowane/Funkcja_isNaN" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/functions_b2cd05cbfe188215dc2e3f972d293ed6/index.html b/files/zh-tw/conflicting/web/javascript/guide/functions_b2cd05cbfe188215dc2e3f972d293ed6/index.html new file mode 100644 index 0000000000..db213a465e --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/functions_b2cd05cbfe188215dc2e3f972d293ed6/index.html @@ -0,0 +1,24 @@ +--- +title: isFinite 函數 +slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isFinite_函數 +translation_of: Web/JavaScript/Guide/Functions +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions/isFinite_Function +--- +

 

+
+

isFinite 函數

+

isFinite 函數會對參數求值，來判斷是否是有限的數字。isFinite 的語法如下︰

+
isFinite(number)
+
+

此處的 number 就是要求值的數字。

+

如果參數是 NaN、正無限大、負無限大，這個方法就會返回 false，否則就會返回 true。

+

以下的代碼會檢查客戶端的輸入，來判斷是否是有限的數字。

+
if(isFinite(ClientInput))
+{
+   /* 適當的處理 */
+}
+
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的函數:eval_函數", "Core_JavaScript_1.5_教學:預先定義的函數:isNaN_函數") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Predefined_Functions/isFinite_Function", "fr": "fr/Guide_JavaScript_1.5/Fonctions_pr\u00e9d\u00e9finies/La_fonction_isFinite", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isFinite_Function", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Funkcje_predefiniowane/Funkcja_isFinite" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/functions_ceaa4b2a55bb67388c2728af1ff890f5/index.html b/files/zh-tw/conflicting/web/javascript/guide/functions_ceaa4b2a55bb67388c2728af1ff890f5/index.html new file mode 100644 index 0000000000..0533e2d1a4 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/functions_ceaa4b2a55bb67388c2728af1ff890f5/index.html @@ -0,0 +1,21 @@ +--- +title: escape 和 unescape 函數 +slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/escape_和_unescape_函數 +translation_of: Web/JavaScript/Guide/Functions +translation_of_original: >- + Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions/escape_and_unescape_Functions +--- +

 

+
+

escape 和 unescape 函數

+

escape 和 unescape 函數可讓你把字串編碼或解碼。escape 函數會返回以 ISO Latin 字元集來表示參數的十六進制編碼。unescape 函數會對指定的十六進制編碼值返回 ASCII 字串。

+

這些函數的語句是︰

+
escape(string)
+unescape(string)
+
+

這些函數主要是在伺服端的 JavaScript 用來編碼或解碼 URL 裡的名稱和值的配對。

+

escape 和 unescape 函數在非 ASCII 字元下無法正確運作，也已被廢棄。在 JavaScript 1.5 及其後版本中，可以改用 encodeURI、decodeURI、encodeURIComponent、decodeURIComponent。

+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的函數:Number_和_String_函數", "Core_JavaScript_1.5_教學:閉鎖的運用") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Predefined_Functions/escape_and_unescape_Functions", "es": "es/Gu\u00eda_JavaScript_1.5/Funciones_predefinidas/Funciones_escape_y_unescape", "fr": "fr/Guide_JavaScript_1.5/Fonctions_pr\u00e9d\u00e9finies/Les_fonctions_escape_et_unescape", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Functions/escape_and_unescape_Functions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Funkcje_predefiniowane/Funkcje_escape_i_unescape" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/functions_effb9b1bcc102a5f6df7f1785ce89033/index.html b/files/zh-tw/conflicting/web/javascript/guide/functions_effb9b1bcc102a5f6df7f1785ce89033/index.html new file mode 100644 index 0000000000..fb257f891c --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/functions_effb9b1bcc102a5f6df7f1785ce89033/index.html @@ -0,0 +1,17 @@ +--- +title: eval 函數 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/eval_函數 +translation_of: Web/JavaScript/Guide/Functions +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions/eval_Function +--- +

 

+
+

eval 函數

+

eval 函數無須參考實際的物件，就可以對 JavaScript 代碼的字串直接求值。eval 語法如下︰

+
eval(expr)
+
+

此處 expr 就是要被求值的字串。

+

如果字串表示成表達式，eval 就會對表達式求值。如果參數（expr）表示成一個以上的 JavaScript 語句，eval 就會對語句求值。eval 代碼的作用域等同於呼叫端代碼的作用域。不要用 eval 來對算術表達式求值，JavaScript 會自動的對算術表達式來求值。

+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的函數", "Core_JavaScript_1.5_教學:預先定義的函數:isFinite_函數") }}

+

{{ languages( {"en": "en/Core_JavaScript_1.5_Guide/Predefined_Functions/eval_Function", "fr": "fr/Guide_JavaScript_1.5/Fonctions_pr\u00e9d\u00e9finies/La_fonction_eval", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Functions/eval_Function", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Funkcje_predefiniowane/Funkcja_eval" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types/index.html b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types/index.html new file mode 100644 index 0000000000..407d484a34 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types/index.html @@ -0,0 +1,33 @@ +--- +title: Unicode +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/Unicode +translation_of: Web/JavaScript/Guide/Grammar_and_types +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Unicode +--- +

 

+

Unicode

+

Unicode 是一種全球通用的字元編碼標準，用於交換並顯示主要的書寫語言。Unicode 涵括了美國、歐洲、中東、非洲、印度、亞洲以及太平洋地區的語系，但不包括歷史手稿和專門符號。Unicode 可用於交換、處理並顯示多國語系的文書，除了一般的專門符號和數學符號以外。Unicode 期望能夠解決對於不同國家的字元標準的多國語言處理等國際化問題。但目前並未完整支援所有的現代或古代的文字。

+

Unicode 字元集可以使用所有已知編碼的字元。Unicode 是繼 ASCII（American Standard Code for Information Interchange；美國資訊交換標準碼）字元集之後的字元集模型。Unicode 為每一個字元分配一個數字和名稱。字元編碼規範了字元的識別資訊及其數值（編碼位置），但未指明數值的位元表示法。16 位元數值（編碼值）是以十六進制數並加上前綴 U 來定義的，例如，U+0041 表示 A。這個數值的專用名稱是 LATIN CAPITAL LETTER A。

+

JavaScript 1.3 以前的版本並不支援 Unicode。

+

Unicode 與 ASCII 和 ISO 的相容性

+

Unicode 完全相容於國際標準 ISO/IEC 10646-1; 1993，屬於 ISO 10646 的子集。

+

若干編碼標準（包括 UTF-8、UTF-16、ISO UCS-2）是用來把 Unicode 表示為實際的位元。

+

Unicode 的 UTF-8 編碼可相容於 ASCII 字元，並已有許多程式支援。並且把前 128 個 Unicode 字元對應至 ASCII 字元，而擁有相同的位元組內碼。從 U+0020 到 U+007E 的 Unicode 字元完全等價於從 0x20 到 0x7E 的 ASCII 字元。與 ASCII 不同之處在於，還支援了使用 7 位元字元集的拉丁字母，UTF-8 為各個字元使用 1 到 4 個位元組（原作“octet”，即位元組、8 位元），借此容納數以百萬計的字元。另一種編碼標準，UTF-16，使用 2 個位元組表示 Unicode 字元。藉由 4 位元組的跳脫序列，可讓 UTF-16 表示 Unicode 的全部範圍。ISO UCS-2（Universal Character Set）使用 2 個位元組。

+

JavaScript 和 Navigator 支援 UTF-8/Unicode，意味著你只需在 JavaScript 程式中加上特別的技術，就可以使用非拉丁文、國際性、地域性的文字。Unicode 為多國文字的編碼提供了標準方法。由於 Unicode 的 UTF-8 編碼可相容於 ASCII，程式可以使用 ASCII 字元。你可以在 JavaScript 的註解、字串的字面表達、識別子、正則表達式中使用非 ASCII 的 Unicode 字元。

+

Unicode 的跳脫序列

+

你可以在字串的字面表達、正則表達式、識別子中使用 Unicode 跳脫序列。跳脫序列是由 6 個 ASCII 字元所構成︰\u 和 4 個十六進制數。例如，\u00A9 表示版權符號。在 JavaScript 中，所有的 Unicode 跳脫序列都會被解譯為單一字元。

+

以下代碼返回版權符號和字串 "Netscape Communications"。

+
x="\u00A9 Netscape Communications"
+

下表列出最常用的特殊字元及其 Unicode 值。

+ +
分類 Unicode 值 名稱 格式名稱
空白的值 \u0009 Tab <TAB>
  \u000B Vertical Tab <VT>
  \u000C Form Feed <FF>
  \u0020 Space <SP>
行終止的值 \u000A Line Feed <LF>
  \u000D Carriage Return <CR>
額外的 Unicode 跳脫序列的值 \u0008 Backspace <BS>
  \u0009 Horizontal Tab <HT>
  \u0022 Double Quote "
  \u0027 Single Quote '
  \u005C Backslash \
+

表 2.2: 特殊字元的 Unicode 值

+

JavaScript 使用的 Unicode 跳脫序列與 Java 不同。在 JavaScript 中，跳脫序列一開始不會被解譯為特殊字元。例如，字串裡的換行的跳脫序列，在給函數解譯以前，並不會使字串換行。JavaScript 會忽略所有使用在註解裡的跳脫序列。在 Java 中，如果跳脫序列使用在單行註解裡，就會被解譯為 Unicode 字元。對於字串的字面表達而言，Java 編譯器將首先解譯跳脫序列。例如，如果在 Java 中使用換行的跳脫字元（即 \u000A），就會使字串的字面表達換行。這在 Java 中會引起錯誤，因為換行不可以用在字串的字面表達。你必須給字串的字面表達的換行替換成 \n。在 JavaScript 中，也同樣使用 \n 作為跳脫序列。

+

在 JavaScript 檔案裡的 Unicode 字元

+

Gecko 的早期版本假設從 XUL 載入的 JavaScript 檔案使用的是 Latin-1 字元編碼。從 Gecko 1.8 開始，就從 XUL 檔案的編碼來推斷字元編碼。請參閱 在 XUL JavaScript 中的國際化字元 取得進一步資訊。

+

使用 Unicode 顯示字元

+

你可以使用 Unicode 顯示不同語言或專門符號的字元。為使字元正確的顯示，像 Mozilla Firefox 或 Netscape 這類客戶端也需要支援 Unicode。此外，客戶端也必須有可用的 Unicode 字型，客戶端平台也必須支援 Unicode。通常，Unicode 字型並不會顯示所有的 Unicode 字元。部分平台，如 Windows 95，只提供對 Unicode 的一部分支援。

+

要接收非 ASCII 字元的輸入，客戶端需要把傳送進來的輸入視為 Unicode。使用標準的增強式鍵盤，客戶端無法簡單的輸入由 Unicode 支援的額外字元。在某些時候，使用 Unicode 跳脫序列輸入 Unicode 字元是唯一的輸入方法。

+

有關 Unicode 的詳細資訊，參閱 Unicode 首頁 以及 1996 年由 Addison-Wesley 出版的 Unicode Standard, Version 2.0。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:字面表達", "Core_JavaScript_1.5_教學:表達式") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Unicode", "es": "es/Gu\u00eda_JavaScript_1.5/Unicode", "fr": "fr/Guide_JavaScript_1.5/Unicode", "ja": "ja/Core_JavaScript_1.5_Guide/Unicode", "ko": "ko/Core_JavaScript_1.5_Guide/Unicode", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Unicode" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_5c6f30ff8e011c45a011b9c8f3b5bcea/index.html b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_5c6f30ff8e011c45a011b9c8f3b5bcea/index.html new file mode 100644 index 0000000000..bea630e438 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_5c6f30ff8e011c45a011b9c8f3b5bcea/index.html @@ -0,0 +1,30 @@ +--- +title: 值 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/值 +translation_of: Web/JavaScript/Guide/Grammar_and_types +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Values +--- +

 

+

值

+

JavaScript 識別下列值的類型︰

+ +

這是相對來說比較小的一組值的類型，也就是資料類型，可讓你的應用程式發揮出有用的功能。整數和實數之間並沒有明顯的區別。在 JavaScript 中也沒有明確的日期資料類型。不過你還是可以使用 Date 物件及其方法來處理日期。物件 和 函數 也是語言的基礎元素。你可以把物件想成已命名的值的容器，而函數是使程式可以執行的處理程序。

+

資料類型的轉換

+

JavaScript 是動態類型的語言。這表示當你宣告變數時，你不必指定變數的資料類型，而且資料類型會在 Script 執行過程中按需要自動的轉換。所以，舉例如下，你可以如下定義變數︰

+
var answer = 42;
+
+

然後，你可以把字串值代入給值，如下︰

+
answer = "Thanks for all the fish...";
+
+

因為 JavaScript 的類型是動態的，這個代入的代碼不會引起錯誤訊息。

+

在含有數值和字串值並介以 + 運算子的表達式中，JavaScript 把數值轉換為字串。例如，考慮下面的語句︰

+
x = "The answer is " + 42 // 返回 "The answer is 42"
+y = 42 + " is the answer" // 返回 "42 is the answer"
+
+

在含有其他運算子的語句裡，JavaScript 不會把數值轉換為字串。例如︰

+
"37" - 7 // 返回 30
+"37" + 7 // 返回 "377"
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:JavaScript_概要", "Core_JavaScript_1.5_教學:變數") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Values", "es": "es/Gu\u00eda_JavaScript_1.5/Valores", "fr": "fr/Guide_JavaScript_1.5/Valeurs", "ja": "ja/Core_JavaScript_1.5_Guide/Values", "ko": "ko/Core_JavaScript_1.5_Guide/Values", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Warto\u015bci", "zh-cn": "cn/Core_JavaScript_1.5_Guide/Values" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_d57082c2207b466127d8dc34a980addf/index.html b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_d57082c2207b466127d8dc34a980addf/index.html new file mode 100644 index 0000000000..0c66b79359 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_d57082c2207b466127d8dc34a980addf/index.html @@ -0,0 +1,118 @@ +--- +title: 字面表達 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/字面表達 +translation_of: Web/JavaScript/Guide/Grammar_and_types +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Literals +--- +

 

+

字面表達

+

你在 JavaScript 使用字面表達來表示值。這是由你在 Script 中直接寫下的固定值，這些不是變數。本節說明下列各類型的字面表達︰

+ +

陣列的字面表達

+

陣列的字面表達是以零個以上的表達式所構成的列表，列表的每一項代表陣列的元素，以方括號 ([]) 包夾。當你使用陣列的字面表達建立陣列時，陣列會以指定的值作為元素來初始化，也會以指定的參數個數來設定陣列的長度。

+

以下範例以三個元素和長度建立 coffees 陣列︰

+
var coffees = ["French Roast", "Colombian", "Kona"];
+
+

附註: 陣列的字面表達是物件初始化子的一種類型。參閱 物件初始化子的使用。

+

如果在頂層 Script 裡使用字面表達建立陣列，每一次對含有陣列的字面表達的表達式求值時，JavaScript 就會解譯這些陣列。此外，每一次呼叫函數時，在函數中使用的字面表達就會被建立。

+

陣列的字面表達也是 Array 物件。參閱 Array 物件 取得有關 Array 物件的細節。

+

陣列的字面表達的額外的逗號

+

你不必在陣列的字面表達中指定所有的元素。如果你放上兩個連續的逗號，就會為未指定的元素預留空間來建立陣列。以下範例建立 fish 陣列︰

+
var fish = ["Lion", , "Angel"];
+
+

這個陣列含有兩個附有值的元素和一個空的元素（fish{{ mediawiki.external(0) }} 是“Lion”，fish{{ mediawiki.external(1) }} 是 undefined，fish{{ mediawiki.external(2) }} 是“Angel”）。

+

如果你在元表列表的尾部附帶逗號，這個逗號會被忽略。在下面的範例中，陣列的長度是 3，這裡不存在 myList{{ mediawiki.external(3) }}。所在位於列表裡面的逗號指的都是新的元素。

+
var myList = ['home', , 'school', ];
+
+

在下面的範例中，陣列的長度是 4，myList{{ mediawiki.external(0) }} 和 myList{{ mediawiki.external(2) }} 是空的。

+
var myList = [ , 'home', , 'school'];
+
+

在下面的範例中，陣列的長度是 4，myList{{ mediawiki.external(1) }} 和 myList{{ mediawiki.external(3) }} 是空的。只有最後面的逗號被忽略。

+
var myList = ['home', , 'school', , ];
+

布林的字面表達

+

布林類型有兩種字面表達︰true 和 false。

+

別被原始布林值的 true、false 和 Boolean 物件的 true、false 的值混淆了。Boolean 物件是以原始布林資料類型包裝起來的。參閱 Boolean 物件 取得更多資訊。

整數

+

整數可以表示為十進制、十六進制、八進制。十進制整數的字面表達由一系列不以 0 開頭的數字組成。以 0 開頭的整數的字面表達表示他是八進制，以 0x（或 0X）開頭表示十六進制。十六進制整數可以包含數字 (0-9) 和 a-f 和 A-F 的字母。八進制整數只可以包含 0-7 的數字。

+

八進制整數的字面表達在 ECMA-262 第三版的標準中已不被推薦。JavaScript 1.5 為了向後相容，仍然繼續支援。

+

整數的字面表達的一些範例︰

+
0、117、-345（十進制）
+015、0001、-077（八進制）
+0x1123、0x00111、-0xF1A7（十六進制）
+
+

浮點數的字面表達

+

浮點數的字面表達可分為以下部分︰

+ +

指數部分是以一個“e”或“E”後接數字所組成，可帶正負符號（在前面加上“+”或“-”）。浮點數的字面表達至少必須要有一個數字和一個小數點或“e”（或“E”）。

+

浮點數的字面表達的一些範例有 3.1415、-3.1E12、.1e12、2E-12。

+

表示成更精簡的語法結構是︰

+
[digits][.digits][(E|e)[(+|-)]digits]
+
+

例如︰

+
3.14
+2345.789
+.3333333333333333333
+
+

物件的字面表達

+

物件的字面表達是以零個以上的 屬性名稱-關聯值 的配對所構成，以花括號 ({}) 包夾。你不應該在語句的開始處使用物件的字面表達。這會導致錯誤，或出現非預期的行為，因為 { 會被解譯成區塊的開始處。

+

以下是物件的字面表達的範例。car 物件的第一個元素定義了 myCar 屬性；第二個元素，getCar 屬性，含有函數 (CarTypes("Honda"));；第三個元素，special 屬性，使用了現存的變數（Sales）。

+
var Sales = "Toyota";
+
+function CarTypes(name) {
+  if (name == "Honda")
+     return name;
+  else
+     return "Sorry, we don't sell " + name + ".";
+}
+
+var car = { myCar: "Saturn", getCar: CarTypes("Honda"), special: Sales };
+
+document.write(car.myCar);   // Saturn
+document.write(car.getCar);  // Honda
+document.write(car.special); // Toyota
+
+

此外，你可以使用數值或字串的字面表達作為屬性的名稱，或者嵌入其他的物件。以下是上述的範例。

+
var car = { manyCars: {a: "Saab", b: "Jeep"}, 7: "Mazda" };
+
+document.write(car.manyCars.b); // Jeep
+document.write(car[7]); // Mazda
+
+

請注意︰

+
var foo = {a: "alpha", 2: "two"};
+document.write(foo.a);    // alpha
+document.write(foo[2]);   // two
+//document.write(foo.2);  // 錯誤: 參數列表後面少了 )
+//document.write(foo[a]); // 錯誤: a 尚未定義
+document.write(foo["a"]); // alpha
+document.write(foo["2"]); // two
+

字串的字面表達

+

字串的字面表達是以零個以上的字元所構成，並以雙引號 (") 或單引號 (') 包夾。字串必須以相同的引號包夾，也就是成對的單、雙引號。以下是字串的字面表達的範例︰

+ +

你可以在字串的字面表達的值上呼叫 String 物件的所有方法—JavaScript 會自動的把字串的字面表達轉換成臨時的 String 物件，呼叫方法，然後丟棄臨時的 String 物件。你也可以使用 String.length 屬性︰

+ +

除非你特別使用 String 物件，否則就應該使用字串的字面表達。參閱 String 物件 取得有關 String 物件的細節。

+
在字串中使用特殊字元
+

除了普通的字元以外，你也可以在字串中包含特殊字元，如下範例︰

+
"one line \n another line"
+
+

下表列出了你可以使用於 JavaScript 字串中的特殊字元。

+ +
字元 意義
\b 後退一格
\f 換頁
\n 換行
\r 歸位
\t Tab
\v 垂直 Tab
\' 單引號
\" 雙引號
\\ 反斜線 (\)。
\XXX 使用介於 0 至 377 之間的三個八進制數 XXX 來表示以 Latin-1 編碼的字元。例如，\251 是版權符號的八進制內碼序列。
\xXX 使用介於 00 至 FF 之間的兩個十六進制數 XX 來表示以 Latin-1 編碼的字元。例如，\xA9 是版權符號的十六進制內碼序列。
\uXXXX 使用四個十六進制數 XXXX 來表示 Unicode 字元。例如，\u00A9 是版權符號的 Unicode 內碼序列。參閱 Unicode 的跳脫序列。
+

表 2.1: JavaScript 的特殊字元

+
字元的跳脫
+

對於未列在表 2.1 的字元，加在前面的反斜線將會被忽略，但是這個作法已被建議廢除，應該要避免。

+

你可以在字串裡面的引號前面插入反斜線。這就是引號的跳脫。例如︰

+
var quote = "He read \"The Cremation of Sam McGee\" by R.W. Service.";
+document.write(quote);
+
+

結果會是︰

+
He read "The Cremation of Sam McGee" by R.W. Service.
+
+

要在字串裡包含反斜線，你必須跳脫反斜線字元。例如，要把檔案路徑 c:\temp 代入成字串，方法如下︰

+
var home = "c:\\temp";
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:常數", "Core_JavaScript_1.5_教學:Unicode") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Literals", "es": "es/Gu\u00eda_JavaScript_1.5/Literales", "fr": "fr/Guide_JavaScript_1.5/Constantes_litt\u00e9rales", "ja": "ja/Core_JavaScript_1.5_Guide/Literals", "ko": "ko/Core_JavaScript_1.5_Guide/Literals", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Litera\u0142y", "zh-cn": "cn/Core_JavaScript_1.5_Guide/\u6587\u672c\u5316" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_e5a53691c318855e3342ad91feb78f2e/index.html b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_e5a53691c318855e3342ad91feb78f2e/index.html new file mode 100644 index 0000000000..9eedc7a21a --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_e5a53691c318855e3342ad91feb78f2e/index.html @@ -0,0 +1,28 @@ +--- +title: 常數 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/常數 +translation_of: Web/JavaScript/Guide/Grammar_and_types +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Constants +--- +

 

+

常數

+

你可以使用 const 關鍵字建立唯讀的常數。常數識別子的語法和變數識別子的相同︰以字母或底線開頭，可以包含字母、數值、底線字元。

+
const prefix = '212';
+
+

在 Script 執行時，常數不可以藉由代入或重新宣告來改變值。

+

常數的作用域規則和變數一樣，除了 const 關鍵字即使是全域常數也一直是必要的。如果省略了關鍵字，識別子就會被認定為變數。

+

你不可以在同一個作用域裡，使用和函數或變數的同樣的名稱來宣告常數。例如︰

+
// 這會引起錯誤
+function f() {};
+const f = 5;
+
+// 這也會引起錯誤
+function f() {
+  const g = 5;
+  var g;
+
+  //其他語句
+}
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:變數", "Core_JavaScript_1.5_教學:字面表達") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Constants", "es": "es/Gu\u00eda_JavaScript_1.5/Constantes", "fr": "fr/Guide_JavaScript_1.5/Constantes", "ja": "ja/Core_JavaScript_1.5_Guide/Constants", "ko": "ko/Core_JavaScript_1.5_Guide/Constants", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Sta\u0142e" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_ef6fc79abc28f5eadd6c126341df5e49/index.html b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_ef6fc79abc28f5eadd6c126341df5e49/index.html new file mode 100644 index 0000000000..151736f40c --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_ef6fc79abc28f5eadd6c126341df5e49/index.html @@ -0,0 +1,57 @@ +--- +title: 變數 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/變數 +translation_of: Web/JavaScript/Guide/Grammar_and_types +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Variables +--- +

 

+

變數

+

你會在你的應用程式中使用變數作為值的名稱。變數的名稱稱為識別子，並遵守以下規則。

+

JavaScript 識別子必須以字母、底線 (_)、美金符號 ($) 開頭；之後的字元就可以使用數字 (0-9)。因為 JavaScript 區分大小寫，字母包括從“A”到“Z”的字元（大寫）和從“a”到“z”的字元（小寫）。

+

從 JavaScript 1.5 開始，你可以在識別子中使用 ISO 8859-1 或 Unicode 字母，如 å、ü。你也可以使用表列於 Unicode 跳脫序列 頁面的 \uXXXX 的 Unicode 跳脫序列作為識別子。

+

合規則的名稱例子有 Number_hits、temp99 和 _name。

+

變數的宣告

+

你可以使用兩個方法宣告變數︰

+ +

變數的求值

+

使用 var 語法宣告、且沒有初始值的變數，這個變數的值是 undefined。

+

企圖存取未宣告的變數，將導致 ReferenceError 例外的拋出︰

+
var a;
+print("The value of a is " + a); // 輸出 "a 的值是 undefined"
+print("The value of b is " + b); // 拋出 ReferenceError 例外
+
+

你可以使用 undefined 確認變數是否有值。在下列代碼中，變數 input 尚未代入值，所以 if 語法求出的是 true。

+
var input;
+if(input === undefined){
+  doThis();
+} else {
+  doThat();
+}
+
+

在用於布林邏輯時，undefined 值會被視為 false。例如，下面的代碼會執行函數 myFunction，因為 myArray 元素尚未定義︰

+
var myArray = new Array();
+if (!myArray[0]) myFunction();
+
+

當你對 null 變數求值時，null 值在用於數值時會被視為 0，而在用於布林邏輯時則視為 false。例如︰

+
var n = null;
+print(n * 32); // 輸出 0
+

變數的作用域

+

當你在任何函數之外宣告變數時，這個變數就稱為全域變數，因為這個變數可以在整份文件中的任何代碼裡使用。當你在函數之內宣告變數時，這個變數就稱為局域變數，因為這個變數只能在函數之內使用。

+

JavaScript 的 區塊語法 並沒有作用域；在區塊之內的代碼不會是局域的。例如在下面的代碼中，如果 condition 是 false，結果會輸出 0，而不是拋出例外︰

+
if (condition) {
+  var x = 5;
+}
+print(x ? x : 0);
+
+

另一個在 JavaScript 中關於變數的獨特行為是，你可以參考稍後才會宣告的變數，而不會引起例外︰

+
print(x === undefined); // 輸出 "true"
+var x = 3;
+
+

全域變數

+

全域變數其實就是全域物件的屬性。在 Web 頁面中，全域物件是 window，所以你可以使用 window.variable 語法設定並存取全域變數。

+

因此，你可以從另一個視窗或框架，藉由指定視窗或框架的名稱，來存取宣告在視窗或框架裡的全域變數。例如，如果有一個稱為 phoneNumber 的變數是在 FRAMESET 文件中宣告，你可以從名為 parent.phoneNumber 的子框架參考這個變數。

+

參閱

+

JavaScript 的 Sharp 變數

+

{{ PreviousNext("Core_JavaScript_1.5_教學:值", "Core_JavaScript_1.5_教學:常數") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Variables", "es": "es/Gu\u00eda_JavaScript_1.5/Variables", "fr": "fr/Guide_JavaScript_1.5/Variables", "ja": "ja/Core_JavaScript_1.5_Guide/Variables", "ko": "ko/Core_JavaScript_1.5_Guide/Variables", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Zmienne", "zh-cn": "cn/Core_JavaScript_1.5_Guide/\u53d8\u91cf" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/index.html b/files/zh-tw/conflicting/web/javascript/guide/index.html new file mode 100644 index 0000000000..7f8133da58 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/index.html @@ -0,0 +1,452 @@ +--- +title: 陣列的運用 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/陣列的運用 +translation_of: Web/JavaScript/Guide +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Working_with_Arrays +--- +

陣列是值的有序序列。有別於其他的語言，JavaScript 並沒有明確的陣列資料類型。取而代之，提供了 Array 物件，可以直接實體化或使用陣列的字面表達記法。

+ +

Array 物件有以各種方式操作陣列的方法，如合併、反轉、排序。他有一個用來指定陣列長度的屬性。JavaScript 也提供有用的陣列的字面表達語法，用來建立這些物件。

+ +

陣列的建立

+ +

陣列可以使用字面表達語法（通常是首選）或使用 Array 的建構子（也可以稱作函數，兩者行為完全相同）來建立︰

+ +
var colors = ["Red", "Green", "Blue"];
+var colors = new Array("Red", "Green", "Blue");
+var colors = Array("Red", "Green", "Blue");
+
+ +

陣列具有 length 屬性，提供來存取陣列的長度。如果你使用上述其中一個例子來初始化陣列，陣列的長度將會是 3︰

+ +
print(colors.length); // 3
+
+ +

在建立陣列的時候，如果你知道你的陣列的預期長度，你可以給 Array 的建構子傳入長度︰

+ +
var fiveItems = new Array(5);
+
+ +

明確定義長度並不會影響陣列的實際容量；這樣只會影響新陣列的 length 屬性。（陣列本身並沒有小於指定值的索引的屬性。）構建子的變體極少使用到。

+ +

JavaScript 1.7 引入陣列的簡約式作為建立新陣列的捷徑；下面 會討論。

+ +

陣列元素的運用

+ +

你可以透過把值代入給陣列元素的方式儲存陣列。下面是我們的範例 colors 陣列更為完整的實例︰

+ +
var colors = []; // 空陣列
+print(colors.length); // 0
+
+colors[0] = 'Red';
+colors[1] = 'Green';
+colors[2] = 'Blue';
+print(colors.length); // 3
+
+ +

附加元素至陣列的末端的常見習慣是使用 array.length 作為索引︰

+ +
colors[colors.length] = 'Orange';
+
+ +

可以使用 array.push() 方法達到同樣效果︰

+ +
colors.push('Purple');
+
+ +

陣列的元素使用元素的索引來存取。陣列是以 0 開始索引，因此陣列中的第一個元素是 0︰

+ +
var red = colors[0];
+
+ +

可以使用各式各樣的陣列方法來存取陣列的元素。例如，pop() 方法移除並返回陣列的最後一個元素︰

+ +
var lastElement = colors.pop(); /* colors 的最後一個元素也被移除 */
+
+ +

理解 length

+ +

以實作的層級來說，JavaScript 的陣列實際上把元素存放成標準的物件屬性，並使用陣列的索引作為屬性的名稱。length 屬性很特別；他永遠會返回比保存在陣列中的最高索引值再高一的值︰

+ +
var cats = [];
+cats[30] = ['Dusty'];
+print(cats.length); // 31
+
+ +

你也可以把值代入給 length 屬性。寫下小於陣列中已存放的項目的數目，就會截掉其餘的項目；寫下 0 就完全清空陣列︰

+ +
var cats = ['Dusty', 'Misty', 'Twiggy'];
+print(cats.length); // 3
+
+cats.length = 2;
+print(cats); // 輸出 "Dusty,Misty" - Twiggy 被移除了
+
+cats.length = 0;
+print(cats); // 什麼也沒輸出；cats 陣列是空的
+
+ +

迭代整個陣列

+ +

常見的操作就是迭代所有陣列的值，並以同樣方式處理每一個值。做到這一點的最簡單的方式如下︰

+ +
var colors = ['red', 'green', 'blue'];
+for (var i = 0; i < colors.length; i++) {
+  alert(colors[i]);
+}
+
+ +

如果你知道陣列中沒有一個元素會在布林的求值結果中為 false - 如果你的陣列只以 DOM 的結點組成，例如，你可以使用更有效率的習慣︰

+ +
var divs = document.getElementsByTagName('div');
+for (var i = 0, div; div = divs[i]; i++) {
+  /* 以同樣方式處理 div */
+}
+
+ +

這樣可以避免檢查陣列長度的開支，並且確保 div 變數被重新指定到每一次循環的使用中項目，以方便加入。

+ +

 forEach 方法是在 JavaScript 1.6 引入的，提供了另一種迭代陣列的方式︰

+ +
var colors = ['red', 'green', 'blue'];
+colors.forEach(function(color) {
+  alert(color);
+});
+
+ +

傳給 forEach 的函數會在陣列中的每一個項目中執行一次，並把陣列的項目傳給函數作為參數。

+ +

Array 的方法

+ +

Array 物件有以下的方法︰

+ + + +
var a1 = [1, 2, 3];
+var a2 = a1.concat(['a', 'b', 'c']);
+print(a2); // 1,2,3,a,b,c
+
+ + + +
var a = ['Wind', 'Rain', 'Fire'];
+print(a.join(' - ')); // "Wind - Rain - Fire"
+
+ + + +
var a = [1, 2, 3];
+var last = a.pop();
+print(a); // 1,2
+print(last); // 3
+
+ + + +
var a = [1, 2];
+a.push(3);
+print(a); // 1,2,3
+
+ + + +
var a = [1, 2, 3, 4];
+a.reverse();
+print(a); // 4,3,2,1
+
+ + + +
var a = [1, 2, 3];
+var first = a.shift();
+print(a); // 2,3
+print(first); // 警報 1
+
+ + + +
var a1 = [1, 2, 3];
+a1.unshift(4);
+print(a1); // 4,1,2,3
+
+ + + +
var a1 = ['a', 'b', 'c', 'd', 'e'];
+var a2 = a1.slice(1, 4);
+print(a2); // 警報 b,c,d
+
+ + + +
var a = ['a', 'b', 'c', 'd', 'e'];
+var removed = a.splice(1, 3, 'f', 'g', 'h', 'i');
+print(removed); // b,c,d
+print(a); // a,f,g,h,i,e
+
+ + + +
var a = ['Wind', 'Rain', 'Fire'];
+a.sort();
+print(a); // Fire,Rain,Wind
+
+ +

sort 也可以接受 Callback 函數來決定如何排序陣列的內容。這個函數會對兩個值做比較，並返回下列三個值其中之一︰

+ + + +

例如，下面的例子會以字串的最後一個字母來排序︰

+ +
var a = ['Wind', 'Rain', 'Fire'];
+function sortFn(a, b) {
+  var lastA = a[a.length - 1];
+  var lastB = b[b.length - 1];
+  if (lastA < lastB) return -1;
+  if (lastA > lastB) return 1;
+  if (lastA == lastB) return 0;
+}
+a.sort(sortFn);
+print(a); // Wind,Fire,Rain
+
+ +

於 JavaScript 1.6 引入

+ + + +

 

+ +
   var a = ['a', 'b', 'a', 'b', 'a'];
+   alert(a.indexOf('b')); // 警報 1
+   // 現在再試一次，從最後的符合項之後的索引開始
+   alert(a.indexOf('b', 2)); // 警報 3
+   alert(a.indexOf('z')); // 警報 -1，因為找不到 'z'
+
+ +

 

+ + + +

 

+ +
   var a = ['a', 'b', 'c', 'd', 'a', 'b'];
+   alert(a.lastIndexOf('b')); // 警報 5
+   // 現在再試一次，從最後的符合項之前的索引開始
+   alert(a.lastIndexOf('b', 4)); // 警報 1
+   alert(a.lastIndexOf('z')); // 警報 -1
+
+ +

 

+ + + +

 

+ +
   var a = ['a', 'b', 'c'];
+   a.forEach(alert); // 依序警報每一個項目
+
+ +

 

+ + + +

 

+ +
   var a1 = ['a', 'b', 'c'];
+   var a2 = a1.map(function(item) { return item.toUpperCase(); });
+   alert(a2); // 警報 A,B,C
+
+ +

 

+ + + +

 

+ +
   var a1 = ['a', 10, 'b', 20, 'c', 30];
+   var a2 = a1.filter(function(item) { return typeof item == 'number'; });
+   alert(a2); // 警報 10,20,30
+
+ +

 

+ + + +

 

+ +
   function isNumber(value) { return typeof value == 'number'; }
+   var a1 = [1, 2, 3];
+   alert(a1.every(isNumber)); // 警報 true
+   var a2 = [1, '2', 3];
+   alert(a2.every(isNumber)); // 警報 false
+
+ +

 

+ + + +

 

+ +
   function isNumber(value) { return typeof value == 'number'; }
+   var a1 = [1, 2, 3];
+   alert(a1.some(isNumber)); // 警報 true
+   var a2 = [1, '2', 3];
+   alert(a2.some(isNumber)); // 警報 true
+   var a3 = ['1', '2', '3'];
+   alert(a3.some(isNumber)); // 警報 false
+
+ +

 

+ +

上面接受 Callback 的方法又稱為迭代方法，因為他們會以同樣的方式迭代整個陣列。其中第二個選用性的參數稱為 thisObject。如果有提供的話，thisObject 會變成 Callback 函數的本體內部的 this 關鍵字的值。

+ +

實際上 Callback 函數會以三個參數來呼叫。第一個是使用中項目的值，第二個是他的陣列索引，第三個是陣列本身的參考。JavaScript 函數會忽略任何沒有在參數列表中命名的參數，因此提供只接受單一參數的 Callback 函數也很安全，如 alert。

+ +

於 JavaScript 1.8 引入

+ + + +

 

+ +
   var a = [10, 20, 30];
+   var total = a.reduce(function(first, second) { return first + second; }, 0);
+   alert(total) // 警報 60
+
+ +

 

+ + + +

reduce 和 reduceRight 明顯是迭代陣列的方法中最少的。為了把序列降至單一的值，應該把他們用於遞歸合併兩個值的演算法。

+ +

近似陣列的物件的運用

+ +

 某些 JavaScript 物件，如 document.getElementsByTagName 返回的 NodeList，或者在函數本體內部可以利用的 arguments 物件，表面上看來外觀和行為和陣列很類似，但並未共用所有的方法。例如，arguments 物件提供 length 屬性，但並未實作 forEach 方法。

+ +

在 JavaScript 1.6 中引入的通用陣列，為其他類似陣列的物件提供執行 Array 方法的途徑。每一個標準的陣列方法在 Array 物件本身都有相對應的方法；例如︰

+ +
 function alertArguments() {
+   Array.forEach(arguments, function(item) {
+     alert(item);
+   });
+ }
+
+ +

這些通用方法可以在舊版本的 JavaScript 中，使用由 JavaScript 函數物件所提供的 call 方法，以更冗長的形式模擬。

+ +
 Array.prototype.forEach.call(arguments, function(item) {
+   alert(item);
+ });
+
+ +

陣列的通用方法也可以使用在字串上，因為字串提供的對字元循序存取的方式，和陣列的很類似︰

+ +
 Array.forEach("a string", function(char) {
+   alert(char);
+ });
+
+ +

二維陣列

+ +

下面的代碼建立二維陣列。

+ +
var a = [];
+for (i = 0; i < 4; i++) {
+   a[i] = [];
+   for (j = 0; j < 4; j++) {
+      a[i][j] = "[" + i + ", " + j + "]";
+   }
+}
+
+ +

本例以如下的行來建立陣列︰

+ +
行 0: [0,0][0,1][0,2][0,3]
+行 1: [1,0][1,1][1,2][1,3]
+行 2: [2,0][2,1][2,2][2,3]
+行 3: [3,0][3,1][3,2][3,3]
+
+ +

陣列的簡約式

+ +

在 JavaScript 1.7 中引入的陣列簡約式（array comprehension），對於以其他內容為基礎來建構新陣列提供了很有用的捷徑。簡約式通常可以用在 map() 和 filter() 呼叫的地方，或是結合這兩者的方式。

+ +

下面的簡約式接收數字的陣列，並建立每一個數字的雙倍的新陣列。

+ +
var numbers = [1, 2, 3, 4];
+var doubled = [i * 2 for each (i in numbers)];
+alert(doubled); // 警報 2,4,6,8
+
+ +

這等同於下面的 map() 操作︰

+ +
var doubled = numbers.map(function(i) { return i * 2; });
+
+ +

簡約式也可以用於選取符合特定表達式的項目。這是只選取偶數的簡約式︰

+ +
var numbers = [1, 2, 3, 21, 22, 30];
+var evens = [i for each (i in numbers) if (i % 2 == 0)];
+alert(evens); // 警報 2,22,30
+
+ +

filter() 也可以用於同樣的用途︰

+ +
var evens = numbers.filter(function(i) { return i % 2 == 0; });
+
+ +

map() 和 filter() 這類型的操作可以合併至單一的陣列簡約式。這是只篩出偶數的簡約式，然後建立內含雙倍數值的新陣列。

+ +
var numbers = [1, 2, 3, 21, 22, 30];
+var doubledEvens = [i * 2 for each (i in numbers) if (i % 2 == 0)];
+alert(doubledEvens); // 警報 4,44,60
+
+ +

陣列簡約式的方括號導入了默許的作用域區塊。新的變數（如範例中的 i）會被視為已經使用 let 宣告過了。其意義是不能在簡約式的外部使用這些變數。

+ +

輸入到陣列的簡約式本身並不需要是陣列；也可以使用 迭代器和產生器。

+ +

{{ PreviousNext("Core_JavaScript_1.5_教學:繼承", "Core_JavaScript_1.5_教學:迭代器和產生器") }}

+ +

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Working_with_Arrays" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/regular_expressions/index.html b/files/zh-tw/conflicting/web/javascript/guide/regular_expressions/index.html new file mode 100644 index 0000000000..792eec13b9 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/regular_expressions/index.html @@ -0,0 +1,59 @@ +--- +title: 正規表達式的運用 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用 +translation_of: Web/JavaScript/Guide/Regular_Expressions +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Working_with_Regular_Expressions +--- + +

正規表達式的運用

+

RegExp 的 test 和 exec 方法，還有 String 的 match、replace、search、split 方法都有使用到正規表達式。這些方法在 Core JavaScript 參考 中已有詳細說明。

+ +
方法 說明
exec RegExp 的方法，在字串中比對以執行搜尋。他會返回搜尋資訊的陣列。
test RegExp 的方法，在字串中比對以進行測試。他會返回 true 或 false。
match String 的方法，在字串中比對以執行搜尋。他會返回搜尋資訊的陣列，或在比對不出時返回 null。
search String 的方法，在字串中比對以進行測試。他會返回符合比對的索引，或在搜尋失敗時返回 -1。
replace String 的方法，在字串中比對以執行搜尋，並以其他子字串取代符合比對的子字串。
split String 的方法，使用正規表達式或固定的字串，把字串分割為子字串的陣列。
+

表 4.2: 使用了正規表達式的方法

+

當你想知道是否可以在字串裡找出某個模式，可以使用 test 或 search 方法。要更詳細的資訊（不過執行速度也慢）可以使用 exec 或 match 方法。如果你使用 exec 或 match 並且比對成功，這些方法會返回陣列，並更新相關聯的正規表達式物件包括預先定義的 RegExp 的屬性，如果比對失敗，exec 方法返回 null（可轉換為 false）。

+

在以下的範例中，Script 使用了 exec 方法來在字串裡尋找符合的字串。

+
<SCRIPT type="text/javascript">
+  myRe = /d(b+)d/g;
+  myArray = myRe.exec("cdbbdbsbz");
+</SCRIPT>
+
+

如果你不需要存取正規表達式的屬性，另一個建立 myArray 的方式如下 Script︰

+
<SCRIPT type="text/javascript">
+  myArray = /d(b+)d/g.exec("cdbbdbsbz");
+</SCRIPT>
+
+

如果你想要從字串來建構正規表達式，還有其他選擇如下 Script︰

+
<SCRIPT type="text/javascript">
+  myRe = new RegExp ("d(b+)d", "g");
+  myArray = myRe.exec("cdbbdbsbz");
+</SCRIPT>
+
+

這些 Script 比對成功並返回陣列，並更新顯示在下表中的屬性。

+ +
物件 屬性或索引 說明 上面的範例
myArray   比對符合的字串和所有已記憶的子字串。 {{ mediawiki.external('\"dbbd\", \"bb\"') }}
  index 在輸入的字串中比對符合的索引位置。索引從 0 開始。 1
  input 原始的字串。 "cdbbdbsbz"
  {{ mediawiki.external(0) }} 最後一次比對符合的字元。 "dbbd"
myRe lastIndex 下一個符合項的開始處的索引位置。（這個屬性只在正規表達式使用 g 選項時設定，選項的說明在 使用標誌的進階搜尋。） 5
  source 模式的文字。在正規表達式建立時更新，而非執行時。 "d(b+)d"
+

表 4.3: 正規表達式的執行結果。

+

如上第二個範例所示，你可以藉由物件的初始化子使用正規表達式，而無需代入到變數裡。然而，如果你這樣做的話，每一次使用的都會是新的正規表達式。因此，如果你使用這個形式而不代入到變數，之後你就沒辦法存取正規表達式的屬性。舉例來說，假設你有這個 Script︰

+
<SCRIPT type="text/javascript">
+  myRe = /d(b+)d/g;
+  myArray = myRe.exec("cdbbdbsbz");
+  document.writeln("The value of lastIndex is " + myRe.lastIndex);
+</SCRIPT>
+
+

Script 顯示︰

+
The value of lastIndex is 5
+
+

然而，如果你有這個 Script︰

+
<SCRIPT type="text/javascript">
+  myArray = /d(b+)d/g.exec("cdbbdbsbz");
+  document.writeln("The value of lastIndex is " + /d(b+)d/g.lastIndex);
+</SCRIPT>
+
+

他會顯示︰

+
The value of lastIndex is 0
+
+

/d(b+)d/g 在兩個語句中是不同的正規表達式物件，也因此各自對 lastIndex 屬性有著不同的變數。如果你需要存取以物件初始化子所建立的正規表達式的屬性，你應該先把他代入到變數裡。

+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:正規表達式模式的編寫", "Core_JavaScript_1.5_教學:正規表達式的運用:括弧子字串的比對結果的運用") }}

+
+

{{ languages( {"en": "en/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions", "es": "es/Gu\u00eda_JavaScript_1.5/Trabajar_con_expresiones_regulares", "fr": "fr/Guide_JavaScript_1.5/Travailler_avec_les_expressions_rationnelles", "ja": "ja/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Praca_z_wyra\u017ceniami_regularnymi" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/regular_expressions_24eb6498b86da57e7fb5337fd8fa04a6/index.html b/files/zh-tw/conflicting/web/javascript/guide/regular_expressions_24eb6498b86da57e7fb5337fd8fa04a6/index.html new file mode 100644 index 0000000000..8abec68f16 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/regular_expressions_24eb6498b86da57e7fb5337fd8fa04a6/index.html @@ -0,0 +1,44 @@ +--- +title: 括弧子字串的比對結果的運用 +slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 +translation_of: Web/JavaScript/Guide/Regular_Expressions#Using_Parenthesized_Substring_Matches +translation_of_original: >- + Web/JavaScript/Guide/Obsolete_Pages/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches +--- +

括弧子字串的比對結果的運用

+

在正規表達式的模式中包含括弧，對應的子比對結果就會被記憶。舉例來說，/a(b)c/ 比對字元 'abc' 並把 'b' 記憶起來。若要取回括弧子字串的比對結果，就使用 Array 元素 {{ mediawiki.external(1) }}, ..., {{ mediawiki.external('n') }}。

+

括弧子字串的可能數目並沒有限制。返回的陣列保留了所有找到的子字串。以下範例解說如何使用括弧子字串的比對結果。

+

範例 1
+以下 Script 使用 replace 方法來置換字串裡的文字。對於那些替換用的文字，Script 使用了 $1 和 $2 來表示第一個和第二個括弧子字串的比對結果。

+
<script type="text/javascript">
+ re = /(\w+)\s(\w+)/;
+ str = "John Smith";
+ newstr = str.replace(re, "$2, $1");
+ document.write(newstr);
+</script>
+
+

本例輸出 "Smith, John"。

+

範例 2
+附註: 在 getInfo 函數中，exec 方法是以 () 省略記法所呼叫的，這個記法在 Firefox 可以運作，其他瀏覽器則不一定。

+
<html>
+
+<script type="text/javascript">
+ function getInfo(field){
+   var a = /(\w+)\s(\d+)/(field.value);
+   window.alert(a[1] + ", your age is " + a[2]);
+ }
+</script>
+
+Enter your first name and your age, and then press Enter.
+
+<form>
+  <input type="text" name="NameAge" onchange="getInfo(this);">
+</form>
+
+</html>
+
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:正規表達式的運用", "Core_JavaScript_1.5_教學:正規表達式的運用:使用標誌的進階搜尋") }}

+
+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches", "es": "es/Gu\u00eda_JavaScript_1.5/Trabajar_con_expresiones_regulares/Usar_coincidencias_de_subcadenas_parentizadas", "fr": "fr/Guide_JavaScript_1.5/Travailler_avec_les_expressions_rationnelles/Utilisation_des_parenth\u00e8ses_de_capture", "ja": "ja/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Praca_z_wyra\u017ceniami_regularnymi/U\u017cycie_odpowiedniego_znaku" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/regular_expressions_38b32725e0e3217a5542b1b4ee122407/index.html b/files/zh-tw/conflicting/web/javascript/guide/regular_expressions_38b32725e0e3217a5542b1b4ee122407/index.html new file mode 100644 index 0000000000..2dce68e5a9 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/regular_expressions_38b32725e0e3217a5542b1b4ee122407/index.html @@ -0,0 +1,37 @@ +--- +title: 使用標誌的進階搜尋 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 +translation_of: Web/JavaScript/Guide/Regular_Expressions +translation_of_original: >- + Web/JavaScript/Guide/Obsolete_Pages/Working_with_Regular_Expressions/Advanced_Searching_With_Flags +--- +

使用標誌的進階搜尋

+

正規表達式有四個選用的標誌，這些標誌可用於全域或不分大小寫等的搜尋。若要指明為全域搜尋，就使用 g 標誌。若要指明為區分大小寫來搜尋，就使用 i 標誌。若要指明為在多行中搜尋，就使用 m 標誌。若要進行“定點”搜尋，也就是以目標字串的目前位置為開始點來搜尋，那就使用 y 標誌。這些標誌可以單獨或不分順序混合使用，並作為正規表達式的一部分。

+

{{ Fx_minversion_note(3, "Firefox 3 新增了對 y 標誌的支援。如果在目標字串的目前位置上比對不成功，y 標誌就會失敗。") }}

+

要在正規表達式中包含標誌，使用以下語法︰

+
re = /pattern/flags
+re = new RegExp("pattern", ["flags"])
+
+

注意，標誌也是正規表達式整體的一部分。之後就不能新增或移除標誌。

+

舉例來說，re = /\w+\s/g 建立了可尋找 1 個以上的字元並且後接空白的正規表達式，並找出整個字串的組合部分。

+
<script type="text/javascript">
+ re = /\w+\s/g;
+ str = "fee fi fo fum";
+ myArray = str.match(re);
+ document.write(myArray);
+</script>
+
+

顯示出 {{ mediawiki.external('\"fee \", \"fi \", \"fo \"') }}。在這個範例中，你可以取代一整行︰

+
re = /\w+\s/g;
+
+

改用︰

+
re = new RegExp("\\w+\\s", "g");
+
+

得到同樣的結果。

+

m 標誌用來指明輸入的多行字串應該視為多行。如果使用 m 標誌，^ 和 $ 就會在輸入字串裡比對每一行的開始處和結尾處，而非整個字串的開始處和結尾處。

+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:正規表達式的運用:括弧子字串的比對結果的運用", "Core_JavaScript_1.5_教學:正規表達式的運用:正規表達式的範例") }}

+
+

 

+

 

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions/Advanced_Searching_With_Flags", "es": "es/Gu\u00eda_JavaScript_1.5/Trabajar_con_expresiones_regulares/Ejecutar_una_busqueda_global,_discriminar_mayusculas_y_minusculas_y_considerar_entrada_multil\u00ednea", "fr": "fr/Guide_JavaScript_1.5/Travailler_avec_les_expressions_rationnelles/Ex\u00e9cution_de_recherches_globales,_ignorer_la_casse,_utilisation_de_cha\u00eenes_multilignes", "ja": "ja/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions/Advanced_Searching_With_Flags", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Praca_z_wyra\u017ceniami_regularnymi/Globalne_wyszukiwanie,_wielko\u015b\u0107_znak\u00f3w,_wieloliniowe_wej\u015bcie" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide/working_with_objects/index.html b/files/zh-tw/conflicting/web/javascript/guide/working_with_objects/index.html new file mode 100644 index 0000000000..fc10840076 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide/working_with_objects/index.html @@ -0,0 +1,43 @@ +--- +title: 物件和屬性 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件和屬性 +translation_of: Web/JavaScript/Guide/Working_with_Objects +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Objects_and_Properties +--- +

 

+

物件和屬性

+

JavaScript 的物件連結有屬性。你只需要使用簡單的記法就能存取物件的屬性︰

+
objectName.propertyName
+
+

物件的名稱和屬性的名稱兩者都區分大小寫。你可藉由給他代入值來定義屬性。例如，假設有名為 myCar 的物件（假設物件已經存在）。你可以把他的屬性命名為 make、model、year 如下所示︰

+
myCar.make = "Ford";
+myCar.model = "Mustang";
+myCar.year = 1969;
+
+

JavaScript 物件的屬性也可以使用方括號記法來存取或設定。物件有時又稱為關聯陣列，因為每一個屬性都和字串值連繫在一起，且可以用這些字串值來存取屬性。然後，舉例來說，你可以存取 myCar 物件的屬性如下所示︰

+
myCar["make"] = "Ford";
+myCar["model"] = "Mustang";
+myCar["year"] = 1969;
+
+

你也可以使用儲存在變數裡的字串值來存取屬性︰

+
var propertyName = "make";
+myCar[propertyName] = "Ford";
+
+propertyName = "model";
+myCar[propertyName] = "Mustang";
+
+

你也可以使用括弧和 for...in 來迭代物件所有的屬性。為解說這是如何運作的，以下函數用來顯示物件的屬性，當你把物件和物件的名稱作為參數傳給這個函數的時候︰

+
function show_props(obj, obj_name) {
+   var result = "";
+   for (var i in obj)
+      result += obj_name + "." + i + " = " + obj[i] + "\n";
+   return result;
+}
+
+

然後，呼叫函數 show_props(myCar, "myCar") 就會返回以下內容︰

+
myCar.make = Ford
+myCar.model = Mustang
+myCar.year = 1969
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:閉包的運用", "Core_JavaScript_1.5_教學:建立新的物件") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Objects_and_Properties", "es": "es/Gu\u00eda_JavaScript_1.5/Objetos_y_propiedades", "fr": "fr/Guide_JavaScript_1.5/Objets_et_propri\u00e9t\u00e9s", "ja": "ja/Core_JavaScript_1.5_Guide/Objects_and_Properties", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Obiekty_i_w\u0142asno\u015bci" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/guide_dc05b578fe0c2f7d9a89ed82daab4e65/index.html b/files/zh-tw/conflicting/web/javascript/guide_dc05b578fe0c2f7d9a89ed82daab4e65/index.html new file mode 100644 index 0000000000..181d55974e --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/guide_dc05b578fe0c2f7d9a89ed82daab4e65/index.html @@ -0,0 +1,13 @@ +--- +title: 預先定義的核心物件 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件 +translation_of: Web/JavaScript/Guide +translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Core_Objects +--- +

 

+

預先定義的核心物件

+

本節解說在核心 JavaScript 裡預先定義的物件︰

+ +

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:屬性的刪除", "Core_JavaScript_1.5_教學:預先定義的核心物件:Array_物件") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Predefined_Core_Objects", "es": "es/Gu\u00eda_JavaScript_1.5/Objetos_base_predefinidos", "fr": "fr/Guide_JavaScript_1.5/Objets_pr\u00e9d\u00e9finis", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Core_Objects", "ko": "ko/Core_JavaScript_1.5_Guide/Predefined_Core_Objects", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Obiekty_predefiniowane" } ) }}

diff --git a/files/zh-tw/conflicting/web/javascript/reference/global_objects/arraybuffer/index.html b/files/zh-tw/conflicting/web/javascript/reference/global_objects/arraybuffer/index.html new file mode 100644 index 0000000000..263726d7e0 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/reference/global_objects/arraybuffer/index.html @@ -0,0 +1,111 @@ +--- +title: ArrayBuffer.prototype +slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer +translation_of_original: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype +--- +
{{JSRef}}
+ +

The ArrayBuffer.prototype property represents the prototype for the {{jsxref("ArrayBuffer")}} object.

+ +
{{js_property_attributes(0,0,0)}}
+ +

描述

+ +

ArrayBuffer instances inherit from ArrayBuffer.prototype. As with all constructors, you can change the constructor's prototype object to make changes to all ArrayBuffer instances.

+ +

屬性

+ +
+
ArrayBuffer.prototype.constructor
+
Specifies the function that creates an object's prototype. The initial value is the standard built-in ArrayBuffer constructor.
+
{{jsxref("ArrayBuffer.prototype.byteLength")}} {{readonlyInline}}
+
陣列大小，以位元組（byte）計算。此屬性在陣列建立之後就不可能改變了。唯讀。
+
+ +

方法

+ +
+
{{jsxref("ArrayBuffer.prototype.slice()")}}
+
Returns a new ArrayBuffer whose contents are a copy of this ArrayBuffer's bytes from begin, inclusive, up to end, exclusive. If either begin or end is negative, it refers to an index from the end of the array, as opposed to from the beginning.
+
+ +

規範

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES6', '#sec-arraybuffer.prototype', 'ArrayBuffer.prototype')}}{{Spec2('ES6')}}Initial definition.
{{SpecName('ESDraft', '#sec-arraybuffer.prototype', 'ArrayBuffer.prototype')}}{{Spec2('ESDraft')}} 
+ +

瀏覽器相容性

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support7.0{{ CompatGeckoDesktop("2")}}1011.65.1
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support4.0{{CompatVersionUnknown}}{{CompatGeckoMobile("2")}}1011.64.2
+
+ +

參見

+ + diff --git a/files/zh-tw/conflicting/web/javascript/reference/global_objects/date/index.html b/files/zh-tw/conflicting/web/javascript/reference/global_objects/date/index.html new file mode 100644 index 0000000000..5490743ec0 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/reference/global_objects/date/index.html @@ -0,0 +1,246 @@ +--- +title: Date.prototype +slug: Web/JavaScript/Reference/Global_Objects/Date/prototype +tags: + - Date + - JavaScript + - 原型 + - 參考資料 + - 屬性 +translation_of: Web/JavaScript/Reference/Global_Objects/Date +translation_of_original: Web/JavaScript/Reference/Global_Objects/Date/prototype +--- +
{{JSRef}}
+ +

Date.prototype 屬性表示 {{jsxref("Date")}} 建構子的原型。

+ +
{{js_property_attributes(0, 0, 1)}}
+ +

描述

+ +

JavaScript {{jsxref("Date")}} 實體繼承自 Date.prototype。你可以藉由改變建構子的原型物件，來影響所有繼承自 JavaScript {{jsxref("Date")}} 的實體。

+ +

為了千年年份（換個說法，考慮現在已到了 2000 年）的相容性，設定上你應該採用完整的年份。舉例來說，使用 1998 而不是 98 。為了讓你能取得完整的年份資料， Javascript 包含了 {{jsxref("Date.prototype.getFullYear()", "getFullYear()")}} ， {{jsxref("Date.prototype.setFullYear()", "setFullYear()")}} ， {{jsxref("Date.prototype.getUTCFullYear()", "getUTCFullYear()")}} 以及 {{jsxref("Date.prototype.setUTCFullYear()", "setUTCFullYear()")}} 方法。

+ +

自 ECMAScript 6 開始， Date.prototype 物件只是個一般物件，而不是一個 {{jsxref("Date")}} 實體。

+ +

屬性

+ +
+
Date.prototype.constructor
+
回傳一個能建立實體的函數，這是 {{jsxref("Date")}} 預設的建構子。
+
+ +

方法

+ +

Getter

+ +
+
{{jsxref("Date.prototype.getDate()")}}
+
回傳本地時間月份中的日期（1-31）。
+
{{jsxref("Date.prototype.getDay()")}}
+
回傳本地時間星期中的日子（0-6）。
+
{{jsxref("Date.prototype.getFullYear()")}}
+
回傳本地時間的年份（ 以 4 位數表現）。
+
{{jsxref("Date.prototype.getHours()")}}
+
回傳本地時間的小時（0-23）。
+
{{jsxref("Date.prototype.getMilliseconds()")}}
+
回傳本地時間的毫秒數（0-999）。
+
{{jsxref("Date.prototype.getMinutes()")}}
+
回傳本地時間的分鐘數（0-59）。
+
{{jsxref("Date.prototype.getMonth()")}}
+
回傳本地時間的月份（0-11）。
+
{{jsxref("Date.prototype.getSeconds()")}}
+
回傳本地時間的秒數（0-59)。
+
{{jsxref("Date.prototype.getTime()")}}
+
回傳由 1970-01-01 00:00:00 UTC 開始，到代表時間經過的毫秒數（以負值表示 1970 年之前的時間）。
+
{{jsxref("Date.prototype.getTimezoneOffset()")}}
+
回傳本地時差為多少分鐘。
+
{{jsxref("Date.prototype.getUTCDate()")}}
+
回傳標準時間的在月份中的日期（1-31）。
+
{{jsxref("Date.prototype.getUTCDay()")}}
+
回傳標準時間在星期中的日子（0-6）。
+
{{jsxref("Date.prototype.getUTCFullYear()")}}
+
回傳標準時間的年份（ 以 4 位數表現）。
+
{{jsxref("Date.prototype.getUTCHours()")}}
+
回傳標準時間的小時數（0-23）。
+
{{jsxref("Date.prototype.getUTCMilliseconds()")}}
+
回傳標準時間裡的毫秒數（0-999）。
+
{{jsxref("Date.prototype.getUTCMinutes()")}}
+
回傳標準時間的分鐘數（0-59）。
+
{{jsxref("Date.prototype.getUTCMonth()")}}
+
回傳標準時間的月份數（0-11）。
+
{{jsxref("Date.prototype.getUTCSeconds()")}}
+
回傳標準時間的秒數（0-59）。
+
{{jsxref("Date.prototype.getYear()")}} {{deprecated_inline}}
+
回本地時間的年份（通常 2-3 位數）。用 {{jsxref("Date.prototype.getFullYear()", "getFullYear()")}} 取代。
+
+ +

Setter

+ +
+
{{jsxref("Date.prototype.setDate()")}}
+
設定本地時間月份中的日期。
+
{{jsxref("Date.prototype.setFullYear()")}}
+
設定本地時間的完整年份（以 4 位數表達 4 位數年份）。
+
{{jsxref("Date.prototype.setHours()")}}
+
設定本地時間的小時數。
+
{{jsxref("Date.prototype.setMilliseconds()")}}
+
設定本地時間的毫秒數。
+
{{jsxref("Date.prototype.setMinutes()")}}
+
設定本地時間的分鐘數。
+
{{jsxref("Date.prototype.setMonth()")}}
+
設定本地時間的月份。
+
{{jsxref("Date.prototype.setSeconds()")}}
+
設定本地時間的秒數。
+
{{jsxref("Date.prototype.setTime()")}}
+
設定這個 {{jsxref("Date")}} 物件距 1970-01-01 00:00:00 UTC 的毫秒數，允許使用負值表示之前的時間。
+
{{jsxref("Date.prototype.setUTCDate()")}}
+
設定標準時間月份中的日期。
+
{{jsxref("Date.prototype.setUTCFullYear()")}}
+
設定標準時間的完整年份（以 4 位數表示 4 位數年分）。
+
{{jsxref("Date.prototype.setUTCHours()")}}
+
設定標準時間的小時數。
+
{{jsxref("Date.prototype.setUTCMilliseconds()")}}
+
設定標準時間的毫秒數。
+
{{jsxref("Date.prototype.setUTCMinutes()")}}
+
設定標準時間的分鐘數。
+
{{jsxref("Date.prototype.setUTCMonth()")}}
+
設定標準時間的月份數。
+
{{jsxref("Date.prototype.setUTCSeconds()")}}
+
設定標準時間的秒數。
+
{{jsxref("Date.prototype.setYear()")}} {{deprecated_inline}}
+
設定本地時間的年份（使用 2-3 位數）。使用 {{jsxref("Date.prototype.setFullYear()", "setFullYear()")}} 取代。
+
+ +

Conversion getter

+ +
+
{{jsxref("Date.prototype.toDateString()")}}
+
以可閱讀的字串型式，回傳 {{jsxref("Date")}} 的部分資訊。
+
{{jsxref("Date.prototype.toISOString()")}}
+
將日期時間轉換成 ISO 8601 格式的字串回傳。
+
{{jsxref("Date.prototype.toJSON()")}}
+
回傳等義於 {{jsxref("Date")}} 物件使用 {{jsxref("Date.prototype.toISOString()", "toISOString()")}} 方法的結果。特別使用 {{jsxref("JSON.stringify()")}} 處理。
+
{{jsxref("Date.prototype.toGMTString()")}} {{deprecated_inline}}
+
回傳 {{jsxref("Date")}} 以 GMT (UT) 時區基準代表的時間字串。使用 {{jsxref("Date.prototype.toUTCString()", "toUTCString()")}} 方法來取代。
+
{{jsxref("Date.prototype.toLocaleDateString()")}}
+
依照系統的時間地區設定，回傳日期字串。
+
{{jsxref("Date.prototype.toLocaleFormat()")}} {{non-standard_inline}}
+
傳入格式化字串參數，將日期時間轉換成指定格式的字串。
+
{{jsxref("Date.prototype.toLocaleString()")}}
+
回傳依系統的地區設定導出的日期時間字串。覆寫自 {{jsxref("Object.prototype.toLocaleString()")}} 方法。
+
{{jsxref("Date.prototype.toLocaleTimeString()")}}
+
回傳依系統的地區設定導出的時間字串。
+
{{jsxref("Date.prototype.toSource()")}} {{non-standard_inline}}
+
回傳一個建立相同 {{jsxref("Date")}} 物件的程式碼字串；你可以拿這個結果來建立新物件。覆寫自 {{jsxref("Object.prototype.toSource()")}} 方法。
+
{{jsxref("Date.prototype.toString()")}}
+
回傳代表此 {{jsxref("Date")}} 物件的字串。覆寫自 {{jsxref("Object.prototype.toString()")}} 方法。
+
{{jsxref("Date.prototype.toTimeString()")}}
+
以人類可讀的格式，回傳時間部分的字串。
+
{{jsxref("Date.prototype.toUTCString()")}}
+
依 UTC 時區，轉換出時間日期字串。
+
{{jsxref("Date.prototype.valueOf()")}}
+
回傳 {{jsxref("Date")}} 物件的原始數值。覆寫自 {{jsxref("Object.prototype.valueOf()")}} 方法。
+
+ +

規範

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
規範狀態註
{{SpecName('ES1')}}{{Spec2('ES1')}}初步定義。實作在 JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.9.5', 'Date.prototype')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-properties-of-the-date-prototype-object', 'Date.prototype')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-properties-of-the-date-prototype-object', 'Date.prototype')}}{{Spec2('ESDraft')}} 
+ +

瀏覽器相容性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
平台ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本支援{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
一般物件{{CompatUnknown}}{{CompatGeckoDesktop("41")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
平台AndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本支援{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
一般物件{{CompatUnknown}}{{CompatUnknown}}{{CompatGeckoMobile("41")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
diff --git a/files/zh-tw/conflicting/web/javascript/reference/global_objects/function/index.html b/files/zh-tw/conflicting/web/javascript/reference/global_objects/function/index.html new file mode 100644 index 0000000000..718454721b --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/reference/global_objects/function/index.html @@ -0,0 +1,139 @@ +--- +title: Function.prototype +slug: Web/JavaScript/Reference/Global_Objects/Function/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Function +translation_of_original: Web/JavaScript/Reference/Global_Objects/Function/prototype +--- +
{{JSRef}}
+ +

Function.prototype 屬性表示 {{jsxref("Function")}} 的原型物件。

+ +

描述

+ +

{{jsxref("Function")}} objects inherit from Function.prototype.  Function.prototype cannot be modified.

+ +

屬性

+ +
+
{{jsxref("Function.arguments")}} {{deprecated_inline}}
+
An array corresponding to the arguments passed to a function. This is deprecated as property of {{jsxref("Function")}}, use the {{jsxref("Functions/arguments", "arguments")}} object available within the function instead.
+
{{jsxref("Function.arity")}} {{obsolete_inline}}
+
Used to specifiy the number of arguments expected by the function, but has been removed. Use the {{jsxref("Function.length", "length")}} property instead.
+
{{jsxref("Function.caller")}} {{non-standard_inline}}
+
Specifies the function that invoked the currently executing function.
+
{{jsxref("Function.length")}}
+
Specifies the number of arguments expected by the function.
+
{{jsxref("Function.name")}}
+
The name of the function.
+
{{jsxref("Function.displayName")}} {{non-standard_inline}}
+
The display name of the function.
+
Function.prototype.constructor
+
Specifies the function that creates an object's prototype. See {{jsxref("Object.prototype.constructor")}} for more details.
+
+ +

方法

+ +
+
{{jsxref("Function.prototype.apply()")}}
+
Calls a function and sets its this to the provided value, arguments can be passed as an {{jsxref("Array")}} object.
+
{{jsxref("Function.prototype.bind()")}}
+
Creates a new function which, when called, has its this set to the provided value, with a given sequence of arguments preceding any provided when the new function was called.
+
{{jsxref("Function.prototype.call()")}}
+
Calls (executes) a function and sets its this to the provided value, arguments can be passed as they are.
+
{{jsxref("Function.prototype.isGenerator()")}} {{non-standard_inline}}
+
Returns true if the function is a generator; otherwise returns false.
+
{{jsxref("Function.prototype.toSource()")}} {{non-standard_inline}}
+
Returns a string representing the source code of the function. Overrides the {{jsxref("Object.prototype.toSource")}} method.
+
{{jsxref("Function.prototype.toString()")}}
+
Returns a string representing the source code of the function. Overrides the {{jsxref("Object.prototype.toString")}} method.
+
+ +

規範

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition. Implemented in JavaScript 1.1
{{SpecName('ES5.1', '#sec-15.3.5.2', 'Function.prototype')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-function-instances-prototype', 'Function.prototype')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-function-instances-prototype', 'Function.prototype')}}{{Spec2('ESDraft')}} 
+ +

瀏覽器相容性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

參見

+ + diff --git a/files/zh-tw/conflicting/web/javascript/reference/global_objects/number/index.html b/files/zh-tw/conflicting/web/javascript/reference/global_objects/number/index.html new file mode 100644 index 0000000000..bfd57f3d21 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/reference/global_objects/number/index.html @@ -0,0 +1,85 @@ +--- +title: Number.prototype +slug: Web/JavaScript/Reference/Global_Objects/Number/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Number +translation_of_original: Web/JavaScript/Reference/Global_Objects/Number/prototype +--- +
{{JSRef}}
+ +

Number.prototype 屬性用來表示 {{jsxref("Number")}} 建構式的原型。

+ +
{{js_property_attributes(0, 0, 0)}}
+ +

說明

+ +

所有 {{jsxref("Number")}} 實體都繼承自 Number.prototype 。{{jsxref("Number")}} 建構式的原型物件可以被修改並作用在所有 {{jsxref("Number")}} 實體。

+ +

屬性

+ +
+
Number.prototype.constructor
+
回傳建立這個物件實體的建構式。預設為 {{jsxref("Number")}} 物件。
+
+ +

方法

+ +
+
{{jsxref("Number.prototype.toExponential()")}}
+
回傳以「科學記數法」表示的數值字串。
+
{{jsxref("Number.prototype.toFixed()")}}
+
回傳以定點表示的數值字串。
+
{{jsxref("Number.prototype.toLocaleString()")}}
+
回傳以當地語言為主的數值字串。這覆寫 {{jsxref("Object.prototype.toLocaleString()")}} 的方法。
+
{{jsxref("Number.prototype.toPrecision()")}}
+
回傳以定點或科學記數表示的數值字串。
+
{{jsxref("Number.prototype.toSource()")}} {{non-standard_inline}}
+
Returns an object literal representing the specified {{jsxref("Number")}} object; you can use this value to create a new object. Overrides the {{jsxref("Object.prototype.toSource()")}} method.
+
{{jsxref("Number.prototype.toString()")}}
+
回傳以特定基數表示的數值字串。這覆寫 {{jsxref("Object.prototype.toString()")}} 的方法 。
+
{{jsxref("Number.prototype.valueOf()")}}
+
回傳這個物件的原始型別，即原始數值。這覆寫 {{jsxref("Object.prototype.valueOf()")}} 。
+
+ +

規範

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
規範狀態註記
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition. Implemented in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.7.4', 'Number')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-properties-of-the-number-prototype-object', 'Number')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-properties-of-the-number-prototype-object', 'Number')}}{{Spec2('ESDraft')}} 
+ +

瀏覽器相容性

+ + + +

{{Compat("javascript.builtins.Number.prototype")}}

+ +

參見

+ + diff --git a/files/zh-tw/conflicting/web/javascript/reference/global_objects/object/index.html b/files/zh-tw/conflicting/web/javascript/reference/global_objects/object/index.html new file mode 100644 index 0000000000..4365b10c61 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/reference/global_objects/object/index.html @@ -0,0 +1,219 @@ +--- +title: Object.prototype +slug: Web/JavaScript/Reference/Global_Objects/Object/prototype +tags: + - JavaScript + - Object + - 待翻譯 +translation_of: Web/JavaScript/Reference/Global_Objects/Object +translation_of_original: Web/JavaScript/Reference/Global_Objects/Object/prototype +--- +
{{JSRef}}
+ +

Object.prototype 代表 {{jsxref("Object")}} 的原型物件。

+ +
{{js_property_attributes(0, 0, 0)}}
+ +

描述

+ +

All objects in JavaScript are descended from {{jsxref("Object")}}; all objects inherit methods and properties from Object.prototype, although they may be overridden (except an Object with a null prototype, i.e. Object.create(null)). For example, other constructors' prototypes override the constructor property and provide their own {{jsxref("Object.prototype.toString()", "toString()")}} methods. Changes to the Object prototype object are propagated to all objects unless the properties and methods subject to those changes are overridden further along the prototype chain.

+ +

屬性

+ +
+
{{jsxref("Object.prototype.constructor")}}
+
Specifies the function that creates an object's prototype.
+
{{jsxref("Object.prototype.__proto__")}} {{non-standard_inline}}
+
Points to the object which was used as prototype when the object was instantiated.
+
{{jsxref("Object.prototype.__noSuchMethod__")}} {{non-standard_inline}}
+
Allows a function to be defined that will be executed when an undefined object member is called as a method.
+
{{jsxref("Object.prototype.__count__")}} {{obsolete_inline}}
+
Used to return the number of enumerable properties directly on a user-defined object, but has been removed.
+
{{jsxref("Object.prototype.__parent__")}} {{obsolete_inline}}
+
Used to point to an object's context, but has been removed.
+
+ +

方法

+ +
+
{{jsxref("Object.prototype.__defineGetter__()")}} {{non-standard_inline}} {{deprecated_inline}}
+
Associates a function with a property that, when accessed, executes that function and returns its return value.
+
{{jsxref("Object.prototype.__defineSetter__()")}} {{non-standard_inline}} {{deprecated_inline}}
+
Associates a function with a property that, when set, executes that function which modifies the property.
+
{{jsxref("Object.prototype.__lookupGetter__()")}} {{non-standard_inline}} {{deprecated_inline}}
+
Returns the function associated with the specified property by the {{jsxref("Object.defineGetter", "__defineGetter__")}} method.
+
{{jsxref("Object.prototype.__lookupSetter__()")}} {{non-standard_inline}} {{deprecated_inline}}
+
Returns the function associated with the specified property by the {{jsxref("Object.defineSetter", "__defineSetter__")}} method.
+
{{jsxref("Object.prototype.hasOwnProperty()")}}
+
Returns a boolean indicating whether an object contains the specified property as a direct property of that object and not inherited through the prototype chain.
+
{{jsxref("Object.prototype.isPrototypeOf()")}}
+
Returns a boolean indication whether the specified object is in the prototype chain of the object this method is called upon.
+
{{jsxref("Object.prototype.propertyIsEnumerable()")}}
+
Returns a boolean indicating if the internal ECMAScript DontEnum attribute is set.
+
{{jsxref("Object.prototype.toSource()")}} {{non-standard_inline}}
+
Returns string containing the source of an object literal representing the object that this method is called upon; you can use this value to create a new object.
+
{{jsxref("Object.prototype.toLocaleString()")}}
+
Calls {{jsxref("Object.toString", "toString()")}}.
+
{{jsxref("Object.prototype.toString()")}}
+
Returns a string representation of the object.
+
{{jsxref("Object.prototype.unwatch()")}} {{non-standard_inline}}
+
Removes a watchpoint from a property of the object.
+
{{jsxref("Object.prototype.valueOf()")}}
+
Returns the primitive value of the specified object.
+
{{jsxref("Object.prototype.watch()")}} {{non-standard_inline}}
+
Adds a watchpoint to a property of the object.
+
{{jsxref("Object.prototype.eval()")}} {{obsolete_inline}}
+
Used to evaluate a string of JavaScript code in the context of the specified object, but has been removed.
+
+ +

範例

+ +

因為 JavaScript 並沒有子類別的物件，所以原型是個很有用的解決辦法, 使某些函數作為物件的基本類別物件。例如：

+ +
var Person = function() {
+  this.canTalk = true;
+};
+
+Person.prototype.greet = function() {
+  if (this.canTalk) {
+    console.log('Hi, I am ' + this.name);
+  }
+};
+
+var Employee = function(name, title) {
+  Person.call(this);
+  this.name = name;
+  this.title = title;
+};
+
+Employee.prototype = Object.create(Person.prototype);
+Employee.prototype.constructor = Employee;
+
+Employee.prototype.greet = function() {
+  if (this.canTalk) {
+    console.log('Hi, I am ' + this.name + ', the ' + this.title);
+  }
+};
+
+var Customer = function(name) {
+  Person.call(this);
+  this.name = name;
+};
+
+Customer.prototype = Object.create(Person.prototype);
+Customer.prototype.constructor = Customer;
+
+var Mime = function(name) {
+  Person.call(this);
+  this.name = name;
+  this.canTalk = false;
+};
+
+Mime.prototype = Object.create(Person.prototype);
+Mime.prototype.constructor = Mime;
+
+var bob = new Employee('Bob', 'Builder');
+var joe = new Customer('Joe');
+var rg = new Employee('Red Green', 'Handyman');
+var mike = new Customer('Mike');
+var mime = new Mime('Mime');
+
+bob.greet();
+// Hi, I am Bob, the Builder
+
+joe.greet();
+// Hi, I am Joe
+
+rg.greet();
+// Hi, I am Red Green, the Handyman
+
+mike.greet();
+// Hi, I am Mike
+
+mime.greet();
+
+ +

規範

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition. Implemented in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.2.3.1', 'Object.prototype')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-object.prototype', 'Object.prototype')}}{{Spec2('ES6')}} 
+ +

瀏覽器相容性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

參見

+ + diff --git a/files/zh-tw/conflicting/web/javascript/reference/global_objects/promise/index.html b/files/zh-tw/conflicting/web/javascript/reference/global_objects/promise/index.html new file mode 100644 index 0000000000..f93572bea3 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/reference/global_objects/promise/index.html @@ -0,0 +1,65 @@ +--- +title: Promise.prototype +slug: Web/JavaScript/Reference/Global_Objects/Promise/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Promise +translation_of_original: Web/JavaScript/Reference/Global_Objects/Promise/prototype +--- +
{{JSRef}}
+ +

Promise.prototype 屬性代表了 {{jsxref("Promise")}} 建構式的原型物件。

+ +
{{js_property_attributes(0,0,0)}}
+ +

描述

+ +

所有 {{jsxref("Promise")}} 實例都繼承自 {{jsxref("Promise.prototype")}}。您可以使用建構式的原型物件來增加屬性或方法到所有的 Promise 實例。

+ +

屬性

+ +
+
Promise.prototype.constructor
+
回傳一個建立實例原型（instance's prototype）的函式。預設為 {{jsxref("Promise")}} 函數。
+
+ +

方法

+ +
+
{{jsxref("Promise.catch", "Promise.prototype.catch(onRejected)")}}
+
繫結一個拒絕回呼函式（rejection handler callback）到 promise，當它被呼叫時回傳一個以回傳值作解析的新 promise，或者當 promise 被實現時以原值作解析。
+
{{jsxref("Promise.then", "Promise.prototype.then(onFulfilled, onRejected)")}}
+
繫結實現或拒絕回呼函式到 promise，回傳一個以 handler 之回傳值作解析的新 promise，或者當 promise 未處理（not handled）時以原值作解析。(i.e. 比如相關聯的 onFulfilled 或 onRejected 不是函式。)
+
+ +

規範

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES6', '#sec-promise.prototype', 'Promise.prototype')}}{{Spec2('ES6')}}Initial definition.
{{SpecName('ESDraft', '#sec-promise.prototype', 'Promise.prototype')}}{{Spec2('ESDraft')}} 
+ +

瀏覽器相容性

+ + + +

{{Compat("javascript/promise","Promise.prototype")}}

+ +

參見

+ + diff --git a/files/zh-tw/conflicting/web/javascript/reference/global_objects/string/index.html b/files/zh-tw/conflicting/web/javascript/reference/global_objects/string/index.html new file mode 100644 index 0000000000..011c61418e --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/reference/global_objects/string/index.html @@ -0,0 +1,177 @@ +--- +title: String.prototype +slug: Web/JavaScript/Reference/Global_Objects/String/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/String +translation_of_original: Web/JavaScript/Reference/Global_Objects/String/prototype +--- +
{{JSRef}}
+ +

The String.prototype property represents the {{jsxref("String")}} prototype object.

+ +
{{js_property_attributes(0, 0, 0)}}
+ +

Description

+ +

All {{jsxref("String")}} instances inherit from String.prototype. Changes to the String prototype object are propagated to all {{jsxref("String")}} instances.

+ +

Properties

+ +
+
String.prototype.constructor
+
Specifies the function that creates an object's prototype.
+
{{jsxref("String.prototype.length")}}
+
Reflects the length of the string.
+
N
+
Used to access the character in the Nth position where N is a positive integer between 0 and one less than the value of {{jsxref("String.length", "length")}}. These properties are read-only.
+
+ +

Methods

+ +

Methods unrelated to HTML

+ +
+
{{jsxref("String.prototype.charAt()")}}
+
Returns the character (exactly one UTF-16 code unit) at the specified index.
+
{{jsxref("String.prototype.charCodeAt()")}}
+
Returns a number that is the UTF-16 code unit value at the given index.
+
{{jsxref("String.prototype.codePointAt()")}}
+
Returns a nonnegative integer Number that is the code point value of the UTF-16 encoded code point starting at the specified index.
+
{{jsxref("String.prototype.concat()")}}
+
Combines the text of two strings and returns a new string.
+
{{jsxref("String.prototype.includes()")}}
+
Determines whether one string may be found within another string.
+
{{jsxref("String.prototype.endsWith()")}}
+
Determines whether a string ends with the characters of another string.
+
{{jsxref("String.prototype.indexOf()")}}
+
Returns the index within the calling {{jsxref("String")}} object of the first occurrence of the specified value, or -1 if not found.
+
{{jsxref("String.prototype.lastIndexOf()")}}
+
Returns the index within the calling {{jsxref("String")}} object of the last occurrence of the specified value, or -1 if not found.
+
{{jsxref("String.prototype.localeCompare()")}}
+
Returns a number indicating whether a reference string comes before or after or is the same as the given string in sort order.
+
{{jsxref("String.prototype.match()")}}
+
Used to match a regular expression against a string.
+
{{jsxref("String.prototype.normalize()")}}
+
Returns the Unicode Normalization Form of the calling string value.
+
{{jsxref("String.prototype.padEnd()")}}
+
Pads the current string from the end with a given string to create a new string from a given length.
+
{{jsxref("String.prototype.padStart()")}}
+
Pads the current string from the start with a given string to create a new string from a given length.
+
{{jsxref("String.prototype.quote()")}} {{obsolete_inline}}
+
Wraps the string in double quotes (""").
+
{{jsxref("String.prototype.repeat()")}}
+
Returns a string consisting of the elements of the object repeated the given times.
+
{{jsxref("String.prototype.replace()")}}
+
Used to find a match between a regular expression and a string, and to replace the matched substring with a new substring.
+
{{jsxref("String.prototype.search()")}}
+
Executes the search for a match between a regular expression and a specified string.
+
{{jsxref("String.prototype.slice()")}}
+
Extracts a section of a string and returns a new string.
+
{{jsxref("String.prototype.split()")}}
+
Splits a {{jsxref("Global_Objects/String", "String")}} object into an array of strings by separating the string into substrings.
+
{{jsxref("String.prototype.startsWith()")}}
+
Determines whether a string begins with the characters of another string.
+
{{jsxref("String.prototype.substr()")}}
+
Returns the characters in a string beginning at the specified location through the specified number of characters.
+
{{jsxref("String.prototype.substring()")}}
+
Returns the characters in a string between two indexes into the string.
+
{{jsxref("String.prototype.toLocaleLowerCase()")}}
+
The characters within a string are converted to lower case while respecting the current locale. For most languages, this will return the same as {{jsxref("String.prototype.toLowerCase()", "toLowerCase()")}}.
+
{{jsxref("String.prototype.toLocaleUpperCase()")}}
+
The characters within a string are converted to upper case while respecting the current locale. For most languages, this will return the same as {{jsxref("String.prototype.toUpperCase()", "toUpperCase()")}}.
+
{{jsxref("String.prototype.toLowerCase()")}}
+
Returns the calling string value converted to lower case.
+
{{jsxref("String.prototype.toSource()")}} {{non-standard_inline}}
+
Returns an object literal representing the specified object; you can use this value to create a new object. Overrides the {{jsxref("Object.prototype.toSource()")}} method.
+
{{jsxref("String.prototype.toString()")}}
+
Returns a string representing the specified object. Overrides the {{jsxref("Object.prototype.toString()")}} method.
+
{{jsxref("String.prototype.toUpperCase()")}}
+
Returns the calling string value converted to uppercase.
+
{{jsxref("String.prototype.trim()")}}
+
Trims whitespace from the beginning and end of the string. Part of the ECMAScript 5 standard.
+
{{jsxref("String.prototype.trimLeft()")}} {{non-standard_inline}}
+
Trims whitespace from the left side of the string.
+
{{jsxref("String.prototype.trimRight()")}} {{non-standard_inline}}
+
Trims whitespace from the right side of the string.
+
{{jsxref("String.prototype.valueOf()")}}
+
Returns the primitive value of the specified object. Overrides the {{jsxref("Object.prototype.valueOf()")}} method.
+
{{jsxref("String.prototype.@@iterator()", "String.prototype[@@iterator]()")}}
+
Returns a new Iterator object that iterates over the code points of a String value, returning each code point as a String value.
+
+ +

HTML wrapper methods

+ +

These methods are of limited use, as they provide only a subset of the available HTML tags and attributes.

+ +
+
{{jsxref("String.prototype.anchor()")}}
+
{{htmlattrxref("name", "a", "<a name=\"name\">")}} (hypertext target)
+
{{jsxref("String.prototype.big()")}} {{deprecated_inline}}
+
{{HTMLElement("big")}}
+
{{jsxref("String.prototype.blink()")}} {{deprecated_inline}}
+
{{HTMLElement("blink")}}
+
{{jsxref("String.prototype.bold()")}} {{deprecated_inline}}
+
{{HTMLElement("b")}}
+
{{jsxref("String.prototype.fixed()")}} {{deprecated_inline}}
+
{{HTMLElement("tt")}}
+
{{jsxref("String.prototype.fontcolor()")}} {{deprecated_inline}}
+
{{htmlattrxref("color", "font", "<font color=\"color\">")}}
+
{{jsxref("String.prototype.fontsize()")}} {{deprecated_inline}}
+
{{htmlattrxref("size", "font", "<font size=\"size\">")}}
+
{{jsxref("String.prototype.italics()")}} {{deprecated_inline}}
+
{{HTMLElement("i")}}
+
{{jsxref("String.prototype.link()")}}
+
{{htmlattrxref("href", "a", "<a href=\"url\">")}} (link to URL)
+
{{jsxref("String.prototype.small()")}} {{deprecated_inline}}
+
{{HTMLElement("small")}}
+
{{jsxref("String.prototype.strike()")}} {{deprecated_inline}}
+
{{HTMLElement("strike")}}
+
{{jsxref("String.prototype.sub()")}} {{deprecated_inline}}
+
{{HTMLElement("sub")}}
+
{{jsxref("String.prototype.sup()")}} {{deprecated_inline}}
+
{{HTMLElement("sup")}}
+
+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition.
{{SpecName('ES5.1', '#sec-15.5.3.1', 'String.prototype')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-string.prototype', 'String.prototype')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-string.prototype', 'String.prototype')}}{{Spec2('ESDraft')}} 
+ +

Browser compatibility

+ + + +

{{Compat("javascript.builtins.String.prototype")}}

+ +

See also

+ + diff --git a/files/zh-tw/conflicting/web/javascript/reference/operators/index.html b/files/zh-tw/conflicting/web/javascript/reference/operators/index.html new file mode 100644 index 0000000000..050c362008 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/reference/operators/index.html @@ -0,0 +1,309 @@ +--- +title: 算術運算子 +slug: Web/JavaScript/Reference/Operators/Arithmetic_Operators +translation_of: Web/JavaScript/Reference/Operators +translation_of_original: Web/JavaScript/Reference/Operators/Arithmetic_Operators +--- +
{{jsSidebar("Operators")}}
+ +

算術運算子接受數值（資料型態為字串或變數都可）作為其運算子並回傳單個數值。 標準算術運算符號有加號（+），減號（ - ），乘（*）和除（/）。

+ +
{{EmbedInteractiveExample("pages/js/expressions-arithmetic.html")}}
+ + + +

Addition (+)

+ +

加法運算子生成數字(運算元)的總和或字串串接。

+ +

Syntax

+ +
Operator: x + y
+
+ +

Examples

+ +
// Number + Number -> addition
+1 + 2 // 3
+
+// Boolean + Number -> addition
+true + 1 // 2
+
+// Boolean + Boolean -> addition
+false + false // 0
+
+// Number + String -> concatenation
+5 + 'foo' // "5foo"
+
+// String + Boolean -> concatenation
+'foo' + false // "foofalse"
+
+// String + String -> concatenation
+'foo' + 'bar' // "foobar"
+
+ +

Subtraction (-)

+ +

減法運算子能算出兩個運算元間的差異。

+ +

Syntax

+ +
Operator: x - y
+
+ +

Examples

+ +
5 - 3 // 2
+3 - 5 // -2
+'foo' - 3 // NaN
+ +

Division (/)

+ +

The division operator produces the quotient of its operands where the left operand is the dividend and the right operand is the divisor.

+ +

Syntax

+ +
Operator: x / y
+
+ +

Examples

+ +
1 / 2      // returns 0.5 in JavaScript
+1 / 2      // returns 0 in Java
+// (neither number is explicitly a floating point number)
+
+1.0 / 2.0  // returns 0.5 in both JavaScript and Java
+
+2.0 / 0    // returns Infinity in JavaScript
+2.0 / 0.0  // returns Infinity too
+2.0 / -0.0 // returns -Infinity in JavaScript
+ +

Multiplication (*)

+ +

The multiplication operator produces the product of the operands.

+ +

Syntax

+ +
Operator: x * y
+
+ +

Examples

+ +
2 * 2 // 4
+-2 * 2 // -4
+Infinity * 0 // NaN
+Infinity * Infinity // Infinity
+'foo' * 2 // NaN
+
+ +

Remainder (%)

+ +

The remainder operator returns the remainder left over when one operand is divided by a second operand. It always takes the sign of the dividend.

+ +

Syntax

+ +
Operator: var1 % var2
+
+ +

Examples

+ +
12 % 5 // 2
+-1 % 2 // -1
+1 % -2 // 1
+NaN % 2 // NaN
+1 % 2 // 1
+2 % 3 // 2
+-4 % 2 // -0
+5.5 % 2 // 1.5
+
+ +

Exponentiation (**)

+ +

The exponentiation operator returns the result of raising first operand to the power second operand. that is, var1var2, in the preceding statement, where var1 and var2 are variables. Exponentiation operator is right associative. a ** b ** c is equal to a ** (b ** c).

+ +

Syntax

+ +
Operator: var1 ** var2
+
+ +

Notes

+ +

In most languages like PHP and Python and others that have an exponentiation operator (**), the exponentiation operator is defined to have a higher precedence than unary operators such as unary + and unary -, but there are a few exceptions. For example, in Bash the ** operator is defined to have a lower precedence than unary operators. In JavaScript, it is impossible to write an ambiguous exponentiation expression, i.e. you cannot put a unary operator (+/-/~/!/delete/void/typeof) immediately before the base number.

+ +
-2 ** 2;
+// 4 in Bash, -4 in other languages.
+// This is invalid in JavaScript, as the operation is ambiguous.
+
+
+-(2 ** 2);
+// -4 in JavaScript and the author's intention is unambiguous.
+
+ +

Examples

+ +
2 ** 3 // 8
+3 ** 2 // 9
+3 ** 2.5 // 15.588457268119896
+10 ** -1 // 0.1
+NaN ** 2 // NaN
+
+2 ** 3 ** 2 // 512
+2 ** (3 ** 2) // 512
+(2 ** 3) ** 2 // 64
+
+ +

To invert the sign of the result of an exponentiation expression:

+ +
-(2 ** 2) // -4
+
+ +

To force the base of an exponentiation expression to be a negative number:

+ +
(-2) ** 2 // 4
+
+ +
+

Note: JavaScript also has a bitwise operator ^ (logical XOR). ** and ^ are different (for example : 2 ** 3 === 8 when 2 ^ 3 === 1.)

+
+ +

Increment (++)

+ +

The increment operator increments (adds one to) its operand and returns a value.

+ + + +

Syntax

+ +
Operator: x++ or ++x
+
+ +

Examples

+ +
// Postfix
+var x = 3;
+y = x++; // y = 3, x = 4
+
+// Prefix
+var a = 2;
+b = ++a; // a = 3, b = 3
+
+ +

Decrement (--)

+ +

The decrement operator decrements (subtracts one from) its operand and returns a value.

+ + + +

Syntax

+ +
Operator: x-- or --x
+
+ +

Examples

+ +
// Postfix
+var x = 3;
+y = x--; // y = 3, x = 2
+
+// Prefix
+var a = 2;
+b = --a; // a = 1, b = 1
+
+ +

Unary negation (-)

+ +

The unary negation operator precedes its operand and negates it.

+ +

Syntax

+ +
Operator: -x
+
+ +

Examples

+ +
var x = 3;
+y = -x; // y = -3, x = 3
+
+// Unary negation operator can convert non-numbers into a number
+var x = "4";
+y = -x; // y = -4
+
+ +

Unary plus (+)

+ +

The unary plus operator precedes its operand and evaluates to its operand but attempts to convert it into a number, if it isn't already. Although unary negation (-) also can convert non-numbers, unary plus is the fastest and preferred way of converting something into a number, because it does not perform any other operations on the number. It can convert string representations of integers and floats, as well as the non-string values true, false, and null. Integers in both decimal and hexadecimal ("0x"-prefixed) formats are supported. Negative numbers are supported (though not for hex). If it cannot parse a particular value, it will evaluate to {{jsxref("NaN")}}.

+ +

Syntax

+ +
Operator: +x
+
+ +

Examples

+ +
+3     // 3
++'3'   // 3
++true  // 1
++false // 0
++null  // 0
++function(val){ return val } // NaN
+
+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition.
{{SpecName('ES5.1', '#sec-11.3')}}{{Spec2('ES5.1')}}Defined in several sections of the specification: Additive operators, Multiplicative operators, Postfix expressions, Unary operators.
{{SpecName('ES2015', '#sec-postfix-expressions')}}{{Spec2('ES2015')}}Defined in several sections of the specification: Additive operators, Multiplicative operators, Postfix expressions, Unary operators.
{{SpecName('ES2016', '#sec-postfix-expressions')}}{{Spec2('ES2016')}}Added Exponentiation operator.
{{SpecName('ES2017', '#sec-postfix-expressions')}}{{Spec2('ES2017')}} 
{{SpecName('ESDraft', '#sec-additive-operators')}}{{Spec2('ESDraft')}} 
+ +

Browser compatibility

+ + + +

{{Compat("javascript.operators.arithmetic")}}

+ +

See also

+ + diff --git a/files/zh-tw/conflicting/web/javascript/reference/operators_310dc67549939233c3d18a8fa2cdbb23/index.html b/files/zh-tw/conflicting/web/javascript/reference/operators_310dc67549939233c3d18a8fa2cdbb23/index.html new file mode 100644 index 0000000000..f0b3e39c6e --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/reference/operators_310dc67549939233c3d18a8fa2cdbb23/index.html @@ -0,0 +1,284 @@ +--- +title: 比較運算子 +slug: Web/JavaScript/Reference/Operators/Comparison_Operators +translation_of: Web/JavaScript/Reference/Operators +translation_of_original: Web/JavaScript/Reference/Operators/Comparison_Operators +--- +
{{jsSidebar("Operators")}}
+ +

JavaScript has both strict and type–converting comparisons. A strict comparison (e.g., ===) is only true if the operands are of the same type and the contents match. The more commonly-used abstract comparison (e.g. ==) converts the operands to the same type before making the comparison. For relational abstract comparisons (e.g., <=), the operands are first converted to primitives, then to the same type, before comparison.

+ +

Strings are compared based on standard lexicographical ordering, using Unicode values.

+ +

Features of comparisons:

+ + + +

Equality operators

+ +

Equality (==)

+ +

The equality operator converts the operands if they are not of the same type, then applies strict comparison. If both operands are objects, then JavaScript compares internal references which are equal when operands refer to the same object in memory.

+ +

Syntax

+ +
x == y
+
+ +

Examples

+ +
  1   ==  1        // true
+ "1"  ==  1        // true
+  1   == '1'       // true
+  0   == false     // true
+  0   == null      // false
+var object1 = {"value":"key"}, object2={"value":"key"};
+object1 == object2 //false
+
+  0   == undefined // false
+null  == undefined // true
+
+ +

Inequality (!=)

+ +

The inequality operator returns true if the operands are not equal. If the two operands are not of the same type, JavaScript attempts to convert the operands to an appropriate type for the comparison. If both operands are objects, then JavaScript compares internal references which are not equal when operands refer to different objects in memory.

+ +

Syntax

+ +
x != y
+ +

Examples

+ +
1 !=   2     // true
+1 !=  "1"    // false
+1 !=  '1'    // false
+1 !=  true   // false
+0 !=  false  // false
+
+ +

Identity / strict equality (===)

+ +

The identity operator returns true if the operands are strictly equal (see above) with no type conversion. 

+ +

Syntax

+ +
x === y
+ +

Examples

+ +
3 === 3   // true
+3 === '3' // false
+var object1 = {"value":"key"}, object2={"value":"key"};
+object1 === object2 //false
+ +

 

+ +

Non-identity / strict inequality (!==)

+ +

The non-identity operator returns true if the operands are not equal and/or not of the same type.

+ +

Syntax

+ +
x !== y
+ +

Examples

+ +
3 !== '3' // true
+4 !== 3   // true
+
+ +

Relational operators

+ +

Each of these operators will call the valueOf() function on each operand before a comparison is made.

+ +

Greater than operator (>)

+ +

The greater than operator returns true if the left operand is greater than the right operand.

+ +

Syntax

+ +
x > y
+ +

Examples

+ +
4 > 3 // true
+
+ +

Greater than or equal operator (>=)

+ +

The greater than or equal operator returns true if the left operand is greater than or equal to the right operand.

+ +

Syntax

+ +
 x >= y
+ +

Examples

+ +
4 >= 3 // true
+3 >= 3 // true
+
+ +

Less than operator (<)

+ +

The less than operator returns true if the left operand is less than the right operand.

+ +

Syntax

+ +
 x < y
+ +

Examples

+ +
3 < 4 // true
+
+ +

Less than or equal operator (<=)

+ +

The less than or equal operator returns true if the left operand is less than or equal to the right operand.

+ +

Syntax

+ +
 x <= y
+ +

Examples

+ +
3 <= 4 // true
+
+ +

Using the Equality Operators

+ +

The standard equality operators (== and !=) use the Abstract Equality Comparison Algorithm to compare two operands. If the operands are of different types, it will attempt to convert them to the same type before making the comparison, e.g., in the expression 5 == '5', the string on the right is converted to {{jsxref("Number")}} before the comparison is made.

+ +

The strict equality operators (=== and !==) use the Strict Equality Comparison Algorithm and are intended for performing equality comparisons on operands of the same type. If the operands are of different types, the result is always false so 5 !== '5'.

+ +

Use strict equality operators if the operands must be of a specific type as well as value or if the exact type of the operands is important. Otherwise, use the standard equality operators, which allow you to compare the identity of two operands even if they are not of the same type.

+ +

When type conversion is involved in the comparison (i.e., non–strict comparison), JavaScript converts the types {{jsxref("String")}}, {{jsxref("Number")}}, {{jsxref("Boolean")}}, or {{jsxref("Object")}} operands as follows:

+ + + +
Note: String objects are Type Object, not String! String objects are rarely used, so the following results might be surprising:
+ +
// true as both operands are type String (i.e. string primitives):
+'foo' === 'foo'
+
+var a = new String('foo');
+var b = new String('foo');
+
+// false as a and b are type Object and reference different objects
+a == b
+
+// false as a and b are type Object and reference different objects
+a === b
+
+// true as a and 'foo' are of different type and, the Object (a)
+// is converted to String 'foo' before comparison
+a == 'foo'
+ +

規範

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition. Implemented in JavaScript 1.0
{{SpecName('ES3')}}{{Spec2('ES3')}}Adds === and !== operators. Implemented in JavaScript 1.3
{{SpecName('ES5.1', '#sec-11.8')}}{{Spec2('ES5.1')}}Defined in several sections of the specification: Relational Operators, Equality Operators
{{SpecName('ES6', '#sec-relational-operators')}}{{Spec2('ES6')}}Defined in several sections of the specification: Relational Operators, Equality Operators
{{SpecName('ESDraft', '#sec-relational-operators')}}{{Spec2('ESDraft')}}Defined in several sections of the specification: Relational Operators, Equality Operators
+ +

瀏覽器相容性

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

參見

+ + diff --git a/files/zh-tw/conflicting/web/javascript/reference/operators_7c8eb9475d97a4a734c5991857698560/index.html b/files/zh-tw/conflicting/web/javascript/reference/operators_7c8eb9475d97a4a734c5991857698560/index.html new file mode 100644 index 0000000000..86f78270b5 --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/reference/operators_7c8eb9475d97a4a734c5991857698560/index.html @@ -0,0 +1,555 @@ +--- +title: 位元運算子 +slug: Web/JavaScript/Reference/Operators/Bitwise_Operators +translation_of: Web/JavaScript/Reference/Operators +translation_of_original: Web/JavaScript/Reference/Operators/Bitwise_Operators +--- +
{{jsSidebar("Operators")}}
+ +

位元運算子將運算元視為一段 32 位元長的 0 和 1 序列，而不是十進位、十六進位或八進位的 Numbers。 舉例來說，十進位的 9 可以用二進位表示為 1001。位元運算子對這樣的二進位表示法進行運算，然後回傳標準 JavaScript 數值。

+ +
{{EmbedInteractiveExample("pages/js/expressions-bitwiseoperators.html")}}
+ + + +

下表總結了 JavaScript 的位元運算子：

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
OperatorUsageDescription
位元 ANDa & b當兩運算元的該位置皆為 1 時，回傳值的該位置為 1。
位元 ORa | b當兩運算元的該位置有一者為 1 時，回傳值的該位置為 1。
位元 XORa ^ b當兩運算元的該位置恰好一者為 1 時，回傳值的該位置為 1。
位元 NOT~ a將運算元的所有位元反轉。
左移a << b將 a 的二進位表示法左移 b (< 32) 位元，右側補 0。
保持符號右移a >> b將 a 的二進位表示法右移 b (< 32) 位元，拋棄被移出的位元。
填零右移a >>> b  將 a 的二進位表示法右移 b (< 32) 位元，拋棄被移出的位元，並於右側補 0。
+ +

帶號的 32位元整數

+ +

所有位元運算子的運算元皆會被轉換成二補數系統下的帶號32位元整數。二補數系統意味著一個整數的加法反元素(例如 5和 -5)是該整數的所有位元反轉(位元 NOT，也就是該數的一補數) 再加一。舉例來說，下面的序列代表著整數 314：

+ +
00000000000000000000000100111010
+
+ +

下面的序列代表 ~314，也就是 314 的一補數：

+ +
11111111111111111111111011000101
+
+ +

接著，下面代表著 -314，也就是 314 的二補數：

+ +
11111111111111111111111011000110
+
+ +

二補數系統確保了正值時最左邊的位元為 0，反之則為 1。因此，最左邊的位元被稱作符號位。

+ +

整數 0 全由位元 0組成。

+ +
0 (base 10) = 00000000000000000000000000000000 (base 2)
+
+ +

整數 -1 全由位元 1組成。

+ +
-1 (base 10) = 11111111111111111111111111111111 (base 2)
+
+ +

整數 -2147483648 (十六進位： -0x80000000) 除了第一位為 1，其餘皆由位元 0組成。

+ +
-2147483648 (base 10) = 10000000000000000000000000000000 (base 2)
+
+ +

整數 -2147483648 (十六進位： -0x7fffffff) 除了第一位為 0，其餘皆由位元 1組成。

+ +
2147483647 (base 10) = 01111111111111111111111111111111 (base 2)
+
+ +

整數 -2147483648 和 2147483647 分別為帶號32位元整數所能表示的最小值和最大值。

+ +

位元邏輯運算子

+ +

大致上，位元邏輯運算子的運作如下︰

+ + + +

& (位元 AND)

+ +

對每一組位元執行 AND 運算。a AND b 只在 a 和 b 同時為 1 時得到 1。AND運算的真值表如下：

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
aba AND b
000
010
100
111
+ +
.    9 (base 10) = 00000000000000000000000000001001 (base 2)
+    14 (base 10) = 00000000000000000000000000001110 (base 2)
+                   --------------------------------
+14 & 9 (base 10) = 00000000000000000000000000001000 (base 2) = 8 (base 10)
+
+ +

將任何數 x 和 0 做位元 AND 皆會得到 0。將任何數 x 和 -1 做位元 AND 皆會得到 x。

+ +

| (位元 OR)

+ +

對每一組位元執行 OR 運算。a OR b 在 a 和 b 有一者為 1 時得到 1。OR運算的真值表如下：

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
aba OR b
000
011
101
111
+ +
.    9 (base 10) = 00000000000000000000000000001001 (base 2)
+    14 (base 10) = 00000000000000000000000000001110 (base 2)
+                   --------------------------------
+14 | 9 (base 10) = 00000000000000000000000000001111 (base 2) = 15 (base 10)
+
+ +

將任何數 x 和 0 做位元 OR 皆會得到 x。將任何數 x 和 -1 做位元 OR 皆會得到 -1。

+ +

^ (位元 XOR)

+ +

對每一組位元執行 XOR 運算。a XOR b 只在 a 和 b 恰一者為 1 時得到 1。XOR運算的真值表如下：

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
aba XOR b
000
011
101
110
+ +
.    9 (base 10) = 00000000000000000000000000001001 (base 2)
+    14 (base 10) = 00000000000000000000000000001110 (base 2)
+                   --------------------------------
+14 ^ 9 (base 10) = 00000000000000000000000000000111 (base 2) = 7 (base 10)
+
+ +

將任何數 x 和 0 做位元 AND 皆會得到 x。將任何數 x 和 -1 做位元 AND 皆會得到 ~x。

+ +

~ (位元 NOT)

+ +

對每一個位元執行 NOT 運算。NOT a 會得到 a 的反轉值(也就是一補數)。NOT運算的真值表如下：

+ + + + + + + + + + + + + + + + +
aNOT a
01
10
+ +
 9 (base 10) = 00000000000000000000000000001001 (base 2)
+               --------------------------------
+~9 (base 10) = 11111111111111111111111111110110 (base 2) = -10 (base 10)
+
+ +

將任何數 x 做位元 NOT 皆會得到 -(x + 1)。舉例來說，~-5 會得到 4。

+ +

值得注意的是，因為使用 32位元表示法表示數值 ~-1 和 ~4294967295 (232-1) 皆會得到 0。

+ +

位元位移運算子

+ +

位移運算子需要兩個運算元：第一個是要被位移的值，第二個是位元位移量。位移的方向取決於使用的運算子。

+ +

位移運算子將運算元轉換成 32位元的大端序整數並回傳一個與左運算元相同類別的值。右運算元應不大於32，如果超過的話，將只會使用後 5個位元。

+ +

<< (左移)

+ +

將第一個運算元向左位移指定的量。被移出的位元會被拋棄，並從右側補零。

+ +

例如，9 << 2 會得到 36：

+ +
.    9 (base 10): 00000000000000000000000000001001 (base 2)
+                  --------------------------------
+9 << 2 (base 10): 00000000000000000000000000100100 (base 2) = 36 (base 10)
+
+ +

將任意值 x 左移 y 位元會得到 x * 2 ** y。

+ +

>> (保持符號右移)

+ +

將第一個運算元向右位移指定的量。被移出的位元會被拋棄，並從左側補進和原本最左端相同的位元值。因為新的最左端位元和原本的最左端位元是一樣的，符號位(最左端位元)並不會改變。「保持符號」之名便是因此。

+ +

例如，9 >> 2 會得到 2：

+ +
.    9 (base 10): 00000000000000000000000000001001 (base 2)
+                  --------------------------------
+9 >> 2 (base 10): 00000000000000000000000000000010 (base 2) = 2 (base 10)
+
+ +

同樣地，-9 >> 2 會得到 -3，因為符號會保持不變。

+ +
.    -9 (base 10): 11111111111111111111111111110111 (base 2)
+                   --------------------------------
+-9 >> 2 (base 10): 11111111111111111111111111111101 (base 2) = -3 (base 10)
+
+ +

>>> (填零右移)

+ +

將第一個運算元向右位移指定的量。被移出的位元會被拋棄，並從左側補零。因為符號位變成 0，所以結果永遠都是正值。

+ +

對非負的數來說，填零右移會得到和保持符號右移一樣的結果。例如，9 >>> 2 和 9 >> 2 一樣，皆會得到 2：

+ +
.     9 (base 10): 00000000000000000000000000001001 (base 2)
+                   --------------------------------
+9 >>> 2 (base 10): 00000000000000000000000000000010 (base 2) = 2 (base 10)
+
+ +

然而對負值來說並不是這麼一回事。例如，-9 >>> 2 會得到 1073741821，跟 -9 >> 2 (得到 -3)的結果是不一樣的：

+ +
.     -9 (base 10): 11111111111111111111111111110111 (base 2)
+                    --------------------------------
+-9 >>> 2 (base 10): 00111111111111111111111111111101 (base 2) = 1073741821 (base 10)
+
+ +

範例

+ +

旗標(flags) 和遮罩 (bitmasks)

+ +

位元運算子常被用於生成、修改、和讀取旗標序列，就像是二進制的變數一般。雖然也可以使用普通變數，但使用二進制的旗標序列大大的減少了所需空間 (32 倍)。

+ +

假設有 4個旗標：

+ + + +

這些旗標倍表達成一個位元序列：DCBA。當一個旗標被立起 (set)時，其值為1。當一個旗標被放下 (clear)，其值為0。假設有一變數 flags 的二進位值為 0101：

+ +
var flags = 5;   // 二進位 0101
+
+ +

這個值表示：

+ + + +

因為位元運算子進行的是 32位元操作，0101 實際上是 00000000000000000000000000000101，但前導的 0可被忽略因為他們沒有實際上的意義。

+ +

位元遮罩則為一個可以修改且(或)讀取旗標序列的位元序列。通常為每個單獨旗標為真的「初始」值：

+ +
var FLAG_A = 1; // 0001
+var FLAG_B = 2; // 0010
+var FLAG_C = 4; // 0100
+var FLAG_D = 8; // 1000
+
+ +

新的位元遮罩可以透過對初始遮罩進行位元運算獲得。例如，遮罩 1011 可以透過對 FLAG_A、FLAG_B、和 FLAG_D進行 OR運算獲得：

+ +
var mask = FLAG_A | FLAG_B | FLAG_D; // 0001 | 0010 | 1000 => 1011
+
+ +

Individual flag values can be extracted by ANDing them with a bitmask, where each bit with the value of one will "extract" the corresponding flag. The bitmask masks out the non-relevant flags by ANDing with zeroes (hence the term "bitmask"). For example, the bitmask 0100 can be used to see if flag C is set:

+ +
// if we own a cat
+if (flags & FLAG_C) { // 0101 & 0100 => 0100 => true
+   // do stuff
+}
+
+ +

A bitmask with multiple set flags acts like an "either/or". For example, the following two are equivalent:

+ +
// if we own a bat or we own a cat
+// (0101 & 0010) || (0101 & 0100) => 0000 || 0100 => true
+if ((flags & FLAG_B) || (flags & FLAG_C)) {
+   // do stuff
+}
+
+ +
// if we own a bat or cat
+var mask = FLAG_B | FLAG_C; // 0010 | 0100 => 0110
+if (flags & mask) { // 0101 & 0110 => 0100 => true
+   // do stuff
+}
+
+ +

Flags can be set by ORing them with a bitmask, where each bit with the value one will set the corresponding flag, if that flag isn't already set. For example, the bitmask 1100 can be used to set flags C and D:

+ +
// yes, we own a cat and a duck
+var mask = FLAG_C | FLAG_D; // 0100 | 1000 => 1100
+flags |= mask;   // 0101 | 1100 => 1101
+
+ +

Flags can be cleared by ANDing them with a bitmask, where each bit with the value zero will clear the corresponding flag, if it isn't already cleared. This bitmask can be created by NOTing primitive bitmasks. For example, the bitmask 1010 can be used to clear flags A and C:

+ +
// no, we don't have an ant problem or own a cat
+var mask = ~(FLAG_A | FLAG_C); // ~0101 => 1010
+flags &= mask;   // 1101 & 1010 => 1000
+
+ +

The mask could also have been created with ~FLAG_A & ~FLAG_C (De Morgan's law):

+ +
// no, we don't have an ant problem, and we don't own a cat
+var mask = ~FLAG_A & ~FLAG_C;
+flags &= mask;   // 1101 & 1010 => 1000
+
+ +

Flags can be toggled by XORing them with a bitmask, where each bit with the value one will toggle the corresponding flag. For example, the bitmask 0110 can be used to toggle flags B and C:

+ +
// if we didn't have a bat, we have one now,
+// and if we did have one, bye-bye bat
+// same thing for cats
+var mask = FLAG_B | FLAG_C;
+flags = flags ^ mask;   // 1100 ^ 0110 => 1010
+
+ +

Finally, the flags can all be flipped with the NOT operator:

+ +
// entering parallel universe...
+flags = ~flags;    // ~1010 => 0101
+
+ +

Conversion snippets

+ +

Convert a binary String to a decimal Number:

+ +
var sBinString = '1011';
+var nMyNumber = parseInt(sBinString, 2);
+alert(nMyNumber); // prints 11, i.e. 1011
+
+ +

Convert a decimal Number to a binary String:

+ +
var nMyNumber = 11;
+var sBinString = nMyNumber.toString(2);
+alert(sBinString); // prints 1011, i.e. 11
+
+ +

Automate Mask Creation

+ +

You can create multiple masks from a set of Boolean values, like this:

+ +
function createMask() {
+  var nMask = 0, nFlag = 0, nLen = arguments.length > 32 ? 32 : arguments.length;
+  for (nFlag; nFlag < nLen; nMask |= arguments[nFlag] << nFlag++);
+  return nMask;
+}
+var mask1 = createMask(true, true, false, true); // 11, i.e.: 1011
+var mask2 = createMask(false, false, true); // 4, i.e.: 0100
+var mask3 = createMask(true); // 1, i.e.: 0001
+// etc.
+
+alert(mask1); // prints 11, i.e.: 1011
+
+ +

Reverse algorithm: an array of booleans from a mask

+ +

If you want to create an Array of Booleans from a mask you can use this code:

+ +
function arrayFromMask(nMask) {
+  // nMask must be between -2147483648 and 2147483647
+  if (nMask > 0x7fffffff || nMask < -0x80000000) {
+    throw new TypeError('arrayFromMask - out of range');
+  }
+  for (var nShifted = nMask, aFromMask = []; nShifted;
+       aFromMask.push(Boolean(nShifted & 1)), nShifted >>>= 1);
+  return aFromMask;
+}
+
+var array1 = arrayFromMask(11);
+var array2 = arrayFromMask(4);
+var array3 = arrayFromMask(1);
+
+alert('[' + array1.join(', ') + ']');
+// prints "[true, true, false, true]", i.e.: 11, i.e.: 1011
+
+ +

You can test both algorithms at the same time…

+ +
var nTest = 19; // our custom mask
+var nResult = createMask.apply(this, arrayFromMask(nTest));
+
+alert(nResult); // 19
+
+ +

For the didactic purpose only (since there is the Number.toString(2) method), we show how it is possible to modify the arrayFromMask algorithm in order to create a String containing the binary representation of a Number, rather than an Array of Booleans:

+ +
function createBinaryString(nMask) {
+  // nMask must be between -2147483648 and 2147483647
+  for (var nFlag = 0, nShifted = nMask, sMask = ''; nFlag < 32;
+       nFlag++, sMask += String(nShifted >>> 31), nShifted <<= 1);
+  return sMask;
+}
+
+var string1 = createBinaryString(11);
+var string2 = createBinaryString(4);
+var string3 = createBinaryString(1);
+
+alert(string1);
+// prints 00000000000000000000000000001011, i.e. 11
+
+ +

規範

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition.
{{SpecName('ES5.1', '#sec-11.7')}}{{Spec2('ES5.1')}}Defined in several sections of the specification: Bitwise NOT operator, Bitwise shift operators, Binary bitwise operators
{{SpecName('ES6', '#sec-bitwise-shift-operators')}}{{Spec2('ES6')}}Defined in several sections of the specification: Bitwise NOT operator, Bitwise shift operators, Binary bitwise operators
{{SpecName('ESDraft', '#sec-bitwise-shift-operators')}}{{Spec2('ESDraft')}}Defined in several sections of the specification: Bitwise NOT operator, Bitwise shift operators, Binary bitwise operators
+ +

瀏覽器相容性

+ + + +

{{Compat("javascript.operators.bitwise")}}

+ +

另見

+ + diff --git a/files/zh-tw/conflicting/web/javascript/reference/operators_f71733c8e7001a29c3ec40d8522a4aca/index.html b/files/zh-tw/conflicting/web/javascript/reference/operators_f71733c8e7001a29c3ec40d8522a4aca/index.html new file mode 100644 index 0000000000..2fb07f891e --- /dev/null +++ b/files/zh-tw/conflicting/web/javascript/reference/operators_f71733c8e7001a29c3ec40d8522a4aca/index.html @@ -0,0 +1,244 @@ +--- +title: Logical operators +slug: Web/JavaScript/Reference/Operators/Logical_Operators +translation_of: Web/JavaScript/Reference/Operators +translation_of_original: Web/JavaScript/Reference/Operators/Logical_Operators +--- +
{{jsSidebar("Operators")}}
+ +

邏輯運算子通常會搭配 {{jsxref("Boolean")}} (logical) 值。若是，則回傳布林值。然而， && 和 ||  運算子通常回傳其中一運算元的值, 因此若這些運算子搭配非布林值使用，他們會回傳非布林值。

+ +
{{EmbedInteractiveExample("pages/js/expressions-logicaloperator.html")}}
+ + + +

說明

+ +

邏輯運算子的使用方式如下(expr 可能會是 type，不只是布林值)：

+ + + + + + + + + + + + + + + + + + + + + + + + +
OperatorSyntaxDescription
邏輯 AND (&&)expr1 && expr2若 expr1 可被轉換成 true, 回傳 expr2; 否則 回傳 expr1.
邏輯 OR (||)expr1 || expr2若 expr1 可被轉換成 true, 回傳 expr1; 否則 回傳 expr2.
邏輯 NOT (!)!expr回傳 false 若它的單一運算元可被轉換成 true; 否則回傳 true.
+ +

If a value can be converted to true, the value is so-called {{Glossary("truthy")}}. If a value can be converted to false, the value is so-called {{Glossary("falsy")}}.

+ +

Examples of expressions that can be converted to false are:

+ + + +

Even though the && and || operators can be used with operands that are not Boolean values, they can still be considered boolean operators since their return values can always be converted to boolean primitives. To explicitly convert their return value (or any expression in general) to the corresponding boolean value, use a double NOT operator or the Boolean constructor.

+ +

Short-circuit evaluation

+ +

As logical expressions are evaluated left to right, they are tested for possible "short-circuit" evaluation using the following rules:

+ + + +

Short circuit means that the expr parts above are not evaluated, hence any side effects of doing so do not take effect (e.g., if expr is a function call, the calling never takes place). This happens because the value of the operator is already determined after the evaluation of the first operand. See example:

+ +
function A(){ console.log('called A'); return false; }
+function B(){ console.log('called B'); return true; }
+
+console.log( A() && B() );
+// logs "called A" due to the function call,
+// then logs false (which is the resulting value of the operator)
+
+console.log( B() || A() );
+// logs "called B" due to the function call,
+// then logs true (which is the resulting value of the operator)
+
+ +

Operator precedence

+ +

The following expressions might seem equivalent, but they are not, because the && operator is executed before the || operator (see operator precedence).

+ +
true || false && false      // returns true, because && is executed first
+(true || false) && false    // returns false, because operator precedence cannot apply
+ +

Logical AND (&&)

+ +

The following code shows examples of the && (logical AND) operator.

+ +
a1 = true  && true       // t && t returns true
+a2 = true  && false      // t && f returns false
+a3 = false && true       // f && t returns false
+a4 = false && (3 == 4)   // f && f returns false
+a5 = 'Cat' && 'Dog'      // t && t returns "Dog"
+a6 = false && 'Cat'      // f && t returns false
+a7 = 'Cat' && false      // t && f returns false
+a8 = ''    && false      // f && f returns ""
+a9 = false && ''         // f && f returns false
+
+ +

Logical OR (||)

+ +

The following code shows examples of the || (logical OR) operator.

+ +
o1 = true  || true       // t || t returns true
+o2 = false || true       // f || t returns true
+o3 = true  || false      // t || f returns true
+o4 = false || (3 == 4)   // f || f returns false
+o5 = 'Cat' || 'Dog'      // t || t returns "Cat"
+o6 = false || 'Cat'      // f || t returns "Cat"
+o7 = 'Cat' || false      // t || f returns "Cat"
+o8 = ''    || false      // f || f returns false
+o9 = false || ''         // f || f returns ""
+o10 = false || varObject // f || object returns varObject
+
+ +

Logical NOT (!)

+ +

The following code shows examples of the ! (logical NOT) operator.

+ +
n1 = !true               // !t returns false
+n2 = !false              // !f returns true
+n3 = !''                 // !f returns true
+n4 = !'Cat'              // !t returns false
+
+ +

Double NOT (!!)

+ +

It is possible to use a couple of NOT operators in series to explicitly force the conversion of any value to the corresponding boolean primitive. The conversion is based on the "truthyness" or "falsyness" of the value (see {{Glossary("truthy")}} and {{Glossary("falsy")}}).

+ +

The same conversion can be done through the {{jsxref("Boolean")}} function.

+ +
n1 = !!true                   // !!truthy returns true
+n2 = !!{}                     // !!truthy returns true: any object is truthy...
+n3 = !!(new Boolean(false))   // ...even Boolean objects with a false .valueOf()!
+n4 = !!false                  // !!falsy returns false
+n5 = !!""                     // !!falsy returns false
+n6 = !!Boolean(false)         // !!falsy returns false
+
+ +

Conversion rules for booleans

+ +

Converting AND to OR

+ +

The following operation involving booleans:

+ +
bCondition1 && bCondition2
+ +

is always equal to:

+ +
!(!bCondition1 || !bCondition2)
+ +

Converting OR to AND

+ +

The following operation involving booleans:

+ +
bCondition1 || bCondition2
+ +

is always equal to:

+ +
!(!bCondition1 && !bCondition2)
+ +

Converting between NOTs

+ +

The following operation involving booleans:

+ +
!!bCondition
+ +

is always equal to:

+ +
bCondition
+ +

Removing nested parentheses

+ +

As logical expressions are evaluated left to right, it is always possible to remove parentheses from a complex expression following some rules.

+ +

Removing nested AND

+ +

The following composite operation involving booleans:

+ +
bCondition1 || (bCondition2 && bCondition3)
+ +

is always equal to:

+ +
bCondition1 || bCondition2 && bCondition3
+ +

Removing nested OR

+ +

The following composite operation involving booleans:

+ +
bCondition1 && (bCondition2 || bCondition3)
+ +

is always equal to:

+ +
!(!bCondition1 || !bCondition2 && !bCondition3)
+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition.
{{SpecName('ES5.1', '#sec-11.11')}}{{Spec2('ES5.1')}}Defined in several sections of the specification: Logical NOT Operator, Binary Logical Operators
{{SpecName('ES6', '#sec-binary-logical-operators')}}{{Spec2('ES6')}}Defined in several sections of the specification: Logical NOT Operator, Binary Logical Operators
{{SpecName('ESDraft', '#sec-binary-logical-operators')}}{{Spec2('ESDraft')}}Defined in several sections of the specification: Logical NOT Operator, Binary Logical Operators
+ +

Browser compatibility

+ + + +

{{Compat("javascript.operators.logical")}}

+ +

See also

+ + diff --git a/files/zh-tw/conflicting/web/media/formats/index.html b/files/zh-tw/conflicting/web/media/formats/index.html new file mode 100644 index 0000000000..455655ba25 --- /dev/null +++ b/files/zh-tw/conflicting/web/media/formats/index.html @@ -0,0 +1,467 @@ +--- +title: Media formats supported by the HTML audio and video elements +slug: Web/HTML/Supported_media_formats +translation_of: Web/Media/Formats +translation_of_original: Web/HTML/Supported_media_formats +--- +

The {{ HTMLElement("audio") }} and {{ HTMLElement("video") }} elements provide support for playing audio and video media without requiring plug-ins. Video codecs and audio codecs are used to handle video and audio, and different codecs offer different levels of compression and quality. A container format is used to store and transmit the coded video and audio (both together, the case of a video with a soundtrack). Many combinations of codecs and container formats exist, although only a handful of these are relevant on the Web.

+ +

Different browsers do not support the same media formats in their implementations of HTML5 video and audio, mainly because of patent issues. The area of media formats on the Web has greatly suffered from patent law in many countries - including the USA and EU countries (the notes on patents in this article is provided as-is and without any warranty.) This article discusses the different codec and container combinations relevant to the web, including support in browsers on both desktop and other device types.

+ +

To make an HTML5 video, which works in the newest versions of all major browsers, you can serve your video in both WebM format and MPEG H.264 AAC format, using the source element like this:

+ +
<video controls>
+  <source src="somevideo.webm" type="video/webm">
+  <source src="somevideo.mp4" type="video/mp4">
+  I'm sorry; your browser doesn't support HTML5 video in WebM with VP8 or MP4 with H.264.
+  <!-- You can embed a Flash player here, to play your mp4 video in older browsers -->
+</video>
+
+ +

WebM

+ +

The WebM format is based on a restricted version of the Matroska container format. It always uses the VP8 or VP9 video codec and the Vorbis or Opus audio codec. WebM is natively supported in desktop and mobile Gecko (Firefox), Chrome and Opera, and support for the format can be added to Internet Explorer and Safari (but not on iOS) by installing an add-on.

+ +

Statement from Microsoft on why IE9 does not have native WebM support.

+ +

The WebM format, specifically the VP8 video codec, had been acccused of patent infringment by a group of companies answering a call by the MPEG LA for the formation of a patent pool, but MPEG LA has agreed to license those patents to Google under a "perpetual, transferable, royalty free license".  This means, effectively, that all known patents on the WebM format are licensed to everyone for free. 

+ +

Gecko recognizes the following MIME types as WebM files:

+ +
+
video/webm
+
A WebM media file containing video (and possibly audio as well).
+
audio/webm
+
A WebM media file containing only audio.
+
+ +

Ogg Theora Vorbis

+ +

The Ogg container format with the Theora video codec and the Vorbis audio codec is supported in desktop/mobile Gecko (Firefox), Chrome, and Opera, and support for the format can be added to Safari (but not on iOS) by installing an add-on. The format is not supported in Internet Explorer in any way.

+ +

WebM is generally preferred over Ogg Theora Vorbis when available, because it provides a better compression to quality ratio and is supported in more browsers. The Ogg format can however be used to support older browser versions (for example Firefox 3.5/3.6 don't support WebM, but do support Ogg.)

+ +

The patent situation of Theora is similar to that of WebM.

+ +

You can learn more about creating Ogg media by reading the Theora Cookbook.

+ +

Gecko recognizes the following MIME types as Ogg files:

+ +
+
audio/ogg
+
An Ogg file containing only audio.
+
video/ogg
+
An ogg file containing video (and possibly also audio).
+
application/ogg
+
An Ogg file with unspecified content. Using one of the other two MIME types is preferred, but you can use this if you don't know what the contents of the file are.
+
+ +

Ogg Opus

+ +

The Ogg container can also contain audio encoded using the Opus codec. Support for this is available in Gecko 15.0 {{ geckoRelease("15.0") }} and later, on desktop and mobile browsers.

+ +

MP4 H.264 (AAC or MP3)

+ +

The MP4 container format with the H.264 video codec and the AAC audio codec is natively supported by desktop/mobile Internet Explorer, Safari and Chrome, but Chromium and Opera do not support the format. IE and Chrome also support the MP3 audio codec in the MP4 container, but Safari does not. Firefox/Firefox for Android/Firefox OS supports the format in some cases, but only when a third-party decoder is available, and the device hardware can handle the profile used to encode the MP4.

+ +
+

Note: MP4s encoded with a high profile will not run on lower end hardware, such as low end Firefox OS phones.

+
+ +

The MPEG media formats are covered by patents, which are not freely licensed. All the necessary licenses can be bought from MPEG LA. Since H.264 is currently not a royalty free format, it is unfit for the open web platform, according to Mozilla [1, 2], Google [1, 2] and Opera. However, since royalty free formats are not supported by Internet Explorer and Safari, Mozilla has decided to support the format anyway, and Google never fulfilled their promise to remove support for it in Chrome.

+ +

MP3

+ +

The MP3 audio format (.mp3, audio/mpeg; distinct from the above MP3 audio in an MP4 container case) is supported in <audio> by Firefox/Firefox for Android/Firefox OS when the operating system provides an MP3 decoder, and by Internet Explorer, Chrome and Safari.

+ +

WAVE PCM

+ +

The WAVE container format, with the PCM audio codec (WAVE codec "1") is supported by desktop/mobile Gecko (Firefox) and Safari. Files in the WAVE container format typically end with the ".wav" extension.

+ +
Note: See RFC 2361 for the WAVE codec registry.
+ +

Gecko recognizes the following MIME types as WAVE audio files:

+ + + +

Browser compatibility

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support3.0{{ CompatGeckoDesktop("1.9.1") }}9.010.503.1
<audio>: PCM in WAVE{{ CompatVersionUnknown() }}{{ CompatGeckoDesktop("1.9.1") }}{{ CompatNo() }}10.503.1
<audio>: Vorbis in WebM{{ CompatVersionUnknown() }}{{ CompatGeckoDesktop("2.0") }}{{ CompatNo() }}10.603.1 (must be installed separately)
<audio>: Vorbis in Ogg{{ CompatVersionUnknown() }}{{ CompatGeckoDesktop("1.9.1") }}{{ CompatNo() }}10.503.1 (must be installed separately, e.g. XiphQT)
<audio>: MP3{{ CompatVersionUnknown() }} (Not in Chromium)Partial (see below)9.0{{ CompatNo() }}3.1
<audio>: MP3 in MP4 +

{{ CompatUnknown() }}

+ 		{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
<audio>: AAC in MP4 +

{{ CompatVersionUnknown() }} (Main only) (Not in Chromium)

+ 		+

Partial (see below)

+ 		9.0{{ CompatNo() }}3.1
<audio>: Opus in Ogg27.0{{ CompatGeckoDesktop("15.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
<video>: VP8 and Vorbis in WebM6.0{{ CompatGeckoDesktop("2.0") }}9.0 (must be installed separately, e.g. WebM MF)10.603.1 (must be installed separately, e.g. Perian)
<video>: VP9 and Opus in WebM29.0{{ CompatGeckoDesktop("28.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
<video>:  Theora and Vorbis in Ogg{{ CompatVersionUnknown() }}{{ CompatGeckoDesktop("1.9.1") }}{{ CompatNo() }}10.503.1 (must be installed separately, e.g. XiphQT)
<video>:  H.264 and MP3 in MP4 +

{{ CompatVersionUnknown() }} (Not in Chromium)

+ 		Partial (see below)9.0{{ CompatNo() }}{{ CompatNo() }}
<video>: H.264 and AAC in MP4 +

{{ CompatVersionUnknown() }} (Not in Chromium)

+ 		Partial (see below)9.0{{ CompatNo() }}3.1
any other format{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}3.1 (plays all formats available via QuickTime)
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OS (Gecko)IE MobileOpera MobileOpera MiniSafari MobileChrome for Android
Basic support2.324.01.0.110.011.0Partial (see below)3.229.0
<audio>: PCM in WAVE{{ CompatUnknown() }}24.01.0.1{{ CompatNo() }}{{ CompatNo() }}Partial (see below)3.2{{ CompatUnknown() }}
<audio>: Vorbis in WebM{{ CompatUnknown() }}24.01.0.1{{ CompatNo() }}11.0Partial (see below){{ CompatNo() }}{{ CompatUnknown() }}
<audio>: Vorbis in Ogg{{ CompatUnknown() }}24.01.0.1{{ CompatNo() }}11.0Partial (see below){{ CompatNo() }}{{ CompatUnknown() }}
<audio>: MP3{{ CompatUnknown() }}Partial (see below)Partial (see below)10.0{{ CompatNo() }}Partial (see below)3.2{{ CompatUnknown() }}
<audio>: MP3 in MP4{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
<audio>: AAC in MP4{{ CompatUnknown() }}Partial (see below)Partial (see below)10.0{{ CompatNo() }}Partial (see below){{ CompatUnknown() }}{{ CompatUnknown() }}
<audio>: Opus in Ogg{{ CompatNo() }}24.0{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}Partial (see below){{ CompatNo() }}{{ CompatNo() }}
<video>:  VP8 and Vorbis in WebM2.324.01.0.1{{ CompatNo() }}16.0Partial (see below){{ CompatNo() }}29.0
<video>: VP9 and Opus in WebM{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
<video>: Theora and Vorbis in Ogg{{ CompatNo() }}24.01.0.1{{ CompatNo() }}{{ CompatNo() }}Partial (see below){{ CompatNo() }}{{ CompatNo() }}
<video>:  H.264 and MP3 in MP4Partial (see below)24.0Partial (see below)10.0Partial since 11.0, full since 16.0Partial (see below){{ CompatUnknown() }}29.0
<video>: H.264 and AAC in MP4Partial (see below)24.0Partial (see below)10.0Partial since 11.0, full since 16.0Partial (see below)3.229.0
any other format{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+ +

Notes:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
PlatformGecko (Firefox) version
Windows 7+21.0
Windows Vista22.0
Android20.0
Firefox OS15.0
Linux +

26.0 (relies on GStreamer codecs being installed)

+
OS X 10.7Not yet (see bug)
+ + + +

See also

+ + diff --git a/files/zh-tw/conflicting/web/opensearch/index.html b/files/zh-tw/conflicting/web/opensearch/index.html new file mode 100644 index 0000000000..780e92fb84 --- /dev/null +++ b/files/zh-tw/conflicting/web/opensearch/index.html @@ -0,0 +1,36 @@ +--- +title: 自網頁添加搜尋引擎 +slug: Web/API/Window/sidebar/Adding_search_engines_from_Web_pages +tags: + - 搜尋模組 +translation_of: Web/OpenSearch +translation_of_original: Web/API/Window/sidebar/Adding_search_engines_from_Web_pages +--- +

Firefox 可以用 JavaScript 安裝搜尋引擎模組，且支援 OpenSearch 及 Sherlock 兩種模組格式。 +

+
註： 自 Firefox 2 起，偏好的模組格式為 OpenSearch。
+

當 JavaScript 程式碼要安裝新的搜尋模組時，Firefox 會詢問使用者是否允許安裝。 +

+

安裝 OpenSearch 模組

+

要安裝 OpenSearch 模組，必須使用 window.external.AddSearchProvider() DOM 方法。此方法的語法為： +

+
window.external.AddSearchProvider(搜尋模組 URL);
+
+

其中 搜尋模組 URL 為搜尋引擎模組之 XML 檔的絕對連結 URL。 +

+
注意： OpenSearch 自 Firefox 2 起的版本才支援。
+

安裝 Sherlock 模組

+

要安裝 Sherlock 模組，必須叫用 window.sidebar.addSearchEngine() 方法，語法為： +

+
window.sidebar.addSearchEngine(搜尋模組 URL, 圖示 URL, 建議名稱, 建議分類);
+
+ +

Sherlock 的相關資訊可參考 http://developer.apple.com/macosx/sherlock/ +

+
+
+{{ languages( { "ca": "ca/Addici\u00f3_de_motors_de_cerca_a_les_p\u00e0gines_web", "en": "en/Adding_search_engines_from_web_pages", "es": "es/A\u00f1adir_motores_de_b\u00fasqueda_desde_p\u00e1ginas_web", "fr": "fr/Ajout_de_moteurs_de_recherche_depuis_des_pages_Web", "it": "it/Installare_plugin_di_ricerca_dalle_pagine_web", "ja": "ja/Adding_search_engines_from_web_pages", "pl": "pl/Dodawanie_wyszukiwarek_z_poziomu_stron_WWW" } ) }} diff --git "a/files/zh-tw/core_javascript_1.5_\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" "b/files/zh-tw/core_javascript_1.5_\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" deleted file mode 100644 index c7fe61614d..0000000000 --- "a/files/zh-tw/core_javascript_1.5_\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" +++ /dev/null @@ -1,9 +0,0 @@ ---- -title: Core JavaScript 1.5 正規表達式的建立 -slug: Core_JavaScript_1.5_正規表達式的建立 ---- -

 

- -

This page was auto-generated because a user created a sub-page to this page.

- -

 

diff --git a/files/zh-tw/cross-site_xmlhttprequest/index.html b/files/zh-tw/cross-site_xmlhttprequest/index.html deleted file mode 100644 index 9ffdd6ca6e..0000000000 --- a/files/zh-tw/cross-site_xmlhttprequest/index.html +++ /dev/null @@ -1,108 +0,0 @@ ---- -title: Cross-site XMLHttpRequest -slug: Cross-site_XMLHttpRequest ---- -

Firefox 3 支援了 W3C Access Control working draft，這讓你可以對其他網站作 XMLHttpRequests 以取得其他網站的資料，並加以管理，在自己建立的網站中，混入來自多個其他網站的內容。

-

Firefox 3 支援 Cross-site XMLHttpRequest

-

概觀

-

W3C 存取控制（The W3C Access Control）的架構讓客戶端文件對於誰可以、誰不可以向它們發出「以瀏覽器為基礎的 request」（例如 XMLHttpRequest）有更好的控制。 -

除此之外，這個 access control scheme 讓網路應用程式擁有允許「跨站要求（cross-site request）」的能力。理論上，這讓你在部署好存取控制點（Access Control Point）後，可以由 yoursite.com 的一個頁面透過 XMLHttpRequest 向 google.com 要求一份文件。這個層級的控制，讓管理網站內容的人員在決定是否「讓他們的使用者建立混合不同網站內容的網頁（mashup）或網站應用程式」時更有彈性。 -

-

用法

-

在 Firefox 3，要使用 W3C 存取控制（W3C Access Controls）有兩個方法。第一個是透過「加入新的存取控制檔頭」（在任何 Resouece Type 都能運用此方式，但你對網站伺服器必須有較高的控制權），另一個是透過「存取控制處理指示」（The Access-control Processing Instruction）（僅能用於 XML 文件）。 -

-

存取控制檔頭（Access-Control Headers）

-

這是在允許跨站的 XMLHttpRequests 時最有彈性的作法。如果你在你的 Request Response 中加入額外的存取控制檔頭，像下面這樣，你就可以給予 mozilla.org 上的任何網路應用程式擁有存取的權限。 -

-
Access-Control: allow <mozilla.org>
-

存取控制檔頭讓你有能力可以依據來源、要求方式（request method）來決定是否給予、或拒絕別人存取特定資源。 -

例如，下面這些都是有效的存取控制檔頭： -

-
 // 任何人都可以存取這項資源 - 沒有限制
- Access-Control: allow <*>
-
- // 任何人都不可以存取這項資源 - 沒有例外
- Access-Control: deny <*>
-
- // 只有在 'mozilla.org' 上面的網站可以存取這項資源
- // （這也包含了 sub-domains）
- Access-Control: allow <mozilla.org>
-
- // 除了 developer.mozilla.org 以外，其他所有 mozilla.org　的 sub-domain 都可以存取這項資源
- Access-Control: allow <mozilla.org> exclude <developer.mozilla.org>
-
- // 只有這個 domain、在這個 port、運用此方式的 request 可以存取這項資源
- Access-Control: allow <developer.mozilla.org:80> method GET, POST
-
-

在 W3C Access Control working draft 有更多例子可看。 -

-
例子
-

XML Processing Instruction

-

XML 有「include 額外命令讓 XML processor 針對它特別處理」的能力。The Access Control draft 就是利用這種特性指定了一種額外的命令，讓 XML 文件變成可以在遠端被跨站存取。 -

例如： 使用下列存取控制處理指示 （access-control processing instruction）會給 mozilla.org 上的任何網站有存取 XML 文件的能力： -

-
 <?access-control allow="mozilla.org"?>
-
-

這裡有一些使用存取控制處理指示（access-control processing instruction）來給予 XML 文件存取權限的簡單例子： -

-
 // 任何人都可以存取這項資源 - 沒有限制
- <?access-control allow="*"?>
-
- // 任何人都不可以存取這項資源 - 沒有例外
- <?access-control deny="*"?>
-
- // 只有在 'mozilla.org' 上面的網站可以存取這項資源
- // （這也包含了 sub-domains）
- <?access-control deny="mozilla.org"?>
-
-  // 除了 developer.mozilla.org 以外，其他所有 mozilla.org　的 sub-domain 都可以存取這項資源
- <?access-control allow="mozilla.org" exclude="developer.mozilla.org"?>
-
- // 只有這個 domain、在這個 port、運用此方式的 request 可以存取這項資源
- <?access-control allow="developer.mozilla.org" method="GET POST"?>
-
-

你可以在 W3C Access Control working draft 中找到更多例子。 -

-
例子
-

這個簡單的例子從一個網站向另一個網站要求 XML 檔。這個 XML 檔包含了「存取控制的處理指示」（Access-control processing instruction），這些指示給予任何向伺服器發出要求的網站存取的權限。如果你複製 ac.html 到你自己的伺服器，你就會看到 request 仍然可以作用（因為所有網站都被允許向它發出請求）。 -

ac.html -

-
 <html>
- <head>
- <script>
- window.onload = function(){
-   var xhr = new XMLHttpRequest();
-   xhr.open("GET", "http://dev.jquery.com/~john/xdomain/test.xml", true);
-   xhr.onreadystatechange = function(){
-     if ( xhr.readyState == 4 ) {
-       if ( xhr.status == 200 ) {
-         document.body.innerHTML = "My Name is: " +
-           xhr.responseXML.getElementsByTagName("name")[0].firstChild.nodeValue;
-       } else {
-         document.body.innerHTML = "ERROR";
-       }
-     }
-   };
-   xhr.send(null);
- };
- </script>
- </head>
- <body>
- Loading...
- </body>
- </html>
-
-

test.xml -

-
 <?xml version="1.0" encoding="UTF-8"?>
- <?access-control allow="ejohn.org"?>
- <simple><name>John Resig</name></simple>
-
-

延伸閱讀

- -
-
-{{ languages( { "en": "en/Cross-Site_XMLHttpRequest", "fr": "fr/Requ\u00eates_XMLHttpRequest_inter-sites", "ja": "ja/Cross-Site_XMLHttpRequest", "pl": "pl/\u017b\u0105dania_XMLHttpRequest_przesy\u0142ane_mi\u0119dzy_witrynami" } ) }} diff --git "a/files/zh-tw/dom_\350\247\200\345\257\237\345\231\250/index.html" "b/files/zh-tw/dom_\350\247\200\345\257\237\345\231\250/index.html" deleted file mode 100644 index 9b597bb306..0000000000 --- "a/files/zh-tw/dom_\350\247\200\345\257\237\345\231\250/index.html" +++ /dev/null @@ -1,5 +0,0 @@ ---- -title: DOM 觀察器 -slug: DOM_觀察器 ---- -
diff --git a/files/zh-tw/dragdrop/index.html b/files/zh-tw/dragdrop/index.html deleted file mode 100644 index 8113a786ec..0000000000 --- a/files/zh-tw/dragdrop/index.html +++ /dev/null @@ -1,5 +0,0 @@ ---- -title: DragDrop -slug: DragDrop ---- -This page was auto-generated because a user created a sub-page to this page. diff --git "a/files/zh-tw/firefox_3.5_\346\212\200\350\241\223\346\226\207\344\273\266/index.html" "b/files/zh-tw/firefox_3.5_\346\212\200\350\241\223\346\226\207\344\273\266/index.html" deleted file mode 100644 index 0d151ee276..0000000000 --- "a/files/zh-tw/firefox_3.5_\346\212\200\350\241\223\346\226\207\344\273\266/index.html" +++ /dev/null @@ -1,240 +0,0 @@ ---- -title: Firefox 3.5 技術文件 -slug: Firefox_3.5_技術文件 -tags: - - Firefox - - Firefox 3.5 ---- -

Firefox 3.5 加入很多新功能，當然也加強了對各式網際標準的支援程度。這篇文章大致說明改進的部份、詳細的說明可見英文版原文。

-

限於人力，大部分的文章都是英文版。如果您有興趣，請協助翻譯。

-

3.5 技術面新功能

-

網站、網際程式部份

-

加強支援 HTML 5

-
-
- 在 Firefox 中操作影片、音效
-
- Firefox 3.5 支援 HTML 5 的 audio 及 video 元素。藉由原生支援，影片、音效可以經由 JavaScript 直接操作 (播放、暫停等)。目前只支援 Ogg 及 WAV 兩種格式的影音檔，未來可能支援其他的格式。
-
- 離線資源
-
- Firefox 3.5 現在完整支援 HTML 5 的離線資源規格。需注意的是，在 Firefox 3 雖已經支援部份規格、但由於推出後 HTML 5 離線資源規格已然修改，是以毋需再針對 Firefox 3 設計相關程式。3.5 支援的是最新的規格。
-
- 拖放事件
-
- HTML 5 拖放 (drag & drop) API 提供在網站內 (甚至跨網站) 拖放物件的相關功能。同時，這也讓 Mozilla 相關的程式擴充套件有了比較簡單的 API 可以使用。
-
-

新增功能：CSS 部份

-
-
- 動態下載字形
-
- 新支援的 @font-face 樣式規則，網頁可以藉此提供字形讓使用者動態下載、以設計師所期待的最佳字形檢視網頁。
-
- CSS 媒介判讀
-
- Firefox 3.5 現在支援 CSS 媒介判讀 (media queries)，可以讓不同的媒介使用不同的樣式規則。
-
- 更新 ::before 及 ::after 行為以符合 CSS 2.1
-
- ::before 及 ::after 兩個擬態元素 (pseudo-element) 已經更新，以便完整支援 CSS 2.1 相關規格。新增關於 position、float、list-style-* 及部份 display 特性。
-
-
-
- opacity
-
- Mozilla 先前提供的 -moz-opacity 特性已經停止支援，請改用標準的 opacity 特性。
-
- text-shadow
-
- Firefox 3.5 開始支援 text-shadow 特性，可以為網頁上的文字加上陰影效果。
-
- word-wrap
-
- 此特性可設定是否允許某行文字溢出版面時自動調整斷行。
-
- -moz-box-shadow
-
- -moz-border-image
-
- -moz-column-rule
-
- -moz-column-rule-width
-
- -moz-column-rule-style
-
- -moz-column-rule-color
-
- -moz-column-gap
-
- Firefox 3.1 開始新增上述 Mozilla 擴充特性。
-
- -moz-nativehyperlinktext 色彩值
-
- 新的色彩設定值，顯示為系統的預設連結色彩。
-
- -moz-window-shadow 及 -moz-system-metric(mac-graphite-theme) 特性
-
- 為了方便佈景主題製作而新增的 CSS 特性。
-
- -moz-appearance 支援新設定值
-
- -moz-appearance 開始支援 -moz-win-glass 及 -moz-mac-unified-toolbar 兩種新設定值。
-
- CSS 變形
-
- Firefox 3.5 開始支援 CSS 變形特性，詳情請見 -moz-transform 及 -moz-transform-origin。
-
- :nth-child
-
- :nth-last-child
-
- :nth-of-type
-
- :nth-last-of-type
-
- :first-of-type
-
- :last-of-type
-
- :only-of-type
-
- Firefox 3.5 開始支援上述選取符。
-
-

新增功能：DOM 部份

-
-
- DOM 背景工作序
-
- Firefox 3.5 支援 DOM 背景工作緒 (workers)，方便網際應用程式以多執行緒方式執行。
-
- 地理位置
-
- Firefox 3.5 支援地理資訊 (Geolocation) API，在安裝有相關元件 (Geolocation provider)並啟用的狀態下、允許網際應用程式取得使用者目前的所在地。
-
- 在 Firefox 中使用 JSON
-
- DOM 已經整合對 JSON 的支援。
-
-
-
- 以選取符取用 DOM 元素
-
- 選取符 API 讓開發人員以類似 CSS 的選取符指定 DOM 元素方便操作。
-
- NodeIterator 物件
-
- NodeIterator 提供在DOM子樹中對節點列表進行往返（iterating）的支援。
-
- MozAfterPaint 事件
-
- 新 DOM 事件，在視窗重繪時觸發。
-
- MozMousePixelScroll 事件
-
- 新 DOM 事件，允許偵測滑鼠滾輪事件，且是以像素為單位、非以往的「行」。
-
-

新增功能：JavaScript

-
-
- Object.getPrototypeOf()
-
- 傳回指定物件的原型。
-
- 字串物件的「修剪」方法
-
- String 物件現在可藉 trim()、trimLeft() 及 trimRight() 等方法清除空白部份。
-
-

其他新功能

-
-
- ICC 色彩校正
-
- Firefox 3.5 現在支援圖片的 ICC 色彩校正。
-
- script 元素支援 defer 屬性
-
- 此屬性讓瀏覽器可以決定是否要等待此段腳本執行完畢後再繼續分析、繪制網頁。
-
- 控制預讀 DNS
-
- Firefox 3.5 提供預讀 DNS 功能，不必等到真的按下連結、就可以先行處理本頁裡各連結網址的域名查詢，讓使用者感覺更快。本文說明操作這個行為的方法，包括如何停用、如何調整此功能。
-
-

新增功能：Canvas 部份

-
-
- canvas 元素中的 HTML 5 text API
-
- Canvas 元素開始支援 HTML 5 text API。
-
- canvas 支援陰影效果
-
- 此版開始支援 Canvas 陰影效果。
-
- moz-opaque 屬性
-
- 增加 moz-opaque DOM 屬性，指定 canvas 是否需要使用透明效果。如果一開始就確定不會有透明效果、那麼繪製的效率便能最佳化。
-
-

新增功能：SVG 部份

-
-
- 在 HTML 內容中套用 SVG 特效
-
- 你現在可以在 HTML 及 XHTML 內容中套用 SVG 特效。
-
-

其他改良要點

- -

XUL 及套件開發相關

-

如果您曾開發擴充套件，那麼請先閱讀為 Firefox 3.5 更新套件（英文），裡頭說明了新版本對套件可能衍生的影響。

-

新元件、函式

-
-
- 跨網域 HTTP 存取控制
-
- 當伺服器提供相關支援，則 Firefox 3.5 可以操作包含 XMLHttpRequest 在內的跨網域 HTTP 存取方式。
-
- XMLHttpRequest 進度事件
-
- 讓擴充套件得以監控相關進度。
-
- 支援隱密瀏覽模式
-
- Firefox 3.5 支援隱密瀏覽模式，不會紀錄使用者的活動。擴充套件如需支援隱密模式，可以參考這份文件。
-
- Firefox 3.5 安全相關變動
-
- Firefox 3.5 安全性相關的變動說明。
-
- Firefox 3.5 佈景主題變動
-
- Firefox 3.5 佈景主題相關的變動說明。
-
-

其他值得一提的改良、改變

- -

{{ languages( { "en": "en-US/Firefox/Releases/3.5"} ) }}

diff --git "a/files/zh-tw/firefox_\344\270\255\347\232\204\351\233\242\347\267\232\350\263\207\346\272\220/index.html" "b/files/zh-tw/firefox_\344\270\255\347\232\204\351\233\242\347\267\232\350\263\207\346\272\220/index.html" deleted file mode 100644 index 0b1180d3ca..0000000000 --- "a/files/zh-tw/firefox_\344\270\255\347\232\204\351\233\242\347\267\232\350\263\207\346\272\220/index.html" +++ /dev/null @@ -1,48 +0,0 @@ ---- -title: Firefox 中的離線資源 -slug: Firefox_中的離線資源 -tags: - - HTML5 離線 - - application cache ---- -

 

-

原文 : Using Application Cache

 

介紹

  HTML5 提供了 cache 機制，使得網路應用程式能較不受到網路狀態的影響。開發人員可以藉由 Application Cache (AppCache) 的介面來定義哪些資源應當被瀏覽器儲存起來 - 如此一來即使網路斷線使用者依舊可以取得這些資源。同時，應用程式也能正確的運行即使使用者按下了「重新載入」的按鈕。

  大抵來說，使用 Application Cache 可以取得下列好處：

  • 離線瀏覽：使用者可以在斷線/離線時瀏覽你的網站
  • 網站加速：善用 AppCache 就可以減少載入重複資源的狀況，進而加速網站讀取速度
  • 減少伺服器的負擔：瀏覽器僅只有在伺服器上資源發生變動時才重新抓取資料

application cache 運作的機制

啟動 application cache

  啟動 AppCache 的方法很簡單，你只需要在你程式頁面中，html 元素裡指名 manifest 的位置即可，這裡有個簡單範例：

<html manifest="example.appcache"> 
-  ...
-</html>
-

manifest 指向了一個 cache manifest 的檔案，他指出了在你的應用程式中哪些資源該當被瀏覽器儲存以作為快取。

  你應該在每一個你希望瀏覽器替你儲存資源的頁面加上 manifest。瀏覽器不會自作主張的去儲存 manifest 指定以外的資源。事實上，你並不需要列出所有你想要被快取的頁面，瀏覽器會儲存使用者曾經瀏覽過的所有頁面以及你指名的那些資源。

  某些瀏覽器 - 例如 FireFox - 會在使用者第一次讀取有使用 Application Cache 的時候提醒他們。提示訊息可能會是這樣：

This website (www.example.com) is asking to store data on your computer for offline use. [Allow] [Never for This Site] [Not Now]

The term "offline(-enabled) applications" sometimes refers specifically to applications that the user has allowed to use offline capabilities.

讀取文件

  Application Cache 的運作是基於讀取 manifest 檔案：

  • 倘若 application cache 存在，瀏覽器會直接取用本地端的快取而非經由網路請求資源。這可以加速網頁讀取。
  • 倘若 cache manifest 檔案被更新了，瀏覽器會下載新版的 manifest 並且依此and the resources listed in the manifest. This is done in the background and does not affect performance significantly.

  其運作流程如下：

  1. 當瀏覽器造訪一個有使用 AppCache 的網站時 (根據 <html> 判定)，若發現自己並沒有本地快取，就按照該 manifest 建立第一版的本地快取。
  2. 在接下來的瀏覽行為中，倘然觸及被快取的資源，瀏覽器將會直接自本地端給予回應。在此同時，瀏覽器也會傳送一個確認的事件給 window.applicationCache 物件，其會按照 HTTP cache rules 取回 manifest 檔案。
  3. 假使目前本地擁有的 manifest 已經是最新，瀏覽器將會送一個「不需更新」的事件給 applicationCache 物件。所以假設任何一個在伺服器端被你註明要被快取住的物件更動了，務必改動 manifest 檔案，如此一來使用者的瀏覽器才知道要重新下載所有的資源。
  4. 當 manifest 更新後，所有列在其中的資源會由 applicationCache.add()透過 HTTP caching rules 被重新抓取至本地的暫存快取。當一個檔案被抓到本地快取後，瀏覽器會送出 progress 的事件到 applicationCache 物件。如果發生了錯誤，瀏覽器會送出 error 事件並停止更新。
  5. 當所有資源都被成功的取得後，他們便會被真正地移到離線時也能存取的快取區。此時，cached 事件會被發送給 applicationCache 物件。此時瀏覽器已經能顯示畫面了，未來只有當使用者重新整理頁面、手動操作或被其他程式驅動才會重新從快取中讀到瀏覽器。

清除 application cache

  在 Chrome 中，使用者可以藉由選擇 preferences 中 Clear browsing data... 清除 application cache 的內容 (此外，也可以造訪 chrome://appcache-internals/ )。Safari 中也有類似的設計，你可以選用 preference 中的 Empty cache 達到一樣的目的 (但 safari 此時可能會要求你重啟瀏覽器)。

  而 Firefox 則將這些資料放置在一般的硬碟快取中 (非在 Firefox 的 profile 中)：

  • Windows Vista/7: C:\Users\<username>\AppData\Local\Mozilla\Firefox\Profiles\<salt>.<profile name>\OfflineCache
  • Mac/Linux: /Users/<username>/Library/Caches/Firefox/Profiles/<salt>.<profile name>/OfflineCache

使用者可以透過檢查 about:cache 中 Offline cache device 下的資訊來得知目前狀態。

  使用者可以清除特定網站的快取藉由 Tools -> Options -> Advanced -> Network -> Offline 中的 "Remove..." 按鈕。補充一下，以下兩個方法無法清除快取

  • Clear Recent History (bug 538595)
  • Options -> Advanced -> Network -> Offline data -> Clear Now (bug 538588)

相關資訊亦可參考  clearing the DOM Storage data 。

  Application cache 也會有失效的時候。當伺服器端移除了 manifest 後，瀏覽器會自動清除所有在本地端的快取，並且發送 obsoleted 的事件給 applicationCache 物件。這會使得 application cache 的狀態變為 OBSOLETE。

關於 cache manifest file

如何引用 cache manifest file

  在 manifest 中定義資源的路徑可以分為兩種 - 相對路徑及絕對路徑 (絕對路徑：起始點是 application 所在的那層目錄)。並且，manifest 的 MIME 格式必須為 text/cache-manifest。

cache manifest file 的起始點

  Manifest 文件中的資源必須以 URI 格式表示。所有列於 manifest 中的資源，他們的 scheme、host以及 port 都得和 manifest 文件一樣。

範例 1: 一個簡單的 cache manifest file

  這是一個簡單的範例, example.appcache, 我們假設他屬於 www.example.com

CACHE MANIFEST
-# v1 - 2011-08-13
-# This is a comment.
-http://www.example.com/index.html
-http://www.example.com/header.png
-http://www.example.com/blah/blah
-

  一個 manifest 檔案可以有三種不同的段落 - CACHE、NETWORK 以及 FALLBACK (容後再敘)。在 example.appcache 中我們並未指定段落名，是以所有資源會被以預設方式解析，也就是「需要被加到快取」(意義上屬於 CACHE 段)。如前所提到，資源可以用相對或絕對路徑表示(例如可以把 http://www.example.com/index.html 改為 index.html)。

  在這裡要特別指出被放置在註解中的「v1」字樣。顯然他表達的是版本資訊。但在 manifest 中這樣的表達方式有大用。假設今天 header.png 改變了，你只需要改動版本資訊 (或註解中的內容)，則此 manifest 就會被認為有改變而使得瀏覽器重新抓取快取。當然你可以改動檔案中的其他部分，可是改變版本號是比較建議的方式。

重要提醒: 請勿將 manifest 檔案本身也列在 manifest 內容中，否則將使瀏覽器無法辦別 manifest 是否已被更新。這將使整個 application cache 機制失效。

cache manifest file 中的分類段落: CACHE, NETWORK, and FALLBACK

  在 manifest 中我們可以有三種不同的段落： CACHE、 NETWORK 以及 FALLBACK。

CACHE:
這是預設的段落。列於 CACHE 段落下的資源列表將在使用者第一次造訪時就被加到快取中。
NETWORK:
列於這個段落的資源表示一定得透過網路抓取而不從快取取得。可以使用萬用字元表示內容。
FALLBACK:
FALLBACK 指出了一種替代關係。在這個段落裡的每一行都有兩種 URI，其一指名有網路連線時使用的資源，第二個則是斷線時使用。這兩個 URI 的根目錄必須是相對於 manifest。可以使用萬用字元表示內容。

  這三種不同段落可以以任意順序出現在 manifest 中，並且都可出現多次而無次數限制。

範例 2: 稍微複雜點的 cache manifest file

  這裡我們來看看稍微複雜點的 manifest。他存在於一個虛擬的網站 www.example.com：

CACHE MANIFEST
-# v1 2011-08-14
-# This is another comment
-index.html
-cache.html
-style.css
-image1.png
-
-# Use from network if available
-NETWORK:
-network.html
-
-# Fallback content
-FALLBACK:
-/ fallback.html
-

  這個範例中使用了 NETWORK 以及 FALLBACK：

  • NETWORK：network.html 只能透過網路取回而不從快取。
  • FALLBACK：倘若沒有網路連線就使用 fallback.html (這裡寫法意思是說無法讀取到網站的/ ，也就是無法顯示網站)

cache manifest file 的結構

  Cache manifest 檔案應該被定義成 text/cache-manifest 的 MIME 格式。而所有被定義成 text/cache-manifest MIME 格式的檔案將被以本章所規範的語法解析。

  首先，Cache manifests 必須是一個 UTF-8 格式的文字檔。檔案中可以被嵌入 BOM (Byte-Order Mark)字元，舉例來說，換行會被表示成 「line feed (U+000A)」、「 carriage return (U+000D)」或 「carriage return 及 line feed both」。

  第二，cache manifest 的第一行必須是「CACHE MANIFEST」字串 (CACHE 和 MANIFEST 中間的那個空白是一個 U+0020 符號)，其後可以任意加入 space 或 tab 字符。以這一行來說，其他被加入的字串將會被忽略。

  最後，檔案中的剩餘部份是由零至多個下列所述的項目構成：

Blank line
空白行。你可以任意用 space 或 tab 去產生新的一行。
Comment
註解。指的是以 # 起始的行。要注意 # 只在該行有效，你不能在後附加上其他行 (若你有多行註解，請在每行起始都加上 #)。
Section header
段落標頭。這裡指的是在前面我們討論過 CACHE、 NETWORK 以及 FALLBACK：
Section header Description
CACHE: 其後內容指出哪些資源需要被加到瀏覽器的快取中
NETWORK: 其後內容指出哪些資源一定得從網路取得
FALLBACK: 其後內容指出資源在有網路連線及斷線時的替代關係
段落標頭行可以含有空白，但要記得在最後加上 「：」字元。
Section data
段落資料。其格式隨著不同段落而有所不同。在 CACHE 段落，每一行必須是符合規則的 URI 或 IRI (IRI 類似於 URI，但可使用 unicode)，此外，在 CACHE 段落中不得使用萬用字元，但可自由使用空白 (前提自然是不能破壞 URI/IRI 內容)。而在 NETOWKR 段落中，其內容為符合規則之 URI/IRI，並可以使用萬用字元。最後，在 FALLBACK 段落，其每一行的構成是先寫出合於規則的 URI/IRI，接著寫出倘若網路不通時該用何資源取代。
注意：倘若使用相對路徑的 URI，那麼其相對的位置是「cache manifest 檔案的 URI」。

  Cache manifest 檔是以上述三種段落來依序判讀，是以每一段落可出現一次以上。甚至你也可以寫出內容為空的段落。

Application cache 中的資源

  Application cache 總是含有至少一個資源，並以 URI 形式敘述。下面列出資源種類，manifest 中的資源必屬其中。

Master entries
這是一個瀏覽的入口，其引用了 manifest 檔案。
Explicit entries
描述 CACHE 段落的入口。
Network entries
描述 NETWORK 段落的入口。
Fallback entries
描述 FALLBACK 段落的入口。
注意： R同一種資源可以屬於多種不同種類，例如一個 entry 可以同時是 explicit entry 和 fallback entry。

 關於這些資源種類，下面會有更詳細的說明。

Master entries

  Master entries 是一種在他們 {{ HTMLElement("html") }} element 中含有 {{ htmlattrxref("manifest","html") }} attribute 的 HTML 檔。舉例來說，如果我們說我們有一個 http://www.example.com/entry.html 的 HTML 檔，其內容為：

<html manifest="example.appcache">
-  <h1>Application Cache Example</h1>
-</html>
-

如果 entry.html 並未被列在 example.appcache 中，幫妳拜訪 entry.html 時，他就會被加到 application cache 中，並被指明為一個 master entry。

Explicit entries

  這指出了哪些檔案需要被存到快取中。

Network entries

  這指出了哪些檔案一定得透過網路取得。可以看成是列出了一張線上白名單 (online whitelist)，提示了有些東西必須得透過網路向伺服器抓取。這有很多好處，其中一個好處是可以避開些安全漏洞，避免某些認證結果從本地端讀取而造成危險 (如果這個認證結果被竄改的話 ... )。

  這裡有個例子，你可以要求執行的腳本一定得透過網路向伺服器抓取：

CACHE MANIFEST
-NETWORK:
-/api
注意： Simply有人可能會覺得「一定向伺服器抓取資料」的這件事也可以透過把他們放置在 master entry 達成，但事實上 master entry 會被加入到 application cache 中。

Fallback entries

   Fallback entry 的使用時機在於網路可能斷線。直接看例子，當我們說有個 manifest (http://www.example.com/example.appcache)，其檔案內容是：

CACHE MANIFEST
-FALLBACK:
-example/bar/ example.html
-

任何企圖抓取 http://www.example.com/example/bar/ 或其子資料夾的請求若是失效，瀏覽器會讀取 example.html 作為替代。

Cache 的狀態

  每一個 application cache 都有一個 state，表明目前在瀏覽器端的狀態。共用同一個 manifest URI 的 cache 擁有一樣的狀態。狀態的種類如下：

UNCACHED
這是特殊的一個狀態，代表 cache 物件尚未初始化。
IDLE
代表 cache 並非處於更新中的狀態。
CHECKING
目前正在向伺服器端抓取 manifest 檔案以確認是否接下來要有更新資源的動作。
DOWNLOADING
因為 manifest 的更新，資源已經被下載到本地端的快取中。
UPDATEREADY
有一個新版的 application cache 是可用的狀態。這搭配著 updateready 的事件。相對於 cached 事件，他的意思是有新版的更新已經在本地，但尚未呼叫 swapCache()函式。
OBSOLETE
Application cache 群組現在處於過時的狀態。

測試 cache manifest 的更新

  你可以經由撰寫 JavaScript 程式來關注是否 manifest 檔有所更新。但未免在你漏失在 Listener 完成註冊之前就完成的事件，務必檢查 window.applicationCache.status。如下所示：

function onUpdateReady() {
-  alert('found new version!');
-}
-window.applicationCache.addEventListener('updateready', onUpdateReady);
-if(window.applicationCache.status === window.applicationCache.UPDATEREADY) {
-  onUpdateReady();
-}

   倘若你想手動的去測試 manifest 檔案是否更新，你可以使用 window.applicationCache.update()。

注意 !!!

  • 當 application cache 的機制被啟動，程式撰寫員無法簡單的透過更新資源本身就取得目前伺服器上最新的版本 (或許你已經自本地端快取讀出資源了！)。你必須在瀏覽器讀取資源之前就更新 manifest 檔。這個動作可以透過 window.applicationCache.swapCache() 達到，但在此刻已經被讀取的資源將不受影響。最好的方式是重新刷新頁面。
  • 一個好的主意是是為你伺服器上所有副檔名為 appcache 的檔案設定為已經失效 (set expires headers)。這可以避免 manifest 被加到快取中的風險。以 Apache 為例，你可以這麼做：
    ExpiresByType text/cache-manifest "access plus 0 seconds"

支援 Application Cache 的瀏覽器們

{{ CompatibilityTable() }}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 4.0 3.5 10.0 10.6 4.0
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 2.1 {{ CompatUnknown() }} {{ CompatNo() }} 11.0 3.2

附註：先於 3.5 版以前的FireFox 忽略了 manifest 檔案中 NETWORK 以及 FALLBACK 的部分。

參考資料

{{ HTML5ArticleTOC() }}

{{ languages( { "es": "es/Recursos_offline_en_firefox", "fr": "fr/Ressources_hors_ligne_dans_Firefox", "ja": "ja/Offline_resources_in_Firefox", "pl": "pl/Zasoby_offline_w_Firefoksie", "zh-tw": "zh_tw/Offline_resources_on_Firefox" } ) }}

-
diff --git a/files/zh-tw/glossary/xhtml/index.html b/files/zh-tw/glossary/xhtml/index.html new file mode 100644 index 0000000000..d147c26fee --- /dev/null +++ b/files/zh-tw/glossary/xhtml/index.html @@ -0,0 +1,29 @@ +--- +title: XHTML +slug: XHTML +translation_of: Glossary/XHTML +--- +

 

+

XHTML 對 XML 而言是什麼，就如同 HTML 對 SGML 而言是什麼。也就是說，XHTML 是一種類似於 HTML 的標記語言，但是有更嚴格的語法。W3C 已完成兩種 XHTML 版本︰

+ +

第三個版本，XHTML 2，對於元素詞彙有非常重大的改變，目前仍在開發中。

+

關於 XHTML 的更多資訊，請見︰

+ +

工具

+ +

參閱

+ +

檢視全部...

+

{{ languages( { "en": "en/XHTML", "fr": "fr/XHTML", "es": "es/XHTML", "it": "it/XHTML", "ja": "ja/XHTML", "pt": "pt/XHTML", "pl": "pl/XHTML" } ) }}

diff --git a/files/zh-tw/html5_cross_browser_polyfills/index.html b/files/zh-tw/html5_cross_browser_polyfills/index.html deleted file mode 100644 index d823a44760..0000000000 --- a/files/zh-tw/html5_cross_browser_polyfills/index.html +++ /dev/null @@ -1,34 +0,0 @@ ---- -title: HTML5 跨瀏覽器兼容程式碼 -slug: HTML5_Cross_Browser_Polyfills ---- -

這是個蒐集中文世界開發（但不一定原創）的跨瀏覽器兼容代碼、連結的地方，作為 Paul Irish《HTML5 Cross Browser Polyfills》的仿效文件。蒐集不會完全，因此也強烈建議繼續追蹤上述文件的進展，或是使用搜尋引擎。

-

歡迎貢獻新的代碼、連結，不過請注意放在這個地方的代碼皆屬於公有領域。

-

全頻（fullscreen）API

-

支援  Gecko:FullScreenAPI 草案的 {{ domxref("window.fullScreen") }} 與 {{ domxref("element.onfullscreenchange", "fullscreenchange") }} 事件 ，由贺师俊（hax）所提供：

-
if (!('fullScreen' in window)) Object.defineProperty(window, 'fullScreen', {
-  get: function() {
-  return (screen.width == window.outerWidth && screen.height == window.outerHeight)
-  }
-})
-
-var _fullScreen = window.fullScreen
-if (!('onfullscreenchange' in window)) window.addEventListener('resize', function() {
-  var f = window.fullScreen
-  if (f != _fullScreen) {
-    _fullScreen = f
-    fireSimpleEvent('fullscreenchange', document, {bubbles:true})
-  }
-}, false)
-
-function fireSimpleEvent(type, target, option) {
-  if (!target) target = document
-  if (!option) option = {}
-  var evt = document.createEvent('Event')
-  evt.initEvent(type, !!option.bubbles, !!option.cancelable)
-  return target.dispatchEvent(evt)
-}
-
-

中文排版

- diff --git a/files/zh-tw/learn/css/howto/css_faq/index.html b/files/zh-tw/learn/css/howto/css_faq/index.html new file mode 100644 index 0000000000..b824c671c4 --- /dev/null +++ b/files/zh-tw/learn/css/howto/css_faq/index.html @@ -0,0 +1,165 @@ +--- +title: CSS 一般問題 +slug: Web/CSS/Common_CSS_Questions +tags: + - CSS + - 待審閱技術 + - 待審閱文字 + - 所有類別 +translation_of: Learn/CSS/Howto/CSS_FAQ +--- +

+

+

我的 CSS 合乎規格，但繪出的版面有誤

+

如果想讓大部分的瀏覽器都能正確繪製標準 HTML/CSS 頁面，便須於 HTML 檔案中放上完整的正確 DOCTYPE。 +

新近瀏覽器都有兩種佈局模式： +

+ +

以 Gecko 為核心的瀏覽器都有第三種近乎標準模式，其中只有一些些不合規範的地方。 +

如果你宣告的 DTD 不合標準或過期了，那麼瀏覽器就會進入 Quirks 模式。 +

以下是常用的 DTD 列表，可以讓瀏覽器進入標準或近乎標準模式。 +

+
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
+"http://www.w3.org/TR/html4/loose.dtd">
+
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
+"http://www.w3.org/TR/html4/strict.dtd">
+
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+
+

id 與 class 之間的差別

+

HTML 元素都可有 id 及 class 屬性。id 屬性是讓你為元素命名的，整個頁面中的元素名稱也不應有重複；class 屬性則可將元素歸為某特定類別，通常也會有很多元素屬於同一種類別 (意即 class 屬性值相同。) CSS 可以讓你以 id 或 class 來決定某元素的樣式。 +

如果你想指定某特定單一元素的樣式，則應使用 id。 +

+
+

若有很多個元素皆有相同樣式，則可使用 class。 +

這方面的資訊亦可參考 CSS 選取符。 +

+
+

恢復某特性的預設值

+

CSS2 並不提供任何指定某特性預設值的方法，所以要恢復某特性預設值的唯一方法就是重新指定此值。此外你自己得知道預設值是什麼，因為 CSS 也沒有所謂 default 的關鍵字。 +

所以，以選取符撰寫樣式時須特別注意 (例如以標籤名稱 p 作為選取符)，或許可以用更明確的選取符 (例如 ID 或 class)。以標籤名稱作選取符茲事體大，一旦使用便將影響整個網頁，而且沒有自動恢復預設值的方法。 +

此外，由於 CSS 具串聯特性，指定選取符時通常越明確越好，以免把不相干的元素都牽扯進來。 +

+

相依樣式

+

CSS 並不支援「以另一個樣式規則為基準」的樣式設定法。 (參考 Eric Meyer 所寫、關於 CSS 工作小組的說明。) 不過，你可以為某單一元素套上多重樣式，製作出類似效果。 +

+

套用多重類別

+

你可以在 HTML 元素的 class 屬性裡以空白字元分隔填上多個樣式類別名稱，便能同時套用多重類別。 +

+
<style type="text/css">
+.firstclass { background: black; color: white; }
+.secondclass { font-weight: bold; }
+</style>
+
+<div class="firstclass secondclass">
+... content ...
+... content ...
+... content ...
+</div>
+
+

若是這些規則中設定了同一種特性值，則會依序以明確性（specificity）、定義位置先後決定顯示方式，與class 屬性中的次序無關。 +

+

無用樣式

+

即使樣式規則已經正確設定完畢，還是可能為瀏覽器所忽略，此時通常是經過語法及優先權法則判斷後的正常現象。 +

以下是導致樣式被略過的常見情形： +

+ +

你可以使用 DOM 觀察器 的 CSS Style Rules 來檢查上述問題。 +

HTML 元素層次問題 +

此時 CSS 樣式套用與否與元素的層次大有相關，請留意：套用到子元素的樣式必定會蓋過母元素的樣式，跟明確性或 CSS 規則的優先權無關。 +

+
#section { font-weight: bold; }
+.redtext { font-weight: normal; color: red; }
+
+<div id="section">
+   粗體、
+   <span class="redtext">正常紅字、</span>
+   又見粗體
+</div>
+
+

如果你的 HTML 層級錯綜複雜，發生規則意外被忽略的情形時，請檢查元素層級問題。可能有某個子元素套上了不該用的樣式。 +

樣式規則重新定義 +

在 CSS 樣式表中，先後次序非常重要。如果你定義了某規則後又重新定義一次，則晚定義的才算數。 +

+
#section { font-weight: bold; }
+.redtext { color: red; }
+/* 其他規則 */
+/* 其他規則 */
+/* 其他規則 */
+.redtext { color: green; }
+
+<div id="section">
+粗體、
+<span class="redtext">正常紅字？</span>
+又見粗體
+</div>
+
+

為避免此類錯誤發生，每個特定選取符請僅定義一次樣式，集中特性一次定義也便於管理些。 +


+特性的簡寫法 +

使用簡寫法來定義樣式簡明扼要，是個不錯的方法。你也可以用簡寫法設定某組特性中的部分特性值，但須留意其他沒寫到的部分會自動採用預設值。這表示之前的規則中為某單一特性定義的值可能失效。 +

+
#section { font-size: 12px; font-family: Verdana; font-weight: bold; }
+.redtext { font: 14px Arial; color: red; }
+
+<div id="section">
+   採用 Verdana 粗體的 12px 字樣；
+   <span class="redtext">採用 Arial 正常字體的 14px 紅字；</span>
+   還是採用 Verdana 粗體的 12px 字樣。
+</div>
+
+

前一個例子中，套用到不同元素範圍的同族特性是問題所在，但就算特性都寫在同一條規則裡也可能出問題，因為順序真的很重要。 +

+
#section {
+   font-weight: bold;
+   font: 12px Verdana;  /* 有了這行，font-weight 又回到預設的 normal 了 */
+}
+
+


+使用 * 選取符 +

* 選取符表示任何元素皆符合，但使用上應多加小心。 +

+
body * { font-weight: normal; }
+#section { font: 12px Verdana; }
+.boldtext { font-weight: bold; }
+.redtext { color: red; }
+
+<div id="section">
+   正常、
+   <span class="boldtext">
+      <span class="redtext">正常紅字、</span>
+   </span>
+   又見正常。
+</div>
+
+

在此例中，選取符為 body * 的規則會套用到所有 body 內的元素，也包括 redtext，所以原先套用到 boldtext 的 font-weight: bold; 就被覆蓋為 font-weight: normal; 了。 +


+CSS 明確性 +

如果某元素會套用好幾條規則，則相衝突的特性就要靠規則的明確性來分高下。行內樣式（放在 HTML 各標籤的 style 屬性中）優先權最高，其次是以 id 做選取符的規則，再其次是以 class 套用的類別，最後則是單純以元素名稱當選取符的規則。 +

+
div { color: black; }
+#orange { color: orange; }
+.green { color: green; }
+
+<div id="orange" class="green" style="color: red;">是紅的！</div>
+
+

如果樣式規則的選取符分成好幾段，計算方式就更為複雜一些。需要瞭解完整資訊者，請參考 CSS 2.1 規格書的 6.4.3 一節。 +

+

-moz-* 特性是什麼玩意？

+

請見 Mozilla 擴充的 CSS。由於這些擴充規格不是 W3C 標準的一部分，因此並不建議使用。 +

+
+
+{{ languages( { "en": "en/Common_CSS_Questions", "pl": "pl/Cz\u0119ste_pytania_o_CSS" } ) }} diff --git a/files/zh-tw/learn/forms/how_to_structure_a_web_form/index.html b/files/zh-tw/learn/forms/how_to_structure_a_web_form/index.html new file mode 100644 index 0000000000..b403666795 --- /dev/null +++ b/files/zh-tw/learn/forms/how_to_structure_a_web_form/index.html @@ -0,0 +1,315 @@ +--- +title: 如何建構 HTML 表單 +slug: Learn/HTML/Forms/How_to_structure_an_HTML_form +translation_of: Learn/Forms/How_to_structure_a_web_form +--- +
{{LearnSidebar}}
+ +
{{PreviousMenuNext("Learn/Forms/Your_first_form", "Learn/Forms/Basic_native_form_controls", "Learn/Forms")}}
+ +

有了基礎後，我們就能探討表單元素，所提供的結構與文意之詳細資訊；還有各表單部份的相異之處。

+ + + + + + + + + + + + +
先決條件：對電腦還有 HTML 有基本理解。
目標：理解如何構建 HTML 表單並給予無障礙的語意化。
+ +

表單表單的彈性化令其成為 HTML 最複雜的結構之一。你能使用專用的表單元素和屬性，來構建任何類型的基本表單。使用正確的 HTML 表單結構能讓確保表單可用、且無障礙。

+ +

<form> 元素

+ +

{{HTMLElement("form")}} 元素會形式上的定義表單和決定行為屬性。每次建立 HTML 表單時，都必須使用 form 元素；並將所有內容嵌進去。大多數的輔助技術與瀏覽器套件，都能抓到 {{HTMLElement("form")}} 元素，並實做特殊的 hook，使其更易於使用。

+ +

我們之前就講過這件事了。

+ +
注意：絕對不能在表單裡面再嵌入表單。這會讓表單行為變得難以理解，所以是一個壞主意。
+ +

你可以從表單外面控制 {{HTMLElement("form")}} 。這麼做的話，除非使用 form 將其與表單關聯，否則該操作預設上和任何表單無關。引入此功能是為了可以在即使該操作未嵌在表單中，其依舊能顯式地將操作與表單綁定。

+ +

接下來就開始探討表單裡面可能會嵌入什麼吧。

+ +

<fieldset> and <legend> 元素

+ +

{{HTMLElement("fieldset")}} 元素能方便地建立用途相近、樣式及語意化都很方便的小部件組（groups of widgets）。你可以透過添加 {{HTMLElement("legend")}} 來給 {{HTMLElement("fieldset")}} 的內部開頭添加標籤。{{HTMLElement("legend")}} 的文字內容能描述 {{HTMLElement("legend")}} 目的。

+ +

多數輔助科技會在 {{HTMLElement("legend")}} 元素被 {{HTMLElement("fieldset")}} 包住時偵測並使用它。比如說 Jaws 與 NVDA 之類的螢幕報讀器就會在讀到每個控件的標籤前，讀出 legend 的內容。

+ +

下面就有一個示例：

+ +
<form>
+  <fieldset>
+    <legend>Fruit juice size</legend>
+    <p>
+      <input type="radio" name="size" id="size_1" value="small">
+      <label for="size_1">Small</label>
+    </p>
+    <p>
+      <input type="radio" name="size" id="size_2" value="medium">
+      <label for="size_2">Medium</label>
+    </p>
+    <p>
+      <input type="radio" name="size" id="size_3" value="large">
+      <label for="size_3">Large</label>
+    </p>
+  </fieldset>
+</form>
+ +
+

註：你可以在fieldset-legend.html 觀察範例（或著觀察這個動態互動）。

+
+ +

在閱讀表單時，螢幕報讀器會針對第一個小部件組，說出「Fruit juice size small」、接著針對第二個小部件組，說出「Fruit juice size medium」、第三個則是「Fruit juice size large」。

+ +

這個示例的是最重要的用法之一：每次有一組 radio 按鈕時，就該在裡面放一個 {{HTMLElement("fieldset")}} 元素。{{HTMLElement("fieldset")}} 也能用在表單的其他地方。理想上，要是表單一長，就要把他放到其他頁面。但如果做不到這點，那將不同的相關部分，放在不同的 fieldsets 之中，也可以提高可用性。

+ +

由於 {{HTMLElement("fieldset")}} 對輔助技術的影響，這個元素是建立無障礙表單的基石，但請注意不要濫用這個元素。可以的話，聽聽螢幕報讀是怎麼講的。如果踢起來怪怪的，那就試著改進表單。

+ +

<label> 元素

+ +

正如上篇文章中所見，{{HTMLElement("label")}} 元素是定義 HTML 表單控件的正式方法。如果要構建無障礙的表單，這是最重要的元素：正確實做後，螢幕閱讀器會說出表單元素標籤、以及相關說明，同時也對有視力的用戶很有用。以這個例子為例，我們在上一篇文章中看過：

+ +
<label for="name">Name:</label> <input type="text" id="name" name="user_name">
+ +

在 <label> 元素透過 for 屬性與 <input> 元素的 id 屬性正確連結後，螢幕閱讀器就會讀出「Name, edit text」這樣的文字。

+ +

還有另一種控制標籤與表單控件關聯的方法：那就是把表單控件嵌在 <label> 元素裡面，以便隱式關聯。

+ +
<label for="name">
+  Name: <input type="text" id="name" name="user_name">
+</label>
+ +

但即使在這種情況下，最好還是設置 for 屬性，以確保所有輔具都能理解標籤和控件之間的關係。

+ +

如果沒有標籤、或著說表單控件沒有被顯式或隱式關聯，螢幕閱讀器會讀出沒啥幫助的「Edit text blank」。

+ +

標籤也能點喔！

+ +

使用標籤的另一個好處，就是能在點選該標籤後，啟動相對應的小部件。這種功能在控制文字輸入的時候會很好用：用戶點選標籤時就可以 focus 到 input 那邊。這對 button 與 checkbox 尤其有用：因為點選的區域可能很小，因此使它盡可能簡單地啟用，會是很有用的。

+ +

例如在下面的示例中，點選「I like cherry」標籤文字後會切換 taste_cherry checkbox 的點選狀態：

+ +
<form>
+  <p>
+    <input type="checkbox" id="taste_1" name="taste_cherry" value="cherry">
+    <label for="taste_1">I like cherry</label>
+  </p>
+  <p>
+    <input type="checkbox" id="taste_2" name="taste_banana" value="banana">
+    <label for="taste_2">I like banana</label>
+  </p>
+</form>
+ +
+

註：你可以在 checkbox-label.html 觀察示例（這裡有展示版本！）

+
+ +

多個標籤

+ +

嚴格來說，一個小部件組能放很多個標籤，但由於部分輔助科技處理上會有問題，所以這也不是個好點子。如果有多個標籤，請試著把巢狀各個小部件，並在裡面只安插一個 {{htmlelement("label")}} 元素。

+ +

來看看這個例子：

+ +
<p>Required fields are followed by <abbr title="required">*</abbr>.</p>
+
+<!-- So this: -->
+<div>
+  <label for="username">Name:</label>
+  <input id="username" type="text" name="username">
+  <label for="username"><abbr title="required" aria-label="required">*</abbr></label>
+</div>
+
+<!-- would be better done like this: -->
+<div>
+  <label for="username">
+    <span>Name:</span>
+    <input id="username" type="text" name="username">
+    <abbr title="required" aria-label="required">*</abbr>
+  </label>
+</div>
+
+<!-- But this is probably best: -->
+<div>
+  <label for="username">Name: <abbr title="required" aria-label="required">*</abbr></label>
+  <input id="username" type="text" name="username">
+</div>
+ +

{{EmbedLiveSample("Multiple_labels", 120, 120)}}

+ +

The paragraph at the top states a rule for required elements. The rule must be included before it is used so that sighted users and users of assistive technologies such as screen readers can learn what it means before they encounter a required element. While this helps inform users what an asterisk means, it can not be relied upon. A screen reader will speak an asterisk as "star" when encountered. When hovered by a sighted mouse user, "required" should appear, which is achieved by use of the title attribute. Titles being read aloud depend on the screen reader's settings, so it is more reliable to also include the aria-label attribute, which is always read by screen readers.

+ +

The above variants increase in effectiveness as you go through them:

+ + + +
+

Note: You might get slightly different results, depending on your screenreader. This was tested in VoiceOver (and NVDA behaves similarly). We'd love to hear about your experiences too.

+
+ +
+

Note: You can find this example on GitHub as required-labels.html (see it live also). don't test the example with 2 or 3 of the versions uncommented — screenreaders will definitely get confused if you have multiple labels AND multiple inputs with the same ID!

+
+ +

建立表單所常用的 HTML 結構

+ +

Beyond the structures specific to web forms, it's good to remember that form markup is just HTML. This means that you can use all the power of HTML to structure a web form.

+ +

As you can see in the examples, it's common practice to wrap a label and its widget with a {{HTMLElement("li")}} element within a {{HTMLElement("ul")}} or {{HTMLElement("ol")}} list. {{HTMLElement("p")}} and {{HTMLElement("div")}} elements are also commonly used. Lists are recommended for structuring multiple checkboxes or radio buttons.

+ +

In addition to the {{HTMLElement("fieldset")}} element, it's also common practice to use HTML titles (e.g. {{htmlelement("h1")}}, {{htmlelement("h2")}}) and sectioning (e.g. {{htmlelement("section")}}) to structure complex forms.

+ +

Above all, it is up to you to find a comfortable coding style that results in accessible, usable forms. Each separate section of functionality should be contained in a separate {{htmlelement("section")}} element, with {{htmlelement("fieldset")}} elements to contain radio buttons.

+ +

主動學習：建立表單結構

+ +

Let's put these ideas into practice and build a slightly more involved form — a payment form. This form will contain a number of control types that you may not yet understand. Don't worry about this for now; you'll find out how they work in the next article (Basic native form controls). For now, read the descriptions carefully as you follow the below instructions, and start to form an appreciation of which wrapper elements we are using to structure the form, and why.

+ +
    +
  1. To start with, make a local copy of our blank template file and the CSS for our payment form in a new directory on your computer.
    2. +
  2. Apply the CSS to the HTML by adding the following line inside the HTML {{htmlelement("head")}}: + 
    <link href="payment-form.css" rel="stylesheet">
    +
    3. +
  3. Next, create your form by adding the outer {{htmlelement("form")}} element: + 
    <form>
+
+</form>
    +
    4. +
  4. Inside the <form> tags, add a heading and paragraph to inform users how required fields are marked: + 
    <h1>Payment form</h1>
+<p>Required fields are followed by <strong><abbr title="required">*</abbr></strong>.</p>
    +
    5. +
  5. Next we'll add a larger section of code into the form, below our previous entry. Here you'll see that we are wrapping the contact information fields inside a distinct {{htmlelement("section")}} element. Moreover, we have a set of two radio buttons, each of which we are putting inside its own list ({{htmlelement("li")}}) element. We also have two standard text {{htmlelement("input")}}s and their associated {{htmlelement("label")}} elements, each contained inside a {{htmlelement("p")}}, and a password input for entering a password. Add this code to your form: + 
    <section>
+    <h2>Contact information</h2>
+    <fieldset>
+      <legend>Title</legend>
+      <ul>
+          <li>
+            <label for="title_1">
+              <input type="radio" id="title_1" name="title" value="K" >
+              King
+            </label>
+          </li>
+          <li>
+            <label for="title_2">
+              <input type="radio" id="title_2" name="title" value="Q">
+              Queen
+            </label>
+          </li>
+          <li>
+            <label for="title_3">
+              <input type="radio" id="title_3" name="title" value="J">
+              Joker
+            </label>
+          </li>
+      </ul>
+    </fieldset>
+    <p>
+      <label for="name">
+        <span>Name: </span>
+        <strong><abbr title="required">*</abbr></strong>
+      </label>
+      <input type="text" id="name" name="username">
+    </p>
+    <p>
+      <label for="mail">
+        <span>E-mail: </span>
+        <strong><abbr title="required">*</abbr></strong>
+      </label>
+      <input type="email" id="mail" name="usermail">
+    </p>
+    <p>
+      <label for="pwd">
+        <span>Password: </span>
+        <strong><abbr title="required">*</abbr></strong>
+      </label>
+      <input type="password" id="pwd" name="password">
+    </p>
+</section>
    +
    6. +
  6. The second <section> of our form is the payment information. We have three distinct controls along with their labels, each contained inside a <p>. The first is a drop-down menu ({{htmlelement("select")}}) for selecting credit card type. The second is an <input> element of type tel, for entering a credit card number; while we could have used the number type, we don't want the number's spinner UI. The last one is an <input> element of type date, for entering the expiration date of the card; this one will come up with a date picker widget in supporting browsers, and fall back to a normal text input in non-supporting browsers. These newer input types are reintroduced in The HTML5 input types.
    +
    + Enter the following below the previous section: + 
    <section>
+    <h2>Payment information</h2>
+    <p>
+      <label for="card">
+        <span>Card type:</span>
+      </label>
+      <select id="card" name="usercard">
+        <option value="visa">Visa</option>
+        <option value="mc">Mastercard</option>
+        <option value="amex">American Express</option>
+      </select>
+    </p>
+    <p>
+      <label for="number">
+        <span>Card number:</span>
+        <strong><abbr title="required">*</abbr></strong>
+      </label>
+      <input type="tel" id="number" name="cardnumber">
+    </p>
+    <p>
+      <label for="date">
+        <span>Expiration date:</span>
+        <strong><abbr title="required">*</abbr></strong>
+        <em>formatted as mm/dd/yyyy</em>
+      </label>
+      <input type="date" id="date" name="expiration">
+    </p>
+</section>
    +
    7. +
  7. The last section we'll add is a lot simpler, containing only a {{htmlelement("button")}} of type submit, for submitting the form data. Add this to the bottom of your form now: + 
    <p> <button type="submit">Validate the payment</button> </p>
    +
    8. +
+ +

You can see the finished form in action below (also find it on GitHub — see our payment-form.html source and running live):

+ +

{{EmbedLiveSample("A_payment_form","100%",620, "", "Learn/Forms/How_to_structure_a_web_form/Example")}}

+ +

結論

+ +

你現在擁有了正確建構 HTML 表單的所有知識。接下來將介紹本章介紹的許多功能。在下一篇文章中，將詳細探討如何使用各種不同類型的表單小部件，來收集用戶的訊息。

+ +

參見

+ + + +

{{PreviousMenuNext("Learn/Forms/Your_first_form", "Learn/Forms/Basic_native_form_controls", "Learn/Forms")}}

+ +

在本模塊

+ + + +

Advanced Topics

+ + diff --git a/files/zh-tw/learn/forms/index.html b/files/zh-tw/learn/forms/index.html new file mode 100644 index 0000000000..589880794f --- /dev/null +++ b/files/zh-tw/learn/forms/index.html @@ -0,0 +1,359 @@ +--- +title: 網站表單-與數據合作 +slug: Learn/HTML/Forms +tags: + - Featured + - Forms + - Guide + - HTML + - NeedsTranslation + - TopicStub + - Web + - 待翻譯 +translation_of: Learn/Forms +--- +

這篇指南提供了一系列的文章，幫你掌握HTML表單的基本知識。對於與使用者互動，網站表單是一項十分有力的工具，最常使用於用戶數據蒐集，或控制使用者介面。但由於一些歷史與技術上的因素，並沒有顯著的方法發揮表單的潛力。在下面的指引中，我們將介紹網站表單所有基本面向，包括標記他們的HTML結構、設定控制器樣式、驗證數據及將數距提送至伺服器

+ +

參考文章列表

+ +
    +
  1. 我的第一個HTML表單
    2. +
  2. 如何構建 HTML 表單
    3. +
  3. 本機表單控件
    4. +
  4. CSS和HTML表單 +
      +
    1. 造型HTML表單
      2. +
    2. HTML表單高級造型
      3. +
    3. 表單控件屬性兼容表
      4. +
    +
    5. +
  5. 發送和檢索表單數據
    6. +
  6. 數據表單驗證
    7. +
  7. 如何創建自定義表單控件
    8. +
  8. 通過JavaScript發送形式 +
      +
    1. 使用FORMDATA 對象
      2. +
    +
    9. +
  9. 在傳統的瀏覽器的HTML表單
    10. +
+ +

HTML 文件

+ +

HTML 元素

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
HTML 元素元素的 DOM interface說明
{{HTMLElement("button")}}{{domxref("HTMLButtonElement")}}該按鈕元素表示一個可點擊的按鈕。
{{HTMLElement("datalist")}}{{domxref("HTMLDataListElement")}}該數據列表元素包含了一組  {{ HTMLElement("option") }}  表示對其他表單元素的值可能的選擇要素。
{{HTMLElement("fieldset")}}{{domxref("HTMLFieldSetElement")}}該字段集是用來在表單中的組數表單元素。
{{HTMLElement("form")}}{{domxref("HTMLFormElement")}}的形式元素表示的文件的一部分，它包含使用戶能夠提交信息給web服務器的交互元件。
{{HTMLElement("input")}}{{domxref("HTMLInputElement")}}該  輸入元素用於創建表格的交互式控制。
{{HTMLElement("keygen")}}{{domxref("HTMLKeygenElement")}}所述凱基元素存在，以促進生成的密鑰材料，並提交了公開密鑰的作為HTML形式的一部分
{{HTMLElement("label")}}{{domxref("HTMLLabelElement")}}該標籤元素代表一個項目在用戶界面的標題
{{HTMLElement("legend")}}{{domxref("HTMLLegendElement")}}在傳說元素代表一個標題為其父 {{ HTMLElement("fieldset") }} 的內容。
{{HTMLElement("meter")}}{{domxref("HTMLMeterElement")}}所述米元素表示一個已知的範圍內的任一標量值或分數值。
{{HTMLElement("optgroup")}}{{domxref("HTMLOptGroupElement")}}在OPTGROUP元素創建一個 {{ HTMLElement("select") }}  元素中的一組選項。
{{HTMLElement("option")}}{{domxref("HTMLOptionElement")}}在HTML 選項元素用於創建表示  {{ HTMLElement("select") }} ，一個 {{ HTMLElement("optgroup") }} 或 {{ HTMLElement("datalist") }} 元素中的項目的控制。
{{HTMLElement("output")}}{{domxref("HTMLOutputElement")}}的輸出元素表示一個計算的結果。
{{HTMLElement("progress")}}{{domxref("HTMLProgressElement")}}的進展元素用於查看任務的完成進度。
{{HTMLElement("select")}}{{domxref("HTMLSelectElement")}}在選擇元素代表呈現一個選項菜單的控制。
{{HTMLElement("textarea")}}{{domxref("HTMLTextAreaElement")}}該textarea的元素代表多行純文本編輯控制。
+ +
+

注：所有的表單元素，因為所有的HTML元素，支持 {{domxref("HTMLElement")}} DOM接口。

+
+ +

HTML 屬性

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
屬性能使用該屬性的 HTML 元素說明
accept{{ HTMLElement("form") }}, {{ HTMLElement("input") }}的類型列表服務器接受，通常是文件類型。
accept-charset{{ HTMLElement("form") }}支持的字符集列表。
action{{ HTMLElement("form") }}一個程序處理通過表單提交的信息的URI。
autocomplete{{ HTMLElement("form") }}, {{ HTMLElement("input") }}指示是否在這個表單控件可以在默認情況下有其值由瀏覽器自動完成。
autofocus{{ HTMLElement("button") }}、 {{ HTMLElement("input") }}、 {{ HTMLElement("keygen") }}、 {{ HTMLElement("select") }}、 {{ HTMLElement("textarea") }}該元素應該在頁面加載後自動聚焦。
challenge{{ HTMLElement("keygen") }}即隨著公共密鑰提交的挑戰字符串。
checked{{ HTMLElement("input") }}指示是否應將元素在頁面加載檢查。
cols{{ HTMLElement("textarea") }}限定在一個textarea的列數。
data{{ HTMLElement("object") }}指定的資源的URL。
dirname{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}
disabled{{ HTMLElement("button") }} 、{{ HTMLElement("fieldset") }} 、 {{ HTMLElement("input") }} 、 {{ HTMLElement("keygen") }} 、 {{ HTMLElement("optgroup") }} 、 {{ HTMLElement("option") }} 、 {{ HTMLElement("select") }} 、 {{ HTMLElement("textarea")}}表明用戶是否可以與元件進行交互。
enctype{{ HTMLElement("form") }}定義當表單數據的內容類型的方法是POST。
for{{ HTMLElement("label") }}、 {{ HTMLElement("output") }}描述了屬於這一種元素。
form{{ HTMLElement("button") }} 、 {{ HTMLElement("fieldset") }} 、 {{ HTMLElement("input") }} 、 {{ HTMLElement("keygen") }} 、 {{ HTMLElement("label") }} 、 {{ HTMLElement("meter") }} 、 {{ HTMLElement("object") }} 、 {{ HTMLElement("output") }} 、 {{ HTMLElement("progress") }} 、 {{ HTMLElement("select") }} 、 {{ HTMLElement("textarea")}}表明是元件的所有者的形式。
high{{ HTMLElement("meter") }}表示下界的上限範圍。
keytype{{ HTMLElement("keygen") }}指定鍵所產生的類型。
list{{ HTMLElement("input") }}標識的預定義的選項的列表，以向用戶建議。
low{{ HTMLElement("meter") }}指示上限較低的範圍內。
max{{ HTMLElement("input") }} 、 {{ HTMLElement("meter") }} 、 {{ HTMLElement("progress") }}指示所允許的最大值。
maxlength{{ HTMLElement("input") }} 、 {{ HTMLElement("textarea") }}定義了在元件允許的字符的最大數目。
method{{HTMLElement("form")}}定義提交表單時使用的HTTP方法。可GET（默認）或POST。
min{{ HTMLElement("input") }} 、 {{ HTMLElement("meter") }}指示所允許的最小值。
multiple{{ HTMLElement("input") }}、 {{ HTMLElement("select") }}表示是否多個值所用的類型的輸入可以輸入電子郵件或文件。
name{{ HTMLElement("button") }} 、 {{ HTMLElement("form") }} 、 {{ HTMLElement("fieldset") }} 、 {{ HTMLElement("input") }} 、 {{ HTMLElement("keygen") }} 、 {{ HTMLElement("output") }} 、 {{ HTMLElement("select") }} 、 {{ HTMLElement("textarea") }}該元素的名稱。例如所使用的服務器，以確定在表單提交的字段。
novalidate{{ HTMLElement("form") }}此屬性表明，當提交表單應該無法通過驗證。
optimum{{ HTMLElement("meter") }}表示最佳數值。
pattern{{ HTMLElement("input") }}定義一個正則表達式元素的值將針對驗證。
placeholder{{ HTMLElement("input") }}、 {{ HTMLElement("textarea") }}提供一個提示什麼可以在字段中輸入的用戶。
readonly{{ HTMLElement("input") }} 、 {{ HTMLElement("textarea") }}指示該元素是否可以編輯或沒有。
required{{ HTMLElement("input") }} 、 {{ HTMLElement("select") }}、 {{ HTMLElement("textarea") }}指示此元素是否必填。
rows{{ HTMLElement("textarea") }}限定在一個textarea的行數。
selected{{ HTMLElement("option") }}定義了將在頁面加載所選的值。
size{{ HTMLElement("input") }}、 {{ HTMLElement("select") }}限定了元件的寬度（以像素為單位）。如果該元素的類型的屬性是文本或密碼那麼它的字符數。
src{{ HTMLElement("img") }}可嵌入內容的URL。
step{{ HTMLElement("input") }}
target{{ HTMLElement("form") }}
type{{ HTMLElement("button") }} 、 {{ HTMLElement("input") }}限定了元件的類型。
usemap{{ HTMLElement("img") }}
value{{ HTMLElement("button") }}、 {{ HTMLElement("option") }}、 {{ HTMLElement("input") }}、 {{ HTMLElement("meter") }}、 {{ HTMLElement("progress") }}定義了將被顯示在頁面上的負載元件的默認值。
wrap{{ HTMLElement("textarea") }}指示文本是否應被包裹或沒有。
+ +

規範性引用文件

+ + + +
+
+
diff --git a/files/zh-tw/learn/how_to_contribute/index.html b/files/zh-tw/learn/how_to_contribute/index.html deleted file mode 100644 index f8a864b98d..0000000000 --- a/files/zh-tw/learn/how_to_contribute/index.html +++ /dev/null @@ -1,81 +0,0 @@ ---- -title: 如何建設 MDN 學習專區 -slug: Learn/How_to_contribute -tags: - - Documentation - - 初學者 - - 貢獻 -translation_of: Learn/How_to_contribute ---- -
{{LearnSidebar}}
- -

無論你是初來乍到、抑或尋至深處無怨尤、都應該是對貢獻 MDN 學習專區起了興趣吧。那很棒！

- -

在這裡，你會看到該如何改進 MDN 學習專區的內容。視你的時間多寡、以及你是初學者、網路開發者、教師而定，有一些你可以完成的事情。

- -
-

注意：你可以在如何撰寫幫助別人理解 Web 的文章裡面找到指引如何撰寫學習專區的新文章。

-
- -

找到特定的任務

- -

貢獻者們使用 Trello board 來組織工作事務。你可以透過這個方法，找出某個專案的工作。要加入的話，只要 建立一個 Trello 的帳號、然後去 ping Chris Mills 叫他給你撰寫 board 的權限。

- -

Contributing is a great way to have some fun while learning new stuff. If you ever feel lost or have questions, don't hesitate to reach us on our mailing list or IRC channel (see at the bottom of this page for details). Chris Mills is the topic driver for the Learning Area — you could also try pinging him directly.

- -

接下來的章節，會提供一些在你所能下的常見點子。

- -

我是初學者

- -

真棒！初學者在學習專區的創建與給予回饋，不但重要還很寶貴。身為目標閱聽者的你能在文章方面，提供令你成為團內重要成員的獨特觀點。如果你透過這些文章學習卻碰上問題、或是在某些地方稿不清楚，你可以自己去改它、或告訴我們以便我們修正之。

- -

我們建議你可以透過以下方法貢獻：

- -
-
給我們的文章添加標籤（約五分鐘）
-
給 MDN 的文章添加標籤，是向 MDN 貢獻的最簡單方法。我們有很多功能會透過標籤助以呈現內文資訊，所以幫忙標籤的建設相當寶貴。從沒有任何標籤的術語表以及學習專區開始吧。
-
閱讀並評價術語表（約五分鐘）
-
我們需要身為初學者的眼光，來檢視我們的內容。如果你發現某個術語難以理解，就表示該術語需要改進。你可以作任何認為有需要的更動。如果你不認為自己有修改該術語的技能，至少請透過我們的郵件清單告訴我們。
-
撰寫新的術語（約二十分鐘）
-
這是最有效的新技能學習法。選一個你想理解的概念去研究。接著，撰寫這個術語。和別人解釋，是「固著」你腦內知識的好方法。既幫自己理解所知、也幫了其他人。利人利己，大家都贏！
-
閱讀並評價術語表學習專區的文章（約兩小時）
-
和閱讀術語表差不多，但因為文章會更長了些，所以要花更多時間。
-
- -

我是網路開發者

- -

好極了！我們需要你的技能，來確保我們教給初學者的內容正確無誤。因為這裡的宗旨是理解網路，請確保解釋儘可能簡單，但不致毫無用處。比起過度精確，可以理解才是最重要的。

- -
-
閱讀並評價術語表（約五分鐘）
-
我們需要你確認文章的內容是正確又不過於艱澀難懂的。請你變更任何你認為有必要改善的地方。如果你想要在做變更之前討論一下內容，歡迎透過 our mailing list 或 IRC channel通知我們。
-
撰寫新的術語（約二十分鐘）
-
闡明術語是一個簡單又精確的學習方式，初學者還會感激你。我們有很多尚未定義的用詞需要你的協助，挑一個你擅長的吧。
-
閱讀並評價術語表學習專區的文章（約兩小時）
-
這跟評價數語表一樣(如上述)，只是這些文章的篇幅更常，需要花更多的時間。
-
撰寫新的學習專區文章 (約四小時或更多)
-
MDN缺少簡單易懂的網頁技術相關文章(例如HTML, CSS, JavaScript)。我們也有較舊的文章需要重新審視並修正，請你將技能發揮到極致，讓初學者也能使用網頁技術。
-
提供練習題、範例或是互動式的教學工具。(? 小時)
-
我們所有的文章都需要 "active learning" 的素材在內，因為讓人們學習的最好途徑就是讓他們自己實作。這些素材會是練習題或互動式的內容，能協助使用者將文章內詳述的概念實際運用。有很多方式能夠製作 "active learning" 的內容，像是使用 JSFiddle 或相似的工具提供範例程式碼，或使用Thimble提供互動式的內容。 好好發揮你得創造力吧！
-
- -

我是教師

- -

MDN 有著精良的技術史，但我們對教導新人觀念的最佳方法，缺乏深入了解。針對這方面，我們需要借重做為教師或導師身份的你。你能幫我們確保給讀者們的內容，有著良好而實用的教育路徑（educational track）。

- -
-
閱讀並評價術語表（約十五分鐘）
-
Check out a glossary entry and feel free to make any changes you think are necessary. If you want to discuss the content before editing, ping us on our mailing list or IRC channel.
-
撰寫新的術語（約一小時）
-
Clear, simple definitions of terms and basic overviews of concepts in the glossary are critical in meeting beginners' needs. Your experience as an educator can help create excellent glossary entries; we have many undefined terms which need your attention. Pick one and go for it.
-
添加實例或圖表至文章 (約一小時)
-
As you might know, illustrations are an invaluable part of any learning content. This is something we often lack on MDN and your skills can make a difference in that area. Check out the articles that lack illustrative content and pick one you'd like to create graphics for.
-
閱讀並審核教學文章 (約兩小時)
-
This is similar to reviewing glossary entries (see above), but it requires more time since the articles are typically quite a bit longer.
-
撰寫新的教學文章 (約四小時)
-
We need simple, straightforward articles about the Web ecosystem and other functional topics around it. Since these learning articles need to be educational rather than trying to literally cover everything there is to know, your experience in knowing what to cover and how will be a great asset.
-
建立練習題，測驗或是互動式的學習工具(? 小時)
-
All our learning articles require "active learning" materials. Such materials are exercises or interactive content which help a user learn to use and expand upon the concepts detailed in an article.  There are lots of things you can do here, from creating quizzes to building fully hackable interactive content with Thimble. Unleash your creativity!
-
建立學習途徑 (? 小時)
-
In order to provide progressive and comprehensible tutorials, we need to shape our content into pathways. It's a way to gather existing content and figure out what is missing to create a learning article to write.
-
diff --git a/files/zh-tw/learn/html/forms/how_to_structure_an_html_form/index.html b/files/zh-tw/learn/html/forms/how_to_structure_an_html_form/index.html deleted file mode 100644 index b403666795..0000000000 --- a/files/zh-tw/learn/html/forms/how_to_structure_an_html_form/index.html +++ /dev/null @@ -1,315 +0,0 @@ ---- -title: 如何建構 HTML 表單 -slug: Learn/HTML/Forms/How_to_structure_an_HTML_form -translation_of: Learn/Forms/How_to_structure_a_web_form ---- -
{{LearnSidebar}}
- -
{{PreviousMenuNext("Learn/Forms/Your_first_form", "Learn/Forms/Basic_native_form_controls", "Learn/Forms")}}
- -

有了基礎後，我們就能探討表單元素，所提供的結構與文意之詳細資訊；還有各表單部份的相異之處。

- - - - - - - - - - - - -
先決條件：對電腦還有 HTML 有基本理解。
目標：理解如何構建 HTML 表單並給予無障礙的語意化。
- -

表單表單的彈性化令其成為 HTML 最複雜的結構之一。你能使用專用的表單元素和屬性，來構建任何類型的基本表單。使用正確的 HTML 表單結構能讓確保表單可用、且無障礙。

- -

<form> 元素

- -

{{HTMLElement("form")}} 元素會形式上的定義表單和決定行為屬性。每次建立 HTML 表單時，都必須使用 form 元素；並將所有內容嵌進去。大多數的輔助技術與瀏覽器套件，都能抓到 {{HTMLElement("form")}} 元素，並實做特殊的 hook，使其更易於使用。

- -

我們之前就講過這件事了。

- -
注意：絕對不能在表單裡面再嵌入表單。這會讓表單行為變得難以理解，所以是一個壞主意。
- -

你可以從表單外面控制 {{HTMLElement("form")}} 。這麼做的話，除非使用 form 將其與表單關聯，否則該操作預設上和任何表單無關。引入此功能是為了可以在即使該操作未嵌在表單中，其依舊能顯式地將操作與表單綁定。

- -

接下來就開始探討表單裡面可能會嵌入什麼吧。

- -

<fieldset> and <legend> 元素

- -

{{HTMLElement("fieldset")}} 元素能方便地建立用途相近、樣式及語意化都很方便的小部件組（groups of widgets）。你可以透過添加 {{HTMLElement("legend")}} 來給 {{HTMLElement("fieldset")}} 的內部開頭添加標籤。{{HTMLElement("legend")}} 的文字內容能描述 {{HTMLElement("legend")}} 目的。

- -

多數輔助科技會在 {{HTMLElement("legend")}} 元素被 {{HTMLElement("fieldset")}} 包住時偵測並使用它。比如說 Jaws 與 NVDA 之類的螢幕報讀器就會在讀到每個控件的標籤前，讀出 legend 的內容。

- -

下面就有一個示例：

- -
<form>
-  <fieldset>
-    <legend>Fruit juice size</legend>
-    <p>
-      <input type="radio" name="size" id="size_1" value="small">
-      <label for="size_1">Small</label>
-    </p>
-    <p>
-      <input type="radio" name="size" id="size_2" value="medium">
-      <label for="size_2">Medium</label>
-    </p>
-    <p>
-      <input type="radio" name="size" id="size_3" value="large">
-      <label for="size_3">Large</label>
-    </p>
-  </fieldset>
-</form>
- -
-

註：你可以在fieldset-legend.html 觀察範例（或著觀察這個動態互動）。

-
- -

在閱讀表單時，螢幕報讀器會針對第一個小部件組，說出「Fruit juice size small」、接著針對第二個小部件組，說出「Fruit juice size medium」、第三個則是「Fruit juice size large」。

- -

這個示例的是最重要的用法之一：每次有一組 radio 按鈕時，就該在裡面放一個 {{HTMLElement("fieldset")}} 元素。{{HTMLElement("fieldset")}} 也能用在表單的其他地方。理想上，要是表單一長，就要把他放到其他頁面。但如果做不到這點，那將不同的相關部分，放在不同的 fieldsets 之中，也可以提高可用性。

- -

由於 {{HTMLElement("fieldset")}} 對輔助技術的影響，這個元素是建立無障礙表單的基石，但請注意不要濫用這個元素。可以的話，聽聽螢幕報讀是怎麼講的。如果踢起來怪怪的，那就試著改進表單。

- -

<label> 元素

- -

正如上篇文章中所見，{{HTMLElement("label")}} 元素是定義 HTML 表單控件的正式方法。如果要構建無障礙的表單，這是最重要的元素：正確實做後，螢幕閱讀器會說出表單元素標籤、以及相關說明，同時也對有視力的用戶很有用。以這個例子為例，我們在上一篇文章中看過：

- -
<label for="name">Name:</label> <input type="text" id="name" name="user_name">
- -

在 <label> 元素透過 for 屬性與 <input> 元素的 id 屬性正確連結後，螢幕閱讀器就會讀出「Name, edit text」這樣的文字。

- -

還有另一種控制標籤與表單控件關聯的方法：那就是把表單控件嵌在 <label> 元素裡面，以便隱式關聯。

- -
<label for="name">
-  Name: <input type="text" id="name" name="user_name">
-</label>
- -

但即使在這種情況下，最好還是設置 for 屬性，以確保所有輔具都能理解標籤和控件之間的關係。

- -

如果沒有標籤、或著說表單控件沒有被顯式或隱式關聯，螢幕閱讀器會讀出沒啥幫助的「Edit text blank」。

- -

標籤也能點喔！

- -

使用標籤的另一個好處，就是能在點選該標籤後，啟動相對應的小部件。這種功能在控制文字輸入的時候會很好用：用戶點選標籤時就可以 focus 到 input 那邊。這對 button 與 checkbox 尤其有用：因為點選的區域可能很小，因此使它盡可能簡單地啟用，會是很有用的。

- -

例如在下面的示例中，點選「I like cherry」標籤文字後會切換 taste_cherry checkbox 的點選狀態：

- -
<form>
-  <p>
-    <input type="checkbox" id="taste_1" name="taste_cherry" value="cherry">
-    <label for="taste_1">I like cherry</label>
-  </p>
-  <p>
-    <input type="checkbox" id="taste_2" name="taste_banana" value="banana">
-    <label for="taste_2">I like banana</label>
-  </p>
-</form>
- -
-

註：你可以在 checkbox-label.html 觀察示例（這裡有展示版本！）

-
- -

多個標籤

- -

嚴格來說，一個小部件組能放很多個標籤，但由於部分輔助科技處理上會有問題，所以這也不是個好點子。如果有多個標籤，請試著把巢狀各個小部件，並在裡面只安插一個 {{htmlelement("label")}} 元素。

- -

來看看這個例子：

- -
<p>Required fields are followed by <abbr title="required">*</abbr>.</p>
-
-<!-- So this: -->
-<div>
-  <label for="username">Name:</label>
-  <input id="username" type="text" name="username">
-  <label for="username"><abbr title="required" aria-label="required">*</abbr></label>
-</div>
-
-<!-- would be better done like this: -->
-<div>
-  <label for="username">
-    <span>Name:</span>
-    <input id="username" type="text" name="username">
-    <abbr title="required" aria-label="required">*</abbr>
-  </label>
-</div>
-
-<!-- But this is probably best: -->
-<div>
-  <label for="username">Name: <abbr title="required" aria-label="required">*</abbr></label>
-  <input id="username" type="text" name="username">
-</div>
- -

{{EmbedLiveSample("Multiple_labels", 120, 120)}}

- -

The paragraph at the top states a rule for required elements. The rule must be included before it is used so that sighted users and users of assistive technologies such as screen readers can learn what it means before they encounter a required element. While this helps inform users what an asterisk means, it can not be relied upon. A screen reader will speak an asterisk as "star" when encountered. When hovered by a sighted mouse user, "required" should appear, which is achieved by use of the title attribute. Titles being read aloud depend on the screen reader's settings, so it is more reliable to also include the aria-label attribute, which is always read by screen readers.

- -

The above variants increase in effectiveness as you go through them:

- - - -
-

Note: You might get slightly different results, depending on your screenreader. This was tested in VoiceOver (and NVDA behaves similarly). We'd love to hear about your experiences too.

-
- -
-

Note: You can find this example on GitHub as required-labels.html (see it live also). don't test the example with 2 or 3 of the versions uncommented — screenreaders will definitely get confused if you have multiple labels AND multiple inputs with the same ID!

-
- -

建立表單所常用的 HTML 結構

- -

Beyond the structures specific to web forms, it's good to remember that form markup is just HTML. This means that you can use all the power of HTML to structure a web form.

- -

As you can see in the examples, it's common practice to wrap a label and its widget with a {{HTMLElement("li")}} element within a {{HTMLElement("ul")}} or {{HTMLElement("ol")}} list. {{HTMLElement("p")}} and {{HTMLElement("div")}} elements are also commonly used. Lists are recommended for structuring multiple checkboxes or radio buttons.

- -

In addition to the {{HTMLElement("fieldset")}} element, it's also common practice to use HTML titles (e.g. {{htmlelement("h1")}}, {{htmlelement("h2")}}) and sectioning (e.g. {{htmlelement("section")}}) to structure complex forms.

- -

Above all, it is up to you to find a comfortable coding style that results in accessible, usable forms. Each separate section of functionality should be contained in a separate {{htmlelement("section")}} element, with {{htmlelement("fieldset")}} elements to contain radio buttons.

- -

主動學習：建立表單結構

- -

Let's put these ideas into practice and build a slightly more involved form — a payment form. This form will contain a number of control types that you may not yet understand. Don't worry about this for now; you'll find out how they work in the next article (Basic native form controls). For now, read the descriptions carefully as you follow the below instructions, and start to form an appreciation of which wrapper elements we are using to structure the form, and why.

- -
    -
  1. To start with, make a local copy of our blank template file and the CSS for our payment form in a new directory on your computer.
    2. -
  2. Apply the CSS to the HTML by adding the following line inside the HTML {{htmlelement("head")}}: - 
    <link href="payment-form.css" rel="stylesheet">
    -
    3. -
  3. Next, create your form by adding the outer {{htmlelement("form")}} element: - 
    <form>
-
-</form>
    -
    4. -
  4. Inside the <form> tags, add a heading and paragraph to inform users how required fields are marked: - 
    <h1>Payment form</h1>
-<p>Required fields are followed by <strong><abbr title="required">*</abbr></strong>.</p>
    -
    5. -
  5. Next we'll add a larger section of code into the form, below our previous entry. Here you'll see that we are wrapping the contact information fields inside a distinct {{htmlelement("section")}} element. Moreover, we have a set of two radio buttons, each of which we are putting inside its own list ({{htmlelement("li")}}) element. We also have two standard text {{htmlelement("input")}}s and their associated {{htmlelement("label")}} elements, each contained inside a {{htmlelement("p")}}, and a password input for entering a password. Add this code to your form: - 
    <section>
-    <h2>Contact information</h2>
-    <fieldset>
-      <legend>Title</legend>
-      <ul>
-          <li>
-            <label for="title_1">
-              <input type="radio" id="title_1" name="title" value="K" >
-              King
-            </label>
-          </li>
-          <li>
-            <label for="title_2">
-              <input type="radio" id="title_2" name="title" value="Q">
-              Queen
-            </label>
-          </li>
-          <li>
-            <label for="title_3">
-              <input type="radio" id="title_3" name="title" value="J">
-              Joker
-            </label>
-          </li>
-      </ul>
-    </fieldset>
-    <p>
-      <label for="name">
-        <span>Name: </span>
-        <strong><abbr title="required">*</abbr></strong>
-      </label>
-      <input type="text" id="name" name="username">
-    </p>
-    <p>
-      <label for="mail">
-        <span>E-mail: </span>
-        <strong><abbr title="required">*</abbr></strong>
-      </label>
-      <input type="email" id="mail" name="usermail">
-    </p>
-    <p>
-      <label for="pwd">
-        <span>Password: </span>
-        <strong><abbr title="required">*</abbr></strong>
-      </label>
-      <input type="password" id="pwd" name="password">
-    </p>
-</section>
    -
    6. -
  6. The second <section> of our form is the payment information. We have three distinct controls along with their labels, each contained inside a <p>. The first is a drop-down menu ({{htmlelement("select")}}) for selecting credit card type. The second is an <input> element of type tel, for entering a credit card number; while we could have used the number type, we don't want the number's spinner UI. The last one is an <input> element of type date, for entering the expiration date of the card; this one will come up with a date picker widget in supporting browsers, and fall back to a normal text input in non-supporting browsers. These newer input types are reintroduced in The HTML5 input types.
    -
    - Enter the following below the previous section: - 
    <section>
-    <h2>Payment information</h2>
-    <p>
-      <label for="card">
-        <span>Card type:</span>
-      </label>
-      <select id="card" name="usercard">
-        <option value="visa">Visa</option>
-        <option value="mc">Mastercard</option>
-        <option value="amex">American Express</option>
-      </select>
-    </p>
-    <p>
-      <label for="number">
-        <span>Card number:</span>
-        <strong><abbr title="required">*</abbr></strong>
-      </label>
-      <input type="tel" id="number" name="cardnumber">
-    </p>
-    <p>
-      <label for="date">
-        <span>Expiration date:</span>
-        <strong><abbr title="required">*</abbr></strong>
-        <em>formatted as mm/dd/yyyy</em>
-      </label>
-      <input type="date" id="date" name="expiration">
-    </p>
-</section>
    -
    7. -
  7. The last section we'll add is a lot simpler, containing only a {{htmlelement("button")}} of type submit, for submitting the form data. Add this to the bottom of your form now: - 
    <p> <button type="submit">Validate the payment</button> </p>
    -
    8. -
- -

You can see the finished form in action below (also find it on GitHub — see our payment-form.html source and running live):

- -

{{EmbedLiveSample("A_payment_form","100%",620, "", "Learn/Forms/How_to_structure_a_web_form/Example")}}

- -

結論

- -

你現在擁有了正確建構 HTML 表單的所有知識。接下來將介紹本章介紹的許多功能。在下一篇文章中，將詳細探討如何使用各種不同類型的表單小部件，來收集用戶的訊息。

- -

參見

- - - -

{{PreviousMenuNext("Learn/Forms/Your_first_form", "Learn/Forms/Basic_native_form_controls", "Learn/Forms")}}

- -

在本模塊

- - - -

Advanced Topics

- - diff --git a/files/zh-tw/learn/html/forms/index.html b/files/zh-tw/learn/html/forms/index.html deleted file mode 100644 index 589880794f..0000000000 --- a/files/zh-tw/learn/html/forms/index.html +++ /dev/null @@ -1,359 +0,0 @@ ---- -title: 網站表單-與數據合作 -slug: Learn/HTML/Forms -tags: - - Featured - - Forms - - Guide - - HTML - - NeedsTranslation - - TopicStub - - Web - - 待翻譯 -translation_of: Learn/Forms ---- -

這篇指南提供了一系列的文章，幫你掌握HTML表單的基本知識。對於與使用者互動，網站表單是一項十分有力的工具，最常使用於用戶數據蒐集，或控制使用者介面。但由於一些歷史與技術上的因素，並沒有顯著的方法發揮表單的潛力。在下面的指引中，我們將介紹網站表單所有基本面向，包括標記他們的HTML結構、設定控制器樣式、驗證數據及將數距提送至伺服器

- -

參考文章列表

- -
    -
  1. 我的第一個HTML表單
    2. -
  2. 如何構建 HTML 表單
    3. -
  3. 本機表單控件
    4. -
  4. CSS和HTML表單 -
      -
    1. 造型HTML表單
      2. -
    2. HTML表單高級造型
      3. -
    3. 表單控件屬性兼容表
      4. -
    -
    5. -
  5. 發送和檢索表單數據
    6. -
  6. 數據表單驗證
    7. -
  7. 如何創建自定義表單控件
    8. -
  8. 通過JavaScript發送形式 -
      -
    1. 使用FORMDATA 對象
      2. -
    -
    9. -
  9. 在傳統的瀏覽器的HTML表單
    10. -
- -

HTML 文件

- -

HTML 元素

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
HTML 元素元素的 DOM interface說明
{{HTMLElement("button")}}{{domxref("HTMLButtonElement")}}該按鈕元素表示一個可點擊的按鈕。
{{HTMLElement("datalist")}}{{domxref("HTMLDataListElement")}}該數據列表元素包含了一組  {{ HTMLElement("option") }}  表示對其他表單元素的值可能的選擇要素。
{{HTMLElement("fieldset")}}{{domxref("HTMLFieldSetElement")}}該字段集是用來在表單中的組數表單元素。
{{HTMLElement("form")}}{{domxref("HTMLFormElement")}}的形式元素表示的文件的一部分，它包含使用戶能夠提交信息給web服務器的交互元件。
{{HTMLElement("input")}}{{domxref("HTMLInputElement")}}該  輸入元素用於創建表格的交互式控制。
{{HTMLElement("keygen")}}{{domxref("HTMLKeygenElement")}}所述凱基元素存在，以促進生成的密鑰材料，並提交了公開密鑰的作為HTML形式的一部分
{{HTMLElement("label")}}{{domxref("HTMLLabelElement")}}該標籤元素代表一個項目在用戶界面的標題
{{HTMLElement("legend")}}{{domxref("HTMLLegendElement")}}在傳說元素代表一個標題為其父 {{ HTMLElement("fieldset") }} 的內容。
{{HTMLElement("meter")}}{{domxref("HTMLMeterElement")}}所述米元素表示一個已知的範圍內的任一標量值或分數值。
{{HTMLElement("optgroup")}}{{domxref("HTMLOptGroupElement")}}在OPTGROUP元素創建一個 {{ HTMLElement("select") }}  元素中的一組選項。
{{HTMLElement("option")}}{{domxref("HTMLOptionElement")}}在HTML 選項元素用於創建表示  {{ HTMLElement("select") }} ，一個 {{ HTMLElement("optgroup") }} 或 {{ HTMLElement("datalist") }} 元素中的項目的控制。
{{HTMLElement("output")}}{{domxref("HTMLOutputElement")}}的輸出元素表示一個計算的結果。
{{HTMLElement("progress")}}{{domxref("HTMLProgressElement")}}的進展元素用於查看任務的完成進度。
{{HTMLElement("select")}}{{domxref("HTMLSelectElement")}}在選擇元素代表呈現一個選項菜單的控制。
{{HTMLElement("textarea")}}{{domxref("HTMLTextAreaElement")}}該textarea的元素代表多行純文本編輯控制。
- -
-

注：所有的表單元素，因為所有的HTML元素，支持 {{domxref("HTMLElement")}} DOM接口。

-
- -

HTML 屬性

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
屬性能使用該屬性的 HTML 元素說明
accept{{ HTMLElement("form") }}, {{ HTMLElement("input") }}的類型列表服務器接受，通常是文件類型。
accept-charset{{ HTMLElement("form") }}支持的字符集列表。
action{{ HTMLElement("form") }}一個程序處理通過表單提交的信息的URI。
autocomplete{{ HTMLElement("form") }}, {{ HTMLElement("input") }}指示是否在這個表單控件可以在默認情況下有其值由瀏覽器自動完成。
autofocus{{ HTMLElement("button") }}、 {{ HTMLElement("input") }}、 {{ HTMLElement("keygen") }}、 {{ HTMLElement("select") }}、 {{ HTMLElement("textarea") }}該元素應該在頁面加載後自動聚焦。
challenge{{ HTMLElement("keygen") }}即隨著公共密鑰提交的挑戰字符串。
checked{{ HTMLElement("input") }}指示是否應將元素在頁面加載檢查。
cols{{ HTMLElement("textarea") }}限定在一個textarea的列數。
data{{ HTMLElement("object") }}指定的資源的URL。
dirname{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}
disabled{{ HTMLElement("button") }} 、{{ HTMLElement("fieldset") }} 、 {{ HTMLElement("input") }} 、 {{ HTMLElement("keygen") }} 、 {{ HTMLElement("optgroup") }} 、 {{ HTMLElement("option") }} 、 {{ HTMLElement("select") }} 、 {{ HTMLElement("textarea")}}表明用戶是否可以與元件進行交互。
enctype{{ HTMLElement("form") }}定義當表單數據的內容類型的方法是POST。
for{{ HTMLElement("label") }}、 {{ HTMLElement("output") }}描述了屬於這一種元素。
form{{ HTMLElement("button") }} 、 {{ HTMLElement("fieldset") }} 、 {{ HTMLElement("input") }} 、 {{ HTMLElement("keygen") }} 、 {{ HTMLElement("label") }} 、 {{ HTMLElement("meter") }} 、 {{ HTMLElement("object") }} 、 {{ HTMLElement("output") }} 、 {{ HTMLElement("progress") }} 、 {{ HTMLElement("select") }} 、 {{ HTMLElement("textarea")}}表明是元件的所有者的形式。
high{{ HTMLElement("meter") }}表示下界的上限範圍。
keytype{{ HTMLElement("keygen") }}指定鍵所產生的類型。
list{{ HTMLElement("input") }}標識的預定義的選項的列表，以向用戶建議。
low{{ HTMLElement("meter") }}指示上限較低的範圍內。
max{{ HTMLElement("input") }} 、 {{ HTMLElement("meter") }} 、 {{ HTMLElement("progress") }}指示所允許的最大值。
maxlength{{ HTMLElement("input") }} 、 {{ HTMLElement("textarea") }}定義了在元件允許的字符的最大數目。
method{{HTMLElement("form")}}定義提交表單時使用的HTTP方法。可GET（默認）或POST。
min{{ HTMLElement("input") }} 、 {{ HTMLElement("meter") }}指示所允許的最小值。
multiple{{ HTMLElement("input") }}、 {{ HTMLElement("select") }}表示是否多個值所用的類型的輸入可以輸入電子郵件或文件。
name{{ HTMLElement("button") }} 、 {{ HTMLElement("form") }} 、 {{ HTMLElement("fieldset") }} 、 {{ HTMLElement("input") }} 、 {{ HTMLElement("keygen") }} 、 {{ HTMLElement("output") }} 、 {{ HTMLElement("select") }} 、 {{ HTMLElement("textarea") }}該元素的名稱。例如所使用的服務器，以確定在表單提交的字段。
novalidate{{ HTMLElement("form") }}此屬性表明，當提交表單應該無法通過驗證。
optimum{{ HTMLElement("meter") }}表示最佳數值。
pattern{{ HTMLElement("input") }}定義一個正則表達式元素的值將針對驗證。
placeholder{{ HTMLElement("input") }}、 {{ HTMLElement("textarea") }}提供一個提示什麼可以在字段中輸入的用戶。
readonly{{ HTMLElement("input") }} 、 {{ HTMLElement("textarea") }}指示該元素是否可以編輯或沒有。
required{{ HTMLElement("input") }} 、 {{ HTMLElement("select") }}、 {{ HTMLElement("textarea") }}指示此元素是否必填。
rows{{ HTMLElement("textarea") }}限定在一個textarea的行數。
selected{{ HTMLElement("option") }}定義了將在頁面加載所選的值。
size{{ HTMLElement("input") }}、 {{ HTMLElement("select") }}限定了元件的寬度（以像素為單位）。如果該元素的類型的屬性是文本或密碼那麼它的字符數。
src{{ HTMLElement("img") }}可嵌入內容的URL。
step{{ HTMLElement("input") }}
target{{ HTMLElement("form") }}
type{{ HTMLElement("button") }} 、 {{ HTMLElement("input") }}限定了元件的類型。
usemap{{ HTMLElement("img") }}
value{{ HTMLElement("button") }}、 {{ HTMLElement("option") }}、 {{ HTMLElement("input") }}、 {{ HTMLElement("meter") }}、 {{ HTMLElement("progress") }}定義了將被顯示在頁面上的負載元件的默認值。
wrap{{ HTMLElement("textarea") }}指示文本是否應被包裹或沒有。
- -

規範性引用文件

- - - -
-
-
diff --git "a/files/zh-tw/learn/html/multimedia_and_embedding/html\344\270\255\347\232\204\345\234\226\347\211\207/index.html" "b/files/zh-tw/learn/html/multimedia_and_embedding/html\344\270\255\347\232\204\345\234\226\347\211\207/index.html" deleted file mode 100644 index 5a2dfd7eff..0000000000 --- "a/files/zh-tw/learn/html/multimedia_and_embedding/html\344\270\255\347\232\204\345\234\226\347\211\207/index.html" +++ /dev/null @@ -1,502 +0,0 @@ ---- -title: HTML中的圖片 -slug: Learn/HTML/Multimedia_and_embedding/HTML中的圖片 -translation_of: Learn/HTML/Multimedia_and_embedding/Images_in_HTML ---- -
{{LearnSidebar}}
- -
{{NextMenu("Learn/HTML/Multimedia_and_embedding/Video_and_audio_content", "Learn/HTML/Multimedia_and_embedding")}}
- -

最初的網頁最初的發展階段，只是文字。而只有文字想當然爾令網頁讀起來十分的枯燥乏味。然而幸運的是沒有多久，將圖片（以及其他更有趣的內容類型）嵌入網頁的功能就誕生了。 在多媒體嵌入網頁的學習中，從<img>元素開始是相對適當，因為該元素用於在網頁中嵌入簡單的圖像。 在本文中，我們將研究如何深入使用它，包括在網頁中嵌入簡單圖像的基礎知識，使用<figure>增加標題說明以做註釋，以及詳細說明它與CSS背景圖片的關係。

- - - - - - - - - - - - -
課成需求:基本的電腦操作, 安裝軟體的能力, 處理檔案的基本能力, 熟悉最基本的HTML的 （如HTML入門中所述）
學習目標:了解如何在HTML中嵌入簡單的圖片，為它們加上標題註釋，以及HTML圖片與CSS背景圖片之間的關係。
- -

如何將圖片放入網頁中?

- -

為了在網頁上放置一個簡單的圖像，我們使用<img>元素。 這是一個空元素（意味著它沒有文本內容或結束標記），並需要至少一個屬性（src）（有時稱為其完整標題，source）才有用。 src屬性包含指向要嵌入頁面的圖像的路徑，該路徑可以是相對路徑或絕對路徑URL，與<a>元素中的href屬性相同。

- -
-

提醒: 在繼續之前，您應該閱讀有關URL和路徑的快速入門，以複習相對路徑和絕對路徑URL。

-
- -

舉例來說, 如果您的圖片名為 dinosaur.jpg 且與HTML檔案位於同一資料夾中，可以這樣嵌入圖片：

- -
<img src="dinosaur.jpg">
- -

如果圖片位於名為images的資料夾中，且該目錄與HTML頁面位於同一資料夾（Google建議這樣的編排，以利於SEO /索引目的），則應將其嵌入如下：

- -
<img src="images/dinosaur.jpg">
- -

像這樣.

- -
-

提醒: 搜索引擎還會讀取圖片名稱，並將其納入SEO中。 因此您應該為圖片提供一個描述性的檔名。 例如 dinosaur.jpg 的命名方式會比 img835.png 更好。

-
- -

你也可以用絕對路徑URL來嵌入圖片，例如

- -
<img src="https://www.example.com/images/dinosaur.jpg">
- -

但這麼做是沒有意義的，因為它只會使瀏覽器執行更多工作，瀏覽器需重複執行從DNS服務器中搜尋IP地址等等工作。您應將網站上的圖片與HTML存放在同一個伺服器上。

- -
-

注意: 大多數圖像均受版權保護。 請勿在你的網站上隨意顯示圖片，除非：

- - - -

侵犯版權是違法及不道德的。 此外，切勿將src屬性指向您未被授權的他人網站上的圖便。 這稱為“熱連結”。再次重申，竊取某人的頻寬是違法的，且這會減慢您網站的速度。此外當別人變更、移除或換上令人尷尬的內容時你將無法做出改變。

-
- -

我們上面的程式碼將有以下結果：

- -

A basic image of a dinosaur, embedded in a browser, with "Images in HTML" written above it

- -
-

提醒: <img>和<video>之類的元素有時也稱為替換元素。 這是因為元素的內容和圖片大小是由外部（例如圖片或影音檔）所定義的，而不是由元素的內容定義。

-
- -
-

提醒: 您可以從在Github上找到本節完成的示例（參見開源碼。）

-
- -

替代性文字

- -

我們下一個要看的屬性是alt。 它的功能算是圖片的文字描述，應用於因網路連接速度慢而無法看到/顯示圖片或需要長時間來跑圖等等情況。 例如，上面的程式碼我們可以像這樣修改：

- -
<img src="images/dinosaur.jpg"
-     alt="The head and torso of a dinosaur skeleton;
-          it has a large head with long sharp teeth">
- -

測試替代文字最簡單方法是故意拼錯檔名。 例如，如果我們的圖片名稱為dinosooooor.jpg，則瀏覽器將不會顯示該圖片，而是顯示alt文本：The Images in HTML title, but this time the dinosaur image is not displayed, and alt text is in its place.

- -

那麼，為什麼您會看到或需要替代文字？ 它可以派上用場的原因有很多：

- - - -

您應該在alt屬性中確切寫些什麼？ 這取決於圖片為何而出現；也就是說，如果圖片不顯示，您將損失什麼：

- - - -

本質上，關鍵是即使在看不見圖片的情況下也能提供相同的體驗。這樣可以確保所有使用者都不會丟失任何內容。嘗試在瀏覽器中關閉圖像，然後查看外觀。您很快就會意識到，如果看不到圖片，替代文字會很有幫助。

- -
-

Note: For more information, see our guide to Text Alternatives.

-
- -

寬與高

- -

You can use the width and height attributes to specify the width and height of your image. You can find your image's width and height in a number of ways. For example on the Mac you can use Cmd + I to get the info display up for the image file. Returning to our example, we could do this:

- -
<img src="images/dinosaur.jpg"
-     alt="The head and torso of a dinosaur skeleton;
-          it has a large head with long sharp teeth"
-     width="400"
-     height="341">
- -

This doesn't result in much difference to the display, under normal circumstances. But if the image isn't being displayed, for example, the user has just navigated to the page, and the image hasn't yet loaded, you'll notice the browser is leaving a space for the image to appear in:

- -

The Images in HTML title, with dinosaur alt text, displayed inside a large box that results from width and height settings

- -

This is a good thing to do, resulting in the page loading quicker and more smoothly.

- -

However, you shouldn't alter the size of your images using HTML attributes. If you set the image size too big, you'll end up with images that look grainy, fuzzy, or too small, and wasting bandwidth downloading an image that is not fitting the user's needs. The image may also end up looking distorted, if you don't maintain the correct aspect ratio. You should use an image editor to put your image at the correct size before putting it on your webpage.

- -
-

Note: If you do need to alter an image's size, you should use CSS instead.

-
- -

圖片標題

- -

As with links, you can also add title attributes to images, to provide further supporting information if needed. In our example, we could do this:

- -
<img src="images/dinosaur.jpg"
-     alt="The head and torso of a dinosaur skeleton;
-          it has a large head with long sharp teeth"
-     width="400"
-     height="341"
-     title="A T-Rex on display in the Manchester University Museum">
- -

This gives us a tooltip on mouse hover, just like link titles:

- -

The dinosaur image, with a tooltip title on top of it that reads A T-Rex on display at the Manchester University Museum

- -

However, this does not come recommended — title has a number of accessibility problems, mainly based around the fact that screen reader support is very unpredictable and most browsers won't show it unless you are hovering with a mouse (so e.g. no access to keyboard users). If you are interested in more information about this, read The Trials and Tribulations of the Title Attribute by Scott O'Hara.

- -

It is better to include such supporting information in the main article text, rather than attached to the image.

- -

實戰練習：嵌入圖片

- -

It is now your turn to play! This active learning section will have you up and running with a simple embedding exercise. You are provided with a basic {{htmlelement("img")}} tag; we'd like you to embed the image located at the following URL:

- -

https://raw.githubusercontent.com/mdn/learning-area/master/html/multimedia-and-embedding/images-in-html/dinosaur_small.jpg

- -

Earlier we said to never hotlink to images on other servers, but this is just for learning purposes, so we'll let you off this one time.

- -

We would also like you to:

- - - -

If you make a mistake, you can always reset it using the Reset button. If you get really stuck, press the Show solution button to see an answer:

- - - -

{{ EmbedLiveSample('Playable_code', 700, 350, "", "", "hide-codepen-jsfiddle") }}

- -

用圖文和圖文標註說明圖像

- -

Speaking of captions, there are a number of ways that you could add a caption to go with your image. For example, there would be nothing to stop you from doing this:

- -
<div class="figure">
-  <img src="images/dinosaur.jpg"
-       alt="The head and torso of a dinosaur skeleton;
-            it has a large head with long sharp teeth"
-       width="400"
-       height="341">
-
-  <p>A T-Rex on display in the Manchester University Museum.</p>
-</div>
- -

This is ok. It contains the content you need, and is nicely stylable using CSS. But there is a problem here: there is nothing that semantically links the image to its caption, which can cause problems for screen readers. For example, when you have 50 images and captions, which caption goes with which image?

- -

A better solution, is to use the HTML5 {{htmlelement("figure")}} and {{htmlelement("figcaption")}} elements. These are created for exactly this purpose: to provide a semantic container for figures, and to clearly link the figure to the caption. Our above example could be rewritten like this:

- -
<figure>
-  <img src="images/dinosaur.jpg"
-       alt="The head and torso of a dinosaur skeleton;
-            it has a large head with long sharp teeth"
-       width="400"
-       height="341">
-
-  <figcaption>A T-Rex on display in the Manchester University Museum.</figcaption>
-</figure>
- -

The {{htmlelement("figcaption")}} element tells browsers, and assistive technology that the caption describes the other content of the {{htmlelement("figure")}} element.

- -
-

Note: From an accessibility viewpoint, captions and {{htmlattrxref('alt','img')}} text have distinct roles. Captions benefit even people who can see the image, whereas {{htmlattrxref('alt','img')}} text provides the same functionality as an absent image. Therefore, captions and alt text shouldn't just say the same thing, because they both appear when the image is gone. Try turning images off in your browser and see how it looks.

-
- -

A figure doesn't have to be an image. It is an independent unit of content that:

- - - -

A figure could be several images, a code snippet, audio, video, equations, a table, or something else.

- -

實戰練習：建立圖文標註

- -

In this active learning section, we'd like you to take the finished code from the previous active learning section, and turn it into a figure:

- -
    -
  1. Wrap it in a {{htmlelement("figure")}} element.
    2. -
  2. Copy the text out of the title attribute, remove the title attribute, and put the text inside a {{htmlelement("figcaption")}} element below the image.
    3. -
- -

If you make a mistake, you can always reset it using the Reset button. If you get really stuck, press the Show solution button to see an answer:

- - - -

{{ EmbedLiveSample('Playable_code_2', 700, 350, "", "", "hide-codepen-jsfiddle") }}

- -

CSS 背景圖片

- -

您還可以使用CSS將圖像嵌入網頁（JavaScript也可以，但這完全是另一回事了）。 CSSbackground-image屬性和其他background- *屬性用於控制背景圖片的放置。 例如要將背景圖片放置在頁面的每個段落上，可以執行以下操作：

- -
p {
-  background-image: url("images/dinosaur.jpg");
-}
- -

這種嵌入圖片的方式比HTML圖像更容易定位和控制。 那麼，為什麼還要用HTML嵌入圖片呢？ 如上所述，CSS背景圖像僅用於裝飾。 如果您只是想在頁面上添加一些漂亮的東西以增強視覺效果，那很好。 但是，此類圖像根本沒有語義。 它們與文字不同，對於螢幕閱讀器是不可見的，依此類推。 這裡需要的是HTML圖片！

- -

總結來說，如果圖片在內容上具有含義，則應使用HTML圖像。 如果圖像純粹是裝飾性的，則應使用CSS背景圖片。

- -
-

提醒: 在我們的CSS主題中，您將學到更多關於CSS背景圖片的知識。

-
- -

試試看!

- -

您已經來到了本文的末端，但是您還記得最重要的內容嗎？ 在繼續往下之前，這裡有些測驗讓您驗證看看您是否都學會了 — 測驗：HTML圖像。

- -

總結

- -

目前就是這樣啦。 我們已經詳細介紹了圖片和標題說明。 在下一篇文章中我們將進一步介紹，如何使用HTML將視頻和音頻嵌入在網頁中。

- -

{{NextMenu("Learn/HTML/Multimedia_and_embedding/Video_and_audio_content", "Learn/HTML/Multimedia_and_embedding")}}

- -

在這個主題中

- - diff --git a/files/zh-tw/learn/html/multimedia_and_embedding/images_in_html/index.html b/files/zh-tw/learn/html/multimedia_and_embedding/images_in_html/index.html new file mode 100644 index 0000000000..5a2dfd7eff --- /dev/null +++ b/files/zh-tw/learn/html/multimedia_and_embedding/images_in_html/index.html @@ -0,0 +1,502 @@ +--- +title: HTML中的圖片 +slug: Learn/HTML/Multimedia_and_embedding/HTML中的圖片 +translation_of: Learn/HTML/Multimedia_and_embedding/Images_in_HTML +--- +
{{LearnSidebar}}
+ +
{{NextMenu("Learn/HTML/Multimedia_and_embedding/Video_and_audio_content", "Learn/HTML/Multimedia_and_embedding")}}
+ +

最初的網頁最初的發展階段，只是文字。而只有文字想當然爾令網頁讀起來十分的枯燥乏味。然而幸運的是沒有多久，將圖片（以及其他更有趣的內容類型）嵌入網頁的功能就誕生了。 在多媒體嵌入網頁的學習中，從<img>元素開始是相對適當，因為該元素用於在網頁中嵌入簡單的圖像。 在本文中，我們將研究如何深入使用它，包括在網頁中嵌入簡單圖像的基礎知識，使用<figure>增加標題說明以做註釋，以及詳細說明它與CSS背景圖片的關係。

+ + + + + + + + + + + + +
課成需求:基本的電腦操作, 安裝軟體的能力, 處理檔案的基本能力, 熟悉最基本的HTML的 （如HTML入門中所述）
學習目標:了解如何在HTML中嵌入簡單的圖片，為它們加上標題註釋，以及HTML圖片與CSS背景圖片之間的關係。
+ +

如何將圖片放入網頁中?

+ +

為了在網頁上放置一個簡單的圖像，我們使用<img>元素。 這是一個空元素（意味著它沒有文本內容或結束標記），並需要至少一個屬性（src）（有時稱為其完整標題，source）才有用。 src屬性包含指向要嵌入頁面的圖像的路徑，該路徑可以是相對路徑或絕對路徑URL，與<a>元素中的href屬性相同。

+ +
+

提醒: 在繼續之前，您應該閱讀有關URL和路徑的快速入門，以複習相對路徑和絕對路徑URL。

+
+ +

舉例來說, 如果您的圖片名為 dinosaur.jpg 且與HTML檔案位於同一資料夾中，可以這樣嵌入圖片：

+ +
<img src="dinosaur.jpg">
+ +

如果圖片位於名為images的資料夾中，且該目錄與HTML頁面位於同一資料夾（Google建議這樣的編排，以利於SEO /索引目的），則應將其嵌入如下：

+ +
<img src="images/dinosaur.jpg">
+ +

像這樣.

+ +
+

提醒: 搜索引擎還會讀取圖片名稱，並將其納入SEO中。 因此您應該為圖片提供一個描述性的檔名。 例如 dinosaur.jpg 的命名方式會比 img835.png 更好。

+
+ +

你也可以用絕對路徑URL來嵌入圖片，例如

+ +
<img src="https://www.example.com/images/dinosaur.jpg">
+ +

但這麼做是沒有意義的，因為它只會使瀏覽器執行更多工作，瀏覽器需重複執行從DNS服務器中搜尋IP地址等等工作。您應將網站上的圖片與HTML存放在同一個伺服器上。

+ +
+

注意: 大多數圖像均受版權保護。 請勿在你的網站上隨意顯示圖片，除非：

+ + + +

侵犯版權是違法及不道德的。 此外，切勿將src屬性指向您未被授權的他人網站上的圖便。 這稱為“熱連結”。再次重申，竊取某人的頻寬是違法的，且這會減慢您網站的速度。此外當別人變更、移除或換上令人尷尬的內容時你將無法做出改變。

+
+ +

我們上面的程式碼將有以下結果：

+ +

A basic image of a dinosaur, embedded in a browser, with "Images in HTML" written above it

+ +
+

提醒: <img>和<video>之類的元素有時也稱為替換元素。 這是因為元素的內容和圖片大小是由外部（例如圖片或影音檔）所定義的，而不是由元素的內容定義。

+
+ +
+

提醒: 您可以從在Github上找到本節完成的示例（參見開源碼。）

+
+ +

替代性文字

+ +

我們下一個要看的屬性是alt。 它的功能算是圖片的文字描述，應用於因網路連接速度慢而無法看到/顯示圖片或需要長時間來跑圖等等情況。 例如，上面的程式碼我們可以像這樣修改：

+ +
<img src="images/dinosaur.jpg"
+     alt="The head and torso of a dinosaur skeleton;
+          it has a large head with long sharp teeth">
+ +

測試替代文字最簡單方法是故意拼錯檔名。 例如，如果我們的圖片名稱為dinosooooor.jpg，則瀏覽器將不會顯示該圖片，而是顯示alt文本：The Images in HTML title, but this time the dinosaur image is not displayed, and alt text is in its place.

+ +

那麼，為什麼您會看到或需要替代文字？ 它可以派上用場的原因有很多：

+ + + +

您應該在alt屬性中確切寫些什麼？ 這取決於圖片為何而出現；也就是說，如果圖片不顯示，您將損失什麼：

+ + + +

本質上，關鍵是即使在看不見圖片的情況下也能提供相同的體驗。這樣可以確保所有使用者都不會丟失任何內容。嘗試在瀏覽器中關閉圖像，然後查看外觀。您很快就會意識到，如果看不到圖片，替代文字會很有幫助。

+ +
+

Note: For more information, see our guide to Text Alternatives.

+
+ +

寬與高

+ +

You can use the width and height attributes to specify the width and height of your image. You can find your image's width and height in a number of ways. For example on the Mac you can use Cmd + I to get the info display up for the image file. Returning to our example, we could do this:

+ +
<img src="images/dinosaur.jpg"
+     alt="The head and torso of a dinosaur skeleton;
+          it has a large head with long sharp teeth"
+     width="400"
+     height="341">
+ +

This doesn't result in much difference to the display, under normal circumstances. But if the image isn't being displayed, for example, the user has just navigated to the page, and the image hasn't yet loaded, you'll notice the browser is leaving a space for the image to appear in:

+ +

The Images in HTML title, with dinosaur alt text, displayed inside a large box that results from width and height settings

+ +

This is a good thing to do, resulting in the page loading quicker and more smoothly.

+ +

However, you shouldn't alter the size of your images using HTML attributes. If you set the image size too big, you'll end up with images that look grainy, fuzzy, or too small, and wasting bandwidth downloading an image that is not fitting the user's needs. The image may also end up looking distorted, if you don't maintain the correct aspect ratio. You should use an image editor to put your image at the correct size before putting it on your webpage.

+ +
+

Note: If you do need to alter an image's size, you should use CSS instead.

+
+ +

圖片標題

+ +

As with links, you can also add title attributes to images, to provide further supporting information if needed. In our example, we could do this:

+ +
<img src="images/dinosaur.jpg"
+     alt="The head and torso of a dinosaur skeleton;
+          it has a large head with long sharp teeth"
+     width="400"
+     height="341"
+     title="A T-Rex on display in the Manchester University Museum">
+ +

This gives us a tooltip on mouse hover, just like link titles:

+ +

The dinosaur image, with a tooltip title on top of it that reads A T-Rex on display at the Manchester University Museum

+ +

However, this does not come recommended — title has a number of accessibility problems, mainly based around the fact that screen reader support is very unpredictable and most browsers won't show it unless you are hovering with a mouse (so e.g. no access to keyboard users). If you are interested in more information about this, read The Trials and Tribulations of the Title Attribute by Scott O'Hara.

+ +

It is better to include such supporting information in the main article text, rather than attached to the image.

+ +

實戰練習：嵌入圖片

+ +

It is now your turn to play! This active learning section will have you up and running with a simple embedding exercise. You are provided with a basic {{htmlelement("img")}} tag; we'd like you to embed the image located at the following URL:

+ +

https://raw.githubusercontent.com/mdn/learning-area/master/html/multimedia-and-embedding/images-in-html/dinosaur_small.jpg

+ +

Earlier we said to never hotlink to images on other servers, but this is just for learning purposes, so we'll let you off this one time.

+ +

We would also like you to:

+ + + +

If you make a mistake, you can always reset it using the Reset button. If you get really stuck, press the Show solution button to see an answer:

+ + + +

{{ EmbedLiveSample('Playable_code', 700, 350, "", "", "hide-codepen-jsfiddle") }}

+ +

用圖文和圖文標註說明圖像

+ +

Speaking of captions, there are a number of ways that you could add a caption to go with your image. For example, there would be nothing to stop you from doing this:

+ +
<div class="figure">
+  <img src="images/dinosaur.jpg"
+       alt="The head and torso of a dinosaur skeleton;
+            it has a large head with long sharp teeth"
+       width="400"
+       height="341">
+
+  <p>A T-Rex on display in the Manchester University Museum.</p>
+</div>
+ +

This is ok. It contains the content you need, and is nicely stylable using CSS. But there is a problem here: there is nothing that semantically links the image to its caption, which can cause problems for screen readers. For example, when you have 50 images and captions, which caption goes with which image?

+ +

A better solution, is to use the HTML5 {{htmlelement("figure")}} and {{htmlelement("figcaption")}} elements. These are created for exactly this purpose: to provide a semantic container for figures, and to clearly link the figure to the caption. Our above example could be rewritten like this:

+ +
<figure>
+  <img src="images/dinosaur.jpg"
+       alt="The head and torso of a dinosaur skeleton;
+            it has a large head with long sharp teeth"
+       width="400"
+       height="341">
+
+  <figcaption>A T-Rex on display in the Manchester University Museum.</figcaption>
+</figure>
+ +

The {{htmlelement("figcaption")}} element tells browsers, and assistive technology that the caption describes the other content of the {{htmlelement("figure")}} element.

+ +
+

Note: From an accessibility viewpoint, captions and {{htmlattrxref('alt','img')}} text have distinct roles. Captions benefit even people who can see the image, whereas {{htmlattrxref('alt','img')}} text provides the same functionality as an absent image. Therefore, captions and alt text shouldn't just say the same thing, because they both appear when the image is gone. Try turning images off in your browser and see how it looks.

+
+ +

A figure doesn't have to be an image. It is an independent unit of content that:

+ + + +

A figure could be several images, a code snippet, audio, video, equations, a table, or something else.

+ +

實戰練習：建立圖文標註

+ +

In this active learning section, we'd like you to take the finished code from the previous active learning section, and turn it into a figure:

+ +
    +
  1. Wrap it in a {{htmlelement("figure")}} element.
    2. +
  2. Copy the text out of the title attribute, remove the title attribute, and put the text inside a {{htmlelement("figcaption")}} element below the image.
    3. +
+ +

If you make a mistake, you can always reset it using the Reset button. If you get really stuck, press the Show solution button to see an answer:

+ + + +

{{ EmbedLiveSample('Playable_code_2', 700, 350, "", "", "hide-codepen-jsfiddle") }}

+ +

CSS 背景圖片

+ +

您還可以使用CSS將圖像嵌入網頁（JavaScript也可以，但這完全是另一回事了）。 CSSbackground-image屬性和其他background- *屬性用於控制背景圖片的放置。 例如要將背景圖片放置在頁面的每個段落上，可以執行以下操作：

+ +
p {
+  background-image: url("images/dinosaur.jpg");
+}
+ +

這種嵌入圖片的方式比HTML圖像更容易定位和控制。 那麼，為什麼還要用HTML嵌入圖片呢？ 如上所述，CSS背景圖像僅用於裝飾。 如果您只是想在頁面上添加一些漂亮的東西以增強視覺效果，那很好。 但是，此類圖像根本沒有語義。 它們與文字不同，對於螢幕閱讀器是不可見的，依此類推。 這裡需要的是HTML圖片！

+ +

總結來說，如果圖片在內容上具有含義，則應使用HTML圖像。 如果圖像純粹是裝飾性的，則應使用CSS背景圖片。

+ +
+

提醒: 在我們的CSS主題中，您將學到更多關於CSS背景圖片的知識。

+
+ +

試試看!

+ +

您已經來到了本文的末端，但是您還記得最重要的內容嗎？ 在繼續往下之前，這裡有些測驗讓您驗證看看您是否都學會了 — 測驗：HTML圖像。

+ +

總結

+ +

目前就是這樣啦。 我們已經詳細介紹了圖片和標題說明。 在下一篇文章中我們將進一步介紹，如何使用HTML將視頻和音頻嵌入在網頁中。

+ +

{{NextMenu("Learn/HTML/Multimedia_and_embedding/Video_and_audio_content", "Learn/HTML/Multimedia_and_embedding")}}

+ +

在這個主題中

+ + diff --git a/files/zh-tw/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html b/files/zh-tw/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html new file mode 100644 index 0000000000..a1996f2537 --- /dev/null +++ b/files/zh-tw/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html @@ -0,0 +1,386 @@ +--- +title: 從物件到iframe - 其他嵌入技術 +slug: Learn/HTML/Multimedia_and_embedding/其他_嵌入_技術 +translation_of: Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies +--- +
{{LearnSidebar}}
+ +
{{PreviousMenuNext("Learn/HTML/Multimedia_and_embedding/Video_and_audio_content", "Learn/HTML/Multimedia_and_embedding/Adding_vector_graphics_to_the_Web", "Learn/HTML/Multimedia_and_embedding")}}
+ +

到現在為止，您應該真正掌握了將內容嵌入網頁的方法，包括圖片，影片和聲音。在這一點上，我們想採取一些橫向的措施，尋找一些元素，使您可以將各種內容類型嵌入到網頁中： {{htmlelement("iframe")}}, {{htmlelement("embed")}} 和 {{htmlelement("object")}} 元素。<iframe>用於嵌入其他網頁，另外兩個用於嵌入PDF，SVG甚至是Flash（這項技術正在淘汰，但您仍會半定期看到）。

+ + + + + + + + + + + + +
Prerequisites:Basic computer literacy, basic software installed, basic knowledge of working with files, familiarity with HTML fundamentals (as covered in Getting started with HTML) and the previous articles in this module.
Objective:To learn how to embed items into web pages using {{htmlelement("object")}}, {{htmlelement("embed")}}, and {{htmlelement("iframe")}}, like Flash movies and other webpages.
+ +

A short history of embedding

+ +

A long time ago on the Web, it was popular to use frames to create websites — small parts of a website stored in individual HTML pages. These were embedded in a master document called a frameset, which allowed you to specify the area on the screen that each frame filled, rather like sizing the columns and rows of a table. These were considered the height of coolness in the mid to late 90s, and there was evidence that having a webpage split up into smaller chunks like this was better for download speeds — especially noticeable with network connections being so slow back then. They did however have many problems, which far outweighed any positives as network speeds got faster, so you don't see them being used anymore.

+ +

A little while later (late 90s, early 2000s), plugin technologies became very popular, such as Java Applets and Flash — these allowed web developers to embed rich content into webpages such as videos and animations, which just weren't available through HTML alone. Embedding these technologies was achieved through elements like {{htmlelement("object")}}, and the lesser-used {{htmlelement("embed")}}, and they were very useful at the time. They have since fallen out of fashion due to many problems, including accessibility, security, file size, and more; these days most mobile devices don't support such plugins anymore, and desktop support is on the way out.

+ +

Finally, the {{htmlelement("iframe")}} element appeared (along with other ways of embedding content, such as {{htmlelement("canvas")}}, {{htmlelement("video")}}, etc.) This provides a way to embed an entire web document inside another one, as if it were an {{htmlelement("img")}} or other such element, and is used regularly today.

+ +

With the history lesson out of the way, let's move on and see how to use some of these.

+ +

Active learning: classic embedding uses

+ +

In this article we are going to jump straight into an active learning section, to immediately give you a real idea of just what embedding technologies are useful for. The online world is very familiar with Youtube, but many people don't know about some of the sharing facilities it has available. Let's look at how Youtube allows us to embed a video in any page we like using an {{htmlelement("iframe")}}.

+ +
    +
  1. First, go to Youtube and find a video you like.
    2. +
  2. Below the video, you'll find a Share button — select this to display the sharing options.
    3. +
  3. Select the Embed button and you'll be given some <iframe> code — copy this.
    4. +
  4. Insert it into the Input box below, and see what the result is in the Output.
    5. +
+ +

For bonus points, you could also try embedding a Google Map in the example:

+ +
    +
  1. Go to Google Maps and find a map you like.
    2. +
  2. Click on the "Hamburger Menu" (three horizontal lines) in the top left of the UI.
    3. +
  3. Select the Share or embed map option.
    4. +
  4. Select the Embed map option, which will give you some <iframe> code — copy this.
    5. +
  5. Insert it into the Input box below, and see what the result is in the Output.
    6. +
+ +

If you make a mistake, you can always reset it using the Reset button. If you get really stuck, press the Show solution button to see an answer.

+ + + +

{{ EmbedLiveSample('Playable_code', 700, 600, "", "", "hide-codepen-jsfiddle") }}

+ +

Iframes in detail

+ +

So, that was easy and fun, right? {{htmlelement("iframe")}} elements are designed to allow you to embed other web documents into the current document. This is great for incorporating third-party content into your website that you might not have direct control over and don't want to have to implement your own version of — such as video from online video providers, commenting systems like Disqus, maps from online map providers, advertising banners, etc. The live editable examples you've been using through this course are implemented using <iframe>s.

+ +

There are some serious {{anch("Security concerns")}} to consider with <iframe>s, as we'll discuss below, but this doesn't mean that you shouldn't use them in your websites — it just requires some knowledge and careful thinking. Let's explore the code in a bit more detail. Say you wanted to include the MDN glossary on one of your web pages — you could try something like this:

+ +
<iframe src="https://developer.mozilla.org/en-US/docs/Glossary"
+        width="100%" height="500" frameborder="0"
+        allowfullscreen sandbox>
+  <p>
+    <a href="https://developer.mozilla.org/en-US/docs/Glossary">
+       Fallback link for browsers that don't support iframes
+    </a>
+  </p>
+</iframe>
+ +

This example includes the basic essentials needed to use an <iframe>:

+ +
+
{{htmlattrxref('allowfullscreen','iframe')}}
+
If set, the <iframe> is able to be placed in fullscreen mode using the Full Screen API (somewhat beyond scope for this article.)
+
{{htmlattrxref('frameborder','iframe')}}
+
If set to 1, this tells the browser to draw a border between this frame and other frames, which is the default behaviour. 0 removes the border. Using this isn't really recommended any more, as the same effect can be better achieved using {{cssxref('border')}}: none; in your {{Glossary('CSS')}}.
+
{{htmlattrxref('src','iframe')}}
+
This attribute, as with {{htmlelement("video")}}/{{htmlelement("img")}}, contains a path pointing to the URL of the document to be embedded.
+
{{htmlattrxref('width','iframe')}} and {{htmlattrxref('height','iframe')}}
+
These attributes specify the width and height you want the iframe to be.
+
Fallback content
+
In the same way as other similar elements like {{htmlelement("video")}}, you can include fallback content between the opening and closing <iframe></iframe> tags that will appear if the browser doesn't support the <iframe>. In this case, we have included a link to the page instead. It is unlikely that you'll come across any browser that doesn't support <iframe>s these days.
+
{{htmlattrxref('sandbox','iframe')}}
+
This attribute, which works in slightly more modern browsers than the rest of the <iframe> features (e.g. IE 10 and above) requests heightened security settings; we'll say more about this in the next section.
+
+ +
+

Note: In order to improve speed, it's a good idea to set the iframe's src attribute with JavaScript after the main content is done with loading. This makes your page usable sooner and decreases your official page load time (an important {{glossary("SEO")}} metric.)

+
+ +

Security concerns

+ +

Above we mentioned security concerns — let's go into this in a bit more detail now. We are not expecting you to understand all of this content perfectly the first time; we just want to make you aware of this concern, and provide a reference to come back to as you get more experienced and start considering using <iframe>s in your experiments and work. Also, there is no need to be scared and not use <iframe>s — you just need to be careful. Read on...

+ +

Browser makers and Web developers have learned the hard way that iframes are a common target (official term: attack vector) for bad people on the Web (often termed hackers, or more accurately, crackers) to attack if they are trying to maliciously modify your webpage, or trick people into doing something they don't want to do, such as reveal sensitive information like usernames and passwords. Because of this, spec engineers and browser developers have developed various security mechanisms for making <iframe>s more secure, and there are also best practices to consider — we'll cover some of these below.

+ +
+

{{interwiki('wikipedia','Clickjacking')}} is one kind of common iframe attack where hackers embed an invisible iframe into your document (or embed your document into their own malicious website) and use it to capture users' interactions. This is a common way to mislead users or steal sensitive data.

+
+ +

A quick example first though — try loading the previous example we showed above into your browser — you can find it live on Github (see the source code too.) You won't actually see anything displayed on the page, and if you look at the Console in the browser developer tools, you'll see a message telling you why. In Firefox, you'll get told Load denied by X-Frame-Options: https://developer.mozilla.org/en-US/docs/Glossary does not permit framing. This is because the developers that built MDN have included a setting on the server that serves the website pages to disallow them from being embedded inside <iframe>s (see {{anch("Configure CSP directives")}}, below.) This makes sense — an entire MDN page doesn't really make sense to be embedded in other pages unless you want to do something like embed them on your site and claim them as your own — or attempt to steal data via clickjacking, which are both really bad things to do. Plus if everybody started to do this, all the additional bandwidth would start to cost Mozilla a lot of money.

+ +

Only embed when necessary

+ +

Sometimes it makes sense to embed third-party content — like youtube videos and maps — but you can save yourself a lot of headaches if you only embed third-party content when completely necessary. A good rule of thumb for web security is "You can never be too cautious. If you made it, double-check it anyway. If someone else made it, assume it's dangerous until proven otherwise."

+ +
+

Besides security, you should also be aware of intellectual property issues. Most content is copyrighted, offline and online, even content you might not expect (for example, most images on Wikimedia Commons). Never display content on your webpage unless you own it or the owners have given you written, unequivocal permission. Penalties for copyright infringement are severe. Again, you can never be too cautious.

+ +

If the content is licensed, you must obey the license terms. For example, the content on MDN is licensed under CC-BY-SA. That means, you must credit us properly when you quote our content, even if you make substantial changes.

+
+ +

Use HTTPS

+ +

{{Glossary("HTTPS")}} is the encrypted version of {{Glossary("HTTP")}}. You should serve your websites using HTTPS whenever possible:

+ +
    +
  1. HTTPS reduces the chance that remote content has been tampered with in transit,
    2. +
  2. HTTPS prevents embedded content from accessing content in your parent document, and vice versa.
    3. +
+ +

Using HTTPS requires a security certificate, which can be expensive (although Let's Encrypt makes things easier) — if you can't get one, you may serve your parent document with HTTP. However, because of the second benefit of HTTPS above, no matter what the cost, you must never embed third-party content with HTTP. (In the best case scenario, your user's Web browser will give them a scary warning.) All reputable companies that make content available for embedding via an <iframe> will make it available via HTTPS — look at the URLs inside the <iframe> src attribute when you are embedding content from Google Maps or Youtube, for example.

+ +
+

Note: Github pages allow content to be served via HTTPS by default, so is useful for hosting content. If you are using different hosting and are not sure, ask your hosting provider about it.

+
+ +

Always use the sandbox attribute

+ +

You want to give attackers as little power as you can to do bad things on your website, therefore you should give embedded content only the permissions needed for doing its job. Of course, this applies to your own content, too. A container for code where it can be used appropriately — or for testing — but can't cause any harm to the rest of the codebase (either accidental or malicious) is called a sandbox.

+ +

Unsandboxed content can do way too much (executing JavaScript, submitting forms, popup windows, etc.) By default, you should impose all available restrictions by using the sandbox attribute with no parameters, as shown in our previous example.

+ +

If absolutely required, you can add permissions back one by one (inside the sandbox="" attribute value) — see the {{htmlattrxref('sandbox','iframe')}} reference entry for all the available options. One important note is that you should never add both allow-scripts and allow-same-origin to your sandbox attribute — in that case, the embedded content could bypass the Same-origin policy that stops sites from executing scripts, and use JavaScript to turn off sandboxing altogether.

+ +
+

Note: Sandboxing provides no protection if attackers can fool people into visiting malicious content directly (outside an iframe). If there's any chance that certain content may be malicious (e.g., user-generated content), please serve it from a different {{glossary("domain")}} to your main site.

+
+ +

Configure CSP directives

+ +

{{Glossary("CSP")}} stands for content security policy and provides a set of HTTP Headers (metadata sent along with your web pages when they are served from a web server) designed to improve the security of your HTML document. When it comes to securing <iframe>s, you can configure your server to send an appropriate X-Frame-Options  header. This can prevent other websites from embedding your content in their web pages (which would enable {{interwiki('wikipedia','clickjacking')}} and a host of other attacks), which is exactly what the MDN developers have done, as we saw earlier on.

+ +
+

Note: You can read Frederik Braun's post On the X-Frame-Options Security Header for more background information on this topic. Obviously, it's rather out of scope for a full explanation in this article.

+
+ +

The <embed> and <object> elements

+ +

The {{htmlelement("embed")}} and {{htmlelement("object")}} elements serve a different function to {{htmlelement("iframe")}} — these elements are general purpose embedding tools for embedding multiple types of external content, which include plugin technologies like Java Applets and Flash, PDF (which can be shown in a browser with a PDF plugin), and even content like videos, SVG and images!

+ +
+

Note: A plugin, in this context, refers to software that provides access to content the browser cannot read natively.

+
+ +

However, you are unlikely to use these elements very much — Applets haven't been used for years, Flash is no longer very popular, due to a number of reasons (see {{anch("The case against plugins")}}, below), PDFs tend to be better linked to than embedded, and other content such as images and video have much better, easier elements to handle those. Plugins and these embedding methods are really a legacy technology, and we are mainly mentioning them in case you come across them in certain circumstances like intranets, or enterprise projects.

+ +

If you find yourself needing to embed plugin content, this is the kind of information you'll need, at a minimum:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
{{htmlelement("embed")}}{{htmlelement("object")}}
{{glossary("URL")}} of the embedded content{{htmlattrxref('src','embed')}}{{htmlattrxref('data','object')}}
accurate {{glossary("MIME type", 'media type')}} of the embedded content{{htmlattrxref('type','embed')}}{{htmlattrxref('type','object')}}
height and width (in CSS pixels) of the box controlled by the plugin{{htmlattrxref('height','embed')}}
+ {{htmlattrxref('width','embed')}}		{{htmlattrxref('height','object')}}
+ {{htmlattrxref('width','object')}}
names and values, to feed the plugin as parametersad hoc attributes with those names and valuessingle-tag {{htmlelement("param")}} elements, contained within <object>
independent HTML content as fallback for an unavailable resourcenot supported (<noembed> is obsolete)contained within <object>, after <param> elements
+ +
+

Note: <object> requires a data attribute, a type attribute, or both. If you use both, you may also use the {{htmlattrxref('typemustmatch','object')}} attribute (only implemented in Firefox and Chrome, as of this writing). typemustmatch keeps the embedded file from running unless the type attribute provides the correct media type. typemustmatch can therefore confer significant security benefits when you're embedding content from a different {{glossary("origin")}} (it can keep attackers from running arbitrary scripts through the plugin).

+
+ +

Here's an example that uses the {{htmlelement("embed")}} element to embed a Flash movie (see this live on Github, and check the source code too):

+ +
<embed src="whoosh.swf" quality="medium"
+       bgcolor="#ffffff" width="550" height="400"
+       name="whoosh" align="middle" allowScriptAccess="sameDomain"
+       allowFullScreen="false" type="application/x-shockwave-flash"
+       pluginspage="http://www.macromedia.com/go/getflashplayer">
+ +

Pretty horrible, isn't it? The HTML generated by the Adobe Flash tool tended to be even worse, using an <object> element with an <embed> element embedded in it, to cover all bases (check out an example.) Flash was even used successfully as fallback content for HTML5 video, for a time, but this is increasingly being seen as not necessary.

+ +

Now let's look at an <object> example that embeds a PDF into a page (see the live example and the source code):

+ +
<object data="mypdf.pdf" type="application/pdf"
+        width="800" height="1200" typemustmatch>
+  <p>You don't have a PDF plugin, but you can
+    <a href="mypdf.pdf">download the PDF file.
+    </a>
+  </p>
+</object>
+ +

PDFs were a necessary stepping stone between paper and digital, but they pose many accessibility challenges and can be hard to read on small screens. They do still tend to be popular in some circles, but it is much better to link to them so they can be downloaded or read on a separate page, rather than embedding them in a webpage.

+ +

The case against plugins

+ +

Once upon a time, plugins were indispensable on the Web. Remember the days when you had to install Adobe Flash Player just to watch a movie online? And then you constantly got annoying alerts about updating Flash Player and your Java Runtime Environment. Web technologies have since grown much more robust, and those days are over. For virtually all applications, it's time to stop delivering content that depends on plugins and start taking advantage of Web technologies instead.

+ + + +
+

Note: Due to its inherent issues and the lack of support for Flash, Adobe announced that they would stop supporting it at the end of 2020.  As of January 2020, most browsers block Flash content by default, and by December 31st of 2020, all browsers will have completly removed all Flash functionality. Any existing Flash content will be inaccessable after that date.

+
+ +

So what should you do? If you need interactivity, HTML and {{glossary("JavaScript")}} can readily get the job done for you with no need for Java applets or outdated ActiveX/BHO technology. Instead of relying on Adobe Flash, you should use HTML5 video for your media needs, SVG for vector graphics, and Canvas for complex images and animations. Peter Elst was already writing some years ago that Adobe Flash is rarely the right tool for the job. As for ActiveX, even Microsoft's {{glossary("Microsoft Edge","Edge")}} browser no longer supports it.

+ +

Test your skills!

+ +

You've reached the end of this article, but can you remember the most important information? You can find some further tests to verify that you've retained this information before you move on — see Test your skills: Multimedia and embedding.

+ +

Summary

+ +

The topic of embedding other content in web documents can quickly become very complex, so in this article, we've tried to introduce it in a simple, familiar way that will immediately seem relevant, while still hinting at some of the more advanced features of the involved technologies. To start with, you are unlikely to use embedding for much beyond including third-party content like maps and videos on your pages. As you become more experienced, however, you are likely to start finding more uses for them.

+ +

There are many other technologies that involve embedding external content besides the ones we discussed here. We saw some in earlier articles, such as {{htmlelement("video")}}, {{htmlelement("audio")}}, and {{htmlelement("img")}}, but there are others to discover, such as {{htmlelement("canvas")}} for JavaScript-generated 2D and 3D graphics, and {{SVGElement("svg")}} for embedding vector graphics. We'll look at SVG in the next article of the module.

+ +

{{PreviousMenuNext("Learn/HTML/Multimedia_and_embedding/Video_and_audio_content", "Learn/HTML/Multimedia_and_embedding/Adding_vector_graphics_to_the_Web", "Learn/HTML/Multimedia_and_embedding")}}

+ +

In this module

+ + diff --git "a/files/zh-tw/learn/html/multimedia_and_embedding/\345\205\266\344\273\226_\345\265\214\345\205\245_\346\212\200\350\241\223/index.html" "b/files/zh-tw/learn/html/multimedia_and_embedding/\345\205\266\344\273\226_\345\265\214\345\205\245_\346\212\200\350\241\223/index.html" deleted file mode 100644 index a1996f2537..0000000000 --- "a/files/zh-tw/learn/html/multimedia_and_embedding/\345\205\266\344\273\226_\345\265\214\345\205\245_\346\212\200\350\241\223/index.html" +++ /dev/null @@ -1,386 +0,0 @@ ---- -title: 從物件到iframe - 其他嵌入技術 -slug: Learn/HTML/Multimedia_and_embedding/其他_嵌入_技術 -translation_of: Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies ---- -
{{LearnSidebar}}
- -
{{PreviousMenuNext("Learn/HTML/Multimedia_and_embedding/Video_and_audio_content", "Learn/HTML/Multimedia_and_embedding/Adding_vector_graphics_to_the_Web", "Learn/HTML/Multimedia_and_embedding")}}
- -

到現在為止，您應該真正掌握了將內容嵌入網頁的方法，包括圖片，影片和聲音。在這一點上，我們想採取一些橫向的措施，尋找一些元素，使您可以將各種內容類型嵌入到網頁中： {{htmlelement("iframe")}}, {{htmlelement("embed")}} 和 {{htmlelement("object")}} 元素。<iframe>用於嵌入其他網頁，另外兩個用於嵌入PDF，SVG甚至是Flash（這項技術正在淘汰，但您仍會半定期看到）。

- - - - - - - - - - - - -
Prerequisites:Basic computer literacy, basic software installed, basic knowledge of working with files, familiarity with HTML fundamentals (as covered in Getting started with HTML) and the previous articles in this module.
Objective:To learn how to embed items into web pages using {{htmlelement("object")}}, {{htmlelement("embed")}}, and {{htmlelement("iframe")}}, like Flash movies and other webpages.
- -

A short history of embedding

- -

A long time ago on the Web, it was popular to use frames to create websites — small parts of a website stored in individual HTML pages. These were embedded in a master document called a frameset, which allowed you to specify the area on the screen that each frame filled, rather like sizing the columns and rows of a table. These were considered the height of coolness in the mid to late 90s, and there was evidence that having a webpage split up into smaller chunks like this was better for download speeds — especially noticeable with network connections being so slow back then. They did however have many problems, which far outweighed any positives as network speeds got faster, so you don't see them being used anymore.

- -

A little while later (late 90s, early 2000s), plugin technologies became very popular, such as Java Applets and Flash — these allowed web developers to embed rich content into webpages such as videos and animations, which just weren't available through HTML alone. Embedding these technologies was achieved through elements like {{htmlelement("object")}}, and the lesser-used {{htmlelement("embed")}}, and they were very useful at the time. They have since fallen out of fashion due to many problems, including accessibility, security, file size, and more; these days most mobile devices don't support such plugins anymore, and desktop support is on the way out.

- -

Finally, the {{htmlelement("iframe")}} element appeared (along with other ways of embedding content, such as {{htmlelement("canvas")}}, {{htmlelement("video")}}, etc.) This provides a way to embed an entire web document inside another one, as if it were an {{htmlelement("img")}} or other such element, and is used regularly today.

- -

With the history lesson out of the way, let's move on and see how to use some of these.

- -

Active learning: classic embedding uses

- -

In this article we are going to jump straight into an active learning section, to immediately give you a real idea of just what embedding technologies are useful for. The online world is very familiar with Youtube, but many people don't know about some of the sharing facilities it has available. Let's look at how Youtube allows us to embed a video in any page we like using an {{htmlelement("iframe")}}.

- -
    -
  1. First, go to Youtube and find a video you like.
    2. -
  2. Below the video, you'll find a Share button — select this to display the sharing options.
    3. -
  3. Select the Embed button and you'll be given some <iframe> code — copy this.
    4. -
  4. Insert it into the Input box below, and see what the result is in the Output.
    5. -
- -

For bonus points, you could also try embedding a Google Map in the example:

- -
    -
  1. Go to Google Maps and find a map you like.
    2. -
  2. Click on the "Hamburger Menu" (three horizontal lines) in the top left of the UI.
    3. -
  3. Select the Share or embed map option.
    4. -
  4. Select the Embed map option, which will give you some <iframe> code — copy this.
    5. -
  5. Insert it into the Input box below, and see what the result is in the Output.
    6. -
- -

If you make a mistake, you can always reset it using the Reset button. If you get really stuck, press the Show solution button to see an answer.

- - - -

{{ EmbedLiveSample('Playable_code', 700, 600, "", "", "hide-codepen-jsfiddle") }}

- -

Iframes in detail

- -

So, that was easy and fun, right? {{htmlelement("iframe")}} elements are designed to allow you to embed other web documents into the current document. This is great for incorporating third-party content into your website that you might not have direct control over and don't want to have to implement your own version of — such as video from online video providers, commenting systems like Disqus, maps from online map providers, advertising banners, etc. The live editable examples you've been using through this course are implemented using <iframe>s.

- -

There are some serious {{anch("Security concerns")}} to consider with <iframe>s, as we'll discuss below, but this doesn't mean that you shouldn't use them in your websites — it just requires some knowledge and careful thinking. Let's explore the code in a bit more detail. Say you wanted to include the MDN glossary on one of your web pages — you could try something like this:

- -
<iframe src="https://developer.mozilla.org/en-US/docs/Glossary"
-        width="100%" height="500" frameborder="0"
-        allowfullscreen sandbox>
-  <p>
-    <a href="https://developer.mozilla.org/en-US/docs/Glossary">
-       Fallback link for browsers that don't support iframes
-    </a>
-  </p>
-</iframe>
- -

This example includes the basic essentials needed to use an <iframe>:

- -
-
{{htmlattrxref('allowfullscreen','iframe')}}
-
If set, the <iframe> is able to be placed in fullscreen mode using the Full Screen API (somewhat beyond scope for this article.)
-
{{htmlattrxref('frameborder','iframe')}}
-
If set to 1, this tells the browser to draw a border between this frame and other frames, which is the default behaviour. 0 removes the border. Using this isn't really recommended any more, as the same effect can be better achieved using {{cssxref('border')}}: none; in your {{Glossary('CSS')}}.
-
{{htmlattrxref('src','iframe')}}
-
This attribute, as with {{htmlelement("video")}}/{{htmlelement("img")}}, contains a path pointing to the URL of the document to be embedded.
-
{{htmlattrxref('width','iframe')}} and {{htmlattrxref('height','iframe')}}
-
These attributes specify the width and height you want the iframe to be.
-
Fallback content
-
In the same way as other similar elements like {{htmlelement("video")}}, you can include fallback content between the opening and closing <iframe></iframe> tags that will appear if the browser doesn't support the <iframe>. In this case, we have included a link to the page instead. It is unlikely that you'll come across any browser that doesn't support <iframe>s these days.
-
{{htmlattrxref('sandbox','iframe')}}
-
This attribute, which works in slightly more modern browsers than the rest of the <iframe> features (e.g. IE 10 and above) requests heightened security settings; we'll say more about this in the next section.
-
- -
-

Note: In order to improve speed, it's a good idea to set the iframe's src attribute with JavaScript after the main content is done with loading. This makes your page usable sooner and decreases your official page load time (an important {{glossary("SEO")}} metric.)

-
- -

Security concerns

- -

Above we mentioned security concerns — let's go into this in a bit more detail now. We are not expecting you to understand all of this content perfectly the first time; we just want to make you aware of this concern, and provide a reference to come back to as you get more experienced and start considering using <iframe>s in your experiments and work. Also, there is no need to be scared and not use <iframe>s — you just need to be careful. Read on...

- -

Browser makers and Web developers have learned the hard way that iframes are a common target (official term: attack vector) for bad people on the Web (often termed hackers, or more accurately, crackers) to attack if they are trying to maliciously modify your webpage, or trick people into doing something they don't want to do, such as reveal sensitive information like usernames and passwords. Because of this, spec engineers and browser developers have developed various security mechanisms for making <iframe>s more secure, and there are also best practices to consider — we'll cover some of these below.

- -
-

{{interwiki('wikipedia','Clickjacking')}} is one kind of common iframe attack where hackers embed an invisible iframe into your document (or embed your document into their own malicious website) and use it to capture users' interactions. This is a common way to mislead users or steal sensitive data.

-
- -

A quick example first though — try loading the previous example we showed above into your browser — you can find it live on Github (see the source code too.) You won't actually see anything displayed on the page, and if you look at the Console in the browser developer tools, you'll see a message telling you why. In Firefox, you'll get told Load denied by X-Frame-Options: https://developer.mozilla.org/en-US/docs/Glossary does not permit framing. This is because the developers that built MDN have included a setting on the server that serves the website pages to disallow them from being embedded inside <iframe>s (see {{anch("Configure CSP directives")}}, below.) This makes sense — an entire MDN page doesn't really make sense to be embedded in other pages unless you want to do something like embed them on your site and claim them as your own — or attempt to steal data via clickjacking, which are both really bad things to do. Plus if everybody started to do this, all the additional bandwidth would start to cost Mozilla a lot of money.

- -

Only embed when necessary

- -

Sometimes it makes sense to embed third-party content — like youtube videos and maps — but you can save yourself a lot of headaches if you only embed third-party content when completely necessary. A good rule of thumb for web security is "You can never be too cautious. If you made it, double-check it anyway. If someone else made it, assume it's dangerous until proven otherwise."

- -
-

Besides security, you should also be aware of intellectual property issues. Most content is copyrighted, offline and online, even content you might not expect (for example, most images on Wikimedia Commons). Never display content on your webpage unless you own it or the owners have given you written, unequivocal permission. Penalties for copyright infringement are severe. Again, you can never be too cautious.

- -

If the content is licensed, you must obey the license terms. For example, the content on MDN is licensed under CC-BY-SA. That means, you must credit us properly when you quote our content, even if you make substantial changes.

-
- -

Use HTTPS

- -

{{Glossary("HTTPS")}} is the encrypted version of {{Glossary("HTTP")}}. You should serve your websites using HTTPS whenever possible:

- -
    -
  1. HTTPS reduces the chance that remote content has been tampered with in transit,
    2. -
  2. HTTPS prevents embedded content from accessing content in your parent document, and vice versa.
    3. -
- -

Using HTTPS requires a security certificate, which can be expensive (although Let's Encrypt makes things easier) — if you can't get one, you may serve your parent document with HTTP. However, because of the second benefit of HTTPS above, no matter what the cost, you must never embed third-party content with HTTP. (In the best case scenario, your user's Web browser will give them a scary warning.) All reputable companies that make content available for embedding via an <iframe> will make it available via HTTPS — look at the URLs inside the <iframe> src attribute when you are embedding content from Google Maps or Youtube, for example.

- -
-

Note: Github pages allow content to be served via HTTPS by default, so is useful for hosting content. If you are using different hosting and are not sure, ask your hosting provider about it.

-
- -

Always use the sandbox attribute

- -

You want to give attackers as little power as you can to do bad things on your website, therefore you should give embedded content only the permissions needed for doing its job. Of course, this applies to your own content, too. A container for code where it can be used appropriately — or for testing — but can't cause any harm to the rest of the codebase (either accidental or malicious) is called a sandbox.

- -

Unsandboxed content can do way too much (executing JavaScript, submitting forms, popup windows, etc.) By default, you should impose all available restrictions by using the sandbox attribute with no parameters, as shown in our previous example.

- -

If absolutely required, you can add permissions back one by one (inside the sandbox="" attribute value) — see the {{htmlattrxref('sandbox','iframe')}} reference entry for all the available options. One important note is that you should never add both allow-scripts and allow-same-origin to your sandbox attribute — in that case, the embedded content could bypass the Same-origin policy that stops sites from executing scripts, and use JavaScript to turn off sandboxing altogether.

- -
-

Note: Sandboxing provides no protection if attackers can fool people into visiting malicious content directly (outside an iframe). If there's any chance that certain content may be malicious (e.g., user-generated content), please serve it from a different {{glossary("domain")}} to your main site.

-
- -

Configure CSP directives

- -

{{Glossary("CSP")}} stands for content security policy and provides a set of HTTP Headers (metadata sent along with your web pages when they are served from a web server) designed to improve the security of your HTML document. When it comes to securing <iframe>s, you can configure your server to send an appropriate X-Frame-Options  header. This can prevent other websites from embedding your content in their web pages (which would enable {{interwiki('wikipedia','clickjacking')}} and a host of other attacks), which is exactly what the MDN developers have done, as we saw earlier on.

- -
-

Note: You can read Frederik Braun's post On the X-Frame-Options Security Header for more background information on this topic. Obviously, it's rather out of scope for a full explanation in this article.

-
- -

The <embed> and <object> elements

- -

The {{htmlelement("embed")}} and {{htmlelement("object")}} elements serve a different function to {{htmlelement("iframe")}} — these elements are general purpose embedding tools for embedding multiple types of external content, which include plugin technologies like Java Applets and Flash, PDF (which can be shown in a browser with a PDF plugin), and even content like videos, SVG and images!

- -
-

Note: A plugin, in this context, refers to software that provides access to content the browser cannot read natively.

-
- -

However, you are unlikely to use these elements very much — Applets haven't been used for years, Flash is no longer very popular, due to a number of reasons (see {{anch("The case against plugins")}}, below), PDFs tend to be better linked to than embedded, and other content such as images and video have much better, easier elements to handle those. Plugins and these embedding methods are really a legacy technology, and we are mainly mentioning them in case you come across them in certain circumstances like intranets, or enterprise projects.

- -

If you find yourself needing to embed plugin content, this is the kind of information you'll need, at a minimum:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
{{htmlelement("embed")}}{{htmlelement("object")}}
{{glossary("URL")}} of the embedded content{{htmlattrxref('src','embed')}}{{htmlattrxref('data','object')}}
accurate {{glossary("MIME type", 'media type')}} of the embedded content{{htmlattrxref('type','embed')}}{{htmlattrxref('type','object')}}
height and width (in CSS pixels) of the box controlled by the plugin{{htmlattrxref('height','embed')}}
- {{htmlattrxref('width','embed')}}		{{htmlattrxref('height','object')}}
- {{htmlattrxref('width','object')}}
names and values, to feed the plugin as parametersad hoc attributes with those names and valuessingle-tag {{htmlelement("param")}} elements, contained within <object>
independent HTML content as fallback for an unavailable resourcenot supported (<noembed> is obsolete)contained within <object>, after <param> elements
- -
-

Note: <object> requires a data attribute, a type attribute, or both. If you use both, you may also use the {{htmlattrxref('typemustmatch','object')}} attribute (only implemented in Firefox and Chrome, as of this writing). typemustmatch keeps the embedded file from running unless the type attribute provides the correct media type. typemustmatch can therefore confer significant security benefits when you're embedding content from a different {{glossary("origin")}} (it can keep attackers from running arbitrary scripts through the plugin).

-
- -

Here's an example that uses the {{htmlelement("embed")}} element to embed a Flash movie (see this live on Github, and check the source code too):

- -
<embed src="whoosh.swf" quality="medium"
-       bgcolor="#ffffff" width="550" height="400"
-       name="whoosh" align="middle" allowScriptAccess="sameDomain"
-       allowFullScreen="false" type="application/x-shockwave-flash"
-       pluginspage="http://www.macromedia.com/go/getflashplayer">
- -

Pretty horrible, isn't it? The HTML generated by the Adobe Flash tool tended to be even worse, using an <object> element with an <embed> element embedded in it, to cover all bases (check out an example.) Flash was even used successfully as fallback content for HTML5 video, for a time, but this is increasingly being seen as not necessary.

- -

Now let's look at an <object> example that embeds a PDF into a page (see the live example and the source code):

- -
<object data="mypdf.pdf" type="application/pdf"
-        width="800" height="1200" typemustmatch>
-  <p>You don't have a PDF plugin, but you can
-    <a href="mypdf.pdf">download the PDF file.
-    </a>
-  </p>
-</object>
- -

PDFs were a necessary stepping stone between paper and digital, but they pose many accessibility challenges and can be hard to read on small screens. They do still tend to be popular in some circles, but it is much better to link to them so they can be downloaded or read on a separate page, rather than embedding them in a webpage.

- -

The case against plugins

- -

Once upon a time, plugins were indispensable on the Web. Remember the days when you had to install Adobe Flash Player just to watch a movie online? And then you constantly got annoying alerts about updating Flash Player and your Java Runtime Environment. Web technologies have since grown much more robust, and those days are over. For virtually all applications, it's time to stop delivering content that depends on plugins and start taking advantage of Web technologies instead.

- - - -
-

Note: Due to its inherent issues and the lack of support for Flash, Adobe announced that they would stop supporting it at the end of 2020.  As of January 2020, most browsers block Flash content by default, and by December 31st of 2020, all browsers will have completly removed all Flash functionality. Any existing Flash content will be inaccessable after that date.

-
- -

So what should you do? If you need interactivity, HTML and {{glossary("JavaScript")}} can readily get the job done for you with no need for Java applets or outdated ActiveX/BHO technology. Instead of relying on Adobe Flash, you should use HTML5 video for your media needs, SVG for vector graphics, and Canvas for complex images and animations. Peter Elst was already writing some years ago that Adobe Flash is rarely the right tool for the job. As for ActiveX, even Microsoft's {{glossary("Microsoft Edge","Edge")}} browser no longer supports it.

- -

Test your skills!

- -

You've reached the end of this article, but can you remember the most important information? You can find some further tests to verify that you've retained this information before you move on — see Test your skills: Multimedia and embedding.

- -

Summary

- -

The topic of embedding other content in web documents can quickly become very complex, so in this article, we've tried to introduce it in a simple, familiar way that will immediately seem relevant, while still hinting at some of the more advanced features of the involved technologies. To start with, you are unlikely to use embedding for much beyond including third-party content like maps and videos on your pages. As you become more experienced, however, you are likely to start finding more uses for them.

- -

There are many other technologies that involve embedding external content besides the ones we discussed here. We saw some in earlier articles, such as {{htmlelement("video")}}, {{htmlelement("audio")}}, and {{htmlelement("img")}}, but there are others to discover, such as {{htmlelement("canvas")}} for JavaScript-generated 2D and 3D graphics, and {{SVGElement("svg")}} for embedding vector graphics. We'll look at SVG in the next article of the module.

- -

{{PreviousMenuNext("Learn/HTML/Multimedia_and_embedding/Video_and_audio_content", "Learn/HTML/Multimedia_and_embedding/Adding_vector_graphics_to_the_Web", "Learn/HTML/Multimedia_and_embedding")}}

- -

In this module

- - diff --git a/files/zh-tw/learn/html/tables/basics/index.html b/files/zh-tw/learn/html/tables/basics/index.html new file mode 100644 index 0000000000..03325afbce --- /dev/null +++ b/files/zh-tw/learn/html/tables/basics/index.html @@ -0,0 +1,568 @@ +--- +title: HTML表格的基礎 +slug: Learn/HTML/Tables/基礎 +translation_of: Learn/HTML/Tables/Basics +--- +
{{LearnSidebar}}
+ +
{{NextMenu("Learn/HTML/Tables/Advanced", "Learn/HTML/Tables")}}
+ +

這篇文章將帶你從列、格、標頭，以及將各格以數欄、數列的方式合併等基礎開始探索HTML表格。

+ + + + + + + + + + + + +
先備知識: +

HTML的基礎(見介紹HTML)

+
目標:對HTML表格有基本的認識
+ +

什麼是表格?

+ +

表格是一個由列和欄組成的結構化資料(tabular data)。表格能幫助你快速查看不同資料類型間的關聯值。例如人和年紀、一周當中的某天或是地方游泳池的時間表。

+ +

A sample table showing names and ages of some people - Chris 38, Dennis 45, Sarah 29, Karen 47.

+ +

A swimming timetable showing a sample data table

+ +

表格在人類社會當中被廣泛使用且已經有很久的歷史，如下是美國1800年的人口普查紀錄表格。

+ +

A very old parchment document; the data is not easily readable, but it clearly shows a data table being used.

+ +

這也難怪HTML的開創者要提供一個在網路建立和呈現表格化資料的方法。

+ +

表格是怎麼運作的呢?

+ +

表格是精確的，資訊可以透過列和欄位名稱之間的視覺關聯輕鬆呈現。觀察以下表格，利用列和欄目名稱找出有62個衛星的類木行星。

+ +

有關太陽系星球的資訊 (真實資料取自 Nasa's Planetary Fact Sheet - Metric. )

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
名稱質量(1024kg)直徑 (km)密度(kg/m3)重力(m/s2)一天的長度(小時)和太陽的距離(106km)平均溫度 (°C)衛星的數目備註
陸地行星水星0.3304,87954273.74222.657.91670最接近太陽
金星4.8712,10452438.92802.0108.24640
地球5.9712,75655149.824.0149.6151我們的世界
火星0.6426,79239333.724.7227.9-652紅色星球
類木行星氣態巨行星木星1898142,984132623.19.9778.6-11067最大的星球
土星568120,5366879.010.71433.5-14062
冰質巨行星天王星86.851,11812718.717.22872.5-19527
海王星10249,528163811.016.14495.1-20014
矮行星冥王星0.01462,37020950.7153.35906.4-2255在2006年被從行星類別中除名，但這還些爭議。
+ +

在正確執行之下，就連視障者都可以把表格資料詮釋為HTML格式的表格。一份成功的HTML表格就應該如此提升視障者的使用經驗。

+ +

表格樣式

+ +

你也可以在 GitHub 上看看實際範例 ! 而你也許會注意到那裡的表格似乎更容易閱讀。那是因為這裡的表格只有加上很少樣式，而GitHub上的版本卻應用上了更多明顯的CSS 。

+ +

需要弄清楚的一點是 : 要讓表格在網頁上有效呈現需要提供紮實的HTML架構和CSS樣式資訊，但將在這個模組中聚焦在HTML的部分。若想瞭解CSS的部分，可以在完成這部分閱讀之後造訪表格樣式設計的文章。

+ +

在這個單元裡我們將不會聚焦在CSS上，但是我們提供基本的CSS樣式表讓你做使用，這將會使你製作的表格比起毫無修飾的預設樣式更方便閱讀。你能在這找到樣式表，並且你也能找到一個適用於樣式表的HTML模版 — 他們能一起讓你有個好起點來實驗HTML表格。

+ +

當何時你不應該使用HTML表格?

+ +

HTML表格應該被使用在結構化資料(tabular data)上 — 這就是它們被設計的目的。
+ 不幸地是，許多人習慣使用HTML表格去排版他們的網頁，例如: 使用一列去當header，一列當做內容欄位，一列當作footer...等等，你能在我們的輔助學習單元裡的頁面輸出發現更多細節以及一個範例。它曾經被這麼使用是因為CSS過去在不同瀏覽器之間的支援程度十分可怕; 如今，已非常少在用表格做排版，但你仍然可能在網路的一些邊邊角角見到。

+ +

簡單來說，使用表格排版而非使用CSS排版技術是一件很糟的事情。
+ 下列是主要原因:

+ +
    +
  1. 表格排版會減少對視障使用者的輔助 : 視障者使用的螢幕閱讀器會翻譯存在於HTML網頁的標籤並對使用者念出內容。由於表格並不是正確的排版工具，並且標示方式遠複雜於CSS排版技術，所以螢幕閱讀器輸出的內容會使他們的使用者感到困惑。
    2. +
  2. 表格會產生標籤雜燴(tag soup): 就像上面提到的，表格排版通常會比一般適當的輸出技術包含更複雜的標籤結構。這會導致程式碼本身更難撰寫、維護及debug。
    3. +
  3. 表格不會自適應(automatically responsive): 當你使用合適的排版容器(像是{htmlelement("header")}, {{htmlelement("section")}}) 或是 {{htmlelement("div")}}),它們的寬度相對於父層預設為100%，而表格的預設大小是依據它們的內容物，所以當表格樣式要有效的在不同的裝置之間運行時，會需要做額外的測量調整。
    4. +
+ +

主動學習:建造你第一個表格

+ +

關於表格的理論我們已經談論夠了，所以，來深入實際的例子並建立一個簡單的表格吧!

+ +
    +
  1. 第一件事，在自己的電腦複製一份新的空白模板.html 以及 簡易表格.css 
    2. +
  2. 每一個表格裡的內容都是由這兩個標籤所組成:<table></table> 將這些放入你的HTML中的body。
    3. +
  3. 表格裡最小的容器是表格儲存格，由<td>元素所組成('td' 代表 'table data')。將下列的程式碼加入你的表格標籤之中: + 
    <td>Hi, I'm your first cell.</td>
    +
    4. +
  4. 如果我們想要一個四格儲存格寬的列(row), 我們需要複製這些標籤三次。
    + 將你的表格內容更新成這樣: + 
    <td>Hi, I'm your first cell.</td>
+<td>I'm your second cell.</td>
+<td>I'm your third cell.</td>
+<td>I'm your fourth cell.</td>
    +
    5. +
+ +

就像你看到的，儲存格不會在各自的下方，它們彼此自動排列在同一列上。每個 <td> 元素會創造單個儲存格並且使它們據在同一行，我們新增的每一個儲存格都會使列更長。

+ +

要讓這個列停止增加並開始在下一列增加連續的儲存格的話，我們需要用 <tr> 元素 ('tr' 代表 'table row')，現在來探討一下:

+ +
    +
  1. 放置四個你已新增在 <tr> 標籤裡的儲存格, 像這樣: + + 
    <tr>
+  <td>Hi, I'm your first cell.</td>
+  <td>I'm your second cell.</td>
+  <td>I'm your third cell.</td>
+  <td>I'm your fourth cell.</td>
+</tr>
    +
    2. +
  2. 現在你已經製作了一列了，可以再繼續做一、二列 — 每個列都需要被額外的 <tr> 元素包裹住, 並且每個儲存格都須包含在一個 <td>  內
    3. +
+ +

表格應該會看起來像下面這樣:

+ + + + + + + + + + + + + + + + +
Hi, I'm your first cell.I'm your second cell.I'm your third cell.I'm your fourth cell.
Second row, first cell.Cell 2.Cell 3.Cell 4.
+ +
+

Note: 你也可以在GitHub 上看到 simple-table.html (see it live also).

+
+ +

用 <th> 加上標頭元素

+ +

現在，讓我們把注意力轉移到表格的標頭(table header) — 存在於一列或一欄開頭的特別儲存格並且定義了欄或列中內容的資料型態 (舉個例子, 看看這篇文章中第一個範例裡 的"Person" 和 "Age" 儲存格 )。
+ 為了說明為什麼它們很有用，請看下面的表格例子, 首先是程式碼:

+ +
<table>
+  <tr>
+    <td>&nbsp;</td>
+    <td>Knocky</td>
+    <td>Flor</td>
+    <td>Ella</td>
+    <td>Juan</td>
+  </tr>
+  <tr>
+    <td>Breed</td>
+    <td>Jack Russell</td>
+    <td>Poodle</td>
+    <td>Streetdog</td>
+    <td>Cocker Spaniel</td>
+  </tr>
+  <tr>
+    <td>Age</td>
+    <td>16</td>
+    <td>9</td>
+    <td>10</td>
+    <td>5</td>
+  </tr>
+  <tr>
+    <td>Owner</td>
+    <td>Mother-in-law</td>
+    <td>Me</td>
+    <td>Me</td>
+    <td>Sister-in-law</td>
+  </tr>
+  <tr>
+    <td>Eating Habits</td>
+    <td>Eats everyone's leftovers</td>
+    <td>Nibbles at food</td>
+    <td>Hearty eater</td>
+    <td>Will eat till he explodes</td>
+  </tr>
+</table>
+ +

這是實際渲染出的表格:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
KnockyFlorEllaJuan
BreedJack RussellPoodleStreetdogCocker Spaniel
Age169105
OwnerMother-in-lawMeMeSister-in-law
Eating HabitsEats everyone's leftoversNibbles at foodHearty eaterWill eat till he explodes
+ +

這裡的問題在於，當你找到想知道的資料時，並不容易去找到資料之間對應的位置。如果欄跟列能有個明顯的標示，會比較好理解。

+ +

主動學習 : 表格標頭

+ +

讓我們來繼續改善這個表格吧!

+ +
    +
  1. 首先, 複製 dogs-table.html and minimal-table.css 檔案到你的電腦。
    + 這份HTML裡包含跟底下你看到的一樣的狗狗範例。
    2. +
  2. 為了在語意上和視覺上辨識表格的標頭，你可以使用 <th> 元素 ('th' 代表 'table header')。它的運作方式跟 <td> 完全相同，除了它表示的是標頭而非一般儲存格外。
    + 繼續修改你的HTML將所有外圍的 <td> 元素變成 <th> 元素。
    3. +
  3. 儲存你的HTML並在瀏覽器上執行，現在你應該可以看到標頭應有的樣子。
    4. +
+ +
+

Note: 你可以在GitHub上的dogs-table-fixed.html找到我們寫好的完整的範例(直接看看長怎樣).

+
+ +

標頭為什麼實用?

+ +

我們已經部分解答了這個問題 — 當有標頭清楚標示時，它能更簡單的使你找到資料並讓整體設計看起來更完整。

+ +
+

Note: 表格標頭有具備預設樣式 — 粗體並置中，即使你不加上你自己的表格樣式，他們仍然能被凸顯。

+
+ +

表格標頭還有一個額外的好處 — 伴隨著 作用域(scope) 屬性 (我們將會在下一個章節中學到)，當要連結每個標頭而所有資料都在同一列或欄時，這能允許表格使用起來更無障礙。並且，螢幕閱讀器能一次性讀出完整一列或一欄的資料，這是非常實用的。

+ +

允許列或欄的儲存格合併

+ +

有時我們想要儲存格涵蓋複數的列或欄，來看看下列顯示常見動物名稱的簡單例子。在某些案例，我們想要將名字代表雄性或雌性顯示在動物名字旁邊，但有些不需要，這種情況下我們只想將動物名字橫跨整個表格。

+ +

初始架構會看起來像這樣:

+ +
<table>
+  <tr>
+    <th>Animals</th>
+  </tr>
+  <tr>
+    <th>Hippopotamus</th>
+  </tr>
+  <tr>
+    <th>Horse</th>
+    <td>Mare</td>
+  </tr>
+  <tr>
+    <td>Stallion</td>
+  </tr>
+  <tr>
+    <th>Crocodile</th>
+  </tr>
+  <tr>
+    <th>Chicken</th>
+    <td>Hen</td>
+  </tr>
+  <tr>
+    <td>Rooster</td>
+  </tr>
+</table>
+ +

但輸出的不如我們想要的樣子:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
Animals
Hippopotamus
HorseMare
Stallion
Crocodile
ChickenHen
Rooster
+ +

我們需要一種方式讓"Animals", "Hippopotamus", 和 "Crocodile" 橫跨兩個欄位, 然後讓 "Horse" and "Chicken" 向下合併兩列儲存格。幸運地是，表格標頭和儲存格有 colspan 和 rowspan 屬性，可以讓我們這樣做。 兩者都接受無單位的數值等同於你想合併的列或欄的數量。舉例來說，colspan="2" 會讓這個儲存格合併兩欄。

+ +

來使用 colspan 和 rowspan 來改善這麼表格吧!

+ +
    +
  1. 首先，複製一份我們的 animals-table.html 和 minimal-table.css 檔案在你的電腦上。這個HTML包含跟上面同樣的動物範例。
    2. +
  2. 接著，使用 colspan 來讓 "Animals", "Hippopotamus", 和 "Crocodile" 合併橫跨兩個欄位。
    3. +
  3. 最後, 使用 rowspan 來讓 "Horse" and "Chicken" 合併橫跨兩列。
    4. +
  4. 儲存並在瀏覽器上檢視你改善後的程式碼。
    5. +
+ +
+

Note: 你可以在GitHub上的 animals-table-fixed.html 找到我們寫好的完整的範例 (see it live also).

+
+ + +
+ +

Providing common styling to columns

+ +

在我們繼續下去前，我們將要告訴你這節文章最後一個重點。HTML有一個一次定義一整欄樣式資訊的方法 —  <col>  <colgroup> 元素。These exist because it can be a bit annoying and inefficient having to specify styling on columns — you generally have to specify your styling information on every <td> or <th> in the column, or use a complex selector such as {{cssxref(":nth-child()")}}.

+ +
+

Note: Styling columns like this is limited to a few properties: border, background, width, and visibility. To set other properties you'll have to either style every <td> or <th> in the column, or use a complex selector such as {{cssxref(":nth-child()")}}.

+
+ +

Take the following simple example:

+ +
<table>
+  <tr>
+    <th>Data 1</th>
+    <th style="background-color: yellow">Data 2</th>
+  </tr>
+  <tr>
+    <td>Calcutta</td>
+    <td style="background-color: yellow">Orange</td>
+  </tr>
+  <tr>
+    <td>Robots</td>
+    <td style="background-color: yellow">Jazz</td>
+  </tr>
+</table>
+ +

Which gives us the following result:

+ + + + + + + + + + + + + + + + +
Data 1Data 2
CalcuttaOrange
RobotsJazz
+ +

This isn't ideal, as we have to repeat the styling information across all three cells in the column (we'd probably have a class set on all three in a real project and specify the styling in a separate stylesheet). Instead of doing this, we can specify the information once, on a <col> element. <col> elements are  specified inside a <colgroup> container just below the opening <table> tag. We could create the same effect as we see above by specifying our table as follows:

+ +
<table>
+  <colgroup>
+    <col>
+    <col style="background-color: yellow">
+  </colgroup>
+  <tr>
+    <th>Data 1</th>
+    <th>Data 2</th>
+  </tr>
+  <tr>
+    <td>Calcutta</td>
+    <td>Orange</td>
+  </tr>
+  <tr>
+    <td>Robots</td>
+    <td>Jazz</td>
+  </tr>
+</table>
+ +

Effectively we are defining two "style columns", one specifying styling information for each column. We are not styling the first column, but we still have to include a blank <col> element — if we didn't, the styling would just be applied to the first column.

+ +

If we wanted to apply the styling information to both columns, we could just include one <col> element with a span attribute on it, like this:

+ +
<colgroup>
+  <col style="background-color: yellow" span="2">
+</colgroup>
+ +

Just like colspan and rowspan, span takes a unitless number value that specifies the number of columns you want the styling to apply to.

+ +

Active learning: colgroup and col

+ +

Now it's time to have a go yourself.

+ +

Below you can see the timetable of a languages teacher. On Friday she has a new class teaching Dutch all day, but she also teaches German for a few periods on Tuesday and Thursdays. She wants to highlight the columns containing the days she is teaching.

+ +

{{EmbedGHLiveSample("learning-area/html/tables/basic/timetable-fixed.html", '100%', 320)}}

+ +

Recreate the table by following the steps below.

+ +
    +
  1. First, make a local copy of our timetable.html file in a new directory on your local machine. The HTML contains the same table you saw above, minus the column styling information.
    2. +
  2. Add a <colgroup> element at the top of the table, just underneath the <table> tag, in which you can add your <col> elements (see the remaining steps below).
    3. +
  3. The first two columns need to be left unstyled.
    4. +
  4. Add a background color to the third column. The value for your style attribute is background-color:#97DB9A;
    5. +
  5. Set a separate width on the fourth column. The value for your style attribute is width: 42px;
    6. +
  6. Add a background color to the fifth column. The value for your style attribute is background-color: #97DB9A;
    7. +
  7. Add a different background color plus a border to the sixth column, to signify that this is a special day and she's teaching a new class. The values for your style attribute are background-color:#DCC48E; border:4px solid #C1437A;
    8. +
  8. The last two days are free days, so just set them to no background color but a set width; the value for the style attribute is width: 42px;
    9. +
+ +

See how you get on with the example. If you get stuck, or want to check your work, you can find our version on GitHub as timetable-fixed.html (see it live also).

+ +

Summary

+ +

That just about wraps up the basics of HTML Tables. In the next article we will look at some slightly more advanced table features, and start to think how accessible they are for visually impaired people.

+ +
{{NextMenu("Learn/HTML/Tables/Advanced", "Learn/HTML/Tables")}}
+ +
+

In this module

+ + +
diff --git "a/files/zh-tw/learn/html/tables/\345\237\272\347\244\216/index.html" "b/files/zh-tw/learn/html/tables/\345\237\272\347\244\216/index.html" deleted file mode 100644 index 03325afbce..0000000000 --- "a/files/zh-tw/learn/html/tables/\345\237\272\347\244\216/index.html" +++ /dev/null @@ -1,568 +0,0 @@ ---- -title: HTML表格的基礎 -slug: Learn/HTML/Tables/基礎 -translation_of: Learn/HTML/Tables/Basics ---- -
{{LearnSidebar}}
- -
{{NextMenu("Learn/HTML/Tables/Advanced", "Learn/HTML/Tables")}}
- -

這篇文章將帶你從列、格、標頭，以及將各格以數欄、數列的方式合併等基礎開始探索HTML表格。

- - - - - - - - - - - - -
先備知識: -

HTML的基礎(見介紹HTML)

-
目標:對HTML表格有基本的認識
- -

什麼是表格?

- -

表格是一個由列和欄組成的結構化資料(tabular data)。表格能幫助你快速查看不同資料類型間的關聯值。例如人和年紀、一周當中的某天或是地方游泳池的時間表。

- -

A sample table showing names and ages of some people - Chris 38, Dennis 45, Sarah 29, Karen 47.

- -

A swimming timetable showing a sample data table

- -

表格在人類社會當中被廣泛使用且已經有很久的歷史，如下是美國1800年的人口普查紀錄表格。

- -

A very old parchment document; the data is not easily readable, but it clearly shows a data table being used.

- -

這也難怪HTML的開創者要提供一個在網路建立和呈現表格化資料的方法。

- -

表格是怎麼運作的呢?

- -

表格是精確的，資訊可以透過列和欄位名稱之間的視覺關聯輕鬆呈現。觀察以下表格，利用列和欄目名稱找出有62個衛星的類木行星。

- -

有關太陽系星球的資訊 (真實資料取自 Nasa's Planetary Fact Sheet - Metric. )

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
名稱質量(1024kg)直徑 (km)密度(kg/m3)重力(m/s2)一天的長度(小時)和太陽的距離(106km)平均溫度 (°C)衛星的數目備註
陸地行星水星0.3304,87954273.74222.657.91670最接近太陽
金星4.8712,10452438.92802.0108.24640
地球5.9712,75655149.824.0149.6151我們的世界
火星0.6426,79239333.724.7227.9-652紅色星球
類木行星氣態巨行星木星1898142,984132623.19.9778.6-11067最大的星球
土星568120,5366879.010.71433.5-14062
冰質巨行星天王星86.851,11812718.717.22872.5-19527
海王星10249,528163811.016.14495.1-20014
矮行星冥王星0.01462,37020950.7153.35906.4-2255在2006年被從行星類別中除名，但這還些爭議。
- -

在正確執行之下，就連視障者都可以把表格資料詮釋為HTML格式的表格。一份成功的HTML表格就應該如此提升視障者的使用經驗。

- -

表格樣式

- -

你也可以在 GitHub 上看看實際範例 ! 而你也許會注意到那裡的表格似乎更容易閱讀。那是因為這裡的表格只有加上很少樣式，而GitHub上的版本卻應用上了更多明顯的CSS 。

- -

需要弄清楚的一點是 : 要讓表格在網頁上有效呈現需要提供紮實的HTML架構和CSS樣式資訊，但將在這個模組中聚焦在HTML的部分。若想瞭解CSS的部分，可以在完成這部分閱讀之後造訪表格樣式設計的文章。

- -

在這個單元裡我們將不會聚焦在CSS上，但是我們提供基本的CSS樣式表讓你做使用，這將會使你製作的表格比起毫無修飾的預設樣式更方便閱讀。你能在這找到樣式表，並且你也能找到一個適用於樣式表的HTML模版 — 他們能一起讓你有個好起點來實驗HTML表格。

- -

當何時你不應該使用HTML表格?

- -

HTML表格應該被使用在結構化資料(tabular data)上 — 這就是它們被設計的目的。
- 不幸地是，許多人習慣使用HTML表格去排版他們的網頁，例如: 使用一列去當header，一列當做內容欄位，一列當作footer...等等，你能在我們的輔助學習單元裡的頁面輸出發現更多細節以及一個範例。它曾經被這麼使用是因為CSS過去在不同瀏覽器之間的支援程度十分可怕; 如今，已非常少在用表格做排版，但你仍然可能在網路的一些邊邊角角見到。

- -

簡單來說，使用表格排版而非使用CSS排版技術是一件很糟的事情。
- 下列是主要原因:

- -
    -
  1. 表格排版會減少對視障使用者的輔助 : 視障者使用的螢幕閱讀器會翻譯存在於HTML網頁的標籤並對使用者念出內容。由於表格並不是正確的排版工具，並且標示方式遠複雜於CSS排版技術，所以螢幕閱讀器輸出的內容會使他們的使用者感到困惑。
    2. -
  2. 表格會產生標籤雜燴(tag soup): 就像上面提到的，表格排版通常會比一般適當的輸出技術包含更複雜的標籤結構。這會導致程式碼本身更難撰寫、維護及debug。
    3. -
  3. 表格不會自適應(automatically responsive): 當你使用合適的排版容器(像是{htmlelement("header")}, {{htmlelement("section")}}) 或是 {{htmlelement("div")}}),它們的寬度相對於父層預設為100%，而表格的預設大小是依據它們的內容物，所以當表格樣式要有效的在不同的裝置之間運行時，會需要做額外的測量調整。
    4. -
- -

主動學習:建造你第一個表格

- -

關於表格的理論我們已經談論夠了，所以，來深入實際的例子並建立一個簡單的表格吧!

- -
    -
  1. 第一件事，在自己的電腦複製一份新的空白模板.html 以及 簡易表格.css 
    2. -
  2. 每一個表格裡的內容都是由這兩個標籤所組成:<table></table> 將這些放入你的HTML中的body。
    3. -
  3. 表格裡最小的容器是表格儲存格，由<td>元素所組成('td' 代表 'table data')。將下列的程式碼加入你的表格標籤之中: - 
    <td>Hi, I'm your first cell.</td>
    -
    4. -
  4. 如果我們想要一個四格儲存格寬的列(row), 我們需要複製這些標籤三次。
    - 將你的表格內容更新成這樣: - 
    <td>Hi, I'm your first cell.</td>
-<td>I'm your second cell.</td>
-<td>I'm your third cell.</td>
-<td>I'm your fourth cell.</td>
    -
    5. -
- -

就像你看到的，儲存格不會在各自的下方，它們彼此自動排列在同一列上。每個 <td> 元素會創造單個儲存格並且使它們據在同一行，我們新增的每一個儲存格都會使列更長。

- -

要讓這個列停止增加並開始在下一列增加連續的儲存格的話，我們需要用 <tr> 元素 ('tr' 代表 'table row')，現在來探討一下:

- -
    -
  1. 放置四個你已新增在 <tr> 標籤裡的儲存格, 像這樣: - - 
    <tr>
-  <td>Hi, I'm your first cell.</td>
-  <td>I'm your second cell.</td>
-  <td>I'm your third cell.</td>
-  <td>I'm your fourth cell.</td>
-</tr>
    -
    2. -
  2. 現在你已經製作了一列了，可以再繼續做一、二列 — 每個列都需要被額外的 <tr> 元素包裹住, 並且每個儲存格都須包含在一個 <td>  內
    3. -
- -

表格應該會看起來像下面這樣:

- - - - - - - - - - - - - - - - -
Hi, I'm your first cell.I'm your second cell.I'm your third cell.I'm your fourth cell.
Second row, first cell.Cell 2.Cell 3.Cell 4.
- -
-

Note: 你也可以在GitHub 上看到 simple-table.html (see it live also).

-
- -

用 <th> 加上標頭元素

- -

現在，讓我們把注意力轉移到表格的標頭(table header) — 存在於一列或一欄開頭的特別儲存格並且定義了欄或列中內容的資料型態 (舉個例子, 看看這篇文章中第一個範例裡 的"Person" 和 "Age" 儲存格 )。
- 為了說明為什麼它們很有用，請看下面的表格例子, 首先是程式碼:

- -
<table>
-  <tr>
-    <td>&nbsp;</td>
-    <td>Knocky</td>
-    <td>Flor</td>
-    <td>Ella</td>
-    <td>Juan</td>
-  </tr>
-  <tr>
-    <td>Breed</td>
-    <td>Jack Russell</td>
-    <td>Poodle</td>
-    <td>Streetdog</td>
-    <td>Cocker Spaniel</td>
-  </tr>
-  <tr>
-    <td>Age</td>
-    <td>16</td>
-    <td>9</td>
-    <td>10</td>
-    <td>5</td>
-  </tr>
-  <tr>
-    <td>Owner</td>
-    <td>Mother-in-law</td>
-    <td>Me</td>
-    <td>Me</td>
-    <td>Sister-in-law</td>
-  </tr>
-  <tr>
-    <td>Eating Habits</td>
-    <td>Eats everyone's leftovers</td>
-    <td>Nibbles at food</td>
-    <td>Hearty eater</td>
-    <td>Will eat till he explodes</td>
-  </tr>
-</table>
- -

這是實際渲染出的表格:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
KnockyFlorEllaJuan
BreedJack RussellPoodleStreetdogCocker Spaniel
Age169105
OwnerMother-in-lawMeMeSister-in-law
Eating HabitsEats everyone's leftoversNibbles at foodHearty eaterWill eat till he explodes
- -

這裡的問題在於，當你找到想知道的資料時，並不容易去找到資料之間對應的位置。如果欄跟列能有個明顯的標示，會比較好理解。

- -

主動學習 : 表格標頭

- -

讓我們來繼續改善這個表格吧!

- -
    -
  1. 首先, 複製 dogs-table.html and minimal-table.css 檔案到你的電腦。
    - 這份HTML裡包含跟底下你看到的一樣的狗狗範例。
    2. -
  2. 為了在語意上和視覺上辨識表格的標頭，你可以使用 <th> 元素 ('th' 代表 'table header')。它的運作方式跟 <td> 完全相同，除了它表示的是標頭而非一般儲存格外。
    - 繼續修改你的HTML將所有外圍的 <td> 元素變成 <th> 元素。
    3. -
  3. 儲存你的HTML並在瀏覽器上執行，現在你應該可以看到標頭應有的樣子。
    4. -
- -
-

Note: 你可以在GitHub上的dogs-table-fixed.html找到我們寫好的完整的範例(直接看看長怎樣).

-
- -

標頭為什麼實用?

- -

我們已經部分解答了這個問題 — 當有標頭清楚標示時，它能更簡單的使你找到資料並讓整體設計看起來更完整。

- -
-

Note: 表格標頭有具備預設樣式 — 粗體並置中，即使你不加上你自己的表格樣式，他們仍然能被凸顯。

-
- -

表格標頭還有一個額外的好處 — 伴隨著 作用域(scope) 屬性 (我們將會在下一個章節中學到)，當要連結每個標頭而所有資料都在同一列或欄時，這能允許表格使用起來更無障礙。並且，螢幕閱讀器能一次性讀出完整一列或一欄的資料，這是非常實用的。

- -

允許列或欄的儲存格合併

- -

有時我們想要儲存格涵蓋複數的列或欄，來看看下列顯示常見動物名稱的簡單例子。在某些案例，我們想要將名字代表雄性或雌性顯示在動物名字旁邊，但有些不需要，這種情況下我們只想將動物名字橫跨整個表格。

- -

初始架構會看起來像這樣:

- -
<table>
-  <tr>
-    <th>Animals</th>
-  </tr>
-  <tr>
-    <th>Hippopotamus</th>
-  </tr>
-  <tr>
-    <th>Horse</th>
-    <td>Mare</td>
-  </tr>
-  <tr>
-    <td>Stallion</td>
-  </tr>
-  <tr>
-    <th>Crocodile</th>
-  </tr>
-  <tr>
-    <th>Chicken</th>
-    <td>Hen</td>
-  </tr>
-  <tr>
-    <td>Rooster</td>
-  </tr>
-</table>
- -

但輸出的不如我們想要的樣子:

- - - - - - - - - - - - - - - - - - - - - - - - - - - -
Animals
Hippopotamus
HorseMare
Stallion
Crocodile
ChickenHen
Rooster
- -

我們需要一種方式讓"Animals", "Hippopotamus", 和 "Crocodile" 橫跨兩個欄位, 然後讓 "Horse" and "Chicken" 向下合併兩列儲存格。幸運地是，表格標頭和儲存格有 colspan 和 rowspan 屬性，可以讓我們這樣做。 兩者都接受無單位的數值等同於你想合併的列或欄的數量。舉例來說，colspan="2" 會讓這個儲存格合併兩欄。

- -

來使用 colspan 和 rowspan 來改善這麼表格吧!

- -
    -
  1. 首先，複製一份我們的 animals-table.html 和 minimal-table.css 檔案在你的電腦上。這個HTML包含跟上面同樣的動物範例。
    2. -
  2. 接著，使用 colspan 來讓 "Animals", "Hippopotamus", 和 "Crocodile" 合併橫跨兩個欄位。
    3. -
  3. 最後, 使用 rowspan 來讓 "Horse" and "Chicken" 合併橫跨兩列。
    4. -
  4. 儲存並在瀏覽器上檢視你改善後的程式碼。
    5. -
- -
-

Note: 你可以在GitHub上的 animals-table-fixed.html 找到我們寫好的完整的範例 (see it live also).

-
- - -
- -

Providing common styling to columns

- -

在我們繼續下去前，我們將要告訴你這節文章最後一個重點。HTML有一個一次定義一整欄樣式資訊的方法 —  <col>  <colgroup> 元素。These exist because it can be a bit annoying and inefficient having to specify styling on columns — you generally have to specify your styling information on every <td> or <th> in the column, or use a complex selector such as {{cssxref(":nth-child()")}}.

- -
-

Note: Styling columns like this is limited to a few properties: border, background, width, and visibility. To set other properties you'll have to either style every <td> or <th> in the column, or use a complex selector such as {{cssxref(":nth-child()")}}.

-
- -

Take the following simple example:

- -
<table>
-  <tr>
-    <th>Data 1</th>
-    <th style="background-color: yellow">Data 2</th>
-  </tr>
-  <tr>
-    <td>Calcutta</td>
-    <td style="background-color: yellow">Orange</td>
-  </tr>
-  <tr>
-    <td>Robots</td>
-    <td style="background-color: yellow">Jazz</td>
-  </tr>
-</table>
- -

Which gives us the following result:

- - - - - - - - - - - - - - - - -
Data 1Data 2
CalcuttaOrange
RobotsJazz
- -

This isn't ideal, as we have to repeat the styling information across all three cells in the column (we'd probably have a class set on all three in a real project and specify the styling in a separate stylesheet). Instead of doing this, we can specify the information once, on a <col> element. <col> elements are  specified inside a <colgroup> container just below the opening <table> tag. We could create the same effect as we see above by specifying our table as follows:

- -
<table>
-  <colgroup>
-    <col>
-    <col style="background-color: yellow">
-  </colgroup>
-  <tr>
-    <th>Data 1</th>
-    <th>Data 2</th>
-  </tr>
-  <tr>
-    <td>Calcutta</td>
-    <td>Orange</td>
-  </tr>
-  <tr>
-    <td>Robots</td>
-    <td>Jazz</td>
-  </tr>
-</table>
- -

Effectively we are defining two "style columns", one specifying styling information for each column. We are not styling the first column, but we still have to include a blank <col> element — if we didn't, the styling would just be applied to the first column.

- -

If we wanted to apply the styling information to both columns, we could just include one <col> element with a span attribute on it, like this:

- -
<colgroup>
-  <col style="background-color: yellow" span="2">
-</colgroup>
- -

Just like colspan and rowspan, span takes a unitless number value that specifies the number of columns you want the styling to apply to.

- -

Active learning: colgroup and col

- -

Now it's time to have a go yourself.

- -

Below you can see the timetable of a languages teacher. On Friday she has a new class teaching Dutch all day, but she also teaches German for a few periods on Tuesday and Thursdays. She wants to highlight the columns containing the days she is teaching.

- -

{{EmbedGHLiveSample("learning-area/html/tables/basic/timetable-fixed.html", '100%', 320)}}

- -

Recreate the table by following the steps below.

- -
    -
  1. First, make a local copy of our timetable.html file in a new directory on your local machine. The HTML contains the same table you saw above, minus the column styling information.
    2. -
  2. Add a <colgroup> element at the top of the table, just underneath the <table> tag, in which you can add your <col> elements (see the remaining steps below).
    3. -
  3. The first two columns need to be left unstyled.
    4. -
  4. Add a background color to the third column. The value for your style attribute is background-color:#97DB9A;
    5. -
  5. Set a separate width on the fourth column. The value for your style attribute is width: 42px;
    6. -
  6. Add a background color to the fifth column. The value for your style attribute is background-color: #97DB9A;
    7. -
  7. Add a different background color plus a border to the sixth column, to signify that this is a special day and she's teaching a new class. The values for your style attribute are background-color:#DCC48E; border:4px solid #C1437A;
    8. -
  8. The last two days are free days, so just set them to no background color but a set width; the value for the style attribute is width: 42px;
    9. -
- -

See how you get on with the example. If you get stuck, or want to check your work, you can find our version on GitHub as timetable-fixed.html (see it live also).

- -

Summary

- -

That just about wraps up the basics of HTML Tables. In the next article we will look at some slightly more advanced table features, and start to think how accessible they are for visually impaired people.

- -
{{NextMenu("Learn/HTML/Tables/Advanced", "Learn/HTML/Tables")}}
- -
-

In this module

- - -
diff --git a/files/zh-tw/learn/javascript/building_blocks/events/index.html b/files/zh-tw/learn/javascript/building_blocks/events/index.html new file mode 100644 index 0000000000..102e9cd314 --- /dev/null +++ b/files/zh-tw/learn/javascript/building_blocks/events/index.html @@ -0,0 +1,85 @@ +--- +title: Event attributes +slug: Web/Guide/HTML/Event_attributes +translation_of: >- + Learn/JavaScript/Building_blocks/Events#Inline_event_handlers_%E2%80%94_don%27t_use_these +translation_of_original: Web/Guide/HTML/Event_attributes +--- +

每一個 HTML 元素都可以放置事件屬性，以藉此於事件發生時能執行 JavaScripte 程式。事件屬性的名稱都有一個前綴「on」，例如當使用者點選元素時要執行指定的 JavaScript，可以使用 onclick 屬性並把要執行的 JavaScript 當成屬性值。

+ +

In the JavaScript code executed in response to the event, this is bound to the HTML element and the {{domxref("Event")}} object can be reached using the event variable in the scope of the attribute.

+ +
+

Warning: These attributes should be avoided. This makes the markup bigger and less readable. Concerns of content/structure and behavior are not well-separated, making a bug harder to find. Furthermore, usage of event attributes almost always causes scripts to expose global functions on the {{domxref("Window")}} object, polluting the global namespace.

+
+ +

While these attributes can at times be attractively easy to use, you should avoid using them. Instead, use the {{domxref("EventTarget.addEventListener()")}} function to add a listener for the event.

+ +

Event attributes can be blocked by using Content Security Policy which if used, blocks all inline scripts unless the 'unsafe-inline' keyword is used.

+ +

Example using event attributes

+ +

This example appends text to an element each time time the {{HTMLElement("div")}} is clicked.

+ +
+

Note: This is an example of how not to do things, using one of these attributes.

+
+ +
<!doctype html>
+<html>
+  <head>
+    <title>Event Attribute Example</title>
+    <script>
+      function doSomething() {
+        document.getElementById("thanks").innerHTML += "<p>Thanks for clicking!</p>";
+      }
+    </script>
+  </head>
+  <body>
+    <div onclick="doSomething();">Click me!</div>
+    <div id="thanks"></div>
+  </body>
+</html>
+
+ +

Try this example below:

+ +

{{ EmbedLiveSample('Example_using_event_attributes', '', '', '') }}

+ +

Example using event listeners

+ +

Instead, you should use {{domxref("EventTarget.addEventListener()")}}, as shown here:

+ +
<!doctype html>
+<html>
+  <head>
+    <title>Event Attribute Example</title>
+    <script>
+      function doSomething() {
+        document.getElementById("thanks").innerHTML += "<p>Thanks for clicking!</p>";
+      }
+
+      // Called when the page is done loading; this is where we do any setup we need,
+      // such as creating event listeners for the elements in the page.
+
+      function setup() {
+        document.getElementById("click").addEventListener("click", doSomething, true);
+      }
+
+      // Install an event handler on the window to receive the "load" event, which
+      // indicates that the document has finished loading into the window.
+
+      window.addEventListener("load", setup, true);
+    </script>
+  </head>
+  <body>
+    <div id="click">Click me!</div>
+    <div id="thanks"></div>
+  </body>
+</html>
+ +

You can see this in action below:

+ +

{{ EmbedLiveSample('Example_using_event_listeners', '', '', '') }}

+ + diff --git a/files/zh-tw/learn/performance/multimedia/index.html b/files/zh-tw/learn/performance/multimedia/index.html new file mode 100644 index 0000000000..cbd3d8e23a --- /dev/null +++ b/files/zh-tw/learn/performance/multimedia/index.html @@ -0,0 +1,130 @@ +--- +title: '多媒體: 圖像跟影片' +slug: Learn/Performance/多媒體 +translation_of: Learn/Performance/Multimedia +--- +

媒體，換句話說就是圖像跟影片，平均占了網站超過70%的下載流量。以下載的效能來考慮的話，減少媒體數量和檔案大小是一個簡單可以實現的目標。 這篇文章聚焦在優化圖像跟影片來改善網站的效能。

+ +
+

這是一篇進階的在 web 上優化多媒體的介紹，包含基本的原則還有技巧，想了更多的話，可以看  https://images.guide。

+
+ +

為什麼要優化你的多媒體

+ +

對於平均的網站, 51% 的頻寬消耗來自圖像, 而影像則是 25%，所以我們可以說處理和優化你的多媒體是很重要的。

+ +

你必須考慮流量的使用. 很多的人都是使用流量有限制的上網方案， 或是用多少付多少的上網方案，也就是根據用了多少 MB 來付費。這樣的問題不是只發生在新興國家的市場. 在 2018 年, 英國仍有 24% 在使用「用多少付多少」的方案。

+ +

你還需要考慮記憶體的問題，因為許多移動設備的 RAM 都有限。有一件很重要的事你必須要記住，下載的圖像是被儲存在記憶體裡的。

+ +

優化圖像傳送

+ +

儘管是頻寬的最大消耗者，但因為圖像是非同步載入的，所以訪問者可以在下載的同時看到頁面。因此，它們對感知性能的影響遠低於許多人的預期。 然而，圖像在內容中很常被使用，因此，重要的應該是讓訪問者盡快地看到它們，以獲得良好的體驗。

+ +

載入策略

+ +

對於大多數網站來說，最大改進之一是將不在視窗裡的圖像做 lazy-loading ，而不是在初始頁面載入時就全部下載下來，不管訪問者是否之後會往下滾動查看它們。 許多 JavaScript 函式庫都可以為你實現這個功能，例如說 lazysize，並且瀏覽器的供應商也正在著手原生的 lazyload 屬性，然而目前還處於實驗階段。

+ +

除了載入圖像的子集之外，接下來您還應該研究一下圖像本身的格式：

+ + + +

最佳格式

+ +

這非常值得用一個章節來介紹。因為為圖像選擇正確的格式可能很棘手。格式通常取決於圖像的用途：

+ + + +

優先在不需要移動卷軸就能看到的網頁區域使用 Progressive JPEG 的原因是因為它們會逐漸地進行渲染（因此得名），這意味著用戶可以先看到低解析度的版本，然後再逐漸地變得清晰。而不是從頂部一行一行的以最高解析度來載入圖像，或甚至只有在完全下載好後才顯示。

+ +

控制下載圖像的優先級別（和順序）

+ +

將最重要的圖像更早地呈現在訪問者面前，可以改善感知性能。

+ +

第一件要確認的事情是，你的前景圖像標籤 <img /> 跟你定義在 CSS 裡 background-image 的背景圖像 — 前景圖像比背景圖像被賦予更高的優先級別。

+ +

其次，通過採用優先級別提示，你可以在圖像標籤中添加importance 屬性來進一步控制優先級別。輪播是一個在圖像上使用優先級別提示的例子，它的第一個圖像的優先級高於其他的圖像。

+ +

渲染策略

+ +

由於圖像是非同步載入的，並且會在第一次渲染後繼續載入，因此，如果在載入之前未定義尺寸的話，則可能會導致頁面內容的重新編排。比如說，當圖像載入時，文字內容可能會被擠壓到下面。所以， 很重要的是，定義 width 跟 height 或是新的 intrinsicsize 屬性。

+ +

對於任何的背景圖像，設置 background-color 的值非常重要，因為在圖像下載之前，它能讓上面的內容是能夠被閱讀的。

+ +

優化影像傳送

+ +

為了確保您不會將不必要的大文件發送給用戶，最好 壓縮所有你要傳輸的影像，優化<source> 順序, 設定 autoplay, 移除靜音影像的聲音, 優化影像預載, 還有 考慮串流 這部影像。

+ +

壓縮所有影像

+ +

大多數的影像壓縮工作都包含，比較影像裡的相鄰幀，並刪除原始幀和後續幀中相同的細節。你想同時壓縮影像並將其匯出為多種影像格式, 包含 WebM，MPEG-4/H.264，以及 Ogg/Theora.

+ +

你用來創建影像的軟體可能包含優化檔案大小的功能。如果沒有的話，那麼可以考慮幾種線上工具，像是之後篇章會討論的 FFmpeg，他可以協助編碼，解碼，轉換，以及呈現其他神奇的功能。

+ +

優化 <source> 順序

+ +

從最小到最大來排序影像的來源。例如說，給定三個壓縮影像，分別為 10 MB，12MB，以及13MB, 把最小的擺在第一個，最大的擺在最後一格。

+ +
<video width="400" height="300" controls="controls">
+  <!-- WebM: 10 MB -->
+  <source src="video.webm" type="video/webm" />
+  <!-- MPEG-4/H.264: 12 MB -->
+  <source src="video.mp4" type="video/mp4" />
+  <!-- Ogg/Theora: 13 MB -->
+  <source src="video.ogv" type="video/ogv" />
+</video>
+ +

就順序的角度來說，瀏覽器會下載它看到的第一個影像來源，因此先讓他載入一個較小的影像。就＂最小＂的角度來說，要確認你的壓縮影響仍然看起來不會太糟。有幾個演算法可能會讓你的影像看起來像是個會動的 gif 。雖然 128 Kb 的影像可能在用戶體驗上會比 10 MB 的影像好，可是把看起來像是 gif 粒狀的影像放在內容後面，也可能會對你的品牌產生負面影響。

+ +

查看 CanIUse.com 來確認現今瀏覽器對於影像以及不同媒體格式的支持。  

+ +

影像自動播放

+ +

為了確保循環播放背景影像，你需要向影像標籤裡添加多個屬性： autoplay, muted, 以及 playsinline.

+ +
<video autoplay="" loop="" muted="true" playsinline="" src="backgroundvideo.mp4">
+ +

雖然屬性 loop 和 autoplay 在對於影像的循環跟自動播放很合理，可是 muted 屬性在行動裝置的瀏覽器裡是必須添加的。

+ +

Playsinline 在行動裝置裡的 Safari 是必須的，他讓影像可以在不需要全螢幕的模式下被播放。

+ +

移除靜音影像的聲音

+ +

如果你有一個 hero-video 或是其他靜音影片, 請將聲音從影像中移除。 

+ +
<video autoplay="" loop="" muted="true" playsinline="" id="hero-video">
+  <source src="banner_video.webm"
+          type='video/webm; codecs="vp8, vorbis"'>
+  <source src="web_banner.mp4" type="video/mp4">
+</video>
+ +

這段 hero-video 代碼, 常出現在許多研討會網站以及公司的主頁， 它是個包括自動播放，循環播放和靜音的影像。它不包含任何控制選單，因此無法收聽聲音。通常它是沒有聲音的，但仍然存在音軌，因此它仍會消耗頻寬。然而，我們沒有理由將頻寬分給靜音影像的聲音。移除聲音可以節省 20% 的頻寬。這代表，如果你的影像是 10 MB，則節省了 2 MB。

+ +

根據您的影像創作軟體，你也許可以在匯出和壓縮過程中刪除聲音。 如果沒有，那麼有一個免費的工具 FFmpeg ，可以使用以下指令來為你完成此任務

+ +
ffmpeg -i original.mp4 -an -c:v copy audioFreeVersion.mp4
+ +

FFmpeg 稱自己為＂用於記錄，轉換和串流音頻和影像的完整，跨平台解決方案＂。

+ +

影像預載

+ +

preload 屬性具有3個可用選項：auto|metadata|none。預設選項是 metadata.

+ +

將選項更改為 auto 會告訴瀏覽器自動下載整個影像。僅有在極有可能播放時才應該執行此操作，否則會浪費大量的頻寬。

+ +

preload="metadata" 最多可讓 3％ 的影像在頁面加載時被下載。 然後對於較大的影像來說，這可能或是大量的頻寬。

+ +

preload="none" 不會在播放之前下載任何的影像。 這會延遲影像的啟動時間，但能夠為播放可能性較低的影像保存大量的頻寬。

+ +

考慮串流

+ +

串流影像讓適當的影像大小和頻寬 (根據網路速度) 被傳遞給用戶。 就像使用響應式圖像一樣，正確大小的影像將被傳遞到瀏覽器，從而確保用戶的快速影像啟動、低緩衝以及優化的播放。

diff --git "a/files/zh-tw/learn/performance/\345\244\232\345\252\222\351\253\224/index.html" "b/files/zh-tw/learn/performance/\345\244\232\345\252\222\351\253\224/index.html" deleted file mode 100644 index cbd3d8e23a..0000000000 --- "a/files/zh-tw/learn/performance/\345\244\232\345\252\222\351\253\224/index.html" +++ /dev/null @@ -1,130 +0,0 @@ ---- -title: '多媒體: 圖像跟影片' -slug: Learn/Performance/多媒體 -translation_of: Learn/Performance/Multimedia ---- -

媒體，換句話說就是圖像跟影片，平均占了網站超過70%的下載流量。以下載的效能來考慮的話，減少媒體數量和檔案大小是一個簡單可以實現的目標。 這篇文章聚焦在優化圖像跟影片來改善網站的效能。

- -
-

這是一篇進階的在 web 上優化多媒體的介紹，包含基本的原則還有技巧，想了更多的話，可以看  https://images.guide。

-
- -

為什麼要優化你的多媒體

- -

對於平均的網站, 51% 的頻寬消耗來自圖像, 而影像則是 25%，所以我們可以說處理和優化你的多媒體是很重要的。

- -

你必須考慮流量的使用. 很多的人都是使用流量有限制的上網方案， 或是用多少付多少的上網方案，也就是根據用了多少 MB 來付費。這樣的問題不是只發生在新興國家的市場. 在 2018 年, 英國仍有 24% 在使用「用多少付多少」的方案。

- -

你還需要考慮記憶體的問題，因為許多移動設備的 RAM 都有限。有一件很重要的事你必須要記住，下載的圖像是被儲存在記憶體裡的。

- -

優化圖像傳送

- -

儘管是頻寬的最大消耗者，但因為圖像是非同步載入的，所以訪問者可以在下載的同時看到頁面。因此，它們對感知性能的影響遠低於許多人的預期。 然而，圖像在內容中很常被使用，因此，重要的應該是讓訪問者盡快地看到它們，以獲得良好的體驗。

- -

載入策略

- -

對於大多數網站來說，最大改進之一是將不在視窗裡的圖像做 lazy-loading ，而不是在初始頁面載入時就全部下載下來，不管訪問者是否之後會往下滾動查看它們。 許多 JavaScript 函式庫都可以為你實現這個功能，例如說 lazysize，並且瀏覽器的供應商也正在著手原生的 lazyload 屬性，然而目前還處於實驗階段。

- -

除了載入圖像的子集之外，接下來您還應該研究一下圖像本身的格式：

- - - -

最佳格式

- -

這非常值得用一個章節來介紹。因為為圖像選擇正確的格式可能很棘手。格式通常取決於圖像的用途：

- - - -

優先在不需要移動卷軸就能看到的網頁區域使用 Progressive JPEG 的原因是因為它們會逐漸地進行渲染（因此得名），這意味著用戶可以先看到低解析度的版本，然後再逐漸地變得清晰。而不是從頂部一行一行的以最高解析度來載入圖像，或甚至只有在完全下載好後才顯示。

- -

控制下載圖像的優先級別（和順序）

- -

將最重要的圖像更早地呈現在訪問者面前，可以改善感知性能。

- -

第一件要確認的事情是，你的前景圖像標籤 <img /> 跟你定義在 CSS 裡 background-image 的背景圖像 — 前景圖像比背景圖像被賦予更高的優先級別。

- -

其次，通過採用優先級別提示，你可以在圖像標籤中添加importance 屬性來進一步控制優先級別。輪播是一個在圖像上使用優先級別提示的例子，它的第一個圖像的優先級高於其他的圖像。

- -

渲染策略

- -

由於圖像是非同步載入的，並且會在第一次渲染後繼續載入，因此，如果在載入之前未定義尺寸的話，則可能會導致頁面內容的重新編排。比如說，當圖像載入時，文字內容可能會被擠壓到下面。所以， 很重要的是，定義 width 跟 height 或是新的 intrinsicsize 屬性。

- -

對於任何的背景圖像，設置 background-color 的值非常重要，因為在圖像下載之前，它能讓上面的內容是能夠被閱讀的。

- -

優化影像傳送

- -

為了確保您不會將不必要的大文件發送給用戶，最好 壓縮所有你要傳輸的影像，優化<source> 順序, 設定 autoplay, 移除靜音影像的聲音, 優化影像預載, 還有 考慮串流 這部影像。

- -

壓縮所有影像

- -

大多數的影像壓縮工作都包含，比較影像裡的相鄰幀，並刪除原始幀和後續幀中相同的細節。你想同時壓縮影像並將其匯出為多種影像格式, 包含 WebM，MPEG-4/H.264，以及 Ogg/Theora.

- -

你用來創建影像的軟體可能包含優化檔案大小的功能。如果沒有的話，那麼可以考慮幾種線上工具，像是之後篇章會討論的 FFmpeg，他可以協助編碼，解碼，轉換，以及呈現其他神奇的功能。

- -

優化 <source> 順序

- -

從最小到最大來排序影像的來源。例如說，給定三個壓縮影像，分別為 10 MB，12MB，以及13MB, 把最小的擺在第一個，最大的擺在最後一格。

- -
<video width="400" height="300" controls="controls">
-  <!-- WebM: 10 MB -->
-  <source src="video.webm" type="video/webm" />
-  <!-- MPEG-4/H.264: 12 MB -->
-  <source src="video.mp4" type="video/mp4" />
-  <!-- Ogg/Theora: 13 MB -->
-  <source src="video.ogv" type="video/ogv" />
-</video>
- -

就順序的角度來說，瀏覽器會下載它看到的第一個影像來源，因此先讓他載入一個較小的影像。就＂最小＂的角度來說，要確認你的壓縮影響仍然看起來不會太糟。有幾個演算法可能會讓你的影像看起來像是個會動的 gif 。雖然 128 Kb 的影像可能在用戶體驗上會比 10 MB 的影像好，可是把看起來像是 gif 粒狀的影像放在內容後面，也可能會對你的品牌產生負面影響。

- -

查看 CanIUse.com 來確認現今瀏覽器對於影像以及不同媒體格式的支持。  

- -

影像自動播放

- -

為了確保循環播放背景影像，你需要向影像標籤裡添加多個屬性： autoplay, muted, 以及 playsinline.

- -
<video autoplay="" loop="" muted="true" playsinline="" src="backgroundvideo.mp4">
- -

雖然屬性 loop 和 autoplay 在對於影像的循環跟自動播放很合理，可是 muted 屬性在行動裝置的瀏覽器裡是必須添加的。

- -

Playsinline 在行動裝置裡的 Safari 是必須的，他讓影像可以在不需要全螢幕的模式下被播放。

- -

移除靜音影像的聲音

- -

如果你有一個 hero-video 或是其他靜音影片, 請將聲音從影像中移除。 

- -
<video autoplay="" loop="" muted="true" playsinline="" id="hero-video">
-  <source src="banner_video.webm"
-          type='video/webm; codecs="vp8, vorbis"'>
-  <source src="web_banner.mp4" type="video/mp4">
-</video>
- -

這段 hero-video 代碼, 常出現在許多研討會網站以及公司的主頁， 它是個包括自動播放，循環播放和靜音的影像。它不包含任何控制選單，因此無法收聽聲音。通常它是沒有聲音的，但仍然存在音軌，因此它仍會消耗頻寬。然而，我們沒有理由將頻寬分給靜音影像的聲音。移除聲音可以節省 20% 的頻寬。這代表，如果你的影像是 10 MB，則節省了 2 MB。

- -

根據您的影像創作軟體，你也許可以在匯出和壓縮過程中刪除聲音。 如果沒有，那麼有一個免費的工具 FFmpeg ，可以使用以下指令來為你完成此任務

- -
ffmpeg -i original.mp4 -an -c:v copy audioFreeVersion.mp4
- -

FFmpeg 稱自己為＂用於記錄，轉換和串流音頻和影像的完整，跨平台解決方案＂。

- -

影像預載

- -

preload 屬性具有3個可用選項：auto|metadata|none。預設選項是 metadata.

- -

將選項更改為 auto 會告訴瀏覽器自動下載整個影像。僅有在極有可能播放時才應該執行此操作，否則會浪費大量的頻寬。

- -

preload="metadata" 最多可讓 3％ 的影像在頁面加載時被下載。 然後對於較大的影像來說，這可能或是大量的頻寬。

- -

preload="none" 不會在播放之前下載任何的影像。 這會延遲影像的啟動時間，但能夠為播放可能性較低的影像保存大量的頻寬。

- -

考慮串流

- -

串流影像讓適當的影像大小和頻寬 (根據網路速度) 被傳遞給用戶。 就像使用響應式圖像一樣，正確大小的影像將被傳遞到瀏覽器，從而確保用戶的快速影像啟動、低緩衝以及優化的播放。

diff --git a/files/zh-tw/learn/server-side/first_steps/introduction/index.html b/files/zh-tw/learn/server-side/first_steps/introduction/index.html new file mode 100644 index 0000000000..a0919697ee --- /dev/null +++ b/files/zh-tw/learn/server-side/first_steps/introduction/index.html @@ -0,0 +1,225 @@ +--- +title: 伺服器端的介紹 +slug: Learn/Server-side/First_steps/介紹 +translation_of: Learn/Server-side/First_steps/Introduction +--- +
{{LearnSidebar}}
+ +
{{NextMenu("Learn/Server-side/First_steps/Client-Server_overview", "Learn/Server-side/First_steps")}}
+ +

歡迎來到MDN伺服器端程式設計的初學者課程 ！在第一篇文章中，我們會用較為抽象的角度來探討 server-side programming，並且為你解答「這是什麼？」「這個和用戶端的程式有什麼不同？」以及「這個有什麼用？」 。在讀完這篇文章後，你將能明白如何透過 server-side coding 來為你的網站增添力量。

+ + + + + + + + + + + + +
先決條件:基本電腦知識、對網路伺服器有基本了解。
目標:認識伺服器端的程式設計、它可以做什麼、它和用戶端的程式有什麼不一樣？
+ +

大多數的大型網站使用伺服器端程式（server-side code）來動態地顯示各種所需的資料，普遍的做法為從伺服端的資料庫中取出資料，並送至用戶端，再透過一些 code 來顯示它們（例如：HTML 與 JavaScript）。

+ +

也許，使用伺服器端程式的最大好處是為不同的瀏覽者量身打造網頁內容。動態網站根據使用者的偏好設定及興趣提供更為相關的內容，也可以儲存個人設定及資訊讓網站更易於使用 — 例如重複使用已儲存的信用卡資料來使付款流程更為順暢。

+ +

它也能讓網站透過信件或其他方式來和使用者互動，如發送通知與更新。這一切的一切都讓網站更能牢牢抓住使用者的心。

+ +

何謂伺服器端網站程式開發？

+ +

網頁瀏覽器使用超文本傳輸協定（HyperText Transfer Protocol, {{glossary("HTTP")}}）與網頁伺服器（web servers）溝通。當您點選網頁上的連結、送出表單，或者執行搜尋，一段 HTTP 請求（request）會由您的瀏覽器送至目標伺服器。

+ +

該請求（request）包含一個用來指定受影響資源的 URL、一個定義行為的請求方法（例如對資源進行get、delete或post）與當進行HTTP POST方法時可能包含編碼於URL參數中的額外資訊（經由一段查詢字串送出的各個鍵值對），或是在關聯的{{glossary("Cookie", "cookies")}}中。

+ +

網頁伺服器等待用戶端的請求訊息、獲得後處理它們，並以一個HTTP回應（response）訊息回覆至網頁瀏覽器。該回應包含一個狀態訊息說明本次請求是否達成（例如："HTTP/1.1 200 OK"表示成功）。

+ +

成功對應於一個請求的回應主體（response body）應包含請求的資源（例如：一份新的HTML頁面或一張圖片等），這些可能將被用來顯示在網頁瀏覽器中。

+ +

靜態網站

+ +

以下的靜態網站（static site）圖展示一個基本的網頁伺服器架構，其中靜態網站意謂當無論何時有個特定資源的請求，伺服器始終回傳相同的硬編碼內容（hard-coded content）。當一個使用者想要引導到一個網頁時，瀏覽器送出的HTTP "GET" 請求指的就是該資源的URL。

+ +

此伺服器從它的檔案系統取回被請求的文件，並回傳一個包含此文件以及成功狀態碼（通常為200 OK）的HTTP回應。若檔案因某些原因無法被取回，則回傳一個錯誤狀態（參見 用戶端錯誤回應 與 伺服器端錯誤回應）。

+ +

A simplified diagram of a static web server.

+ +

動態網站

+ +

一個動態網站的回應內容是當需要時動態產生的。在一個動態網站的HTML網頁通常是經由資料庫取得並插入資料至HTML範本的佔位符（placeholders）中而創造出來（相較於靜態網站，這對於儲存大量內容而言，這是一種相當有效率的做法）。 

+ +

一個動態網站可以根據使用者或已存偏好設定提供的URL資訊回傳不同的資料，也可以以其他的作用方式呈現回應（例如：發送通知）。

+ +

用來支援一個動態網站的大部分的程式碼必須在伺服器執行。建立程式碼的方式稱為＂伺服端程式設計（server-side programming）＂或＂後端腳本（back-end scripting）＂。

+ +

下圖為動態網站（dynamic website）的基本架構。如同先前的圖說，瀏覽器發送HTTP請求至伺服器，接著伺服器處理請求後，回傳合適的HTTP回應。

+ +

對於靜態資源的請求處理方式如同靜態網站的方式（靜態資源為任何不會改變的檔案 — 通常為CSS、JavaScript、圖片、預產生的PDF檔案等）。 

+ +

A simplified diagram of a web server that uses server-side programming to get information from a database and construct HTML from templates. This is the same diagram as is in the Client-Server overview.

+ +

對於動態資源的請求方式則為轉送(2)至伺服端程式碼（如圖中的網頁應用程式 Web Application）。對於＂動態請求＂，伺服器解釋該請求、從資料庫讀取所需資訊(3)、與HTML範本結合取得的資料(4)，最後送回一個包含已產生HTML的回應(5,6)。

+ +
+

伺服端與用戶端程式設計是相同的嗎？

+
+ +

讓我們把注意力集中在伺服端與用戶端的程式設計吧！在以下的每個案例中，程式碼完全不一樣：

+ + + +

執行在瀏覽器的程式碼被稱為用戶端程式碼（client-side code），它主要用來改善一個渲染的網頁外觀與行為。這包含選取與設定UI元件樣式、建立佈局、導覽、表格驗證等。相對的，伺服端網站程式設計大量涉及要回傳哪些內容給瀏覽器做為對請求的回應。伺服端程式碼處理驗證已提交的資料與請求、使用資料庫儲存及取得資料，和按需求發送正確的資料給用戶等任務。

+ +

用戶端程式碼以HTML、CSS與JavaScript撰寫 — 它執行在網頁瀏覽器內，並且僅有或無訪問底層的作業系統（包含對檔案系統的有限存取）。

+ +

網頁開發者不能控制使用者可能使用何種瀏覽器來檢視一個網站 — 瀏覽器與用戶端程式有著不同層度的相容性，並且用戶端程式的挑戰之一是如何妥善地處理瀏覽器支援的差異。

+ +

伺服端程式碼可以為任何程式語言 — 例如有名的伺服端網頁語言包括PHP、Python、Ruby、C#與NodeJS(JavaScript)。該伺服端程式碼擁有完整的作業系統存取權限，而且開發者能夠選擇他們想要的程式語言（以及特定版本）。

+ +

開發者們通常使用網頁框架（web frameworks）撰寫程式碼。網頁框架為功能函式、物件、規則與其他程式碼的集合，旨在解決常見問題、加速開發並簡化在特定域中面臨到的不同類型的任務。

+ +

再者，儘管用戶端與伺服端程式碼都使用框架，但會因為非常不同的域，而使得框架也不同。用戶端網頁框架簡化佈局與呈現的任務，而伺服端網頁框架則提供大量＂通用＂的網頁伺服器功能，否則你可能必須要自己實現（例如：對sessions的支援、對使用者認證的支援、簡易資料庫存取、樣板庫等）。

+ +
+

Note: Client-side frameworks are often used to help speed up development of client-side code, but you can also choose to write all the code by hand; in fact, writing your code by hand can be quicker and more efficient if you only need a small, simple web site UI.

+ +

In contrast, you would almost never consider writing the server-side component of a web app without a framework — implementing a vital feature like an HTTP server is really hard to do from scratch in say Python, but Python web frameworks like Django provide one out of the box, along with other very useful tools.

+
+ +
+

在伺服端，你能做什麼？

+ +

伺服端程式設計是非常有用的，因為它讓我們有效地遞送替單個使用者量身訂做的資訊，從而創造更棒的使用者體驗。

+
+ +

如Amazon這樣的公司使用伺服端程式設計來建構產品搜尋結果、根據顧客偏好與過往購物習慣提供針對性的產品建議、簡化購物過程等。

+ +

銀行使用伺服端程式設計來儲存帳號資訊，並讓已授權用戶檢視與進行交易。其他服務如Facebook、Twitter、Instagram與Wikipedia使用伺服端程式設計來突顯、分享與控制使用者存取到感興趣的內容。

+ +

一些常見的伺服端程式設計使用案例與效益列舉如下。您將會注意到這當中會有些重疊的部分！

+ +

高效率資訊儲存與遞送

+ +

想像一下，在Amazon可以找到多少產品，或者說在Facebook上有多少文章？對各個產品或文章建立各別的靜態網頁完全是不切實際的。

+ +

伺服端程式設計反而是可以讓我們將資訊儲存至資料庫，並且動態建構及回傳HTML與其他型態的檔案（例如：PDF、圖片等）。它也可以藉由合適的用戶端網頁框架（利用這個方式可以降低在伺服器的處理負擔，亦減少需要被送出的大量資料）僅回傳資料（{{glossary("JSON")}}、{{glossary("XML")}}等）來進行畫面渲染。

+ +

伺服器並不侷限於從資料庫發送資訊，還可以回傳軟體工具的結果或是來自通訊服務的資料。這些內容甚至可以針對到收到它的用戶裝置類型。

+ +

由於資訊存在於資料庫中，它可以輕易地與其他商業系統進行分享與更新（例如：當產品在線上或在店家中售完，店家可能會更新該產品的庫存資料庫）。

+ +
+

Note: Your imagination doesn't have to work hard to see the benefit of server-side code for efficient storage and delivery of information:

+ +
    +
  1. Go to Amazon or some other e-commerce site.
    2. +
  2. Search for a number of keywords and note how the page structure doesn't change, even though the results do. 
    3. +
  3. Open two or three different products. Note again how they have a common structure and layout, but the content for different products has been pulled from the database.
    4. +
+ +

For a common search term ("fish", say) you can see literally millions of returned values. Using a database allows these to be stored and shared efficiently, and it allows the presentation of the information to be controlled in just one place.

+
+ +

客製化的使用者體驗

+ +

伺服器能保存及使用關於用戶的資訊，來提供一個方便且量身訂做的使用者體驗。例如，許多網站儲存信用卡資料讓這些資料無須再重新輸入。網站如Google Maps能使用已儲存或目前位置來提供導航資訊與搜尋或旅行歷史紀錄，以便於搜尋結果中突顯在地店家。

+ +

一個使用者習慣更深層的分析，可以使用在預測他的興趣以及更進一步客製回應與提醒，例如在地圖中提供你可能想去看得過去遊歷過的或是熱門的地點列表。

+ +
+

Note: Google Maps saves your search and visit history. Frequently visited or frequently searched locations are highlighted more than others.

+ +

Google search results are optimized based on previous searches.

+ +
    +
  1.  Go to Google search.
    2. +
  2.  Search for "football".
    3. +
  3.  Now try typing "favourite" in the search box and observe the autocomplete search predictions.
    4. +
+ +

Coincidence? Nada!

+
+ +

控制內容存取

+ +

伺服器端程式設計允許網站限制僅能由已授權的使用者存取，並提供資訊給那些只被允許觀看的使用者。

+ +

真實世界案例包括：

+ + + +
+

Note: Consider other real examples where access to content is controlled. For example, what can you see if you go to the online site for your bank? Log in to your account — what additional information can you see and modify? What information can you see that only the bank can change?

+
+ +

儲存session/state資訊

+ +

伺服器端程式設計允許開發者利用sessions — 基本上，就是一個機制讓伺服器儲存目前的使用者資訊，並且基於這些資訊發送不同的回應。

+ +

例如，這允許網站了解一個使用者先前已登入過，以及將訂購歷史紀錄在他們的電子郵件中顯示連結，或者也許會儲存一個基本的遊戲狀態，讓使用者能再次回到網站的同時，拿回他們留在網站的資訊。

+ +
+

Note: Visit a newspaper site that has a subscription model and open a bunch of tabs (e.g. The Age). Continue to visit the site over a few hours/days. Eventually, you will start to be redirected to pages explaining how to subscribe, and you will be unable to access articles. This information is an example of session information stored in cookies.

+
+ +

提醒與溝通

+ +

伺服器能透過網站本身或經由電子郵件、SMS、即時通訊、影像或其他通訊服務，發送提醒訊息給一般或特定使用者。

+ +

一些範例包括：

+ + + +
+

Note: The most common type of notification is a "confirmation of registration". Pick almost any large site that you are interested in (Google, Amazon, Instagram, etc.) and create a new account using your email address. You will shortly receive an email confirming your registration, or requiring acknowledgment to activate your account.

+
+ +

資料分析

+ +

一個網站可能會收集很多包括使用者的資料：他們所搜尋的、他們所買的、他們所推薦的、他們在每個網頁停留的時間。伺服器端程式設計能根據資料分析以完善回應。

+ +

例如，Amazon與Google都根據過往搜尋（與購買）紀錄來廣告產品。

+ +
+

Note: If you're a Facebook user, go to your main feed and look at the stream of posts. Note how some of the posts are out of numerical order - in particular, posts with more "likes" are often higher on the list than more recent posts.

+ +

Also look at what kind of ads you are being shown — you might see ads for things you looked at on other sites. Facebook's algorithm for highlighting content and advertising can be a bit of a mystery, but it is clear that it does depend on your likes and viewing habits!

+
+ +

總結

+ +

恭喜，你已經到達關於伺服器端程式設計的第一篇文章的結尾。 

+ +

現在你已經學到伺服器端程式碼運作於網頁伺服器，他的主要任務是控制哪些資訊要發送給使用者（而用戶端程式碼主要掌握資料的結構與呈現給使用者）。

+ +

你也應該了解這是很有用的，當你身為伺服器端開發者時，因為它允許我們創建有效散播客製訊息與有些你可能會去做的好點子給單個使用者的網站。

+ +

最後，你應該了解伺服器端程式碼可以用很多種程式語言來撰寫，以及你應該使用網頁框架來讓整個程序變得更簡便。 

+ +

在未來的文章，我們將協助你選擇最佳的網頁框架，做為你的第一個網站；接著，我們將帶你更詳細了解主要的用戶端-伺服端的互動。

+ +

{{NextMenu("Learn/Server-side/First_steps/Client-Server_overview", "Learn/Server-side/First_steps")}}

+ +

In this module

+ + diff --git "a/files/zh-tw/learn/server-side/first_steps/\344\273\213\347\264\271/index.html" "b/files/zh-tw/learn/server-side/first_steps/\344\273\213\347\264\271/index.html" deleted file mode 100644 index a0919697ee..0000000000 --- "a/files/zh-tw/learn/server-side/first_steps/\344\273\213\347\264\271/index.html" +++ /dev/null @@ -1,225 +0,0 @@ ---- -title: 伺服器端的介紹 -slug: Learn/Server-side/First_steps/介紹 -translation_of: Learn/Server-side/First_steps/Introduction ---- -
{{LearnSidebar}}
- -
{{NextMenu("Learn/Server-side/First_steps/Client-Server_overview", "Learn/Server-side/First_steps")}}
- -

歡迎來到MDN伺服器端程式設計的初學者課程 ！在第一篇文章中，我們會用較為抽象的角度來探討 server-side programming，並且為你解答「這是什麼？」「這個和用戶端的程式有什麼不同？」以及「這個有什麼用？」 。在讀完這篇文章後，你將能明白如何透過 server-side coding 來為你的網站增添力量。

- - - - - - - - - - - - -
先決條件:基本電腦知識、對網路伺服器有基本了解。
目標:認識伺服器端的程式設計、它可以做什麼、它和用戶端的程式有什麼不一樣？
- -

大多數的大型網站使用伺服器端程式（server-side code）來動態地顯示各種所需的資料，普遍的做法為從伺服端的資料庫中取出資料，並送至用戶端，再透過一些 code 來顯示它們（例如：HTML 與 JavaScript）。

- -

也許，使用伺服器端程式的最大好處是為不同的瀏覽者量身打造網頁內容。動態網站根據使用者的偏好設定及興趣提供更為相關的內容，也可以儲存個人設定及資訊讓網站更易於使用 — 例如重複使用已儲存的信用卡資料來使付款流程更為順暢。

- -

它也能讓網站透過信件或其他方式來和使用者互動，如發送通知與更新。這一切的一切都讓網站更能牢牢抓住使用者的心。

- -

何謂伺服器端網站程式開發？

- -

網頁瀏覽器使用超文本傳輸協定（HyperText Transfer Protocol, {{glossary("HTTP")}}）與網頁伺服器（web servers）溝通。當您點選網頁上的連結、送出表單，或者執行搜尋，一段 HTTP 請求（request）會由您的瀏覽器送至目標伺服器。

- -

該請求（request）包含一個用來指定受影響資源的 URL、一個定義行為的請求方法（例如對資源進行get、delete或post）與當進行HTTP POST方法時可能包含編碼於URL參數中的額外資訊（經由一段查詢字串送出的各個鍵值對），或是在關聯的{{glossary("Cookie", "cookies")}}中。

- -

網頁伺服器等待用戶端的請求訊息、獲得後處理它們，並以一個HTTP回應（response）訊息回覆至網頁瀏覽器。該回應包含一個狀態訊息說明本次請求是否達成（例如："HTTP/1.1 200 OK"表示成功）。

- -

成功對應於一個請求的回應主體（response body）應包含請求的資源（例如：一份新的HTML頁面或一張圖片等），這些可能將被用來顯示在網頁瀏覽器中。

- -

靜態網站

- -

以下的靜態網站（static site）圖展示一個基本的網頁伺服器架構，其中靜態網站意謂當無論何時有個特定資源的請求，伺服器始終回傳相同的硬編碼內容（hard-coded content）。當一個使用者想要引導到一個網頁時，瀏覽器送出的HTTP "GET" 請求指的就是該資源的URL。

- -

此伺服器從它的檔案系統取回被請求的文件，並回傳一個包含此文件以及成功狀態碼（通常為200 OK）的HTTP回應。若檔案因某些原因無法被取回，則回傳一個錯誤狀態（參見 用戶端錯誤回應 與 伺服器端錯誤回應）。

- -

A simplified diagram of a static web server.

- -

動態網站

- -

一個動態網站的回應內容是當需要時動態產生的。在一個動態網站的HTML網頁通常是經由資料庫取得並插入資料至HTML範本的佔位符（placeholders）中而創造出來（相較於靜態網站，這對於儲存大量內容而言，這是一種相當有效率的做法）。 

- -

一個動態網站可以根據使用者或已存偏好設定提供的URL資訊回傳不同的資料，也可以以其他的作用方式呈現回應（例如：發送通知）。

- -

用來支援一個動態網站的大部分的程式碼必須在伺服器執行。建立程式碼的方式稱為＂伺服端程式設計（server-side programming）＂或＂後端腳本（back-end scripting）＂。

- -

下圖為動態網站（dynamic website）的基本架構。如同先前的圖說，瀏覽器發送HTTP請求至伺服器，接著伺服器處理請求後，回傳合適的HTTP回應。

- -

對於靜態資源的請求處理方式如同靜態網站的方式（靜態資源為任何不會改變的檔案 — 通常為CSS、JavaScript、圖片、預產生的PDF檔案等）。 

- -

A simplified diagram of a web server that uses server-side programming to get information from a database and construct HTML from templates. This is the same diagram as is in the Client-Server overview.

- -

對於動態資源的請求方式則為轉送(2)至伺服端程式碼（如圖中的網頁應用程式 Web Application）。對於＂動態請求＂，伺服器解釋該請求、從資料庫讀取所需資訊(3)、與HTML範本結合取得的資料(4)，最後送回一個包含已產生HTML的回應(5,6)。

- -
-

伺服端與用戶端程式設計是相同的嗎？

-
- -

讓我們把注意力集中在伺服端與用戶端的程式設計吧！在以下的每個案例中，程式碼完全不一樣：

- - - -

執行在瀏覽器的程式碼被稱為用戶端程式碼（client-side code），它主要用來改善一個渲染的網頁外觀與行為。這包含選取與設定UI元件樣式、建立佈局、導覽、表格驗證等。相對的，伺服端網站程式設計大量涉及要回傳哪些內容給瀏覽器做為對請求的回應。伺服端程式碼處理驗證已提交的資料與請求、使用資料庫儲存及取得資料，和按需求發送正確的資料給用戶等任務。

- -

用戶端程式碼以HTML、CSS與JavaScript撰寫 — 它執行在網頁瀏覽器內，並且僅有或無訪問底層的作業系統（包含對檔案系統的有限存取）。

- -

網頁開發者不能控制使用者可能使用何種瀏覽器來檢視一個網站 — 瀏覽器與用戶端程式有著不同層度的相容性，並且用戶端程式的挑戰之一是如何妥善地處理瀏覽器支援的差異。

- -

伺服端程式碼可以為任何程式語言 — 例如有名的伺服端網頁語言包括PHP、Python、Ruby、C#與NodeJS(JavaScript)。該伺服端程式碼擁有完整的作業系統存取權限，而且開發者能夠選擇他們想要的程式語言（以及特定版本）。

- -

開發者們通常使用網頁框架（web frameworks）撰寫程式碼。網頁框架為功能函式、物件、規則與其他程式碼的集合，旨在解決常見問題、加速開發並簡化在特定域中面臨到的不同類型的任務。

- -

再者，儘管用戶端與伺服端程式碼都使用框架，但會因為非常不同的域，而使得框架也不同。用戶端網頁框架簡化佈局與呈現的任務，而伺服端網頁框架則提供大量＂通用＂的網頁伺服器功能，否則你可能必須要自己實現（例如：對sessions的支援、對使用者認證的支援、簡易資料庫存取、樣板庫等）。

- -
-

Note: Client-side frameworks are often used to help speed up development of client-side code, but you can also choose to write all the code by hand; in fact, writing your code by hand can be quicker and more efficient if you only need a small, simple web site UI.

- -

In contrast, you would almost never consider writing the server-side component of a web app without a framework — implementing a vital feature like an HTTP server is really hard to do from scratch in say Python, but Python web frameworks like Django provide one out of the box, along with other very useful tools.

-
- -
-

在伺服端，你能做什麼？

- -

伺服端程式設計是非常有用的，因為它讓我們有效地遞送替單個使用者量身訂做的資訊，從而創造更棒的使用者體驗。

-
- -

如Amazon這樣的公司使用伺服端程式設計來建構產品搜尋結果、根據顧客偏好與過往購物習慣提供針對性的產品建議、簡化購物過程等。

- -

銀行使用伺服端程式設計來儲存帳號資訊，並讓已授權用戶檢視與進行交易。其他服務如Facebook、Twitter、Instagram與Wikipedia使用伺服端程式設計來突顯、分享與控制使用者存取到感興趣的內容。

- -

一些常見的伺服端程式設計使用案例與效益列舉如下。您將會注意到這當中會有些重疊的部分！

- -

高效率資訊儲存與遞送

- -

想像一下，在Amazon可以找到多少產品，或者說在Facebook上有多少文章？對各個產品或文章建立各別的靜態網頁完全是不切實際的。

- -

伺服端程式設計反而是可以讓我們將資訊儲存至資料庫，並且動態建構及回傳HTML與其他型態的檔案（例如：PDF、圖片等）。它也可以藉由合適的用戶端網頁框架（利用這個方式可以降低在伺服器的處理負擔，亦減少需要被送出的大量資料）僅回傳資料（{{glossary("JSON")}}、{{glossary("XML")}}等）來進行畫面渲染。

- -

伺服器並不侷限於從資料庫發送資訊，還可以回傳軟體工具的結果或是來自通訊服務的資料。這些內容甚至可以針對到收到它的用戶裝置類型。

- -

由於資訊存在於資料庫中，它可以輕易地與其他商業系統進行分享與更新（例如：當產品在線上或在店家中售完，店家可能會更新該產品的庫存資料庫）。

- -
-

Note: Your imagination doesn't have to work hard to see the benefit of server-side code for efficient storage and delivery of information:

- -
    -
  1. Go to Amazon or some other e-commerce site.
    2. -
  2. Search for a number of keywords and note how the page structure doesn't change, even though the results do. 
    3. -
  3. Open two or three different products. Note again how they have a common structure and layout, but the content for different products has been pulled from the database.
    4. -
- -

For a common search term ("fish", say) you can see literally millions of returned values. Using a database allows these to be stored and shared efficiently, and it allows the presentation of the information to be controlled in just one place.

-
- -

客製化的使用者體驗

- -

伺服器能保存及使用關於用戶的資訊，來提供一個方便且量身訂做的使用者體驗。例如，許多網站儲存信用卡資料讓這些資料無須再重新輸入。網站如Google Maps能使用已儲存或目前位置來提供導航資訊與搜尋或旅行歷史紀錄，以便於搜尋結果中突顯在地店家。

- -

一個使用者習慣更深層的分析，可以使用在預測他的興趣以及更進一步客製回應與提醒，例如在地圖中提供你可能想去看得過去遊歷過的或是熱門的地點列表。

- -
-

Note: Google Maps saves your search and visit history. Frequently visited or frequently searched locations are highlighted more than others.

- -

Google search results are optimized based on previous searches.

- -
    -
  1.  Go to Google search.
    2. -
  2.  Search for "football".
    3. -
  3.  Now try typing "favourite" in the search box and observe the autocomplete search predictions.
    4. -
- -

Coincidence? Nada!

-
- -

控制內容存取

- -

伺服器端程式設計允許網站限制僅能由已授權的使用者存取，並提供資訊給那些只被允許觀看的使用者。

- -

真實世界案例包括：

- - - -
-

Note: Consider other real examples where access to content is controlled. For example, what can you see if you go to the online site for your bank? Log in to your account — what additional information can you see and modify? What information can you see that only the bank can change?

-
- -

儲存session/state資訊

- -

伺服器端程式設計允許開發者利用sessions — 基本上，就是一個機制讓伺服器儲存目前的使用者資訊，並且基於這些資訊發送不同的回應。

- -

例如，這允許網站了解一個使用者先前已登入過，以及將訂購歷史紀錄在他們的電子郵件中顯示連結，或者也許會儲存一個基本的遊戲狀態，讓使用者能再次回到網站的同時，拿回他們留在網站的資訊。

- -
-

Note: Visit a newspaper site that has a subscription model and open a bunch of tabs (e.g. The Age). Continue to visit the site over a few hours/days. Eventually, you will start to be redirected to pages explaining how to subscribe, and you will be unable to access articles. This information is an example of session information stored in cookies.

-
- -

提醒與溝通

- -

伺服器能透過網站本身或經由電子郵件、SMS、即時通訊、影像或其他通訊服務，發送提醒訊息給一般或特定使用者。

- -

一些範例包括：

- - - -
-

Note: The most common type of notification is a "confirmation of registration". Pick almost any large site that you are interested in (Google, Amazon, Instagram, etc.) and create a new account using your email address. You will shortly receive an email confirming your registration, or requiring acknowledgment to activate your account.

-
- -

資料分析

- -

一個網站可能會收集很多包括使用者的資料：他們所搜尋的、他們所買的、他們所推薦的、他們在每個網頁停留的時間。伺服器端程式設計能根據資料分析以完善回應。

- -

例如，Amazon與Google都根據過往搜尋（與購買）紀錄來廣告產品。

- -
-

Note: If you're a Facebook user, go to your main feed and look at the stream of posts. Note how some of the posts are out of numerical order - in particular, posts with more "likes" are often higher on the list than more recent posts.

- -

Also look at what kind of ads you are being shown — you might see ads for things you looked at on other sites. Facebook's algorithm for highlighting content and advertising can be a bit of a mystery, but it is clear that it does depend on your likes and viewing habits!

-
- -

總結

- -

恭喜，你已經到達關於伺服器端程式設計的第一篇文章的結尾。 

- -

現在你已經學到伺服器端程式碼運作於網頁伺服器，他的主要任務是控制哪些資訊要發送給使用者（而用戶端程式碼主要掌握資料的結構與呈現給使用者）。

- -

你也應該了解這是很有用的，當你身為伺服器端開發者時，因為它允許我們創建有效散播客製訊息與有些你可能會去做的好點子給單個使用者的網站。

- -

最後，你應該了解伺服器端程式碼可以用很多種程式語言來撰寫，以及你應該使用網頁框架來讓整個程序變得更簡便。 

- -

在未來的文章，我們將協助你選擇最佳的網頁框架，做為你的第一個網站；接著，我們將帶你更詳細了解主要的用戶端-伺服端的互動。

- -

{{NextMenu("Learn/Server-side/First_steps/Client-Server_overview", "Learn/Server-side/First_steps")}}

- -

In this module

- - diff --git a/files/zh-tw/mdn/at_ten/index.html b/files/zh-tw/mdn/at_ten/index.html new file mode 100644 index 0000000000..039fa64ed8 --- /dev/null +++ b/files/zh-tw/mdn/at_ten/index.html @@ -0,0 +1,37 @@ +--- +title: MDN 10 週年 +slug: MDN_at_ten +translation_of: MDN_at_ten +--- +
慶祝文件化網頁10年.
+ +
+
+

MDN 的歷史

+ +

在 2005 早期, 一個小團隊開始創見一個新穎, 免費的網路社群資源給所有的網路開發者. 他們的才華和不一樣的想法成為了今天的 Mozilla 開發者網路平台(Mozilla Developer Network)—所有開放網路技術的主要資源. 十年後, 我們全球的社群比以往都來的大, 而且我們也持續為開放網路科技創建文件, 提供範例程式碼和學習資源, 包含 CSS, HTML, JavaScript 及其他.

+ +

了解更多 about the history

+ + +

協助 MDN

+ +

十年來, MDN 社群紀錄開放網路. 從修改錯別字到撰寫整個 API 文件, 每個人不分多少都有貢獻. 我們擁有超過 90,000 頁的資料內容已經被我們傑出的成員(Mozillians)翻譯或編寫. 你也可以成為其中的一員.

+ +

了解更多 about contributing

+ +

 

+ +

 

+
+ +
{{TenthCampaignQuote}}
+ + + +
    +
  1. MDN 10 週年
    2. +
  2. MDN 的歷史
    3. +
  3. 協助 MDN
    4. +
+
diff --git a/files/zh-tw/mdn/community/index.html b/files/zh-tw/mdn/community/index.html deleted file mode 100644 index 3c6fcda1a2..0000000000 --- a/files/zh-tw/mdn/community/index.html +++ /dev/null @@ -1,52 +0,0 @@ ---- -title: 加入 MDN 社群 -slug: MDN/Community -tags: - - 教學 - - 社群 -translation_of: MDN/Community ---- -
{{MDNSidebar}}
- -
{{IncludeSubnav("/zh-TW/docs/MDN")}}
- -
-

MDN (Mozilla Developer Network 的縮寫) 比 wiki 更強大： 它是一個屬於開發者們的社群，致力於讓 MDN 這個龐大資源更加傑出。

-
- -

我們非常感謝您對 MDN 的貢獻，但是我們更希望您加入我們的社群，這裡有三個加入我們社群的方法：

- -
    -
  1. 建立 MDN 帳戶
    2. -
  2. 加入會談
    3. -
  3. 追蹤新資訊
    4. -
- -

社群如何運作

- -

以下更多文章關於更多 MDN 的社群。

- -
-
-
-
社群角色
-
在MDN社群中，有著許多負責不同部分的角色。
-
文件生成聚會
-
這是一個文件生成聚會的指南。它包含了過去人們舉辦文件生成聚會所提供的一些建議與訣竅，以幫助你也舉辦一個。
-
追蹤新資訊
-
MDN 是由 Mozilla Developer Network community 所維護。 這裡有一些我們分享我們在做什麼的資訊管道。
-
- -
-
-
- -
-
-
MDN社群會議
-
許多的社群工作都發生在MDN上，然而社群工作也同時發生在一些 討論(非即時性) 與 線上聊天或會議(即時性)中。
-
與社群一同工作
-
絕大部分相當程度對於MDN文件的貢獻來自於了解如何與社群一同工作。這份文章提供一些訣竅以幫助你與其他文件生成者及開發團隊交流。
-
-
-
diff --git "a/files/zh-tw/mdn/community/\350\253\226\345\243\207/index.html" "b/files/zh-tw/mdn/community/\350\253\226\345\243\207/index.html" deleted file mode 100644 index 955d241ece..0000000000 --- "a/files/zh-tw/mdn/community/\350\253\226\345\243\207/index.html" +++ /dev/null @@ -1,53 +0,0 @@ ---- -title: MDN的社群論壇 -slug: MDN/Community/論壇 -tags: - - MDN 資料 - - 指南 - - 社群論壇 -translation_of: MDN/Community/Conversations ---- -
{{MDNSidebar}}
- -
MDN的『 工作 』通常在MDN的網頁上，但『社群』也會透過異步討論(Asynchronous discussions)，及同步線上討論或會議(Synchronous chat)進行。
- -

異步討論 Asynchronous discussions

- -

為了分享資訊及持續的溝通，MDN在Mozilla論壇中有獨立的類別("MDN")，這個類別連結所有與MDN相關的主題，包括文檔內容的創建，翻譯和維護； MDN平台開發；以及計劃，目標設定和進度跟踪。

- - - -

歷史檔案館

- -

Prior to June 2017, MDN-related discussions took place in mailings lists that were gatewayed and archived with Google groups. If you want to search these past discussions, you can look at the Google groups corresponding to the old mailing lists. (Yes, we know these names are overlapping and confusing. Historical accident. Sorry about that.)

- -
-
mozilla.dev.mdc a.k.a. dev-mdc
-
This list was for discussions about documentation content on MDN.
-
mozilla.dev.mdn a.k.a. dev-mdn
-
This list was about the development work on MDN's underlying Kuma platform.
-
mozilla.mdn a.k.a. mdn@
-
This forum was for high-level planning and prioritization discussions, for the MDN website and other related initiatives.
-
- -

同步討論（Synchronous chat）

- -

Mozilla's platform for real-time discussions is Matrix, a chat protocol for which Mozilla has its own server.

- -

The MDN Web docs chat room is a major channel for discussing the content of MDN. We talk about writing, organization of content, and so on. We also have "water cooler" conversations here—it's a way our community can keep in touch and just hang out. This room is most likely to be active during weekdays in North America and Europe.

- -

You might want to learn more about using Matrix with Mozilla, and, if you're really into it, install a stand-alone Matrix application such as Riot.im.

- -

 IRC？

- -

For many years, Mozilla used Internet Relay Chat (IRC) for real-time discussions. As of early 2020, IRC has been deprecated in favor of Matrix. You may see references to IRC channels in many places, including on MDN. You can help by updating links to IRC channels that you find on MDN to point to the corresponding Matrix rooms instead. If you're not sure what the Matrix room is for a topic, ask in the General room. Projects or topics that are no longer active might not have a Matrix room; in such cases, just delete the link.

- -

參與我們的會議 (或其他活動)

- -

MDN團隊舉辦了許多對MDN社群開放的常規會議，請參閱Mozilla wiki上的MDN Meetings頁面，可以獲取日程、議程、註釋相關以及如何加入的訊息。

- -

有關這些會議及其他會議，當地聚會和其他活動，可參閱MDN 活動日曆。定期會議會呈現在MDN Meetings wiki page。

diff --git a/files/zh-tw/mdn/contribute/howto/create_an_mdn_account/index.html b/files/zh-tw/mdn/contribute/howto/create_an_mdn_account/index.html deleted file mode 100644 index 6f3f294e88..0000000000 --- a/files/zh-tw/mdn/contribute/howto/create_an_mdn_account/index.html +++ /dev/null @@ -1,34 +0,0 @@ ---- -title: 如何創建 MDN 帳戶 -slug: MDN/Contribute/Howto/Create_an_MDN_account -translation_of: MDN/Contribute/Howto/Create_an_MDN_account ---- -
{{MDNSidebar}}

要針對 MDN 做出任何改變，你需要一個 MDN 帳戶。不要擔心，如果你只是想閱讀和搜索 MDN，你並不需要帳戶！這個簡單的指南幫助你設置 MDN 帳戶。

- -
-
為什麼 MDN 需要我的電子郵件地址？

- -

你的電子郵件地址用於帳戶恢復，MDN 管理員也會在必要時，用它來和你討論你的帳戶或你在網站上的活動。

-

此外，你可以選擇註冊的通知（例如特定頁面被更改時）和信息（例如，如果你選擇加入我們的 beta 測試團隊，你可能會收到需要測試的新功能）的電子郵件。

-

你的電子郵件地址永遠不會在 MDN 顯示，而且只會在符合我們的隱私權政策下使用。

- -
如果你透過 Github 登入 MDN，而且在 Github 使用了 noreply 的電子郵件地址，你不會收到來自 MDN 的訊息（包含你訂閱頁面的訊息）。
-
-
- -
    -
  1. 在 MDN 每一頁的最上方，你會發現有一個登入的按鈕。滑鼠滑到那邊後點一下（如果是移動設備就輕按）以表列 MDN 支持的驗證服務列表。
    2. -
  2. 選擇要登入的服務。目前只支持 GitHub。請注意如果選了 GitHub，你的 MDN 公開用戶頁會包含一個指向你 GitHub 頁面的連結。
    3. -
  3. 按照 GitHub 的提示把您的帳戶連接到 MDN。
    4. -
  4. 一旦認證服務把你帶回 MDN 以後，MDN 就會提示你輸入一個用戶名和電子郵件地址。您的用戶名會被公開顯示以表彰你所做的工作。不要使用您的電子郵件地址作為用戶名。。
    5. -
  5. 點擊「創建我的 MDN 配置文件」按鈕。
    6. -
  6. 如果您在步驟四指定的電子郵件地址，與認證服務使用的不一樣，你需要檢查這個電子郵件地址，並點擊確認電子郵件中的鏈接。
    7. -
- -

就是這樣！你有一個MDN帳戶，並可以立即編輯或標籤頁，或者提交演示！

- -

您可以在任何 MDN 頁面的頂部點擊你的名字，看看你的公開檔案。從那裡，你可以點擊「編輯」按鈕，進行更改或添加到您的個人資料，所以你可以分享更多關於您的利益，把鏈接添加到你的推特帳戶或部落格等等。

- -
-

用戶名新不能包含空格或“@”字符。請記住，你的用戶名會被公開顯示，以確定你所做的工作！

-
diff --git a/files/zh-tw/mdn/contribute/howto/do_a_technical_review/index.html b/files/zh-tw/mdn/contribute/howto/do_a_technical_review/index.html deleted file mode 100644 index ecb35fe0be..0000000000 --- a/files/zh-tw/mdn/contribute/howto/do_a_technical_review/index.html +++ /dev/null @@ -1,50 +0,0 @@ ---- -title: 如何進行技術審查 -slug: MDN/Contribute/Howto/Do_a_technical_review -translation_of: MDN/Contribute/Howto/Do_a_technical_review ---- -
{{MDNSidebar}}
{{IncludeSubnav("/zh-TW/docs/MDN")}}
- -

技術審查包含檢查文章的正確與完整性，並在需要時進行修正。若文章作者需要其他人來檢查文章的技術性內容，可以在編輯時勾選「技術審查」（Technical review）。通常由作者連絡特定工程師來進行技術審查，但具備該主題技術專長者亦可參與。

- -

本文描述如何執行技術審查，以協助確保 MDN 的內容是正確的。

- -
-
要做什麼？
-
審查並修正文章在技術上的正確與完整性。
-
要審查的文章在哪？
-
找被標記為「技術審查」（technical review）的特定文章。
-
要知道些什麼？
-
-
    -
  • 針對文章主題的專業知識。若閱讀該文章並沒有對你傳授非常新的東西，那就視你自己為專家。
    • -
  • 編輯 MDN 上維基文章的方法。
    • -
-
-
有哪些步驟？
-
-
    -
  1. 選擇要審查的文章 -
      -
    1. 前往技術審查（technical reviews）清單頁面。這裡列出所有請求技術審查的頁面。
      2. -
    2. 選擇一個頁面，而你對該主題非常熟練。
      3. -
    3. 點擊文章連結以載入頁面。
      4. -
    -
    2. -
  2. 閱讀文章並密切關注技術性細節：這篇文章正確嗎？有沒有漏掉什麼？若初次選擇的頁面並不適合由你來審查，不要猶豫，選擇其他頁面。
    3. -
  3. 若沒有錯誤，你不需要透過編輯將文章標記為已審查。找到頁面左方側邊攔的「快速回顧」（quick review），黃色框框會列出任何等待中的審查，並讓你清除審查請求的標記。若有審查請求會顯示如下：
    - Screenshot of the sidebar's box listing reviews that have been requested and allowing the flags to be changed.
    4. -
  4. 取消選取「技術」（Technical），然後點擊「儲存」（Save）。
    5. -
  5. 若發現有錯誤需要修正，亦可在編輯器中改變審查請求的狀態。操作過程如下： -
      -
    1. 點擊靠近頁面頂端的「編輯」（Edit）按鈕以編輯頁面，這會帶你到 MDN editor。
      2. -
    2. 修正任何錯誤的技術資訊，並且（或者）增加任何重要但被遺漏的訊息。
      3. -
    3. 在文章底部填寫版本註解（Revision Comment）。這是用來描述你做了什麼事的簡短訊息，如：「技術審查完成」。當你做了些修正，將相關資訊納入你的註解，如：「技術審查並修正參數描述」。這會幫助其他貢獻者和網站編輯知道你變更的內容和理由。你也可提出（若有的話）自認不夠資格審查的部分。
      4. -
    4. 在 「需要審核嗎？」（Review Needed?） 下方，取消選取「技術」（Technical），就在頁面底部版本註解區塊附近。
      5. -
    5. 點擊「發布」（PUBLISH）按鈕。
      6. -
    -
    6. -
-

恭喜！你已經完成你的第一份技術審查！感謝你的幫助！

-
-
diff --git a/files/zh-tw/mdn/contribute/howto/do_an_editorial_review/index.html b/files/zh-tw/mdn/contribute/howto/do_an_editorial_review/index.html deleted file mode 100644 index 8ef91de87d..0000000000 --- a/files/zh-tw/mdn/contribute/howto/do_an_editorial_review/index.html +++ /dev/null @@ -1,55 +0,0 @@ ---- -title: 如何進行編輯審查 -slug: MDN/Contribute/Howto/Do_an_editorial_review -tags: - - 如何 - - 指南 - - 文件 - - 編輯審查 -translation_of: MDN/Contribute/Howto/Do_an_editorial_review ---- -
{{MDNSidebar}}
- -
{{IncludeSubnav("/zh-TW/docs/MDN")}}
- -

一個主題的編輯審查包含錯字、拼字、文法、語法或其他文字錯誤。並非所有貢獻者都是語言專家，但他們的知識可以提供極為有用的資訊，因此需要審稿和校對。這就是編輯審查在做的事。

- -

這個主題將會介紹如何進行編輯審查，以幫助確保在 MDN 的資訊是正確的。

- -
-
有哪些任務？
-
必要的有審稿和校對。
-
有哪些東西需要編輯審查？
-
那些被標記需要審查的主題。
-
進行編輯審查需要知道什麼？
-
你需要具有良好的英文文法和拼字能力（即能準確翻譯英文成中文的能力）。編輯審查在於確保文法、拼字和語法的正確和意義，並遵守 MDN 編輯指南。
-
有哪些步驟？
-
-
    -
  1. 選擇一個主題： -
      -
    1. 前往待審查清單。這個表列出了要求審查的主題。
      2. -
    2. 選擇一個中文標題且不帶有 Template: (Template: 包含 MDN 功能碼) 的主題。
      3. -
    3. 點擊該主題的連結。
      4. -
    -
    2. -
  2. 閱讀主題，注意錯字、拼字、文法、語法或其他錯誤。如果你覺得無法應付，請找下一個主題。
    3. -
  3. 如果沒有錯誤，你不需要編輯主題來標記為已審查。在左方導覽列尋找「快速審查」方塊：
    - 快速審查
    4. -
  4. 取消選取 編輯 方塊並點擊 儲存。
    5. -
  5. 如果有錯誤需要被糾正： -
      -
    1. 點擊在頁面頂端附近的 編輯 按鈕，接著會轉到 MDN 編輯器。
      2. -
    2. 修正你找到的錯字、拼字、文法、語法或其他錯誤。你並不需要修正所有錯誤，但若你不確定你已經完整的審查主題，請留下編輯審查請求。
      3. -
    3. 在主題尾端留下 版本註解 。像是「編輯審查：修正錯字、文法和拼字」。這能讓其他貢獻者和網站編輯者知道你改了什麼和為什麼。
      4. -
    4. 取消選取在 需要審查嗎？ 中的 編輯 方塊。他在版本註解下面。
      5. -
    5. 按下 發布。
      6. -
    -
    6. -
- -
-

你的變更不一定會立刻出現，他可能會因送出和儲存延遲一會。

-
-
-
diff --git a/files/zh-tw/mdn/contribute/howto/set_the_summary_for_a_page/index.html b/files/zh-tw/mdn/contribute/howto/set_the_summary_for_a_page/index.html deleted file mode 100644 index e44a6fb7ce..0000000000 --- a/files/zh-tw/mdn/contribute/howto/set_the_summary_for_a_page/index.html +++ /dev/null @@ -1,50 +0,0 @@ ---- -title: 如何撰寫文章摘要？ -slug: MDN/Contribute/Howto/Set_the_summary_for_a_page -tags: - - 摘要 -translation_of: MDN/Contribute/Howto/Set_the_summary_for_a_page ---- -
{{MDNSidebar}}

 

- -

你可以在MDN用各式各樣的方式來定義一個頁面的摘要，像是搜尋引擎結果，在其他的MDN網頁如某些到達頁(Landing Pages)，以及提示中。他應該是在頁面的上下文中有意義的文本，並且在上下文中顯示時，沒有其餘的頁面內容。

- -

在頁面中摘要是明確定義的。如果沒有被明確定義的話，通成會拿第一句來當摘要，但並不總是最適合的。

- -
-
-

任務是什麼？

-
-
在頁面中找出可以當成摘要的文字，且用別種文字說明寫成適當的摘要。
-
-

哪些地方需要撰寫摘要？

-
-
缺少摘要的頁面，或是摘要不足的頁面。
-
-

撰寫摘要之前，你需要具備/知道什麼？

-
-
會使用MDN編輯器、擅長寫英文作文以及對於該頁面要有足夠的了解，才能寫出好的摘要。
-
-

撰寫摘要的步驟：

-
-
-
    -
  1. 選一個頁面： -
      -
    1. 在 MDN documentation status 頁面中, 在Sections(章節)下方，點選任何一個你熟悉或是對其有所了解的標題連結（ex：HTML）：
      -
      2. -
    2. 在此文件狀態頁面上方的摘要表格內，點選Pages(頁面)。點選後會導向關於這個標題(ex:HTML)的全部頁面的索引頁。左邊欄位顯示這個頁面的連結，右邊則是顯示tags(標籤)以及該頁面的摘要。
      3. -
    3. 挑選一個沒有摘要的頁面，或是摘要太少的頁面：
      -
      4. -
    4. 點選該頁面的連結。
      5. -
    -
    2. -
  2. 點選編輯打開MDN編輯器。
    3. -
  3. 找出一句或是兩句可以總結上下文的摘要。如果需要的話，編輯現有的內容以創造或是修改成好的摘要。
    4. -
  4. 選擇要當成摘要的文字。
    5. -
  5. 點選在編輯器工具列中的格式化樣式，選擇SEO Summary. （在原始碼中，這會在被選起來的文字旁，產生一個HTML元素： {{HTMLElement("span")}} element with class="seoSummary" ）
    -
    6. -
  6. 使用修訂評論保存您的更改。評論為非必填項目，但我們鼓勵您填寫。能使其他人更容易追蹤文章的變化。
    7. -
-
-
diff --git a/files/zh-tw/mdn/editor/basics/index.html b/files/zh-tw/mdn/editor/basics/index.html deleted file mode 100644 index d33daf9aeb..0000000000 --- a/files/zh-tw/mdn/editor/basics/index.html +++ /dev/null @@ -1,55 +0,0 @@ ---- -title: Editor UI elements -slug: MDN/Editor/Basics -translation_of: MDN/Editor/Basics ---- -
{{MDNSidebar}}

The built-in WYSIWYG editor on MDN is designed to make it as easy as possible to create, edit, and improve articles and other pages almost anywhere on the site. The editor window, shown below, consists of eight key area. This guide provides information about each section so you know how to use our entire editing environment.

- -
-

We're constantly working on improvements to MDN, so there will be times when this documentation or the screen shots below may be slightly out-of-date. We'll periodically update this documentation, though, to avoid it being unusably behind.

-
- -

Screenshot of the editor UI (August 2017) with each section labeled

- -

The editor UI contains the following sections, as shown above. Click a link below to read about that section of the editor.

- - - -

Revision comment

- -

After you've made your changes, it's strongly recommended you add a comment to your revision. This is displayed in the revision history for the page, as well as on the Revision Dashboard. It helps to explain or justify your changes to others that may review your work later. To add a revision comment, simply type the note into the revision comment box before clicking either of the Publish buttons at the top or bottom of the page.

- -

There are a few reasons this is helpful:

- - - -

Review requests

- -

The MDN community uses reviews to try to monitor and improve the quality of MDN's content. This works by setting a flag on an article indicating that a review is needed. You can learn more about technical reviews and editorial review in the How to guides.

- -

To request a review on the article you've worked on, toggle on the checkbox next to the type of review that's needed. Technical reviews should be requested any time you make changes to the explanation of how something technical works, while editorial reviews are a good idea when you've made changes and would like someone to review your writing and style choices.

- -

While selecting a review checkbox adds the article to the lists of those needing technical review or needing editorial review, it does not guarantee that anyone will immediately review the article. For technical reviews, it's a good idea to directly contact a subject-matter expert in the relevant technical area. For editorial reviews, you can post in the MDN discussion forum to request that someone review your changes.

- -

Be sure to click one of the Publish buttons after making your selections, to commit your review request.

- -

See also

- - - - diff --git a/files/zh-tw/mdn/editor/edit_box/index.html b/files/zh-tw/mdn/editor/edit_box/index.html deleted file mode 100644 index 3c691a124b..0000000000 --- a/files/zh-tw/mdn/editor/edit_box/index.html +++ /dev/null @@ -1,134 +0,0 @@ ---- -title: Edit box of the MDN editor -slug: MDN/Editor/Edit_box -translation_of: MDN/Editor/Keyboard_shortcuts ---- -
{{MDNSidebar}}

The edit box is, of course, where you actually do your writing. Right-clicking in the editor box offers appropriate additional options depending on the context of your click: right-clicking in a table offers table-related options and right-clicking in a list offers list-related options, for example.

- -

By default, the editor uses its own contextual menu when you right-click on the editor. To access your browser's default contextual menu (such as to access the Firefox spell checker's list of suggested corrections), hold down the Shift or Control key (the Command key on Mac OS X) while clicking.

- -

鍵盤快捷鍵

- -

There are a number of convenient keyboard shortcuts available to help you avoid taking your hands off the keyboard while you work. The shortcuts are listed for Windows and Linux; on Mac, instead of using the Control key, you can use the Command key.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
快捷鍵說明
Ctrl + A全選
Ctrl + C複製到剪貼簿
Ctrl + V從剪貼簿貼上
Ctrl + X剪下
Ctrl + Z回到上一步
Ctrl + Y重置
Ctrl + K開啟連結編輯器／新增連結
Ctrl + Shift + K移除連結游標位置。
Ctrl + B粗體
Ctrl + I斜體
Ctrl + O切換 <code> 樣式。
Ctrl + Shift + O -

切換原始碼顯示模式。

- -
在原始碼模式下編輯時請小心，您需要遵守我們的內容標準。更多細節關於如何使用原始碼模式與使用之優缺點請參照原始碼模式編輯教學。
-
Ctrl + P切換 <pre> 樣式在當前區塊中的開啟與關閉。
Ctrl + U底線。
Ctrl + S儲存修改並關閉編輯器。
Ctrl + Shift + S儲存修改但不要關閉編輯器。
Ctrl + 0Remove formatting from the selected area (That's a zero, not the letter "O").
Ctrl + 2 through Ctrl + 6Select heading level 2 through 6. Heading level 1 is reserved for the page title displayed at the top of the article.
Ctrl + Shift + LToggle from bulleted list to numbered list to and paragraph format
TabIncrease indent level if in indent mode, otherwise inserts two spaces as a tab. Inside tables, this moves the cursor to the next cell, or inserts a new row if there is no next cell. If the cursor is currently in the page title or in a heading, the cursor jumps to the next paragraph.
Shift + TabDecrease indent level if in indent mode. Inside tables, this jumps to the previous cell, or inserts a new row if there is no previous cell. If the cursor is currently in the page title or in a heading, the cursor jumps to the next paragraph.
Shift + SpaceInsert a non-breaking space (&nbsp;)
Shift + Enter -

Exits out of the current block. For example, if you're currently editing a <pre> block, Shift + Enter exits the block, putting you back in the body of the article.

- -
-

Not currently implemented; see {{bug(780055)}}.

-
-
- -

See also

- - diff --git a/files/zh-tw/mdn/editor/index.html b/files/zh-tw/mdn/editor/index.html deleted file mode 100644 index 5cf0ac0a43..0000000000 --- a/files/zh-tw/mdn/editor/index.html +++ /dev/null @@ -1,23 +0,0 @@ ---- -title: Guide to the MDN editor UI -slug: MDN/Editor -tags: - - Documentation - - Guide - - Landing - - MDN - - MDN Meta - - 指南 -translation_of: MDN/Editor ---- -
{{MDNSidebar}}
{{IncludeSubnav("/zh-TW/docs/MDN")}}
- -

MDN線上文件百科的WYSIWYG (what-you-see-is-what-you-get) 所見即所得編輯器讓人可以輕鬆地對新內容做出貢獻。

- -

這個指南將教會您如何使用編輯器以及提升你的生產力，在您開始編輯或創造新頁面前，請先閱讀並同意遵守Mozilla Terms 。

- -

MDN style guide 提供了內容的編排方法與風格，其中包含了我們建議的文法與拼字規則。

- -

{{LandingPageListSubpages}}

- -

{{EditorGuideQuicklinks}}

diff --git a/files/zh-tw/mdn/kuma/index.html b/files/zh-tw/mdn/kuma/index.html deleted file mode 100644 index 1a4263acad..0000000000 --- a/files/zh-tw/mdn/kuma/index.html +++ /dev/null @@ -1,26 +0,0 @@ ---- -title: 'Kuma: MDN 的維基平台' -slug: MDN/Kuma -tags: - - Kuma - - Landing - - MDN Meta -translation_of: MDN/Kuma ---- -
{{MDNSidebar}}
- -
{{IncludeSubnav("/zh-TW/docs/MDN")}}
- -

Kuma 是由 MDN Web Docs 維護的 Django 程式碼。

- -

{{SubpagesWithSummaries}}

- -

參與 Kuma

- -

要參與 Kuma:

- - diff --git a/files/zh-tw/mdn/yari/index.html b/files/zh-tw/mdn/yari/index.html new file mode 100644 index 0000000000..1a4263acad --- /dev/null +++ b/files/zh-tw/mdn/yari/index.html @@ -0,0 +1,26 @@ +--- +title: 'Kuma: MDN 的維基平台' +slug: MDN/Kuma +tags: + - Kuma + - Landing + - MDN Meta +translation_of: MDN/Kuma +--- +
{{MDNSidebar}}
+ +
{{IncludeSubnav("/zh-TW/docs/MDN")}}
+ +

Kuma 是由 MDN Web Docs 維護的 Django 程式碼。

+ +

{{SubpagesWithSummaries}}

+ +

參與 Kuma

+ +

要參與 Kuma:

+ + diff --git a/files/zh-tw/mdn_at_ten/index.html b/files/zh-tw/mdn_at_ten/index.html deleted file mode 100644 index 039fa64ed8..0000000000 --- a/files/zh-tw/mdn_at_ten/index.html +++ /dev/null @@ -1,37 +0,0 @@ ---- -title: MDN 10 週年 -slug: MDN_at_ten -translation_of: MDN_at_ten ---- -
慶祝文件化網頁10年.
- -
-
-

MDN 的歷史

- -

在 2005 早期, 一個小團隊開始創見一個新穎, 免費的網路社群資源給所有的網路開發者. 他們的才華和不一樣的想法成為了今天的 Mozilla 開發者網路平台(Mozilla Developer Network)—所有開放網路技術的主要資源. 十年後, 我們全球的社群比以往都來的大, 而且我們也持續為開放網路科技創建文件, 提供範例程式碼和學習資源, 包含 CSS, HTML, JavaScript 及其他.

- -

了解更多 about the history

- - -

協助 MDN

- -

十年來, MDN 社群紀錄開放網路. 從修改錯別字到撰寫整個 API 文件, 每個人不分多少都有貢獻. 我們擁有超過 90,000 頁的資料內容已經被我們傑出的成員(Mozillians)翻譯或編寫. 你也可以成為其中的一員.

- -

了解更多 about contributing

- -

 

- -

 

-
- -
{{TenthCampaignQuote}}
- - - -
    -
  1. MDN 10 週年
    2. -
  2. MDN 的歷史
    3. -
  3. 協助 MDN
    4. -
-
diff --git "a/files/zh-tw/mozilla/firefox/releases/4/firefox_4_\351\226\213\347\231\274\350\200\205\346\226\260\345\212\237\350\203\275\346\246\202\350\246\275/index.html" "b/files/zh-tw/mozilla/firefox/releases/4/firefox_4_\351\226\213\347\231\274\350\200\205\346\226\260\345\212\237\350\203\275\346\246\202\350\246\275/index.html" deleted file mode 100644 index c36dad8487..0000000000 --- "a/files/zh-tw/mozilla/firefox/releases/4/firefox_4_\351\226\213\347\231\274\350\200\205\346\226\260\345\212\237\350\203\275\346\246\202\350\246\275/index.html" +++ /dev/null @@ -1,228 +0,0 @@ ---- -title: Firefox 4 for developers -slug: Mozilla/Firefox/Releases/4/Firefox_4_開發者新功能概覽 ---- -
{{FirefoxSidebar}}

2010 年六月起進入 Beta 測試期的 Firefox 4，增進了效能、加強針對 HTML 5 及其他創新網際科技的支援程度，也更加安全。本文為網頁、附加元件、Gecko 平台開發者們提供這一版的簡要技術相關資訊。

- -
-

{{ gecko_callout_heading("2") }}

- -

Gecko 1.9.3 即將更名為 Gecko 2，但許多文件還沒有針對此點更新，在接下來的幾個星期中才會有所更動。

-
- -

以下大部分的功能都已經可以在 逐日建置版中試用。

- -
註：本文、以及本文所連結的其他文件仍持續編修中，很多文件的名稱只是暫定、有些主題的文件也可能會拆成幾份子文件以方便閱讀。中文團隊的目標將僅翻譯這份概覽，其他子文件則有待大家的幫忙。
- -

Features for web developers

- -

Gecko now uses the HTML5 parser, which fixes bugs, improves interoperability, and improves performance. It also lets content embed SVG and MathML directly in the HTML markup.

- -

HTML

- -
-
Introduction to the HTML5 parser
-
A look at what the HTML5 parser means to you, and how to embed SVG and MathML into your content inline.
-
Forms in HTML5
-
A look at improvements to web forms in HTML5.
-
HTML5 Sections
-
Gecko now supports the new HTML5 elements related to sections in a document: {{ HTMLElement("article") }}, {{ HTMLElement("section") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("aside") }}, {{ HTMLElement("hgroup") }}, {{ HTMLElement("header") }} and {{ HTMLElement("footer") }}.
-
Other HTML5 elements
-
Gecko now also supports the following new HTML5 elements: {{ HTMLElement("mark") }}, {{ HTMLElement("figure") }} and  {{ HTMLElement("figcaption") }}.
-
WebSockets
-
A guide to using the new WebSockets API for real-time communication between a web application and a server.
-
- -

Miscellaneous HTML changes

- - - -

CSS

- -
-
CSS transitions
-
New CSS transitions support is available in Firefox 4.
-
Computed values in CSS
-
Support for calc() to compute values in CSS is in progress. See {{ bug(363249) }}.
-
Selector grouping
-
Support for {{ cssxref(":-moz-any") }} to group selectors and factorize combinators.
-
Background image subrectangle support
-
The {{ cssxref("-moz-image-rect") }} property makes it possible to use subrectangles of images as a background image.
-
CSS touch properties
-
Support for touch properties is added. Details, and real article names, to come later.
-
Privacy and the :visited selector
-
Changes have been made to what information can be obtained about the style of visited links using CSS selectors. This may affect some web applications.
-
- -

Miscellaneous CSS changes

- - - -

Graphics and video

- -
-
 
-
WebGL
-
The developing WebGL standard is now supported by Firefox.
-
Optimizing graphics performance
-
Tips and tricks for getting the most out of graphics and video performance in Firefox 4.
-
Support for WebM video
-
The new open WebM video format is supported by Gecko 1.9.3; support is included in nightlies as of 9 June.
-
Full screen API
-
Details coming soon.
-
SMIL animation
-
Support for SMIL animation of SVG is now available. See {{ bug(482402) }}.
-
Using SVG as images and as CSS backgrounds
-
You can now use SVG with the {{ htmlelement("img") }} element, as well as the background image in CSS. See {{ bug(272288) }}, {{ bug(276431) }} and {{ bug(231179) }}.
-
- -

DOM

- -
-
Obtaining boundary rectangles for ranges
-
The Range object now has getClientRects() and getBoundingClientRect() methods. See {{ bug(396392) }}.
-
Capturing mouse events on arbitrary elements
-
Support for the Internet Explorer-originated setCapture() and releaseCapture() APIs has been added. See {{ bug(503943) }}.
-
Manipulating the browser history
-
The existing document history object, available through the {{ domxref("window.history") }} object, now supports the new HTML5 pushState() and replaceState() methods.
-
Touch and multi-touch events
-
Support has been added for touch and multi-touch events.
-
IndexedDB
-
The proposed IndexedDB standard, which provides a local database store for web applications, will be supported by Firefox 4.
-
- -

Miscellaneous DOM changes

- - - -

Security

- -
-
Introducing Content Security Policy
-
Content Security Policy (CSP) is a Mozilla proposal designed to help web designers and server administrators specify how content on their web sites interacts. The goal is to help detect and mitigate attacks including cross-site scripting and data injection attacks.
-
ForceTLS
-
Details soon.
-
The Account Manager
-
Details soon.
-
- -

JavaScript

- -

For an overview of the changes implemented in JavaScript 1.8.5, see New in JavaScript 1.8.5. JavaScript in Firefox 4 will have additional adherence to the ECMAScript 5 standard.

- -

Changes for Mozilla and add-on developers

- -

For helpful tips on updating existing extensions for Firefox 4, see Updating extensions for Firefox 4.

- -

JavaScript code modules

- -
-
Services.jsm
-
The Services.jsm code module provides getters that make it easy to obtain references to commonly-used services, such as the preferences service or the window mediator, among others.
-
- -
-
JS-ctypes API
-
The JS-ctypes API makes it possible to call C-compatible foreign library functions without using XPCOM.
-
Add-ons Manager
-
The new Add-ons Manager provides information about installed add-ons, support for managing them, and provides ways to install and remove add-ons.
-
Loading code modules from chrome: URLs
-
You can now load JavaScript code modules using chrome: URLs, even inside JAR files.
-
- -

DOM changes

- -
-
{{ domxref("ChromeWorker") }}
-
A new type of worker for privileged code; this lets you use things like js-ctypes from workers in extensions and application code.
-
- -

XUL

- -

tabbrowser (gBrowser) changes

- -

Several changes were made to the {{ XULElem("tabbrowser") }} element that impact extensions that interact with tabs.

- - - -

Miscellaneous XUL changes

- - - -

Storage

- -

Miscellaneous storage API changes

- - - -

XPCOM

- -
-
XPCOM changes in Gecko 1.9.3
-
Details about changes to XPCOM that impact compatibility in Firefox 4.
-
Components.utils.getGlobalForObject()
-
This new method returns the global object with which an object is associated; this replaces a common use case of the now-removed __parent__.
-
- -

Memory management

- -
-
Infallible memory allocation
-
Mozilla now provides infallible memory allocators that are guaranteed not to return null. You should read this article to learn how they work and how to explicitly request fallible versus infallible memory allocation.
-
- -

Other changes

- -
-
Gopher support removed
-
The Gopher protocol is no longer supported natively. Continued support is available via the OverbiteFF extension.
-
Default plugin removed
-
The default plugin has been removed. The application plugins folder has also been removed by default, however support for installing plugins via this folder still exists. See bug 533891.
-
Extension Manager replaced with AddonManager
-
nsIExtensionManager has been replaced by AddonManager. Since there is apparently no way at present to obtain the install location from a given extension ID, the closest workaround is to use the directory service to find the profile directory and append "extensions" to it (though this approach will not catch extensions outside of the profile directory or those which are aliased to another location).
-
- -

參考

- - diff --git "a/files/zh-tw/orphaned/core_javascript_1.5_\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" "b/files/zh-tw/orphaned/core_javascript_1.5_\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" new file mode 100644 index 0000000000..c7fe61614d --- /dev/null +++ "b/files/zh-tw/orphaned/core_javascript_1.5_\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" @@ -0,0 +1,9 @@ +--- +title: Core JavaScript 1.5 正規表達式的建立 +slug: Core_JavaScript_1.5_正規表達式的建立 +--- +

 

+ +

This page was auto-generated because a user created a sub-page to this page.

+ +

 

diff --git a/files/zh-tw/orphaned/cross-site_xmlhttprequest/index.html b/files/zh-tw/orphaned/cross-site_xmlhttprequest/index.html new file mode 100644 index 0000000000..9ffdd6ca6e --- /dev/null +++ b/files/zh-tw/orphaned/cross-site_xmlhttprequest/index.html @@ -0,0 +1,108 @@ +--- +title: Cross-site XMLHttpRequest +slug: Cross-site_XMLHttpRequest +--- +

Firefox 3 支援了 W3C Access Control working draft，這讓你可以對其他網站作 XMLHttpRequests 以取得其他網站的資料，並加以管理，在自己建立的網站中，混入來自多個其他網站的內容。

+

Firefox 3 支援 Cross-site XMLHttpRequest

+

概觀

+

W3C 存取控制（The W3C Access Control）的架構讓客戶端文件對於誰可以、誰不可以向它們發出「以瀏覽器為基礎的 request」（例如 XMLHttpRequest）有更好的控制。 +

除此之外，這個 access control scheme 讓網路應用程式擁有允許「跨站要求（cross-site request）」的能力。理論上，這讓你在部署好存取控制點（Access Control Point）後，可以由 yoursite.com 的一個頁面透過 XMLHttpRequest 向 google.com 要求一份文件。這個層級的控制，讓管理網站內容的人員在決定是否「讓他們的使用者建立混合不同網站內容的網頁（mashup）或網站應用程式」時更有彈性。 +

+

用法

+

在 Firefox 3，要使用 W3C 存取控制（W3C Access Controls）有兩個方法。第一個是透過「加入新的存取控制檔頭」（在任何 Resouece Type 都能運用此方式，但你對網站伺服器必須有較高的控制權），另一個是透過「存取控制處理指示」（The Access-control Processing Instruction）（僅能用於 XML 文件）。 +

+

存取控制檔頭（Access-Control Headers）

+

這是在允許跨站的 XMLHttpRequests 時最有彈性的作法。如果你在你的 Request Response 中加入額外的存取控制檔頭，像下面這樣，你就可以給予 mozilla.org 上的任何網路應用程式擁有存取的權限。 +

+
Access-Control: allow <mozilla.org>
+

存取控制檔頭讓你有能力可以依據來源、要求方式（request method）來決定是否給予、或拒絕別人存取特定資源。 +

例如，下面這些都是有效的存取控制檔頭： +

+
 // 任何人都可以存取這項資源 - 沒有限制
+ Access-Control: allow <*>
+
+ // 任何人都不可以存取這項資源 - 沒有例外
+ Access-Control: deny <*>
+
+ // 只有在 'mozilla.org' 上面的網站可以存取這項資源
+ // （這也包含了 sub-domains）
+ Access-Control: allow <mozilla.org>
+
+ // 除了 developer.mozilla.org 以外，其他所有 mozilla.org　的 sub-domain 都可以存取這項資源
+ Access-Control: allow <mozilla.org> exclude <developer.mozilla.org>
+
+ // 只有這個 domain、在這個 port、運用此方式的 request 可以存取這項資源
+ Access-Control: allow <developer.mozilla.org:80> method GET, POST
+
+

在 W3C Access Control working draft 有更多例子可看。 +

+
例子
+

XML Processing Instruction

+

XML 有「include 額外命令讓 XML processor 針對它特別處理」的能力。The Access Control draft 就是利用這種特性指定了一種額外的命令，讓 XML 文件變成可以在遠端被跨站存取。 +

例如： 使用下列存取控制處理指示 （access-control processing instruction）會給 mozilla.org 上的任何網站有存取 XML 文件的能力： +

+
 <?access-control allow="mozilla.org"?>
+
+

這裡有一些使用存取控制處理指示（access-control processing instruction）來給予 XML 文件存取權限的簡單例子： +

+
 // 任何人都可以存取這項資源 - 沒有限制
+ <?access-control allow="*"?>
+
+ // 任何人都不可以存取這項資源 - 沒有例外
+ <?access-control deny="*"?>
+
+ // 只有在 'mozilla.org' 上面的網站可以存取這項資源
+ // （這也包含了 sub-domains）
+ <?access-control deny="mozilla.org"?>
+
+  // 除了 developer.mozilla.org 以外，其他所有 mozilla.org　的 sub-domain 都可以存取這項資源
+ <?access-control allow="mozilla.org" exclude="developer.mozilla.org"?>
+
+ // 只有這個 domain、在這個 port、運用此方式的 request 可以存取這項資源
+ <?access-control allow="developer.mozilla.org" method="GET POST"?>
+
+

你可以在 W3C Access Control working draft 中找到更多例子。 +

+
例子
+

這個簡單的例子從一個網站向另一個網站要求 XML 檔。這個 XML 檔包含了「存取控制的處理指示」（Access-control processing instruction），這些指示給予任何向伺服器發出要求的網站存取的權限。如果你複製 ac.html 到你自己的伺服器，你就會看到 request 仍然可以作用（因為所有網站都被允許向它發出請求）。 +

ac.html +

+
 <html>
+ <head>
+ <script>
+ window.onload = function(){
+   var xhr = new XMLHttpRequest();
+   xhr.open("GET", "http://dev.jquery.com/~john/xdomain/test.xml", true);
+   xhr.onreadystatechange = function(){
+     if ( xhr.readyState == 4 ) {
+       if ( xhr.status == 200 ) {
+         document.body.innerHTML = "My Name is: " +
+           xhr.responseXML.getElementsByTagName("name")[0].firstChild.nodeValue;
+       } else {
+         document.body.innerHTML = "ERROR";
+       }
+     }
+   };
+   xhr.send(null);
+ };
+ </script>
+ </head>
+ <body>
+ Loading...
+ </body>
+ </html>
+
+

test.xml +

+
 <?xml version="1.0" encoding="UTF-8"?>
+ <?access-control allow="ejohn.org"?>
+ <simple><name>John Resig</name></simple>
+
+

延伸閱讀

+ +
+
+{{ languages( { "en": "en/Cross-Site_XMLHttpRequest", "fr": "fr/Requ\u00eates_XMLHttpRequest_inter-sites", "ja": "ja/Cross-Site_XMLHttpRequest", "pl": "pl/\u017b\u0105dania_XMLHttpRequest_przesy\u0142ane_mi\u0119dzy_witrynami" } ) }} diff --git "a/files/zh-tw/orphaned/dom_\350\247\200\345\257\237\345\231\250/index.html" "b/files/zh-tw/orphaned/dom_\350\247\200\345\257\237\345\231\250/index.html" new file mode 100644 index 0000000000..9b597bb306 --- /dev/null +++ "b/files/zh-tw/orphaned/dom_\350\247\200\345\257\237\345\231\250/index.html" @@ -0,0 +1,5 @@ +--- +title: DOM 觀察器 +slug: DOM_觀察器 +--- +
diff --git "a/files/zh-tw/orphaned/firefox_3.5_\346\212\200\350\241\223\346\226\207\344\273\266/index.html" "b/files/zh-tw/orphaned/firefox_3.5_\346\212\200\350\241\223\346\226\207\344\273\266/index.html" new file mode 100644 index 0000000000..0d151ee276 --- /dev/null +++ "b/files/zh-tw/orphaned/firefox_3.5_\346\212\200\350\241\223\346\226\207\344\273\266/index.html" @@ -0,0 +1,240 @@ +--- +title: Firefox 3.5 技術文件 +slug: Firefox_3.5_技術文件 +tags: + - Firefox + - Firefox 3.5 +--- +

Firefox 3.5 加入很多新功能，當然也加強了對各式網際標準的支援程度。這篇文章大致說明改進的部份、詳細的說明可見英文版原文。

+

限於人力，大部分的文章都是英文版。如果您有興趣，請協助翻譯。

+

3.5 技術面新功能

+

網站、網際程式部份

+

加強支援 HTML 5

+
+
+ 在 Firefox 中操作影片、音效
+
+ Firefox 3.5 支援 HTML 5 的 audio 及 video 元素。藉由原生支援，影片、音效可以經由 JavaScript 直接操作 (播放、暫停等)。目前只支援 Ogg 及 WAV 兩種格式的影音檔，未來可能支援其他的格式。
+
+ 離線資源
+
+ Firefox 3.5 現在完整支援 HTML 5 的離線資源規格。需注意的是，在 Firefox 3 雖已經支援部份規格、但由於推出後 HTML 5 離線資源規格已然修改，是以毋需再針對 Firefox 3 設計相關程式。3.5 支援的是最新的規格。
+
+ 拖放事件
+
+ HTML 5 拖放 (drag & drop) API 提供在網站內 (甚至跨網站) 拖放物件的相關功能。同時，這也讓 Mozilla 相關的程式擴充套件有了比較簡單的 API 可以使用。
+
+

新增功能：CSS 部份

+
+
+ 動態下載字形
+
+ 新支援的 @font-face 樣式規則，網頁可以藉此提供字形讓使用者動態下載、以設計師所期待的最佳字形檢視網頁。
+
+ CSS 媒介判讀
+
+ Firefox 3.5 現在支援 CSS 媒介判讀 (media queries)，可以讓不同的媒介使用不同的樣式規則。
+
+ 更新 ::before 及 ::after 行為以符合 CSS 2.1
+
+ ::before 及 ::after 兩個擬態元素 (pseudo-element) 已經更新，以便完整支援 CSS 2.1 相關規格。新增關於 position、float、list-style-* 及部份 display 特性。
+
+
+
+ opacity
+
+ Mozilla 先前提供的 -moz-opacity 特性已經停止支援，請改用標準的 opacity 特性。
+
+ text-shadow
+
+ Firefox 3.5 開始支援 text-shadow 特性，可以為網頁上的文字加上陰影效果。
+
+ word-wrap
+
+ 此特性可設定是否允許某行文字溢出版面時自動調整斷行。
+
+ -moz-box-shadow
+
+ -moz-border-image
+
+ -moz-column-rule
+
+ -moz-column-rule-width
+
+ -moz-column-rule-style
+
+ -moz-column-rule-color
+
+ -moz-column-gap
+
+ Firefox 3.1 開始新增上述 Mozilla 擴充特性。
+
+ -moz-nativehyperlinktext 色彩值
+
+ 新的色彩設定值，顯示為系統的預設連結色彩。
+
+ -moz-window-shadow 及 -moz-system-metric(mac-graphite-theme) 特性
+
+ 為了方便佈景主題製作而新增的 CSS 特性。
+
+ -moz-appearance 支援新設定值
+
+ -moz-appearance 開始支援 -moz-win-glass 及 -moz-mac-unified-toolbar 兩種新設定值。
+
+ CSS 變形
+
+ Firefox 3.5 開始支援 CSS 變形特性，詳情請見 -moz-transform 及 -moz-transform-origin。
+
+ :nth-child
+
+ :nth-last-child
+
+ :nth-of-type
+
+ :nth-last-of-type
+
+ :first-of-type
+
+ :last-of-type
+
+ :only-of-type
+
+ Firefox 3.5 開始支援上述選取符。
+
+

新增功能：DOM 部份

+
+
+ DOM 背景工作序
+
+ Firefox 3.5 支援 DOM 背景工作緒 (workers)，方便網際應用程式以多執行緒方式執行。
+
+ 地理位置
+
+ Firefox 3.5 支援地理資訊 (Geolocation) API，在安裝有相關元件 (Geolocation provider)並啟用的狀態下、允許網際應用程式取得使用者目前的所在地。
+
+ 在 Firefox 中使用 JSON
+
+ DOM 已經整合對 JSON 的支援。
+
+
+
+ 以選取符取用 DOM 元素
+
+ 選取符 API 讓開發人員以類似 CSS 的選取符指定 DOM 元素方便操作。
+
+ NodeIterator 物件
+
+ NodeIterator 提供在DOM子樹中對節點列表進行往返（iterating）的支援。
+
+ MozAfterPaint 事件
+
+ 新 DOM 事件，在視窗重繪時觸發。
+
+ MozMousePixelScroll 事件
+
+ 新 DOM 事件，允許偵測滑鼠滾輪事件，且是以像素為單位、非以往的「行」。
+
+

新增功能：JavaScript

+
+
+ Object.getPrototypeOf()
+
+ 傳回指定物件的原型。
+
+ 字串物件的「修剪」方法
+
+ String 物件現在可藉 trim()、trimLeft() 及 trimRight() 等方法清除空白部份。
+
+

其他新功能

+
+
+ ICC 色彩校正
+
+ Firefox 3.5 現在支援圖片的 ICC 色彩校正。
+
+ script 元素支援 defer 屬性
+
+ 此屬性讓瀏覽器可以決定是否要等待此段腳本執行完畢後再繼續分析、繪制網頁。
+
+ 控制預讀 DNS
+
+ Firefox 3.5 提供預讀 DNS 功能，不必等到真的按下連結、就可以先行處理本頁裡各連結網址的域名查詢，讓使用者感覺更快。本文說明操作這個行為的方法，包括如何停用、如何調整此功能。
+
+

新增功能：Canvas 部份

+
+
+ canvas 元素中的 HTML 5 text API
+
+ Canvas 元素開始支援 HTML 5 text API。
+
+ canvas 支援陰影效果
+
+ 此版開始支援 Canvas 陰影效果。
+
+ moz-opaque 屬性
+
+ 增加 moz-opaque DOM 屬性，指定 canvas 是否需要使用透明效果。如果一開始就確定不會有透明效果、那麼繪製的效率便能最佳化。
+
+

新增功能：SVG 部份

+
+
+ 在 HTML 內容中套用 SVG 特效
+
+ 你現在可以在 HTML 及 XHTML 內容中套用 SVG 特效。
+
+

其他改良要點

+ +

XUL 及套件開發相關

+

如果您曾開發擴充套件，那麼請先閱讀為 Firefox 3.5 更新套件（英文），裡頭說明了新版本對套件可能衍生的影響。

+

新元件、函式

+
+
+ 跨網域 HTTP 存取控制
+
+ 當伺服器提供相關支援，則 Firefox 3.5 可以操作包含 XMLHttpRequest 在內的跨網域 HTTP 存取方式。
+
+ XMLHttpRequest 進度事件
+
+ 讓擴充套件得以監控相關進度。
+
+ 支援隱密瀏覽模式
+
+ Firefox 3.5 支援隱密瀏覽模式，不會紀錄使用者的活動。擴充套件如需支援隱密模式，可以參考這份文件。
+
+ Firefox 3.5 安全相關變動
+
+ Firefox 3.5 安全性相關的變動說明。
+
+ Firefox 3.5 佈景主題變動
+
+ Firefox 3.5 佈景主題相關的變動說明。
+
+

其他值得一提的改良、改變

+ +

{{ languages( { "en": "en-US/Firefox/Releases/3.5"} ) }}

diff --git "a/files/zh-tw/orphaned/firefox_\344\270\255\347\232\204\351\233\242\347\267\232\350\263\207\346\272\220/index.html" "b/files/zh-tw/orphaned/firefox_\344\270\255\347\232\204\351\233\242\347\267\232\350\263\207\346\272\220/index.html" new file mode 100644 index 0000000000..0b1180d3ca --- /dev/null +++ "b/files/zh-tw/orphaned/firefox_\344\270\255\347\232\204\351\233\242\347\267\232\350\263\207\346\272\220/index.html" @@ -0,0 +1,48 @@ +--- +title: Firefox 中的離線資源 +slug: Firefox_中的離線資源 +tags: + - HTML5 離線 + - application cache +--- +

 

+

原文 : Using Application Cache

 

介紹

  HTML5 提供了 cache 機制，使得網路應用程式能較不受到網路狀態的影響。開發人員可以藉由 Application Cache (AppCache) 的介面來定義哪些資源應當被瀏覽器儲存起來 - 如此一來即使網路斷線使用者依舊可以取得這些資源。同時，應用程式也能正確的運行即使使用者按下了「重新載入」的按鈕。

  大抵來說，使用 Application Cache 可以取得下列好處：

  • 離線瀏覽：使用者可以在斷線/離線時瀏覽你的網站
  • 網站加速：善用 AppCache 就可以減少載入重複資源的狀況，進而加速網站讀取速度
  • 減少伺服器的負擔：瀏覽器僅只有在伺服器上資源發生變動時才重新抓取資料

application cache 運作的機制

啟動 application cache

  啟動 AppCache 的方法很簡單，你只需要在你程式頁面中，html 元素裡指名 manifest 的位置即可，這裡有個簡單範例：

<html manifest="example.appcache"> 
+  ...
+</html>
+

manifest 指向了一個 cache manifest 的檔案，他指出了在你的應用程式中哪些資源該當被瀏覽器儲存以作為快取。

  你應該在每一個你希望瀏覽器替你儲存資源的頁面加上 manifest。瀏覽器不會自作主張的去儲存 manifest 指定以外的資源。事實上，你並不需要列出所有你想要被快取的頁面，瀏覽器會儲存使用者曾經瀏覽過的所有頁面以及你指名的那些資源。

  某些瀏覽器 - 例如 FireFox - 會在使用者第一次讀取有使用 Application Cache 的時候提醒他們。提示訊息可能會是這樣：

This website (www.example.com) is asking to store data on your computer for offline use. [Allow] [Never for This Site] [Not Now]

The term "offline(-enabled) applications" sometimes refers specifically to applications that the user has allowed to use offline capabilities.

讀取文件

  Application Cache 的運作是基於讀取 manifest 檔案：

  • 倘若 application cache 存在，瀏覽器會直接取用本地端的快取而非經由網路請求資源。這可以加速網頁讀取。
  • 倘若 cache manifest 檔案被更新了，瀏覽器會下載新版的 manifest 並且依此and the resources listed in the manifest. This is done in the background and does not affect performance significantly.

  其運作流程如下：

  1. 當瀏覽器造訪一個有使用 AppCache 的網站時 (根據 <html> 判定)，若發現自己並沒有本地快取，就按照該 manifest 建立第一版的本地快取。
  2. 在接下來的瀏覽行為中，倘然觸及被快取的資源，瀏覽器將會直接自本地端給予回應。在此同時，瀏覽器也會傳送一個確認的事件給 window.applicationCache 物件，其會按照 HTTP cache rules 取回 manifest 檔案。
  3. 假使目前本地擁有的 manifest 已經是最新，瀏覽器將會送一個「不需更新」的事件給 applicationCache 物件。所以假設任何一個在伺服器端被你註明要被快取住的物件更動了，務必改動 manifest 檔案，如此一來使用者的瀏覽器才知道要重新下載所有的資源。
  4. 當 manifest 更新後，所有列在其中的資源會由 applicationCache.add()透過 HTTP caching rules 被重新抓取至本地的暫存快取。當一個檔案被抓到本地快取後，瀏覽器會送出 progress 的事件到 applicationCache 物件。如果發生了錯誤，瀏覽器會送出 error 事件並停止更新。
  5. 當所有資源都被成功的取得後，他們便會被真正地移到離線時也能存取的快取區。此時，cached 事件會被發送給 applicationCache 物件。此時瀏覽器已經能顯示畫面了，未來只有當使用者重新整理頁面、手動操作或被其他程式驅動才會重新從快取中讀到瀏覽器。

清除 application cache

  在 Chrome 中，使用者可以藉由選擇 preferences 中 Clear browsing data... 清除 application cache 的內容 (此外，也可以造訪 chrome://appcache-internals/ )。Safari 中也有類似的設計，你可以選用 preference 中的 Empty cache 達到一樣的目的 (但 safari 此時可能會要求你重啟瀏覽器)。

  而 Firefox 則將這些資料放置在一般的硬碟快取中 (非在 Firefox 的 profile 中)：

  • Windows Vista/7: C:\Users\<username>\AppData\Local\Mozilla\Firefox\Profiles\<salt>.<profile name>\OfflineCache
  • Mac/Linux: /Users/<username>/Library/Caches/Firefox/Profiles/<salt>.<profile name>/OfflineCache

使用者可以透過檢查 about:cache 中 Offline cache device 下的資訊來得知目前狀態。

  使用者可以清除特定網站的快取藉由 Tools -> Options -> Advanced -> Network -> Offline 中的 "Remove..." 按鈕。補充一下，以下兩個方法無法清除快取

  • Clear Recent History (bug 538595)
  • Options -> Advanced -> Network -> Offline data -> Clear Now (bug 538588)

相關資訊亦可參考  clearing the DOM Storage data 。

  Application cache 也會有失效的時候。當伺服器端移除了 manifest 後，瀏覽器會自動清除所有在本地端的快取，並且發送 obsoleted 的事件給 applicationCache 物件。這會使得 application cache 的狀態變為 OBSOLETE。

關於 cache manifest file

如何引用 cache manifest file

  在 manifest 中定義資源的路徑可以分為兩種 - 相對路徑及絕對路徑 (絕對路徑：起始點是 application 所在的那層目錄)。並且，manifest 的 MIME 格式必須為 text/cache-manifest。

cache manifest file 的起始點

  Manifest 文件中的資源必須以 URI 格式表示。所有列於 manifest 中的資源，他們的 scheme、host以及 port 都得和 manifest 文件一樣。

範例 1: 一個簡單的 cache manifest file

  這是一個簡單的範例, example.appcache, 我們假設他屬於 www.example.com

CACHE MANIFEST
+# v1 - 2011-08-13
+# This is a comment.
+http://www.example.com/index.html
+http://www.example.com/header.png
+http://www.example.com/blah/blah
+

  一個 manifest 檔案可以有三種不同的段落 - CACHE、NETWORK 以及 FALLBACK (容後再敘)。在 example.appcache 中我們並未指定段落名，是以所有資源會被以預設方式解析，也就是「需要被加到快取」(意義上屬於 CACHE 段)。如前所提到，資源可以用相對或絕對路徑表示(例如可以把 http://www.example.com/index.html 改為 index.html)。

  在這裡要特別指出被放置在註解中的「v1」字樣。顯然他表達的是版本資訊。但在 manifest 中這樣的表達方式有大用。假設今天 header.png 改變了，你只需要改動版本資訊 (或註解中的內容)，則此 manifest 就會被認為有改變而使得瀏覽器重新抓取快取。當然你可以改動檔案中的其他部分，可是改變版本號是比較建議的方式。

重要提醒: 請勿將 manifest 檔案本身也列在 manifest 內容中，否則將使瀏覽器無法辦別 manifest 是否已被更新。這將使整個 application cache 機制失效。

cache manifest file 中的分類段落: CACHE, NETWORK, and FALLBACK

  在 manifest 中我們可以有三種不同的段落： CACHE、 NETWORK 以及 FALLBACK。

CACHE:
這是預設的段落。列於 CACHE 段落下的資源列表將在使用者第一次造訪時就被加到快取中。
NETWORK:
列於這個段落的資源表示一定得透過網路抓取而不從快取取得。可以使用萬用字元表示內容。
FALLBACK:
FALLBACK 指出了一種替代關係。在這個段落裡的每一行都有兩種 URI，其一指名有網路連線時使用的資源，第二個則是斷線時使用。這兩個 URI 的根目錄必須是相對於 manifest。可以使用萬用字元表示內容。

  這三種不同段落可以以任意順序出現在 manifest 中，並且都可出現多次而無次數限制。

範例 2: 稍微複雜點的 cache manifest file

  這裡我們來看看稍微複雜點的 manifest。他存在於一個虛擬的網站 www.example.com：

CACHE MANIFEST
+# v1 2011-08-14
+# This is another comment
+index.html
+cache.html
+style.css
+image1.png
+
+# Use from network if available
+NETWORK:
+network.html
+
+# Fallback content
+FALLBACK:
+/ fallback.html
+

  這個範例中使用了 NETWORK 以及 FALLBACK：

  • NETWORK：network.html 只能透過網路取回而不從快取。
  • FALLBACK：倘若沒有網路連線就使用 fallback.html (這裡寫法意思是說無法讀取到網站的/ ，也就是無法顯示網站)

cache manifest file 的結構

  Cache manifest 檔案應該被定義成 text/cache-manifest 的 MIME 格式。而所有被定義成 text/cache-manifest MIME 格式的檔案將被以本章所規範的語法解析。

  首先，Cache manifests 必須是一個 UTF-8 格式的文字檔。檔案中可以被嵌入 BOM (Byte-Order Mark)字元，舉例來說，換行會被表示成 「line feed (U+000A)」、「 carriage return (U+000D)」或 「carriage return 及 line feed both」。

  第二，cache manifest 的第一行必須是「CACHE MANIFEST」字串 (CACHE 和 MANIFEST 中間的那個空白是一個 U+0020 符號)，其後可以任意加入 space 或 tab 字符。以這一行來說，其他被加入的字串將會被忽略。

  最後，檔案中的剩餘部份是由零至多個下列所述的項目構成：

Blank line
空白行。你可以任意用 space 或 tab 去產生新的一行。
Comment
註解。指的是以 # 起始的行。要注意 # 只在該行有效，你不能在後附加上其他行 (若你有多行註解，請在每行起始都加上 #)。
Section header
段落標頭。這裡指的是在前面我們討論過 CACHE、 NETWORK 以及 FALLBACK：
Section header Description
CACHE: 其後內容指出哪些資源需要被加到瀏覽器的快取中
NETWORK: 其後內容指出哪些資源一定得從網路取得
FALLBACK: 其後內容指出資源在有網路連線及斷線時的替代關係
段落標頭行可以含有空白，但要記得在最後加上 「：」字元。
Section data
段落資料。其格式隨著不同段落而有所不同。在 CACHE 段落，每一行必須是符合規則的 URI 或 IRI (IRI 類似於 URI，但可使用 unicode)，此外，在 CACHE 段落中不得使用萬用字元，但可自由使用空白 (前提自然是不能破壞 URI/IRI 內容)。而在 NETOWKR 段落中，其內容為符合規則之 URI/IRI，並可以使用萬用字元。最後，在 FALLBACK 段落，其每一行的構成是先寫出合於規則的 URI/IRI，接著寫出倘若網路不通時該用何資源取代。
注意：倘若使用相對路徑的 URI，那麼其相對的位置是「cache manifest 檔案的 URI」。

  Cache manifest 檔是以上述三種段落來依序判讀，是以每一段落可出現一次以上。甚至你也可以寫出內容為空的段落。

Application cache 中的資源

  Application cache 總是含有至少一個資源，並以 URI 形式敘述。下面列出資源種類，manifest 中的資源必屬其中。

Master entries
這是一個瀏覽的入口，其引用了 manifest 檔案。
Explicit entries
描述 CACHE 段落的入口。
Network entries
描述 NETWORK 段落的入口。
Fallback entries
描述 FALLBACK 段落的入口。
注意： R同一種資源可以屬於多種不同種類，例如一個 entry 可以同時是 explicit entry 和 fallback entry。

 關於這些資源種類，下面會有更詳細的說明。

Master entries

  Master entries 是一種在他們 {{ HTMLElement("html") }} element 中含有 {{ htmlattrxref("manifest","html") }} attribute 的 HTML 檔。舉例來說，如果我們說我們有一個 http://www.example.com/entry.html 的 HTML 檔，其內容為：

<html manifest="example.appcache">
+  <h1>Application Cache Example</h1>
+</html>
+

如果 entry.html 並未被列在 example.appcache 中，幫妳拜訪 entry.html 時，他就會被加到 application cache 中，並被指明為一個 master entry。

Explicit entries

  這指出了哪些檔案需要被存到快取中。

Network entries

  這指出了哪些檔案一定得透過網路取得。可以看成是列出了一張線上白名單 (online whitelist)，提示了有些東西必須得透過網路向伺服器抓取。這有很多好處，其中一個好處是可以避開些安全漏洞，避免某些認證結果從本地端讀取而造成危險 (如果這個認證結果被竄改的話 ... )。

  這裡有個例子，你可以要求執行的腳本一定得透過網路向伺服器抓取：

CACHE MANIFEST
+NETWORK:
+/api
注意： Simply有人可能會覺得「一定向伺服器抓取資料」的這件事也可以透過把他們放置在 master entry 達成，但事實上 master entry 會被加入到 application cache 中。

Fallback entries

   Fallback entry 的使用時機在於網路可能斷線。直接看例子，當我們說有個 manifest (http://www.example.com/example.appcache)，其檔案內容是：

CACHE MANIFEST
+FALLBACK:
+example/bar/ example.html
+

任何企圖抓取 http://www.example.com/example/bar/ 或其子資料夾的請求若是失效，瀏覽器會讀取 example.html 作為替代。

Cache 的狀態

  每一個 application cache 都有一個 state，表明目前在瀏覽器端的狀態。共用同一個 manifest URI 的 cache 擁有一樣的狀態。狀態的種類如下：

UNCACHED
這是特殊的一個狀態，代表 cache 物件尚未初始化。
IDLE
代表 cache 並非處於更新中的狀態。
CHECKING
目前正在向伺服器端抓取 manifest 檔案以確認是否接下來要有更新資源的動作。
DOWNLOADING
因為 manifest 的更新，資源已經被下載到本地端的快取中。
UPDATEREADY
有一個新版的 application cache 是可用的狀態。這搭配著 updateready 的事件。相對於 cached 事件，他的意思是有新版的更新已經在本地，但尚未呼叫 swapCache()函式。
OBSOLETE
Application cache 群組現在處於過時的狀態。

測試 cache manifest 的更新

  你可以經由撰寫 JavaScript 程式來關注是否 manifest 檔有所更新。但未免在你漏失在 Listener 完成註冊之前就完成的事件，務必檢查 window.applicationCache.status。如下所示：

function onUpdateReady() {
+  alert('found new version!');
+}
+window.applicationCache.addEventListener('updateready', onUpdateReady);
+if(window.applicationCache.status === window.applicationCache.UPDATEREADY) {
+  onUpdateReady();
+}

   倘若你想手動的去測試 manifest 檔案是否更新，你可以使用 window.applicationCache.update()。

注意 !!!

  • 當 application cache 的機制被啟動，程式撰寫員無法簡單的透過更新資源本身就取得目前伺服器上最新的版本 (或許你已經自本地端快取讀出資源了！)。你必須在瀏覽器讀取資源之前就更新 manifest 檔。這個動作可以透過 window.applicationCache.swapCache() 達到，但在此刻已經被讀取的資源將不受影響。最好的方式是重新刷新頁面。
  • 一個好的主意是是為你伺服器上所有副檔名為 appcache 的檔案設定為已經失效 (set expires headers)。這可以避免 manifest 被加到快取中的風險。以 Apache 為例，你可以這麼做：
    ExpiresByType text/cache-manifest "access plus 0 seconds"

支援 Application Cache 的瀏覽器們

{{ CompatibilityTable() }}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 4.0 3.5 10.0 10.6 4.0
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 2.1 {{ CompatUnknown() }} {{ CompatNo() }} 11.0 3.2

附註：先於 3.5 版以前的FireFox 忽略了 manifest 檔案中 NETWORK 以及 FALLBACK 的部分。

參考資料

{{ HTML5ArticleTOC() }}

{{ languages( { "es": "es/Recursos_offline_en_firefox", "fr": "fr/Ressources_hors_ligne_dans_Firefox", "ja": "ja/Offline_resources_in_Firefox", "pl": "pl/Zasoby_offline_w_Firefoksie", "zh-tw": "zh_tw/Offline_resources_on_Firefox" } ) }}

+
diff --git a/files/zh-tw/orphaned/html5_cross_browser_polyfills/index.html b/files/zh-tw/orphaned/html5_cross_browser_polyfills/index.html new file mode 100644 index 0000000000..d823a44760 --- /dev/null +++ b/files/zh-tw/orphaned/html5_cross_browser_polyfills/index.html @@ -0,0 +1,34 @@ +--- +title: HTML5 跨瀏覽器兼容程式碼 +slug: HTML5_Cross_Browser_Polyfills +--- +

這是個蒐集中文世界開發（但不一定原創）的跨瀏覽器兼容代碼、連結的地方，作為 Paul Irish《HTML5 Cross Browser Polyfills》的仿效文件。蒐集不會完全，因此也強烈建議繼續追蹤上述文件的進展，或是使用搜尋引擎。

+

歡迎貢獻新的代碼、連結，不過請注意放在這個地方的代碼皆屬於公有領域。

+

全頻（fullscreen）API

+

支援  Gecko:FullScreenAPI 草案的 {{ domxref("window.fullScreen") }} 與 {{ domxref("element.onfullscreenchange", "fullscreenchange") }} 事件 ，由贺师俊（hax）所提供：

+
if (!('fullScreen' in window)) Object.defineProperty(window, 'fullScreen', {
+  get: function() {
+  return (screen.width == window.outerWidth && screen.height == window.outerHeight)
+  }
+})
+
+var _fullScreen = window.fullScreen
+if (!('onfullscreenchange' in window)) window.addEventListener('resize', function() {
+  var f = window.fullScreen
+  if (f != _fullScreen) {
+    _fullScreen = f
+    fireSimpleEvent('fullscreenchange', document, {bubbles:true})
+  }
+}, false)
+
+function fireSimpleEvent(type, target, option) {
+  if (!target) target = document
+  if (!option) option = {}
+  var evt = document.createEvent('Event')
+  evt.initEvent(type, !!option.bubbles, !!option.cancelable)
+  return target.dispatchEvent(evt)
+}
+
+

中文排版

+ diff --git a/files/zh-tw/orphaned/learn/how_to_contribute/index.html b/files/zh-tw/orphaned/learn/how_to_contribute/index.html new file mode 100644 index 0000000000..f8a864b98d --- /dev/null +++ b/files/zh-tw/orphaned/learn/how_to_contribute/index.html @@ -0,0 +1,81 @@ +--- +title: 如何建設 MDN 學習專區 +slug: Learn/How_to_contribute +tags: + - Documentation + - 初學者 + - 貢獻 +translation_of: Learn/How_to_contribute +--- +
{{LearnSidebar}}
+ +

無論你是初來乍到、抑或尋至深處無怨尤、都應該是對貢獻 MDN 學習專區起了興趣吧。那很棒！

+ +

在這裡，你會看到該如何改進 MDN 學習專區的內容。視你的時間多寡、以及你是初學者、網路開發者、教師而定，有一些你可以完成的事情。

+ +
+

注意：你可以在如何撰寫幫助別人理解 Web 的文章裡面找到指引如何撰寫學習專區的新文章。

+
+ +

找到特定的任務

+ +

貢獻者們使用 Trello board 來組織工作事務。你可以透過這個方法，找出某個專案的工作。要加入的話，只要 建立一個 Trello 的帳號、然後去 ping Chris Mills 叫他給你撰寫 board 的權限。

+ +

Contributing is a great way to have some fun while learning new stuff. If you ever feel lost or have questions, don't hesitate to reach us on our mailing list or IRC channel (see at the bottom of this page for details). Chris Mills is the topic driver for the Learning Area — you could also try pinging him directly.

+ +

接下來的章節，會提供一些在你所能下的常見點子。

+ +

我是初學者

+ +

真棒！初學者在學習專區的創建與給予回饋，不但重要還很寶貴。身為目標閱聽者的你能在文章方面，提供令你成為團內重要成員的獨特觀點。如果你透過這些文章學習卻碰上問題、或是在某些地方稿不清楚，你可以自己去改它、或告訴我們以便我們修正之。

+ +

我們建議你可以透過以下方法貢獻：

+ +
+
給我們的文章添加標籤（約五分鐘）
+
給 MDN 的文章添加標籤，是向 MDN 貢獻的最簡單方法。我們有很多功能會透過標籤助以呈現內文資訊，所以幫忙標籤的建設相當寶貴。從沒有任何標籤的術語表以及學習專區開始吧。
+
閱讀並評價術語表（約五分鐘）
+
我們需要身為初學者的眼光，來檢視我們的內容。如果你發現某個術語難以理解，就表示該術語需要改進。你可以作任何認為有需要的更動。如果你不認為自己有修改該術語的技能，至少請透過我們的郵件清單告訴我們。
+
撰寫新的術語（約二十分鐘）
+
這是最有效的新技能學習法。選一個你想理解的概念去研究。接著，撰寫這個術語。和別人解釋，是「固著」你腦內知識的好方法。既幫自己理解所知、也幫了其他人。利人利己，大家都贏！
+
閱讀並評價術語表學習專區的文章（約兩小時）
+
和閱讀術語表差不多，但因為文章會更長了些，所以要花更多時間。
+
+ +

我是網路開發者

+ +

好極了！我們需要你的技能，來確保我們教給初學者的內容正確無誤。因為這裡的宗旨是理解網路，請確保解釋儘可能簡單，但不致毫無用處。比起過度精確，可以理解才是最重要的。

+ +
+
閱讀並評價術語表（約五分鐘）
+
我們需要你確認文章的內容是正確又不過於艱澀難懂的。請你變更任何你認為有必要改善的地方。如果你想要在做變更之前討論一下內容，歡迎透過 our mailing list 或 IRC channel通知我們。
+
撰寫新的術語（約二十分鐘）
+
闡明術語是一個簡單又精確的學習方式，初學者還會感激你。我們有很多尚未定義的用詞需要你的協助，挑一個你擅長的吧。
+
閱讀並評價術語表學習專區的文章（約兩小時）
+
這跟評價數語表一樣(如上述)，只是這些文章的篇幅更常，需要花更多的時間。
+
撰寫新的學習專區文章 (約四小時或更多)
+
MDN缺少簡單易懂的網頁技術相關文章(例如HTML, CSS, JavaScript)。我們也有較舊的文章需要重新審視並修正，請你將技能發揮到極致，讓初學者也能使用網頁技術。
+
提供練習題、範例或是互動式的教學工具。(? 小時)
+
我們所有的文章都需要 "active learning" 的素材在內，因為讓人們學習的最好途徑就是讓他們自己實作。這些素材會是練習題或互動式的內容，能協助使用者將文章內詳述的概念實際運用。有很多方式能夠製作 "active learning" 的內容，像是使用 JSFiddle 或相似的工具提供範例程式碼，或使用Thimble提供互動式的內容。 好好發揮你得創造力吧！
+
+ +

我是教師

+ +

MDN 有著精良的技術史，但我們對教導新人觀念的最佳方法，缺乏深入了解。針對這方面，我們需要借重做為教師或導師身份的你。你能幫我們確保給讀者們的內容，有著良好而實用的教育路徑（educational track）。

+ +
+
閱讀並評價術語表（約十五分鐘）
+
Check out a glossary entry and feel free to make any changes you think are necessary. If you want to discuss the content before editing, ping us on our mailing list or IRC channel.
+
撰寫新的術語（約一小時）
+
Clear, simple definitions of terms and basic overviews of concepts in the glossary are critical in meeting beginners' needs. Your experience as an educator can help create excellent glossary entries; we have many undefined terms which need your attention. Pick one and go for it.
+
添加實例或圖表至文章 (約一小時)
+
As you might know, illustrations are an invaluable part of any learning content. This is something we often lack on MDN and your skills can make a difference in that area. Check out the articles that lack illustrative content and pick one you'd like to create graphics for.
+
閱讀並審核教學文章 (約兩小時)
+
This is similar to reviewing glossary entries (see above), but it requires more time since the articles are typically quite a bit longer.
+
撰寫新的教學文章 (約四小時)
+
We need simple, straightforward articles about the Web ecosystem and other functional topics around it. Since these learning articles need to be educational rather than trying to literally cover everything there is to know, your experience in knowing what to cover and how will be a great asset.
+
建立練習題，測驗或是互動式的學習工具(? 小時)
+
All our learning articles require "active learning" materials. Such materials are exercises or interactive content which help a user learn to use and expand upon the concepts detailed in an article.  There are lots of things you can do here, from creating quizzes to building fully hackable interactive content with Thimble. Unleash your creativity!
+
建立學習途徑 (? 小時)
+
In order to provide progressive and comprehensible tutorials, we need to shape our content into pathways. It's a way to gather existing content and figure out what is missing to create a learning article to write.
+
diff --git a/files/zh-tw/orphaned/learn/html/forms/html5_updates/index.html b/files/zh-tw/orphaned/learn/html/forms/html5_updates/index.html new file mode 100644 index 0000000000..6d83f5efea --- /dev/null +++ b/files/zh-tw/orphaned/learn/html/forms/html5_updates/index.html @@ -0,0 +1,83 @@ +--- +title: Forms in HTML +slug: Web/HTML/Forms_in_HTML +translation_of: Learn/HTML/Forms/HTML5_updates +--- +
+ {{gecko_minversion_header("2")}}
+

摘要

+

HTML5的Form元素及其屬性比HTML4提供更大程度的語意標記，也移除了原本許多在HTML4所需要的繁瑣程式碼腳本與樣式控制。HTML5的Form元素讓表單在跨網頁上有更好的一致性，也提供即時的使用者輸入回饋，因為這些特色，HTML5的Form元素在使用者體驗上有更好的表現，甚至，這些體驗依然適用在瀏覽器關閉程式碼腳本執行的情況下。

+

本文旨在討論Gecko/Firefox, version 4或更新版本在新的或變更後的Form元素特色上的支援。

+

<input>元素

+

<input>元素的type屬性新增了一些屬性值。

+ +

<input>元素同時也新增了一些屬性:

+ +

<form>元素

+

{{HTMLElement("form")}} 元素新增了一些屬性

+ +

 <datalist>元素

+

{{HTMLElement("datalist")}}元素是{{HTMLElement("option")}}元素的列表，{{HTMLElement("option")}}元素會用於提示輸入建議。

+

可以利用{{HTMLElement("input")}}的{{htmlattrxref("list", "input")}}屬性來連結{{HTMLElement("input")}}元素與{{HTMLElement("datalist")}}

+

<output>元素

+

{{HTMLElement("output")}}元素代表運算結果。

+

可以利用{{htmlattrxref("for", "output")}}屬性來設定{{HTMLElement("output")}}元素和其他影響計算結果的元素(如input或參數)的關係，{{htmlattrxref("for", "output")}}屬性的值為一串以空白分隔的元素ID。

+

{{non-standard_inline}} Gecko2.0(不一定適用其他瀏覽器引擎)支援自定義{{HTMLElement("output")}}元素的驗證條件和錯誤訊息，所以提供了其{{Cssxref(":invalid")}}, {{Cssxref(":valid")}}, {{Cssxref(":-moz-ui-invalid")}}和 {{Cssxref(":-moz-ui-valid")}}的CSS pseudo-class，在以下狀況這個特色將很有用，例如沒有輸入值有問題，但計算結果違反了商業規則(好比說總百分比不可超過100)。

+

placeholder屬性

+

{{HTMLElement("input")}}元素和{{HTMLElement("textarea")}}元素的{{htmlattrxref("placeholder", "input")}}屬性會在輸入欄位上顯示輸入提示，這個屬性的值不可以含有回車或換行符號。

+

autofocus屬性

+

{{htmlattrxref("autofocus", "input")}}屬性指示除非使用者另有指定(例如在其他控制項上進行輸入操作)，否則當載入網頁時表單控制項要自動聚焦於特定元素上；autofocus屬性值為布林值(Boolean)，一份文件只能有一份表單設定autofocus屬性。能夠設定這個屬性的元素有{{HTMLElement("input")}}, {{HTMLElement("button")}}, {{HTMLElement("select")}}與{{HTMLElement("textarea")}}，不過當{{htmlattrxref("type", "input")}}屬性為隱藏(hidden)下，autofocus是無效的，也就是說，不能自動聚焦於隱藏元素上。

+

label.control DOM屬性

+

HTMLLabelElement DOM介面提供了{{HTMLElement("label")}}元素一個新的control屬性，control屬性會回傳被標記的控制項，這個控制項便是該label適用的控制項，也就是<label>元素{{htmlattrxref("for", "label")}}屬性指定的元素(如果有的話)或是第一個後代控制項元素。

+

約束驗證

+

HTML5提供了客戶端表單驗證的語法和API，基於安全性與資料正確性，雖然這並不能取代伺服器端驗證，但是客戶端驗證可以提拱使用者更好的立即輸入回饋體驗。

+

當{{HTMLElement("input")}}元素設定了title屬性，其值會作為提示框之內容，若是驗證失敗，提示框的內容會換成相關的錯誤訊息，我們可以利用非標準的{{htmlattrxref("x-moz-errormessage")}}屬性或setCustomValidity()方法來自定義錯誤訊息。

+
<input type="email" title="Please, provide an e-mail" x-moz-errormessage="This is not a valid e-mail">
+
+ Note: 約束驗證不支援表單的{{HTMLElement("button")}}元素，若是想根據表單驗證果來設定按鈕樣式，可以利用{{cssxref(":-moz-submit-invalid")}} pseudo-class。
+

約束驗證的HTML語法

+

下列是HTML5用來約束表單資料的語法

+ +

另外，我們可以在{{HTMLElement("form")}}元素上設定{{htmlattrxref("novalidate", "form")}}屬性或是在{{HTMLElement("button")}}元素以及{{htmlattrxref("type", "input")}}為submit或image的{{HTMLElement("input")}}元素上設定{{htmlattrxref("formnovalidate", "button")}}屬性來避免輸入約束驗證。這些屬性都會指示表單送出時不要進行驗證。

+

約束驗證API

+

下列是客戶端驗證可用的DOM屬性和方法:

+ +

See also

+ diff --git a/files/zh-tw/orphaned/mdn/community/conversations/index.html b/files/zh-tw/orphaned/mdn/community/conversations/index.html new file mode 100644 index 0000000000..955d241ece --- /dev/null +++ b/files/zh-tw/orphaned/mdn/community/conversations/index.html @@ -0,0 +1,53 @@ +--- +title: MDN的社群論壇 +slug: MDN/Community/論壇 +tags: + - MDN 資料 + - 指南 + - 社群論壇 +translation_of: MDN/Community/Conversations +--- +
{{MDNSidebar}}
+ +
MDN的『 工作 』通常在MDN的網頁上，但『社群』也會透過異步討論(Asynchronous discussions)，及同步線上討論或會議(Synchronous chat)進行。
+ +

異步討論 Asynchronous discussions

+ +

為了分享資訊及持續的溝通，MDN在Mozilla論壇中有獨立的類別("MDN")，這個類別連結所有與MDN相關的主題，包括文檔內容的創建，翻譯和維護； MDN平台開發；以及計劃，目標設定和進度跟踪。

+ + + +

歷史檔案館

+ +

Prior to June 2017, MDN-related discussions took place in mailings lists that were gatewayed and archived with Google groups. If you want to search these past discussions, you can look at the Google groups corresponding to the old mailing lists. (Yes, we know these names are overlapping and confusing. Historical accident. Sorry about that.)

+ +
+
mozilla.dev.mdc a.k.a. dev-mdc
+
This list was for discussions about documentation content on MDN.
+
mozilla.dev.mdn a.k.a. dev-mdn
+
This list was about the development work on MDN's underlying Kuma platform.
+
mozilla.mdn a.k.a. mdn@
+
This forum was for high-level planning and prioritization discussions, for the MDN website and other related initiatives.
+
+ +

同步討論（Synchronous chat）

+ +

Mozilla's platform for real-time discussions is Matrix, a chat protocol for which Mozilla has its own server.

+ +

The MDN Web docs chat room is a major channel for discussing the content of MDN. We talk about writing, organization of content, and so on. We also have "water cooler" conversations here—it's a way our community can keep in touch and just hang out. This room is most likely to be active during weekdays in North America and Europe.

+ +

You might want to learn more about using Matrix with Mozilla, and, if you're really into it, install a stand-alone Matrix application such as Riot.im.

+ +

 IRC？

+ +

For many years, Mozilla used Internet Relay Chat (IRC) for real-time discussions. As of early 2020, IRC has been deprecated in favor of Matrix. You may see references to IRC channels in many places, including on MDN. You can help by updating links to IRC channels that you find on MDN to point to the corresponding Matrix rooms instead. If you're not sure what the Matrix room is for a topic, ask in the General room. Projects or topics that are no longer active might not have a Matrix room; in such cases, just delete the link.

+ +

參與我們的會議 (或其他活動)

+ +

MDN團隊舉辦了許多對MDN社群開放的常規會議，請參閱Mozilla wiki上的MDN Meetings頁面，可以獲取日程、議程、註釋相關以及如何加入的訊息。

+ +

有關這些會議及其他會議，當地聚會和其他活動，可參閱MDN 活動日曆。定期會議會呈現在MDN Meetings wiki page。

diff --git a/files/zh-tw/orphaned/mdn/community/index.html b/files/zh-tw/orphaned/mdn/community/index.html new file mode 100644 index 0000000000..3c6fcda1a2 --- /dev/null +++ b/files/zh-tw/orphaned/mdn/community/index.html @@ -0,0 +1,52 @@ +--- +title: 加入 MDN 社群 +slug: MDN/Community +tags: + - 教學 + - 社群 +translation_of: MDN/Community +--- +
{{MDNSidebar}}
+ +
{{IncludeSubnav("/zh-TW/docs/MDN")}}
+ +
+

MDN (Mozilla Developer Network 的縮寫) 比 wiki 更強大： 它是一個屬於開發者們的社群，致力於讓 MDN 這個龐大資源更加傑出。

+
+ +

我們非常感謝您對 MDN 的貢獻，但是我們更希望您加入我們的社群，這裡有三個加入我們社群的方法：

+ +
    +
  1. 建立 MDN 帳戶
    2. +
  2. 加入會談
    3. +
  3. 追蹤新資訊
    4. +
+ +

社群如何運作

+ +

以下更多文章關於更多 MDN 的社群。

+ +
+
+
+
社群角色
+
在MDN社群中，有著許多負責不同部分的角色。
+
文件生成聚會
+
這是一個文件生成聚會的指南。它包含了過去人們舉辦文件生成聚會所提供的一些建議與訣竅，以幫助你也舉辦一個。
+
追蹤新資訊
+
MDN 是由 Mozilla Developer Network community 所維護。 這裡有一些我們分享我們在做什麼的資訊管道。
+
+ +
+
+
+ +
+
+
MDN社群會議
+
許多的社群工作都發生在MDN上，然而社群工作也同時發生在一些 討論(非即時性) 與 線上聊天或會議(即時性)中。
+
與社群一同工作
+
絕大部分相當程度對於MDN文件的貢獻來自於了解如何與社群一同工作。這份文章提供一些訣竅以幫助你與其他文件生成者及開發團隊交流。
+
+
+
diff --git a/files/zh-tw/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html b/files/zh-tw/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html new file mode 100644 index 0000000000..6f3f294e88 --- /dev/null +++ b/files/zh-tw/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html @@ -0,0 +1,34 @@ +--- +title: 如何創建 MDN 帳戶 +slug: MDN/Contribute/Howto/Create_an_MDN_account +translation_of: MDN/Contribute/Howto/Create_an_MDN_account +--- +
{{MDNSidebar}}

要針對 MDN 做出任何改變，你需要一個 MDN 帳戶。不要擔心，如果你只是想閱讀和搜索 MDN，你並不需要帳戶！這個簡單的指南幫助你設置 MDN 帳戶。

+ +
+
為什麼 MDN 需要我的電子郵件地址？

+ +

你的電子郵件地址用於帳戶恢復，MDN 管理員也會在必要時，用它來和你討論你的帳戶或你在網站上的活動。

+

此外，你可以選擇註冊的通知（例如特定頁面被更改時）和信息（例如，如果你選擇加入我們的 beta 測試團隊，你可能會收到需要測試的新功能）的電子郵件。

+

你的電子郵件地址永遠不會在 MDN 顯示，而且只會在符合我們的隱私權政策下使用。

+ +
如果你透過 Github 登入 MDN，而且在 Github 使用了 noreply 的電子郵件地址，你不會收到來自 MDN 的訊息（包含你訂閱頁面的訊息）。
+
+
+ +
    +
  1. 在 MDN 每一頁的最上方，你會發現有一個登入的按鈕。滑鼠滑到那邊後點一下（如果是移動設備就輕按）以表列 MDN 支持的驗證服務列表。
    2. +
  2. 選擇要登入的服務。目前只支持 GitHub。請注意如果選了 GitHub，你的 MDN 公開用戶頁會包含一個指向你 GitHub 頁面的連結。
    3. +
  3. 按照 GitHub 的提示把您的帳戶連接到 MDN。
    4. +
  4. 一旦認證服務把你帶回 MDN 以後，MDN 就會提示你輸入一個用戶名和電子郵件地址。您的用戶名會被公開顯示以表彰你所做的工作。不要使用您的電子郵件地址作為用戶名。。
    5. +
  5. 點擊「創建我的 MDN 配置文件」按鈕。
    6. +
  6. 如果您在步驟四指定的電子郵件地址，與認證服務使用的不一樣，你需要檢查這個電子郵件地址，並點擊確認電子郵件中的鏈接。
    7. +
+ +

就是這樣！你有一個MDN帳戶，並可以立即編輯或標籤頁，或者提交演示！

+ +

您可以在任何 MDN 頁面的頂部點擊你的名字，看看你的公開檔案。從那裡，你可以點擊「編輯」按鈕，進行更改或添加到您的個人資料，所以你可以分享更多關於您的利益，把鏈接添加到你的推特帳戶或部落格等等。

+ +
+

用戶名新不能包含空格或“@”字符。請記住，你的用戶名會被公開顯示，以確定你所做的工作！

+
diff --git a/files/zh-tw/orphaned/mdn/contribute/howto/do_a_technical_review/index.html b/files/zh-tw/orphaned/mdn/contribute/howto/do_a_technical_review/index.html new file mode 100644 index 0000000000..ecb35fe0be --- /dev/null +++ b/files/zh-tw/orphaned/mdn/contribute/howto/do_a_technical_review/index.html @@ -0,0 +1,50 @@ +--- +title: 如何進行技術審查 +slug: MDN/Contribute/Howto/Do_a_technical_review +translation_of: MDN/Contribute/Howto/Do_a_technical_review +--- +
{{MDNSidebar}}
{{IncludeSubnav("/zh-TW/docs/MDN")}}
+ +

技術審查包含檢查文章的正確與完整性，並在需要時進行修正。若文章作者需要其他人來檢查文章的技術性內容，可以在編輯時勾選「技術審查」（Technical review）。通常由作者連絡特定工程師來進行技術審查，但具備該主題技術專長者亦可參與。

+ +

本文描述如何執行技術審查，以協助確保 MDN 的內容是正確的。

+ +
+
要做什麼？
+
審查並修正文章在技術上的正確與完整性。
+
要審查的文章在哪？
+
找被標記為「技術審查」（technical review）的特定文章。
+
要知道些什麼？
+
+
    +
  • 針對文章主題的專業知識。若閱讀該文章並沒有對你傳授非常新的東西，那就視你自己為專家。
    • +
  • 編輯 MDN 上維基文章的方法。
    • +
+
+
有哪些步驟？
+
+
    +
  1. 選擇要審查的文章 +
      +
    1. 前往技術審查（technical reviews）清單頁面。這裡列出所有請求技術審查的頁面。
      2. +
    2. 選擇一個頁面，而你對該主題非常熟練。
      3. +
    3. 點擊文章連結以載入頁面。
      4. +
    +
    2. +
  2. 閱讀文章並密切關注技術性細節：這篇文章正確嗎？有沒有漏掉什麼？若初次選擇的頁面並不適合由你來審查，不要猶豫，選擇其他頁面。
    3. +
  3. 若沒有錯誤，你不需要透過編輯將文章標記為已審查。找到頁面左方側邊攔的「快速回顧」（quick review），黃色框框會列出任何等待中的審查，並讓你清除審查請求的標記。若有審查請求會顯示如下：
    + Screenshot of the sidebar's box listing reviews that have been requested and allowing the flags to be changed.
    4. +
  4. 取消選取「技術」（Technical），然後點擊「儲存」（Save）。
    5. +
  5. 若發現有錯誤需要修正，亦可在編輯器中改變審查請求的狀態。操作過程如下： +
      +
    1. 點擊靠近頁面頂端的「編輯」（Edit）按鈕以編輯頁面，這會帶你到 MDN editor。
      2. +
    2. 修正任何錯誤的技術資訊，並且（或者）增加任何重要但被遺漏的訊息。
      3. +
    3. 在文章底部填寫版本註解（Revision Comment）。這是用來描述你做了什麼事的簡短訊息，如：「技術審查完成」。當你做了些修正，將相關資訊納入你的註解，如：「技術審查並修正參數描述」。這會幫助其他貢獻者和網站編輯知道你變更的內容和理由。你也可提出（若有的話）自認不夠資格審查的部分。
      4. +
    4. 在 「需要審核嗎？」（Review Needed?） 下方，取消選取「技術」（Technical），就在頁面底部版本註解區塊附近。
      5. +
    5. 點擊「發布」（PUBLISH）按鈕。
      6. +
    +
    6. +
+

恭喜！你已經完成你的第一份技術審查！感謝你的幫助！

+
+
diff --git a/files/zh-tw/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html b/files/zh-tw/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html new file mode 100644 index 0000000000..8ef91de87d --- /dev/null +++ b/files/zh-tw/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html @@ -0,0 +1,55 @@ +--- +title: 如何進行編輯審查 +slug: MDN/Contribute/Howto/Do_an_editorial_review +tags: + - 如何 + - 指南 + - 文件 + - 編輯審查 +translation_of: MDN/Contribute/Howto/Do_an_editorial_review +--- +
{{MDNSidebar}}
+ +
{{IncludeSubnav("/zh-TW/docs/MDN")}}
+ +

一個主題的編輯審查包含錯字、拼字、文法、語法或其他文字錯誤。並非所有貢獻者都是語言專家，但他們的知識可以提供極為有用的資訊，因此需要審稿和校對。這就是編輯審查在做的事。

+ +

這個主題將會介紹如何進行編輯審查，以幫助確保在 MDN 的資訊是正確的。

+ +
+
有哪些任務？
+
必要的有審稿和校對。
+
有哪些東西需要編輯審查？
+
那些被標記需要審查的主題。
+
進行編輯審查需要知道什麼？
+
你需要具有良好的英文文法和拼字能力（即能準確翻譯英文成中文的能力）。編輯審查在於確保文法、拼字和語法的正確和意義，並遵守 MDN 編輯指南。
+
有哪些步驟？
+
+
    +
  1. 選擇一個主題： +
      +
    1. 前往待審查清單。這個表列出了要求審查的主題。
      2. +
    2. 選擇一個中文標題且不帶有 Template: (Template: 包含 MDN 功能碼) 的主題。
      3. +
    3. 點擊該主題的連結。
      4. +
    +
    2. +
  2. 閱讀主題，注意錯字、拼字、文法、語法或其他錯誤。如果你覺得無法應付，請找下一個主題。
    3. +
  3. 如果沒有錯誤，你不需要編輯主題來標記為已審查。在左方導覽列尋找「快速審查」方塊：
    + 快速審查
    4. +
  4. 取消選取 編輯 方塊並點擊 儲存。
    5. +
  5. 如果有錯誤需要被糾正： +
      +
    1. 點擊在頁面頂端附近的 編輯 按鈕，接著會轉到 MDN 編輯器。
      2. +
    2. 修正你找到的錯字、拼字、文法、語法或其他錯誤。你並不需要修正所有錯誤，但若你不確定你已經完整的審查主題，請留下編輯審查請求。
      3. +
    3. 在主題尾端留下 版本註解 。像是「編輯審查：修正錯字、文法和拼字」。這能讓其他貢獻者和網站編輯者知道你改了什麼和為什麼。
      4. +
    4. 取消選取在 需要審查嗎？ 中的 編輯 方塊。他在版本註解下面。
      5. +
    5. 按下 發布。
      6. +
    +
    6. +
+ +
+

你的變更不一定會立刻出現，他可能會因送出和儲存延遲一會。

+
+
+
diff --git a/files/zh-tw/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html b/files/zh-tw/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html new file mode 100644 index 0000000000..e44a6fb7ce --- /dev/null +++ b/files/zh-tw/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html @@ -0,0 +1,50 @@ +--- +title: 如何撰寫文章摘要？ +slug: MDN/Contribute/Howto/Set_the_summary_for_a_page +tags: + - 摘要 +translation_of: MDN/Contribute/Howto/Set_the_summary_for_a_page +--- +
{{MDNSidebar}}

 

+ +

你可以在MDN用各式各樣的方式來定義一個頁面的摘要，像是搜尋引擎結果，在其他的MDN網頁如某些到達頁(Landing Pages)，以及提示中。他應該是在頁面的上下文中有意義的文本，並且在上下文中顯示時，沒有其餘的頁面內容。

+ +

在頁面中摘要是明確定義的。如果沒有被明確定義的話，通成會拿第一句來當摘要，但並不總是最適合的。

+ +
+
+

任務是什麼？

+
+
在頁面中找出可以當成摘要的文字，且用別種文字說明寫成適當的摘要。
+
+

哪些地方需要撰寫摘要？

+
+
缺少摘要的頁面，或是摘要不足的頁面。
+
+

撰寫摘要之前，你需要具備/知道什麼？

+
+
會使用MDN編輯器、擅長寫英文作文以及對於該頁面要有足夠的了解，才能寫出好的摘要。
+
+

撰寫摘要的步驟：

+
+
+
    +
  1. 選一個頁面： +
      +
    1. 在 MDN documentation status 頁面中, 在Sections(章節)下方，點選任何一個你熟悉或是對其有所了解的標題連結（ex：HTML）：
      +
      2. +
    2. 在此文件狀態頁面上方的摘要表格內，點選Pages(頁面)。點選後會導向關於這個標題(ex:HTML)的全部頁面的索引頁。左邊欄位顯示這個頁面的連結，右邊則是顯示tags(標籤)以及該頁面的摘要。
      3. +
    3. 挑選一個沒有摘要的頁面，或是摘要太少的頁面：
      +
      4. +
    4. 點選該頁面的連結。
      5. +
    +
    2. +
  2. 點選編輯打開MDN編輯器。
    3. +
  3. 找出一句或是兩句可以總結上下文的摘要。如果需要的話，編輯現有的內容以創造或是修改成好的摘要。
    4. +
  4. 選擇要當成摘要的文字。
    5. +
  5. 點選在編輯器工具列中的格式化樣式，選擇SEO Summary. （在原始碼中，這會在被選起來的文字旁，產生一個HTML元素： {{HTMLElement("span")}} element with class="seoSummary" ）
    +
    6. +
  6. 使用修訂評論保存您的更改。評論為非必填項目，但我們鼓勵您填寫。能使其他人更容易追蹤文章的變化。
    7. +
+
+
diff --git a/files/zh-tw/orphaned/mdn/editor/basics/index.html b/files/zh-tw/orphaned/mdn/editor/basics/index.html new file mode 100644 index 0000000000..d33daf9aeb --- /dev/null +++ b/files/zh-tw/orphaned/mdn/editor/basics/index.html @@ -0,0 +1,55 @@ +--- +title: Editor UI elements +slug: MDN/Editor/Basics +translation_of: MDN/Editor/Basics +--- +
{{MDNSidebar}}

The built-in WYSIWYG editor on MDN is designed to make it as easy as possible to create, edit, and improve articles and other pages almost anywhere on the site. The editor window, shown below, consists of eight key area. This guide provides information about each section so you know how to use our entire editing environment.

+ +
+

We're constantly working on improvements to MDN, so there will be times when this documentation or the screen shots below may be slightly out-of-date. We'll periodically update this documentation, though, to avoid it being unusably behind.

+
+ +

Screenshot of the editor UI (August 2017) with each section labeled

+ +

The editor UI contains the following sections, as shown above. Click a link below to read about that section of the editor.

+ + + +

Revision comment

+ +

After you've made your changes, it's strongly recommended you add a comment to your revision. This is displayed in the revision history for the page, as well as on the Revision Dashboard. It helps to explain or justify your changes to others that may review your work later. To add a revision comment, simply type the note into the revision comment box before clicking either of the Publish buttons at the top or bottom of the page.

+ +

There are a few reasons this is helpful:

+ + + +

Review requests

+ +

The MDN community uses reviews to try to monitor and improve the quality of MDN's content. This works by setting a flag on an article indicating that a review is needed. You can learn more about technical reviews and editorial review in the How to guides.

+ +

To request a review on the article you've worked on, toggle on the checkbox next to the type of review that's needed. Technical reviews should be requested any time you make changes to the explanation of how something technical works, while editorial reviews are a good idea when you've made changes and would like someone to review your writing and style choices.

+ +

While selecting a review checkbox adds the article to the lists of those needing technical review or needing editorial review, it does not guarantee that anyone will immediately review the article. For technical reviews, it's a good idea to directly contact a subject-matter expert in the relevant technical area. For editorial reviews, you can post in the MDN discussion forum to request that someone review your changes.

+ +

Be sure to click one of the Publish buttons after making your selections, to commit your review request.

+ +

See also

+ + + + diff --git a/files/zh-tw/orphaned/mdn/editor/index.html b/files/zh-tw/orphaned/mdn/editor/index.html new file mode 100644 index 0000000000..5cf0ac0a43 --- /dev/null +++ b/files/zh-tw/orphaned/mdn/editor/index.html @@ -0,0 +1,23 @@ +--- +title: Guide to the MDN editor UI +slug: MDN/Editor +tags: + - Documentation + - Guide + - Landing + - MDN + - MDN Meta + - 指南 +translation_of: MDN/Editor +--- +
{{MDNSidebar}}
{{IncludeSubnav("/zh-TW/docs/MDN")}}
+ +

MDN線上文件百科的WYSIWYG (what-you-see-is-what-you-get) 所見即所得編輯器讓人可以輕鬆地對新內容做出貢獻。

+ +

這個指南將教會您如何使用編輯器以及提升你的生產力，在您開始編輯或創造新頁面前，請先閱讀並同意遵守Mozilla Terms 。

+ +

MDN style guide 提供了內容的編排方法與風格，其中包含了我們建議的文法與拼字規則。

+ +

{{LandingPageListSubpages}}

+ +

{{EditorGuideQuicklinks}}

diff --git a/files/zh-tw/orphaned/mdn/editor/keyboard_shortcuts/index.html b/files/zh-tw/orphaned/mdn/editor/keyboard_shortcuts/index.html new file mode 100644 index 0000000000..3c691a124b --- /dev/null +++ b/files/zh-tw/orphaned/mdn/editor/keyboard_shortcuts/index.html @@ -0,0 +1,134 @@ +--- +title: Edit box of the MDN editor +slug: MDN/Editor/Edit_box +translation_of: MDN/Editor/Keyboard_shortcuts +--- +
{{MDNSidebar}}

The edit box is, of course, where you actually do your writing. Right-clicking in the editor box offers appropriate additional options depending on the context of your click: right-clicking in a table offers table-related options and right-clicking in a list offers list-related options, for example.

+ +

By default, the editor uses its own contextual menu when you right-click on the editor. To access your browser's default contextual menu (such as to access the Firefox spell checker's list of suggested corrections), hold down the Shift or Control key (the Command key on Mac OS X) while clicking.

+ +

鍵盤快捷鍵

+ +

There are a number of convenient keyboard shortcuts available to help you avoid taking your hands off the keyboard while you work. The shortcuts are listed for Windows and Linux; on Mac, instead of using the Control key, you can use the Command key.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
快捷鍵說明
Ctrl + A全選
Ctrl + C複製到剪貼簿
Ctrl + V從剪貼簿貼上
Ctrl + X剪下
Ctrl + Z回到上一步
Ctrl + Y重置
Ctrl + K開啟連結編輯器／新增連結
Ctrl + Shift + K移除連結游標位置。
Ctrl + B粗體
Ctrl + I斜體
Ctrl + O切換 <code> 樣式。
Ctrl + Shift + O +

切換原始碼顯示模式。

+ +
在原始碼模式下編輯時請小心，您需要遵守我們的內容標準。更多細節關於如何使用原始碼模式與使用之優缺點請參照原始碼模式編輯教學。
+
Ctrl + P切換 <pre> 樣式在當前區塊中的開啟與關閉。
Ctrl + U底線。
Ctrl + S儲存修改並關閉編輯器。
Ctrl + Shift + S儲存修改但不要關閉編輯器。
Ctrl + 0Remove formatting from the selected area (That's a zero, not the letter "O").
Ctrl + 2 through Ctrl + 6Select heading level 2 through 6. Heading level 1 is reserved for the page title displayed at the top of the article.
Ctrl + Shift + LToggle from bulleted list to numbered list to and paragraph format
TabIncrease indent level if in indent mode, otherwise inserts two spaces as a tab. Inside tables, this moves the cursor to the next cell, or inserts a new row if there is no next cell. If the cursor is currently in the page title or in a heading, the cursor jumps to the next paragraph.
Shift + TabDecrease indent level if in indent mode. Inside tables, this jumps to the previous cell, or inserts a new row if there is no previous cell. If the cursor is currently in the page title or in a heading, the cursor jumps to the next paragraph.
Shift + SpaceInsert a non-breaking space (&nbsp;)
Shift + Enter +

Exits out of the current block. For example, if you're currently editing a <pre> block, Shift + Enter exits the block, putting you back in the body of the article.

+ +
+

Not currently implemented; see {{bug(780055)}}.

+
+
+ +

See also

+ + diff --git "a/files/zh-tw/orphaned/mozilla/firefox/releases/4/firefox_4_\351\226\213\347\231\274\350\200\205\346\226\260\345\212\237\350\203\275\346\246\202\350\246\275/index.html" "b/files/zh-tw/orphaned/mozilla/firefox/releases/4/firefox_4_\351\226\213\347\231\274\350\200\205\346\226\260\345\212\237\350\203\275\346\246\202\350\246\275/index.html" new file mode 100644 index 0000000000..c36dad8487 --- /dev/null +++ "b/files/zh-tw/orphaned/mozilla/firefox/releases/4/firefox_4_\351\226\213\347\231\274\350\200\205\346\226\260\345\212\237\350\203\275\346\246\202\350\246\275/index.html" @@ -0,0 +1,228 @@ +--- +title: Firefox 4 for developers +slug: Mozilla/Firefox/Releases/4/Firefox_4_開發者新功能概覽 +--- +
{{FirefoxSidebar}}

2010 年六月起進入 Beta 測試期的 Firefox 4，增進了效能、加強針對 HTML 5 及其他創新網際科技的支援程度，也更加安全。本文為網頁、附加元件、Gecko 平台開發者們提供這一版的簡要技術相關資訊。

+ +
+

{{ gecko_callout_heading("2") }}

+ +

Gecko 1.9.3 即將更名為 Gecko 2，但許多文件還沒有針對此點更新，在接下來的幾個星期中才會有所更動。

+
+ +

以下大部分的功能都已經可以在 逐日建置版中試用。

+ +
註：本文、以及本文所連結的其他文件仍持續編修中，很多文件的名稱只是暫定、有些主題的文件也可能會拆成幾份子文件以方便閱讀。中文團隊的目標將僅翻譯這份概覽，其他子文件則有待大家的幫忙。
+ +

Features for web developers

+ +

Gecko now uses the HTML5 parser, which fixes bugs, improves interoperability, and improves performance. It also lets content embed SVG and MathML directly in the HTML markup.

+ +

HTML

+ +
+
Introduction to the HTML5 parser
+
A look at what the HTML5 parser means to you, and how to embed SVG and MathML into your content inline.
+
Forms in HTML5
+
A look at improvements to web forms in HTML5.
+
HTML5 Sections
+
Gecko now supports the new HTML5 elements related to sections in a document: {{ HTMLElement("article") }}, {{ HTMLElement("section") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("aside") }}, {{ HTMLElement("hgroup") }}, {{ HTMLElement("header") }} and {{ HTMLElement("footer") }}.
+
Other HTML5 elements
+
Gecko now also supports the following new HTML5 elements: {{ HTMLElement("mark") }}, {{ HTMLElement("figure") }} and  {{ HTMLElement("figcaption") }}.
+
WebSockets
+
A guide to using the new WebSockets API for real-time communication between a web application and a server.
+
+ +

Miscellaneous HTML changes

+ + + +

CSS

+ +
+
CSS transitions
+
New CSS transitions support is available in Firefox 4.
+
Computed values in CSS
+
Support for calc() to compute values in CSS is in progress. See {{ bug(363249) }}.
+
Selector grouping
+
Support for {{ cssxref(":-moz-any") }} to group selectors and factorize combinators.
+
Background image subrectangle support
+
The {{ cssxref("-moz-image-rect") }} property makes it possible to use subrectangles of images as a background image.
+
CSS touch properties
+
Support for touch properties is added. Details, and real article names, to come later.
+
Privacy and the :visited selector
+
Changes have been made to what information can be obtained about the style of visited links using CSS selectors. This may affect some web applications.
+
+ +

Miscellaneous CSS changes

+ + + +

Graphics and video

+ +
+
 
+
WebGL
+
The developing WebGL standard is now supported by Firefox.
+
Optimizing graphics performance
+
Tips and tricks for getting the most out of graphics and video performance in Firefox 4.
+
Support for WebM video
+
The new open WebM video format is supported by Gecko 1.9.3; support is included in nightlies as of 9 June.
+
Full screen API
+
Details coming soon.
+
SMIL animation
+
Support for SMIL animation of SVG is now available. See {{ bug(482402) }}.
+
Using SVG as images and as CSS backgrounds
+
You can now use SVG with the {{ htmlelement("img") }} element, as well as the background image in CSS. See {{ bug(272288) }}, {{ bug(276431) }} and {{ bug(231179) }}.
+
+ +

DOM

+ +
+
Obtaining boundary rectangles for ranges
+
The Range object now has getClientRects() and getBoundingClientRect() methods. See {{ bug(396392) }}.
+
Capturing mouse events on arbitrary elements
+
Support for the Internet Explorer-originated setCapture() and releaseCapture() APIs has been added. See {{ bug(503943) }}.
+
Manipulating the browser history
+
The existing document history object, available through the {{ domxref("window.history") }} object, now supports the new HTML5 pushState() and replaceState() methods.
+
Touch and multi-touch events
+
Support has been added for touch and multi-touch events.
+
IndexedDB
+
The proposed IndexedDB standard, which provides a local database store for web applications, will be supported by Firefox 4.
+
+ +

Miscellaneous DOM changes

+ + + +

Security

+ +
+
Introducing Content Security Policy
+
Content Security Policy (CSP) is a Mozilla proposal designed to help web designers and server administrators specify how content on their web sites interacts. The goal is to help detect and mitigate attacks including cross-site scripting and data injection attacks.
+
ForceTLS
+
Details soon.
+
The Account Manager
+
Details soon.
+
+ +

JavaScript

+ +

For an overview of the changes implemented in JavaScript 1.8.5, see New in JavaScript 1.8.5. JavaScript in Firefox 4 will have additional adherence to the ECMAScript 5 standard.

+ +

Changes for Mozilla and add-on developers

+ +

For helpful tips on updating existing extensions for Firefox 4, see Updating extensions for Firefox 4.

+ +

JavaScript code modules

+ +
+
Services.jsm
+
The Services.jsm code module provides getters that make it easy to obtain references to commonly-used services, such as the preferences service or the window mediator, among others.
+
+ +
+
JS-ctypes API
+
The JS-ctypes API makes it possible to call C-compatible foreign library functions without using XPCOM.
+
Add-ons Manager
+
The new Add-ons Manager provides information about installed add-ons, support for managing them, and provides ways to install and remove add-ons.
+
Loading code modules from chrome: URLs
+
You can now load JavaScript code modules using chrome: URLs, even inside JAR files.
+
+ +

DOM changes

+ +
+
{{ domxref("ChromeWorker") }}
+
A new type of worker for privileged code; this lets you use things like js-ctypes from workers in extensions and application code.
+
+ +

XUL

+ +

tabbrowser (gBrowser) changes

+ +

Several changes were made to the {{ XULElem("tabbrowser") }} element that impact extensions that interact with tabs.

+ + + +

Miscellaneous XUL changes

+ + + +

Storage

+ +

Miscellaneous storage API changes

+ + + +

XPCOM

+ +
+
XPCOM changes in Gecko 1.9.3
+
Details about changes to XPCOM that impact compatibility in Firefox 4.
+
Components.utils.getGlobalForObject()
+
This new method returns the global object with which an object is associated; this replaces a common use case of the now-removed __parent__.
+
+ +

Memory management

+ +
+
Infallible memory allocation
+
Mozilla now provides infallible memory allocators that are guaranteed not to return null. You should read this article to learn how they work and how to explicitly request fallible versus infallible memory allocation.
+
+ +

Other changes

+ +
+
Gopher support removed
+
The Gopher protocol is no longer supported natively. Continued support is available via the OverbiteFF extension.
+
Default plugin removed
+
The default plugin has been removed. The application plugins folder has also been removed by default, however support for installing plugins via this folder still exists. See bug 533891.
+
Extension Manager replaced with AddonManager
+
nsIExtensionManager has been replaced by AddonManager. Since there is apparently no way at present to obtain the install location from a given extension ID, the closest workaround is to use the directory service to find the profile directory and append "extensions" to it (though this approach will not catch extensions outside of the profile directory or those which are aliased to another location).
+
+ +

參考

+ + diff --git a/files/zh-tw/orphaned/web/css/border-image/border-image/index.html b/files/zh-tw/orphaned/web/css/border-image/border-image/index.html new file mode 100644 index 0000000000..210a2663eb --- /dev/null +++ b/files/zh-tw/orphaned/web/css/border-image/border-image/index.html @@ -0,0 +1,111 @@ +--- +title: border-image +slug: Web/CSS/border-image/border-image +tags: + - CSS +--- +

摘要

+ +

CSS 屬性 border-image 可以讓你在元素的邊框上擺上圖片。這讓呈現看似很複雜的一個網頁的小單元簡單很多，它可以省最多九個元素。

+ +
緊告：官方的 CSS3 規範描述的 border-image 屬性在這個功能被凍結並出現在 Gecko 1.9.1 的釋出版之後改變很多。因此，這項功能的語法跟呈現方法很可能在未來 Gecko 的釋出版改變。特別是選擇性的 border-width 參數，它覆蓋既有 border-width 取值的這項特性已經從規範移除了，因此勢必也會在未來的 Gecko 被拿掉。
+ +

瀏覽器會顯示 border-image 指定的圖片而不是 {{ cssxref("border-style") }} 給的邊框樣式，但是若它的取值是 none 或是因某些理由無法顯示該圖片，瀏覽器就會顯示邊框樣式。border-image 會畫一個額外的背景圖片在原來 {{ cssxref("background-image") }} 指 定的背景圖片之上。

+ + + +

語法

+ +
none |
+  [ <圖片> [ <數字> | <百分比> ]{1,4} [/ <邊框寬度>{1,4}]? ] && [ stretch | repeat | round ]{0,2}
+ +

取值

+ +
+
none
+
不顯示圖片，使用邊框樣式。
+
<圖片> （必填）
+
圖片值是一個 {{cssxref("<uri>")}}，例： url(http://example.org/image.png) 。
+
<數> | <百分比> （必填）
+
一個、兩個、三個、四個分別代表從頂邊、右邊、底邊、左邊從圖片外圍到切圖線的距離，將圖片切為九塊：四個角、四個邊跟一個中間部份。
+
+ 一個值的話，該值用於圖片的全部四個邊。
+ 兩個值得話，值用於：一、頂邊與底邊 二、右邊與左邊。
+ 三個值的話，值用於：一、頂邊 二、右邊與左邊 三、底邊。
+ 四個值的情況，四個值分邊用在圖片的頂邊、右邊、底邊、左邊。
+
+ 在 Gecko 1.9.1 (Firefox 3.5) 圖片的中間那個部份會被當做元素的背景。這在未來的版本可能會改變。
+
+ 百分比 由圖片的長度/寬度計算。
+ 數 但表圖片的像素（若為點陣圖）或向量座標（若為 SVG）。
+
<邊框寬度> （選擇性）
+
如果斜線 / 出現在屬性值的話，一個、兩個、三個或是四個在它之後的取值會被當成是 {{ cssxref("border-width") }} 的取值使用。取值的順序如同 {{ cssxref("border-width") }} 。
+
stretch | round | repeat （選擇性）
+
一個或兩個關鍵字，指定邊上的圖片跟中間部份要如何縮放及鋪擺。
+ stretch （預設值）縮放該圖片，使其與配置大小相等。
+ round 鋪擺該圖片，但也縮放它使得被配置範圍鋪滿整數張該圖片。
+ repeat   直接鋪擺該圖片。
+ 第一個關鍵字的對象是頂邊，中間跟底邊的圖片，而第二個關鍵字的對象是左邊跟右邊的邊框。如果第二個不存在，則沿用第一個關鍵字的設定。如果兩者皆不存在，預設值為 stretch。
+
+ +

範例

+ +

[這裡還需要一些活範例]

+ +
#header  { -moz-border-image: url(border.png) 27 27 27 27 round round; }
+
+.button  { -moz-border-image: url(button.png) 0 5 0 5; }
+
+.example { -moz-border-image: url(example.jpg) 3 4 6 8 / 10px 12px 14px 22px; }
+
+ +
/* 鮮見例，在 Firefox 3.5 下看起來像是完全伸展的 background-image */
+
+ div     { -moz-border-image: url(bgimage.png) 0; }
+
+ +

瀏覽器兼容性

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
瀏覽器最小版本支援
Internet Explorer------
Firefox (Gecko)3.5 (1.9.1)-moz-border-image
Opera10.5border-image
Safari (WebKit)3.0 (522)-webkit-border-image
+ +

規範

+ + + +

{{ languages( { "en": "en/CSS/-moz-border-image"} ) }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/javascript_\346\246\202\350\246\201/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/javascript_\346\246\202\350\246\201/index.html" new file mode 100644 index 0000000000..9c74f992c9 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/javascript_\346\246\202\350\246\201/index.html" @@ -0,0 +1,43 @@ +--- +title: JavaScript 概要 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要 +--- +

 

+

什麼是 JavaScript？

+

JavaScript 是跨平台、物件導向的 Script 語言。JavaScript 是小巧、輕量的語言，以單獨的語言來看 JavaScript 並不是很有用，不過 JavaScript 被設計成易於嵌入至其他產品和應用程式（如 Web 瀏覽器）。在宿主環境裡，JavaScript 可連接至由環境提供的可操控的物件。

+

核心 JavaScript 包含 Array、Date、Math 等等的物件核心組件，以及運算子、控制結構、語法等等的語言元素的核心組件。核心 JavaScript 可藉由追加額外的物件而為各種用途來做擴充，例如︰

+ +

藉由 JavaScript 的 LiveConnect 的機能，還可讓 Java 和 JavaScript 的代碼互相通訊。你可以從 JavaScript 生成 Java 物件，並存取他們的公開方法和欄位。也可以從 Java 存取 JavaScript 的物件、屬性、方法。

+

Netscape 發明 JavaScript，且 JavaScript 是初次用於 Netscape 瀏覽器。

+

JavaScript 和 Java

+

JavaScript 和 Java 在某些方面類似，但在很多方面完全不同。JavaScript 語言很像 Java，但沒有 Java 的靜態類型和強固的類型檢查。JavaScript 支援 Java 的表達結構和基本的流程控制結構。

+

相對於 Java 藉由宣告來建構類別的編譯時期系統，JavaScript 支援的執行時期系統，是建立在表示為數值、布林、字串值的少數幾個資料類型。JavaScript 使用以原型為基礎的物件模型，以代替更常見的以類別為基礎的物件模型。以原型為基礎的模型可提供動態繼承，也就是可對個別的物件變更繼承。JavaScript 亦支援無須特別宣告的函數。函數可以是物件的屬性，以寬鬆的類型執行方法。

+

JavaScript 與 Java 相比，是一種在形式上要自由很多的語言。你不必宣告所有的變數、類別或方法。你不必關心方法是不是公開、私有或保護，你也不必實作界面。變數、參數和函數返回的類型都不是明確的類型。

+

Java 是為了快速執行和類型的安全性而設計的一種以類別為基礎的程式語言。類型的安全性的意義，舉例來說，你不能把 Java 的整數類型強制轉換為物件類型，或有意的誤用 Java 的位元碼來存取私有記憶體。Java 的以類別為基礎的模型的意義是程式完全以類別及其方法所組成。Java 的類別階層和強固的類型通常需要緊密結合的物件階層。這些要求使 Java 的程式設計比 JavaScript 編寫要複雜的多。

+

相較之下，JavaScript 繼承了像 HyperTalk、dBASE 那樣的小型動態類型語言的精髓。這些 Script 語言提供工具給更廣大的使用者，因為他們的語法簡單、特殊的內建函數、對物件的建立的要求較少。

+ +
JavaScript Java
物件導向。物件的類型之間沒有區別。繼承是透過原型機制達成，屬性和方法可動態的加入至任何物件。 以類別為基礎。物件可細分為類別和實體，所有的繼承是透過類別階層達成。類別和實體不可動態的加入屬性或方法。
不必宣告變數的資料類型（動態類型）。 必須宣告變數的資料類型（靜態類型）。
不可自動的寫入硬碟。 不可自動的寫入硬碟。
+

表 1.1: JavaScript 和 Java 的比較
+
+JavaScript 和 Java 之間的不同的更進一步資訊，參閱 物件模型的細節 章節。

+

JavaScript 和 ECMAScript 規範

+

Netscape 發明 JavaScript，且 JavaScript 最先使用於 Netscape 瀏覽器。然而，Netscape 與 Ecma International - 把資訊和通訊系統標準化的歐洲協會（以前稱為 ECMA - European Computer Manufacturers Association；歐洲電腦製造商協會）合作發表一份以核心 JavaScript 為基礎的國際程式語言的標準化。JavaScript 的標準化版本，稱為ECMAScript，使所有支援標準的應用程式都能有同樣的行為。企業可以使用這份開放的語言標準開發他們的 JavaScript 實作產品。ECMAScript 標準的文件在 ECMA-262 規範中。

+

ECMA-262 標準也受到 ISO（International Organization for Standardization；國際標準化組織）認可成為 ISO-16262。你可以在 Mozilla 網站上找到 ECMA-262 的 PDF 版本。你也可以在 Ecma International 網站 上找到這份標準。ECMAScript 標準並未提到 Document Object Model (DOM)，DOM 是由 World Wide Web Consortium (W3C) 所標準化。DOM 定義了在 Script 中處理 HTML 文件裡的物件的方法。

+

JavaScript 版本和 ECMAScript 修定版之間的關係

+

Netscape 與 Ecma International 緊密合作產生 ECMAScript 規範 (ECMA-262)。下表說明了 JavaScript 版本和 ECMAScript 版本間的關係。

+ +
JavaScript 的版本 與 ECMAScript 修定版之間的關係
JavaScript 1.1 ECMA-262 第一版是以 JavaScript 1.1 為基礎。
JavaScript 1.2 在 JavaScript 1.2 釋出時，ECMA-262 尚未完成。JavaScript 1.2 因為以下原因而不完全相容於 ECMA-262 第一版︰
  • Netscape 在 JavaScript 1.2 中開發了未考慮到 ECMA-262 的額外機能。
  • ECMA-262 加入兩個新的機能︰使用 Unicode 來國際化，統一所有平台的行為。JavaScript 1.2 的若干機能，如 Date 物件，依賴於平台，且使用平台規範的行為。

JavaScript 1.3

JavaScript 1.3 完全相容於 ECMA-262 第一版。

JavaScript 1.3 解決了 JavaScript 1.2 和 ECMA-262 的不一致，除了 == 和 != 以外，保留 JavaScript 1.2 所有的額外機能，以符合 ECMA-262。

JavaScript 1.4

JavaScript 1.4 完全相容於 ECMA-262 第一版。

在 JavaScript 1.4 釋出時，ECMAScript 規範的第三版仍尚未完成。
JavaScript 1.5 JavaScript 1.5 完全相容於 ECMA-262 第三版。
+

表 1.2: JavaScript 版本和 ECMAScript 版本

+
附註: ECMA-262 第二版由次要的編修和對第一版規範的錯誤修正所組成。Ecma International 的 TC39 工作群組目前正工作於 ECMAScript 第四版，第四版將會對應下一個  JavaScript 的釋出版 JavaScript 2.0。
+

Core JavaScript 參考 指出哪些語言機能對應於 ECMAScript。

+

JavaScript 將會不斷包含尚未成為 ECMAScript 規範的新機能；JavaScript 在提供額外機能時仍會相容於 ECMAScript。

JavaScript 文件與 ECMAScript 規範

+

ECMAScript 規範是實作 ECMAScript 的必要條件的匯整；如果你想知道 JavaScript 機能 ECMAScript 規範是否支援，規範就會很有用。如果你有意只使用 ECMAScript 支援的機能來編寫 JavaScript 代碼，你會需要檢閱 ECMAScript 規範。

+

ECMAScript 文件不是為了幫助 Script 程式員；應該使用 JavaScript 文件取得有關編寫 Script 的資訊。

+

JavaScript 和 ECMAScript 術語

+

ECMAScript 規範使用的術語和語法對 JavaScript 程式員來說可能會很陌生。儘管在 ECMAScript 裡的語言說明有所不同，語言本身仍然是一樣的。JavaScript 支援所有在 ECMAScript 規範中描述的機能。

+

JavaScript 的文件為 JavaScript 程式員適當的描述語言的表面。例如︰

+ +

{{ PreviousNext("Core_JavaScript_1.5_教學:關於", "Core_JavaScript_1.5_教學:值") }}

+

 

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/JavaScript_Overview", "es": "es/Gu\u00eda_JavaScript_1.5/Concepto_de_JavaScript", "fr": "fr/Guide_JavaScript_1.5/Aper\u00e7u_de_JavaScript", "ja": "ja/Core_JavaScript_1.5_Guide/JavaScript_Overview", "ko": "ko/Core_JavaScript_1.5_Guide/JavaScript_Overview", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Przegl\u0105d_JavaScriptu", "zh-cn": "cn/Core_JavaScript_1.5_Guide/JavaScript\u603b\u89c8" } ) }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/liveconnect_\346\246\202\350\246\201/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/liveconnect_\346\246\202\350\246\201/index.html" new file mode 100644 index 0000000000..985cfe5989 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/liveconnect_\346\246\202\350\246\201/index.html" @@ -0,0 +1,11 @@ +--- +title: LiveConnect 概要 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要 +--- +

 

+

LiveConnect 概要

+

LiveConnect 是應用程式介面的名稱，可提供 JavaScript 呼叫 Java 類別的方法的能力，反之亦然，也可以使用 Java 既有的基礎反向運用。

+
包裝器的運用
JavaScript 向 Java 的通訊
Packages 物件
Java 陣列的運用
包裝和類別的參考
char 類型的參數
在 JavaScript 中處理 Java 的例外
Java 向 JavaScript 的通訊
LiveConnect 類別的使用
資料類型的轉換
從 JavaScript 到 Java 的轉換
從 Java 到 JavaScript 的轉換
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:再談屬性的繼承:沒有多重繼承", "Core_JavaScript_1.5_教學:LiveConnect_概要:包裝器的運用") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/LiveConnect_Overview", "es": "es/Gu\u00eda_JavaScript_1.5/Concepto_general_de_LiveConnect", "ja": "ja/Core_JavaScript_1.5_Guide/LiveConnect_Overview", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Podgl\u0105d_klas_LiveConnect" } ) }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/index.html" new file mode 100644 index 0000000000..9f369cbcac --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/index.html" @@ -0,0 +1,39 @@ +--- +title: 例外處理語法 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法 +--- +

例外處理語法

+

你可以使用 throw 語法來拋出例外，並使用 try...catch 語法來處理例外。

+

你也可以使用 try...catch 語法來處理 Java 的例外。參閱 在 JavaScript 中處理 Java 的例外 和 從 JavaScript 向 Java 的通訊 取得資訊。

+ +

例外的類型

+

在此列出 JavaScript 中所有可以拋出的物件。不過並非所有的可拋出物件都以同樣方式產生。雖然只是非常普通的拋出數字或字串來表示錯誤，只使用其中幾個特別為某些用途而產生的例外的類型，往往會更加有效率︰

+ +
+

{{ PreviousNext("Core_JavaScript_1.5_教學:註解", "Core_JavaScript_1.5_教學:例外處理語法:throw_語法") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/throw_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/throw_\350\252\236\346\263\225/index.html" new file mode 100644 index 0000000000..83230830e6 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/throw_\350\252\236\346\263\225/index.html" @@ -0,0 +1,34 @@ +--- +title: throw 語法 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法 +--- +

throw 語法

+

使用 throw 語法來拋出例外。當你準備要拋出例外時，指定內含想要拋出的值的表達式︰

+
throw expression;
+
+

你可以拋出任何的表達式，而不只是特定類型的表達式。以下代碼拋出各式各樣的例外︰

+
throw "Error2";
+throw 42;
+throw true;
+throw {toString: function() { return "I'm an object!"; } };
+
+
+ 附註: 當拋出例外時，還可以指定物件。然後可以在 catch 區塊裡參考物件的屬性。以下範例建立 UserException 類型的物件 myUserException，並使用在拋出語法之中。
+
// 建立類型為 UserException 的物件
+function UserException (message)
+{
+  this.message=message;
+  this.name="UserException";
+}
+
+// 當用來當作字串時（例如，用於錯誤控制台），
+// 就把例外轉換成適當的字串。
+UserException.prototype.toString = function ()
+{
+  return this.name + ': "' + this.message + '"';
+}
+
+// 建立那一種物件類型的實體，並拋出
+throw new UserException("Value too high");
+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/try...catch_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/try...catch_\350\252\236\346\263\225/index.html" new file mode 100644 index 0000000000..2bc150c6fc --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/try...catch_\350\252\236\346\263\225/index.html" @@ -0,0 +1,162 @@ +--- +title: try...catch 語法 +slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法 +--- +

try...catch 語法

+ +

try...catch 語法標記出一整塊需要測試的語句，並指定一個以上的回應方法，萬一有例外拋出時，try...catch 語句就會捕捉。

+ +

try...catch 語法由 try 區塊所組成，其中內含一個以上的語句，和零個以上的 catch 區塊，其中內含語句用來指明當例外在 try 區塊裡拋出時要做些什麼。也就是當你希望 try 區塊成功，但如果他不成功時，你會想要把控制權移交給 catch 區塊。如果任何在 try 區塊內部裡的語句（或者在 try 區塊內部呼叫的函數裡）拋出例外，控制權將立即轉移給 catch 區塊。如果沒有例外從 try 區塊裡拋出，就會跳過 catch 區塊。finally 區塊會在 try 或 catch 區塊執行之後才執行，但會在 try...catch 語法後面的語句之前執行。

+ +

以下範例使用 try...catch 語法。本範例呼叫函數，這個函數是用來在陣列裡根據傳給函數的值來查詢月份的名稱。如果傳入的值不符合月份的數字 (1-12)，就會拋出值為 InvalidMonthNo 的例外，而且在 catch 區塊裡的語句會把 monthName 變數設定為 unknown。

+ +
function getMonthName (mo) {
+    mo=mo-1; // 針對陣列索引調整月份的數字 (1=Jan, 12=Dec)
+    var months=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul",
+          "Aug","Sep","Oct","Nov","Dec");
+    if (months[mo] != null) {
+       return months[mo]
+    } else {
+       throw "InvalidMonthNo"
+    }
+}
+
+try {
+// 需要測試的語句
+    monthName=getMonthName(myMonth) // 可拋出例外的函數
+}
+catch (e) {
+    monthName="unknown"
+    logMyErrors(e) // 把例外物件傳給錯誤處理器
+}
+
+ +

catch 區塊

+ +

你可以使用單一的 catch 區塊來處理所有在 try 區塊裡可能會產生的例外，或者你也可以使用分離的 catch 區塊，每一個皆各自處理特定的例外類型。

+ +

單一 catch 區塊
+ 使用單一 try...catch 語法的 catch 區塊針對在 try 區塊裡拋出的所有例外來執行錯誤處理的代碼。

+ +

單一的 catch 區塊語句如下︰

+ +
catch (catchID) {
+  statements
+}
+
+ +

catch 區塊所指定的識別子（前面語句裡的 catchID）持有由 throw 語法所指定的值。你可以使用這個識別子來取得有關於被拋出的例外的資訊。當進入 catch 區塊時，JavaScript 就會建立這個識別子。識別子只能在 catch 區塊的期間內持續作用。catch 區塊執行結束以後，識別子就不再能使用。

+ +

舉例來說，以下代碼會拋出例外。當例外出現的時候，控制權就轉移給 catch 區塊。

+ +
try {
+   throw "myException" // 產生例外
+}
+catch (e) {
+// 用來處理任何例外的語句
+   logMyErrors(e) // 把例外物件傳給錯誤處理器
+}
+
+ +

多重 catch 區塊
+ 單一的 try 語句可以對應複數個有前提條件的 catch 區塊，每一個皆可處理特定的例外的類型。於是，當指定的的例外被拋出時，就只會進入適當條件的 catch 區塊。你也可以針對所有未指定的例外，使用選用性的對應所有例外的 catch 區塊來作為語法裡最後一個的 catch 區塊。

+ +

舉例來說，以下函數呼叫三個其他的函數（已在別處定義了）來檢驗自己的參數。如果檢驗函數判斷出他所要檢驗的元素是無效的話，他就返回 0，導致呼叫者拋出對應的例外。

+ +
function getCustInfo(name, id, email)
+{
+   var n, i, e;
+
+   if (!validate_name(name))
+       throw "InvalidNameException"
+   else
+       n = name;
+       if (!validate_id(id))
+          throw "InvalidIdException"
+       else
+          i = id;
+       if (!validate_email(email))
+          throw "InvalidEmailException"
+       else
+          e = email;
+       cust = (n + " " + i + " " + e);
+       return (cust);
+}
+
+ +

有各種條件的 catch 區塊會把控制權安排給適當的例外處理器。

+ +
try {
+// 可以拋出三個例外的函數
+   getCustInfo("Lee", 1234, "lee@netscape.com")
+}
+
+catch (e if e == "InvalidNameException") {
+// 針對無效的名稱呼叫處理器
+   bad_name_handler(e)
+}
+
+catch (e if e == "InvalidIdException") {
+// 針對無效的 ID 呼叫處理器
+   bad_id_handler(e)
+}
+
+catch (e if e == "InvalidEmailException") {
+// 針對無效的電子郵件位址呼叫處理器
+   bad_email_handler(e)
+}
+
+catch (e){
+// 不知道該做什麼，就記在日誌裡
+   logError(e)
+}
+
+ +

finally 區塊

+ +

finally 區塊內含的語句，會在 try 和 catch 區塊執行以後、並在 try...catch 語法後面的語句之前來執行。無論有沒有被拋出的例外，finally 區塊都會執行。如果有被拋出的例外，即使沒有 catch 區塊來處理這些例外，還是會執行 finally 區塊裡的語句。

+ +

當出現例外時，你可以使用 finally 區塊來使你的 Script 優美的停止。舉例來說，你可能需要釋放 Script 所佔用的資源。以下範例開啟了檔案，並執行使用這個檔案（伺服端的 JavaScript 可讓你存取檔案）的語句。如果在開啟檔案時有例外被拋出，finally 區塊會在 Script 停止之前把檔案關閉。

+ +
openMyFile();
+try {
+   writeMyFile(theData); // 這裡有可能拋出錯誤
+}catch(e){
+   handleError(e); // 如果我們得到錯誤，就處理他
+}finally {
+   closeMyFile(); // 永遠會關閉這項資源
+}
+
+ +

try...catch 語法的嵌套

+ +

你可以嵌套一個以上的 try...catch 語法。如果有一個內部的 try...catch 語法沒有 catch 區塊，圍住這些 try...catch 語法的 catch 區塊就會被用來比對。

+ +

Error 物件的用處

+ +

根據錯誤的類型，你有可能使用 “name” 和 “message” 屬性來取得更多明確的訊息。“name” 提供錯誤的一般類別（例如，“DOMException” 或 “Error”），“message” 通常提供更為簡練的訊息，如此就能把錯誤物件轉換為字串來取得訊息。

+ +

如果你要拋出你自己的例外，以從這些屬性取得好處（例如，如果你的 catch 區塊不區分你自己的例外和系統的例外的話），你可以使用錯誤建構子。例如︰

+ +
function doSomethingErrorProne () {
+   if (ourCodeMakesAMistake()) {
+      throw (new Error('The message'));
+   }
+   else {
+      doSomethingToGetAJavascriptError();
+   }
+}
+....
+try {
+   doSomethingErrorProne();
+}
+catch (e) {
+   alert(e.name);// 警報 'Error'
+   alert(e.message); // 警報 'The message' 或 JavaScript 錯誤訊息
+}
+
+ +
+

{{ PreviousNext("Core_JavaScript_1.5_教學:例外處理語法:throw_語法", "Core_JavaScript_1.5_教學:函數的定義") }}

+
diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\256\232\347\276\251/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\256\232\347\276\251/index.html" new file mode 100644 index 0000000000..f56f796a03 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\256\232\347\276\251/index.html" @@ -0,0 +1,42 @@ +--- +title: 函數的定義 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義 +--- +

函數的定義

函數的定義由以下的關鍵字所組成︰

簡單的範例

舉例來說，以下代碼定義了一個簡單的函數，名為 square︰

function square(number) {
+  return number * number;
+}
+

函數 square 接收一個參數，稱為 number。函數由一個語句所組成，指示要求返回函數的參數的平方。return 語句用來指定函數返回的值。

return number * number
+

原始的參數是以值傳遞給函數。值是傳遞給函數，但是如果函數修改了參數的值，這項改變不會影響到全域或呼叫端函數裡的值。

如果你以物件（例如，非原始值，如陣列或使用者定義的物件）作為參數來傳遞，物件的參考會被傳遞給函數。這意味著如果函數修改了物件的屬性，函數之外也看得見這項改變，如以下範例所示︰

function myFunc(theObject) {
+  theObject.make="Toyota";
+}
+var mycar = {make:"Honda", model:"Accord", year:1998};
+var x=mycar.make;     // 返回 Honda
+myFunc(mycar);
+var y=mycar.make;     // 返回 Toyota（屬性已被函數修改）
+

注意，把新的物件代入給參數，在呼叫端將不會有任何的影響︰

function myFunc(theObject) {
+  theObject = {make:"Ford", model:"Focus", year:2006};
+}
+var mycar = {make:"Honda", model:"Accord", year:1998};
+var x=mycar.make;     // 返回 Honda
+myFunc(mycar);
+var y=mycar.make;     // 仍然返回 Honda
+

有條件的函數的定義

函數可以根據條件來作定義。例如，給以下的函數定義︰

if (num == 0)
+{
+  function myFunc(theObject) {
+    theObject.make="Toyota"
+  }
+}
+

myFunc 函數只會在變數 num 等於 0 時被定義。如果 num 不等於 0，函數就不會被定義，且任何企圖執行這個函數的嘗試都將會失敗。

函數的表達式

函數也可以在表達式裡來作定義。這稱為函數表達式。一般這類函數都是無名的，他沒有名稱也沒關係。例如，函數 square 可以定義成︰

var square = function(number) {return number * number};
+

當要傳遞函數作為參數給另一個函數時，這個作法會很方便。以下範例示範了 map 函數的定義，然後呼叫端使用無名函數作為第一個參數︰

function map(f,a) {
+  var result=new Array;
+  for (var i = 0; i != a.length; i++)
+    result[i] = f(a[i]);
+  return result;
+}
+

接著呼叫

map(function(x) {return x * x * x}, [0, 1, 2, 5, 10]);
+

返回 {{ mediawiki.external('0, 1, 8, 125, 1000') }}。

+
+

參閱

+

除了如前所述定義函數以外，你也可以定義 函數物件。

+

方法就是和物件相關聯的函數。你將會在 第 8 章，「物件的運用」 中學到更多有關於物件和方法。{{ PreviousNext("Core_JavaScript_1.5_教學:例外處理語法:try...catch_語法", "Core_JavaScript_1.5_教學:函數的呼叫") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Defining_Functions", "fr": "fr/Guide_JavaScript_1.5/D\u00e9finition_de_fonctions", "ja": "ja/Core_JavaScript_1.5_Guide/Defining_Functions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Definiowanie_funkcji" } ) }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\273\272\347\253\213\346\226\260\347\232\204\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\273\272\347\253\213\346\226\260\347\232\204\347\211\251\344\273\266/index.html" new file mode 100644 index 0000000000..faadc10f07 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\273\272\347\253\213\346\226\260\347\232\204\347\211\251\344\273\266/index.html" @@ -0,0 +1,9 @@ +--- +title: 建立新的物件 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件 +--- +

 

+ +

This page was auto-generated because a user created a sub-page to this page.

+ +

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/break_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/break_\350\252\236\346\263\225/index.html" new file mode 100644 index 0000000000..ea6551a851 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/break_\350\252\236\346\263\225/index.html" @@ -0,0 +1,27 @@ +--- +title: break 語法 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法 +--- +

break 語法

+

使用 break 語法可以終止 loop、switch、label 語法。

+ +

break 語法如下︰

+
    +
  1. break;
    2. +
  2. break label;
    3. +
+

第一個語句形式會終止最內層的循環或 switch，第二個語句形式會終止指定標籤的語句。

+

範例
+ 在以下的範例中，反覆操作陣列裡的元素，直到找到某個索引的元素的值等於 theValue︰

+
for (i = 0; i < a.length; i++) {
+   if (a[i] == theValue)
+      break;
+}
+
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:循環語法:label_語法", "Core_JavaScript_1.5_教學:循環語法:continue_語法") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/continue_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/continue_\350\252\236\346\263\225/index.html" new file mode 100644 index 0000000000..68f757d572 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/continue_\350\252\236\346\263\225/index.html" @@ -0,0 +1,49 @@ +--- +title: continue 語法 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法 +--- +

continue 語法

+

continue 語法可用來重新開始 while、do-while、for、label 語法。

+ +

continue 語法如下︰

+
    +
  1. continue
    2. +
  2. continue label
    3. +
+

範例 1
+ 以下範例示範加上 continue 語法的 while 循環，continue 語法會在 i 值為 3 時執行。因此，n 的值依序為 1、3、7、12。

+
i = 0;
+n = 0;
+while (i < 5) {
+   i++;
+   if (i == 3)
+      continue;
+   n += i;
+}
+
+

範例 2
+ 已加上標籤的語法 checkiandj 內含已加上標籤的語法 checkj。如果遇到 continue，程式會終止 checkj 這一次的反覆過程，並開始下一次的反覆過程。每當遇到 continue，就會反覆執行 checkj 直到他的條件返回 false 為止。當返回 false 時，checkiandj 語句完成了餘數的計算，且 checkiandj 會反覆執行，直到他的條件返回為 false 為止。當返回 false 時，程式繼續執行 checkiandj 後面的語句。

+

如果 continue 有一個 checkiandj 標籤，程式就會從 checkiandj 語句的開始處繼續執行。

+
checkiandj :
+   while (i < 4) {
+      document.write(i + "<br/>");
+      i += 1;
+      checkj :
+         while (j > 4) {
+            document.write(j + "<br/>");
+            j -= 1;
+            if ((j % 2) == 0)
+               continue checkj;
+            document.write(j + " is odd.<br/>");
+         }
+      document.write("i = " + i + "<br/>");
+      document.write("j = " + j + "<br/>");
+   }
+
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:循環語法:break_語法", "Core_JavaScript_1.5_教學:物件的操作語法") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/do...while_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/do...while_\350\252\236\346\263\225/index.html" new file mode 100644 index 0000000000..5091d476fd --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/do...while_\350\252\236\346\263\225/index.html" @@ -0,0 +1,22 @@ +--- +title: do...while 語法 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法 +--- +

do...while 語法

+

do...while 語法會反覆執行直到指定條件的求值結果為 false 為止。do...while 語法如下︰

+
do
+   statement
+while (condition);
+
+

statement 會在檢測條件之前就先執行一次。若要執行多個語句，就使用區塊語法（{ ... }）把語句群組化。如果 condition 為 true，就會再執行一次語句。每回執行以後，就會檢測條件。當條件為 false 時，就停止執行並把控制權轉移給 do...while 後面的語句。

+

範例
+ 在以下範例中，do 循環至少會反覆執行一次，並一直反覆到 i 不再小於 5 為止。

+
do {
+   i += 1;
+   document.write(i);
+} while (i < 5);
+
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:循環語法:for_語法", "Core_JavaScript_1.5_教學:循環語法:while_語法") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/for_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/for_\350\252\236\346\263\225/index.html" new file mode 100644 index 0000000000..8978b7ed27 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/for_\350\252\236\346\263\225/index.html" @@ -0,0 +1,53 @@ +--- +title: for 語法 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法 +--- +

for 語法

+

for 循環反覆執行直到指定的條件的求值為 false 為止。JavaScript 的 for 循環和 Java 和 C 的 for 循環很類似。for 語法如下︰

+
for ([initialExpression]; [condition]; [incrementExpression])
+   statement
+
+

執行 for 循環時，會執行以下步驟︰

+
    +
  1. 執行初始化表達式 initialExpression。這個表達式通常會初始化為 1 以上的計數器，不過也可以是任意複雜程度的表達式。也可以在表達式裡宣告變數。
    2. +
  2. 對 condition 表達式求值。如果 condition 的值為 true，就會執行循環語法。如果 condition 的值為 false，就終止 for 循環。如果完全省略 condition 表達式，條件就會被代入為 true。
    3. +
  3. 執行 statement。若要執行多個語句，就使用區塊語法（{ ... }）把這些語句群組化。
    4. +
  4. 執行更新表達式 incrementExpression，並回到第 2 步驟。
    5. +
+

範例
+ 以下函數內含 for 語法，計數至下拉式選單的已選擇選項的數目為止（Select 物件允許複選）。for 語法宣告變數 i 並以 0 初始化。他會檢驗 i 是否小於 Select 物件的選項數目，持續執行 if 語句，並在每一次循環之後以 1 遞增 i。

+
<script type="text/javascript">//<![CDATA[
+
+function howMany(selectObject) {
+   var numberSelected = 0;
+   for (var i = 0; i < selectObject.options.length; i++) {
+      if (selectObject.options[i].selected)
+         numberSelected++;
+   }
+   return numberSelected;
+}
+
+//]]></script>
+<form name="selectForm">
+   <p>
+      <strong>Choose some music types, then click the button below:</strong>
+      <br/>
+      <select name="musicTypes" multiple="multiple">
+         <option selected="selected">R&B</option>
+         <option>Jazz</option>
+         <option>Blues</option>
+         <option>New Age</option>
+         <option>Classical</option>
+         <option>Opera</option>
+      </select>
+   </p>
+   <p>
+      <input type="button" value="How many are selected?"
+         onclick="alert ('Number of options selected: ' + howMany(document.selectForm.musicTypes))"/>
+   </p>
+</form>
+
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:循環語法", "Core_JavaScript_1.5_教學:循環語法:do...while_語法") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/label_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/label_\350\252\236\346\263\225/index.html" new file mode 100644 index 0000000000..8b63254ac1 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/label_\350\252\236\346\263\225/index.html" @@ -0,0 +1,22 @@ +--- +title: label 語法 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法 +--- +

label 語法

+

label 提供識別子作為語法，可讓你的程式的任何一處都能參考得到。舉例來說，你可以使用標籤來標識循環，然後使用 break 或 continue 語法來指示程式是否要中斷循環或繼續執行。

+

label 語法如下︰

+
label :
+   statement
+
+

label 的值可以是任意的 JavaScript 識別子，只要不是保留字的話都可以使用。使用標籤來標識的 statement 可以是任意的語句。

+

範例
+ 在以下範例中，標籤 markLoop 標識了 while 循環。

+
markLoop:
+while (theMark == true)
+   doSomething();
+}
+
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:循環語法:while_語法", "Core_JavaScript_1.5_教學:循環語法:break_語法") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/while_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/while_\350\252\236\346\263\225/index.html" new file mode 100644 index 0000000000..76beeaafeb --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/while_\350\252\236\346\263\225/index.html" @@ -0,0 +1,38 @@ +--- +title: while 語法 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法 +--- +

while 語法

+

while 語法會執行他的語句，只要指定的條件的求值結果為 true。while 語法如下︰

+
while (condition)
+   statement
+
+

如果條件變成 false，就停止執行循環內部的 statement，並把控制權移交給循環後面的語句。

+

條件的測試會發生在執行循環裡的 statement 之前。如果返回的條件為 true，就會執行 statement，並再次測試條件。如果返回的條件為 false，就停止執行並把控制權移交給 while 後面的語句。

+

若要執行多個語句，就使用區塊語法（{ ... }）把這些語句群組化。

+

範例 1
+ 以下 while 循環會一直反覆直到 n 小於 3 為止︰

+
n = 0;
+x = 0;
+while (n < 3) {
+   n++;
+   x += n;
+}
+
+

每一次的反覆，循環便會遞增 n 並且把 n 的值代入給 x。因此，x 和 n 持有下列的值︰

+ +

第三次的循環完成以後，條件 n < 3 不再為 true，所以終止循環。

+

範例 2
+ 應避免無限循環。確認循環裡的條件最終一定會變成 false。否則循環永遠不會終止。下面的 while 循環裡的語句將會永遠執行下去，因為條件永遠不會變成 false︰

+
while (true) {
+   alert("Hello, world");
+}
+
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:循環語法:do...while_語法", "Core_JavaScript_1.5_教學:循環語法:label_語法") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/getter_\345\222\214_setter_\347\232\204\345\256\232\347\276\251/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/getter_\345\222\214_setter_\347\232\204\345\256\232\347\276\251/index.html" new file mode 100644 index 0000000000..222529aa18 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/getter_\345\222\214_setter_\347\232\204\345\256\232\347\276\251/index.html" @@ -0,0 +1,110 @@ +--- +title: Getter 和 Setter 的定義 +slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義 +--- +

 

+ +

Getter 和 Setter 的定義

+ +

Getter 是用來取得指定屬性的值的方法。Setter 是用來設定指定屬性的值的方法。你可以在所有預先定義的核心物件或使用者定義的物件（這類可支援新屬性的附加）中定義 Getter 和 Setter。為了定義 Getter 和 Setter，需要使用物件的字面表達語法。

+ +

自 JavaScript 1.8.1 起，在設定物件和陣列裡的初始化子的屬性時，不再可以呼叫 Setter。

+ +

以下的 JS shell 會話說明了 Getter 和 Setter 是如何在使用者定義的物件 o 裡運作的。JS shell 是一種應用程式，可讓開發者在分批模式或互動性的測試 JavaScript 代碼。

+ +
js> var o = {a:7, get b() {return this.a+1;}, set c(x) {this.a = x/2}};
+[object Object]
+js> o.a;
+7
+js> o.b;
+8
+js> o.c = 50;
+js> o.a;
+25
+
+ +

o 物件的屬性為︰

+ + + +

另一種（Mozilla 限定）表示成一行的方式，也支援在物件的屬性上（如 "foo-bar"）設定 Getter 和 Setter，其中物件需要加上引號。

+ +
var o = {a:7, 'b' getter:function () {return this.a + 1;}, c setter:function (x) {this.a = x / 2;}};
+ +

請注意定義在物件的字面表達中的 Getter 和 Setter 的函數名稱使用的〝[gs]et property()〞（有別於稍後介紹的 __define[GS]etter__）並不是 Getter 本身的名稱，即使 [gs]et propertyName(){ } 語法可能會使你把他誤解成別的事物。若要命名在 Getter 或 Setter 之中的函數的名稱，就使用〝[gs]et property()〞語法，把 Getter 的名稱放在 get 或 set 後面，然後在其後面放上函數的名稱。下面的範例示範如何在物件的字面表達中命名 Getter 函數︰

+ +
var objects = [{get a b(){return 1}},
+               {a getter:function b(){return 1}},
+               {"a" getter:function b(){return 1}}];
+
+for (var i=0; i<objects.length; ++i)
+    print(objects[i].__lookupGetter__("a")) // 為每一個 Getter 輸出 "function b(){return 1}"。
+
+ +

這次 JavaScript shell 會話說明 Getter 和 Setter 如何擴充 Date 的原型，給所有預先定義的 Date 類別的實體加入 year 屬性。他使用了 Date 類別中既存的 getFullYear 以及 setFullYear 方法，以支援 year 屬性的 Getter 和 Setter。

+ +

以下語句針對 year 屬性定義 Getter 和 Setter︰

+ +
js> var d = Date.prototype;
+js> d.__defineGetter__("year", function() { return this.getFullYear(); });
+js> d.__defineSetter__("year", function(y) { this.setFullYear(y); });
+
+ +

以下語句在 Date 物件中使用 Getter 和 Setter︰

+ +
js> var now = new Date;
+js> print(now.year);
+2000
+js> now.year = 2001;
+987617605170
+js> print(now);
+Wed Apr 18 11:13:25 GMT-0700 (Pacific Daylight Time) 2001
+
+ +
在 JavaScript 1.5 的開發期間，這些是內含用來在既存的物件上定義新的 Getter 或 Setter 的 getter = 或 setter = 表達式的摘要，這些語法現在已被廢棄，將會在目前的 JS 1.5 引擎中引發警告，在未來的版本中將會變成語法錯誤。這些都應該要避免。
+ +

概要

+ +

原則上，Getter 和 Setter 可以

+ + + +

當要使用 物件的初始化子 定義 Getter 和 Setter 的時候，你所需要做的是在 Getter 方法的前面加上 get 以及在 Setter 方法的前面加上 set。當然，Getter 方法不可以接受參數，Setter 方法則只能有一個參數（用來設定的新值）。舉例如下︰

+ +
o = {
+  a:7,
+  get b() { return this.a+1; },
+  set c(x) { this.a = x/2; }
+};
+
+ +

也可以在物件建立之後的任何時間點上，使用兩個稱作 __defineGetter__ 和 __defineSetter__ 的特殊方法，把 Getter 和 Setter 加到物件裡。這兩個方法需要 Getter 或 Setter 的名稱以字串的形式作為第一個參數。第二個參數是用來呼叫的函數作為 Getter 或 Setter。舉例如下（延用之前的例子）：

+ +
o.__defineGetter__("b", function() { return this.a+1; });
+o.__defineSetter__("c", function(x) { this.a = x/2; });
+
+ +

這兩種形式的選擇，取決於你的程式設計風格以及手上的工作。如果你已經在定義原型的時候，使用了物件的初始化子，或許你在大多數時候都會選擇第一種形式。這種形式更加密集且自然。然而，如果你需要稍後加入 Getter 和 Setter – 因為你並未編寫原型或實際的物件 – 這時第二種形式就是唯一可行的形式。第二種形式或許是 JavaScript 的動態性質中最佳的表現 – 但這會使代碼難以閱讀和理解。

+ +
+

在 Firefox 3.0 以前，Getter 和 Setter 並不支援 DOM 元素。舊版本的 Firefox 會默默的出錯。如果需要這些例外，修改 HTMLElement 的原型 (HTMLElement.prototype.__define{{ mediawiki.external('SG') }}etter__)，並且避免拋出例外。

+在 Firefox 3.0 中，在已定義的原型上定義 Getter 或 Setter 將會拋出例外。必須事先刪除這些屬性。舊版本的 Firefox 則沒有這個問題。
+ +

參閱

+ + + +

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:使用_this_取得物件的參考", "Core_JavaScript_1.5_教學:新物件的建立:屬性的刪除") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/index.html" new file mode 100644 index 0000000000..687b428275 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/index.html" @@ -0,0 +1,18 @@ +--- +title: 新物件的建立 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立 +--- +

 

+

新物件的建立

+

JavaScript 具備許多預先定義的物件。此外，你也可以建立你自己的物件。在 JavaScript 1.2 以後的版本中，你可以使用物件的初始化子來建立物件。另一個選擇是，你可以先建立建構子函數，然後使用這個函數以及 new 運算子來實體化物件。

+ +

{{ PreviousNext("Core_JavaScript_1.5_教學:物件和屬性", "Core_JavaScript_1.5_教學:新物件的建立:物件初始化子的使用") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\344\275\277\347\224\250_this_\345\217\226\345\276\227\347\211\251\344\273\266\347\232\204\345\217\203\350\200\203/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\344\275\277\347\224\250_this_\345\217\226\345\276\227\347\211\251\344\273\266\347\232\204\345\217\203\350\200\203/index.html" new file mode 100644 index 0000000000..6af61628b5 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\344\275\277\347\224\250_this_\345\217\226\345\276\227\347\211\251\344\273\266\347\232\204\345\217\203\350\200\203/index.html" @@ -0,0 +1,27 @@ +--- +title: 使用 this 取得物件的參考 +slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考 +--- +

 

+

使用 this 取得物件的參考

+

JavaScript 有特別的關鍵字，this，你可以在方法內部使用，用來參考使用中的物件。舉例來說，假設你有稱為 validate 的函數可以檢驗物件的 value 屬性，傳入的參數是物件和上限、下限值︰

+
function validate(obj, lowval, hival) {
+   if ((obj.value < lowval) || (obj.value > hival))
+      alert("Invalid Value!");
+}
+
+

然後，你可以在每一個表單的 onchange 事件處理器中呼叫 validate，使用 this 把 form 元素傳給函數，如下所示︰

+
<input type="text" name="age" size="3"
+   onChange="validate(this, 18, 99)">
+
+

一般來說，this 會參考方法裡的呼叫端物件。

+

如果和 form 的屬性結合使用，this 可以參考使用中物件的親表單。在下面的範例中，表單 myForm 內含 Text 物件以及按鈕。當使用者按下按鈕，表單的名稱就會被設成 Text 物件裡的值。按鈕的 onclick 事件處理器使用 this.form 來參考親表單 myForm。

+
<form name="myForm">
+<p><label>Form name:<input type="text" name="text1" value="Beluga"></label>
+<p><input name="button1" type="button" value="Show Form Name"
+      onclick="this.form.text1.value=this.form.name">
+</p>
+</form>
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:方法的定義", "Core_JavaScript_1.5_教學:新物件的建立:Getter 和 Setter 的定義") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\261\254\346\200\247\347\232\204\345\210\252\351\231\244/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\261\254\346\200\247\347\232\204\345\210\252\351\231\244/index.html" new file mode 100644 index 0000000000..ba099fa041 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\261\254\346\200\247\347\232\204\345\210\252\351\231\244/index.html" @@ -0,0 +1,21 @@ +--- +title: 屬性的刪除 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除 +--- +

 

+

屬性的刪除

+

你可以使用 delete 運算子移除屬性。下面的代碼示範如何移除屬性︰

+
// 建立新的物件 myobj，以及兩個屬性 a 和 b。
+myobj = new Object;
+myobj.a = 5;
+myobj.b = 12;
+
+// 移除一個屬性，只剩 b 屬性留在 myobj 裡。
+delete myobj.a;
+
+

你也可以使用 delete 來刪除全域變數，只要這個變數不是使用 var 關鍵字宣告的話︰

+
g = 17;
+delete g;
+
+

參閱 delete 取得更多資訊。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:Getter_和_Setter_的定義", "Core_JavaScript_1.5_教學:預先定義的核心物件") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\273\272\346\247\213\345\255\220\345\207\275\346\225\270\347\232\204\344\275\277\347\224\250/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\273\272\346\247\213\345\255\220\345\207\275\346\225\270\347\232\204\344\275\277\347\224\250/index.html" new file mode 100644 index 0000000000..b9832bf245 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\273\272\346\247\213\345\255\220\345\207\275\346\225\270\347\232\204\344\275\277\347\224\250/index.html" @@ -0,0 +1,58 @@ +--- +title: 建構子函數的使用 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用 +--- +

 

+

建構子函數的使用

+

還有一個選擇，你可以按照這兩個步驟來建立物件︰

+
    +
  1. 編寫建構子函數以完成物件類型的定義。
    2. +
  2. 使用 new 建立物件的實體。
    3. +
+

若要定義物件類型，就指定物件類型的名稱、屬性、方法並建立函數。舉例來說，假設你想要給 car 建立物件類型。你希望這個物件的類型稱作 car，而且你還希望他有 make、model、year 這些屬性。要做到這些，你需要編寫出以下的函數︰

+
function car(make, model, year) {
+   this.make = make;
+   this.model = model;
+   this.year = year;
+}
+
+

注意 this 是用來把傳送給函數的值代入給物件的屬性。

+

現在你可以建立稱作 mycar 的物件如下所示︰

+
mycar = new car("Eagle", "Talon TSi", 1993);
+
+

這個語句建立 mycar 並且把指定的值代入給他自己的屬性。然後 mycar.make 的值是字串 "Eagle"，mycar.year 是整數 1993，依此類推。

+

你可以藉由呼叫 new 來建立許多個 car 的物件。例如，

+
kenscar = new car("Nissan", "300ZX", 1992);
+vpgscar = new car("Mazda", "Miata", 1990);
+
+

物件可以有另一個物件本身的屬性。例如，假設你定義稱為 person 的物件如下︰

+
function person(name, age, sex) {
+   this.name = name;
+   this.age = age;
+   this.sex = sex;
+}
+
+

然後實體化兩個新的 person 物件如下︰

+
rand = new person("Rand McKinnon", 33, "M");
+ken = new person("Ken Jones", 39, "M");
+
+

然後你可以改寫 car 的定義，加入用來接受 person 物件的 owner 屬性，如下︰

+
function car(make, model, year, owner) {
+   this.make = make;
+   this.model = model;
+   this.year = year;
+   this.owner = owner;
+}
+
+

若要實體化新的物件，你可以如下使用︰

+
car1 = new car("Eagle", "Talon TSi", 1993, rand);
+car2 = new car("Nissan", "300ZX", 1992, ken);
+
+

注意，當建立新的物件的時候，傳入的並不是字面表達字串或整數值，上面的語句把 rand 和 ken 物件當作參數傳給 owners。然後如果你希望找出 car2 的 owner 的名稱，你可以如下存取屬性︰

+
car2.owner.name
+
+

注意，你永遠可以給之前定義的物件加入屬性。例如，語句

+
car1.color = "black"
+
+

把 color 屬性加入給 car1，並且把 "black" 的值代入給新加入的屬性。然而，這樣並不能影響到其他的任何物件。若要給所有同樣類型的物件加入新的屬性，你必須把新的屬性加入到 car 物件類型的定義。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:物件初始化子的使用", "Core_JavaScript_1.5_教學:新物件的建立:物件屬性的索引") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\346\226\271\346\263\225\347\232\204\345\256\232\347\276\251/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\346\226\271\346\263\225\347\232\204\345\256\232\347\276\251/index.html" new file mode 100644 index 0000000000..67a9250b8e --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\346\226\271\346\263\225\347\232\204\345\256\232\347\276\251/index.html" @@ -0,0 +1,40 @@ +--- +title: 方法的定義 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義 +--- +

 

+

方法的定義

+

方法就是和物件連繫在一起的函數。定義方法和定義標準函數的方式皆相同。然後使用下面的語句把函數和現存的物件連繫在一起︰

+
object.methodname = function_name
+
+

此處的 object 就是現存的物件，methodname 就是分配給方法的名稱，function_name 就是函數的名稱。

+

然後你可以呼叫物件中的方法如下︰

+
object.methodname(params);
+
+

你可以藉由含入物件的建構子函數裡的方法定義，針對物件的類型來定義方法。例如，你可以定義函數，用來格式化並顯示先前定義的 car 物件的屬性。例如，

+
function displayCar() {
+   var result = "A Beautiful " + this.year + " " + this.make
+      + " " + this.model;
+   pretty_print(result);
+}
+
+

此處的 pretty_print 是用來顯示水平格線和字串的函數。注意 this 是用來參考方法所屬的物件。

+

你可以在物件的定義中加上如下語句，把這個函數作為 car 的方法。

+
this.displayCar = displayCar;
+
+

於是，car 的完整定義就會變成這樣

+
function car(make, model, year, owner) {
+   this.make = make;
+   this.model = model;
+   this.year = year;
+   this.owner = owner;
+   this.displayCar = displayCar;
+}
+
+

然後你可以給每一個物件呼叫 displayCar 方法如下︰

+
car1.displayCar()
+car2.displayCar()
+
+

產生的輸出顯示在下圖中。

+

Image:obja.gif 圖 7.1: 方法的輸出的顯示

+

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:針對物件的類型定義屬性", "Core_JavaScript_1.5_教學:新物件的建立:使用_this_取得物件的參考") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\210\235\345\247\213\345\214\226\345\255\220\347\232\204\344\275\277\347\224\250/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\210\235\345\247\213\345\214\226\345\255\220\347\232\204\344\275\277\347\224\250/index.html" new file mode 100644 index 0000000000..79b7e5041b --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\210\235\345\247\213\345\214\226\345\255\220\347\232\204\344\275\277\347\224\250/index.html" @@ -0,0 +1,23 @@ +--- +title: 物件初始化子的使用 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 +--- +

 

+

物件初始化子的使用

+

除了使用建構子函數來建立物件以外，你也可以使用物件的初始化子來建立物件。使用物件的初始化子，有時又被稱為以字面表達記法來建立物件。「物件初始化子」與 C++ 的術語一致。

+

使用物件初始化子的語句如下︰

+
var obj = { property_1:   value_1,   // 通常以 property_# 代表識別子...
+            2:            value_2,   // 或者使用數字...
+            ...,
+            "property_n": value_n }; // 或者使用字串
+

此處的 obj 就是新物件的名稱，每一個 property_i 都是識別子（可以是名稱、數字、字串的字面表達），而且每一個 value_i 都是表達式，其值會代入給 property_i。obj 和代入動作不是必要的；如果你不需要在其他地方參考這個物件，你就不需要把物件代入給變數。（注意，你也許需要以圓括弧代替花括弧來包裝物件的字面表達，如果預期物件出現的地方會有其他語句，就要避免和區塊語法相混淆。）

+

如果物件是在最頂層的 Script 中以物件初始化子來建立的，每一次要對內含該物件的字面表達求值時，JavaScript 就會把他解譯成物件。此外，用在函數裡的初始化子，會在每一次呼叫函數的時候建立。

+

以下的語句建立物件，並把他代入給變數 x，但只在表達式的條件為 true 時如此。

+
if (cond) x = {hi:"there"};
+
+

以下例子使用了三個屬性來建立 myHonda。注意，engine 屬性也是物件，並連結有自己的屬性。

+
var myHonda = {color:"red",wheels:4,engine:{cylinders:4,size:2.2}};
+
+

你也可以使用物件的初始化子來建立陣列。參閱 陣列的字面表達。

+

在 JavaScript 1.1 以後的版本中，你無法再使用物件的初始化子。你只能使用他們的建構子函數或者使用由某些其他用途的物件所提供的函數來建立物件。參閱 建構子函數的使用。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立", "Core_JavaScript_1.5_教學:新物件的建立:建構子函數的使用") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\261\254\346\200\247\347\232\204\347\264\242\345\274\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\261\254\346\200\247\347\232\204\347\264\242\345\274\225/index.html" new file mode 100644 index 0000000000..08e243c78b --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\261\254\346\200\247\347\232\204\347\264\242\345\274\225/index.html" @@ -0,0 +1,10 @@ +--- +title: 物件屬性的索引 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引 +--- +

 

+

物件屬性的索引

+

在 JavaScript 1.0 中，你可以使用物件的屬性名稱或序號索引來參考物件的屬性。然而，在 JavaScript 1.1 以後的版本中，如果你最初使用名稱來定義屬性，你就必須永遠使用名稱來參考屬性，如果你最初使用索引來定義屬性，你就必須永遠使用索引來參考屬性。

+

這些限制出現在，當你使用建構子函數來建立物件及其屬性的時候（例如我們之前的 Car 物件類型），以及當你明確的定義個別的屬性的時候（例如，myCar.color = "red"）。如果你最初使用索引來定義物件的屬性，如 myCar{{ mediawiki.external(5) }} = "25 mpg"，隨後你只能以 myCar{{ mediawiki.external(5) }} 來參考這個屬性。

+

這個規則的例外是從 HTML 反映過來的物件，如 forms 陣列。你永遠可以使用序號（以在文件中出現的位置為基準）或他們的名稱（如果有定義的話）來參考這些陣列。舉例來說，如果在文件中的第二個 <FORM> 標記中有 "myForm" 的 NAME 屬性，你可以使用 document.forms{{ mediawiki.external(1) }} 或 document.forms{{ mediawiki.external('\"myForm\"') }} 或 document.myForm 來參考表單。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:建構子函數的使用", "Core_JavaScript_1.5_教學:新物件的建立:針對物件的類型定義屬性") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\351\207\235\345\260\215\347\211\251\344\273\266\347\232\204\351\241\236\345\236\213\345\256\232\347\276\251\345\261\254\346\200\247/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\351\207\235\345\260\215\347\211\251\344\273\266\347\232\204\351\241\236\345\236\213\345\256\232\347\276\251\345\261\254\346\200\247/index.html" new file mode 100644 index 0000000000..0d1e55ac71 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\351\207\235\345\260\215\347\211\251\344\273\266\347\232\204\351\241\236\345\236\213\345\256\232\347\276\251\345\261\254\346\200\247/index.html" @@ -0,0 +1,12 @@ +--- +title: 針對物件的類型定義屬性 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性 +--- +

 

+

針對物件的類型定義屬性

+

你可以透過 prototype 屬性的使用來給之前定義的物件加入新的屬性。這種屬性的定義方式可以共用給所有指定類型的物件，而不只是針對單一的物件實體。以下代碼給所有的 car 類型的物件加入 color 屬性，然後把值代入給 car1 物件的 color 屬性。

+
Car.prototype.color=null;
+car1.color="black";
+
+

參閱 Core JavaScript 參考・函數物件・prototype 屬性 以取得更多資訊。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:物件屬性的索引", "Core_JavaScript_1.5_教學:新物件的建立:方法的定義") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\346\250\241\345\274\217\347\232\204\347\267\250\345\257\253/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\346\250\241\345\274\217\347\232\204\347\267\250\345\257\253/index.html" new file mode 100644 index 0000000000..e07b2f6aa4 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\346\250\241\345\274\217\347\232\204\347\267\250\345\257\253/index.html" @@ -0,0 +1,184 @@ +--- +title: 正規表達式模式的編寫 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 +--- +

正規表達式的模式是由簡單的字元所組成，如 /abc/，或由簡單的和特殊的字元所組成，如 /ab*c/ 或 /Chapter (\d+)\.\d*/。後者含有用來記憶的括弧。以模式的某一部分所產生的比對結果會被記憶起來以供稍後使用，已在 括弧子字串的比對結果的運用 一文中解說。

+

簡單模式的使用

+

簡單的模式直接由想要尋找的字元所組成。例如，/abc/ 的模式只在字元 'abc' 以同樣順序一起出現時，比對出字串裡的字元。在字串 "Hi, do you know your abc's?" 和 "The latest airplane designs evolved from slabcraft." 中將會比對成功。在兩個例子中，都比對出子字串 'abc'。在字串 "Grab crab" 中沒有比對結果，因為字串裡並未含有子字串 'abc'。

+

特殊字元的使用

+

當搜尋的需求遠遠超出直接比對的能力時，如尋找 1 個以上的全部的 b，或是尋找含有特殊字元的空白部分。舉例來說，/ab*c/ 的模式可比對出所有以 'a' 後接 0 個以上的全部的 'b'（* 的意思是前項出現 0 個以上）並緊接者 'c' 的字元。在字串 "cbbabbbbcdebc" 裡，可以比對出子字串 'abbbbc'。

+

下表提供完整的列表，並解說可用於正規表達式的特殊字元。

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
字元意義
\可分為以下兩種︰ +
    +
  • 對於那些沒有特殊意義的字元，反斜線可指示下一個字元為特殊的、不照字面解譯。舉例來說，/b/ 比對字元 'b'。藉由在 b 前面放置反斜線，也就是使用 /\b/，這個字元的特殊意義就變成比對文字的邊界。
    • +
  • 對於那些有特別意義的字元，就利用反斜線指示下一個字元並非特殊的、應該照字面解譯。舉例來說，* 是一個意義為前項出現 0 個以上的特殊字元。例如，/a*/ 意思是比對 0 個以上的全部的 a。如果要照字面比對 *，就在前面加上反斜線。例如，/a\*/ 比對出 'a*'。
    • +
+
^比對輸入的開頭處。如果把多行標誌設為 true，也會比對緊接在換行字元之後的字元。舉例來說，/^A/ 不會在 "an A" 裡比對出 'A'，但會在 "An A" 裡比對出第一個 'A'。
$比對輸入的末尾處。如果把多行標誌設為 true，也會比對緊接在換行字元之前的字元。舉例來說，/t$/ 不會在 "eater" 裡比對出 't'，但會在 "eat" 裡比對出來。
*比對前面的字元 0 次以上。舉例來說，/bo*/ 在 "A ghost booooed" 比對出 'boooo'，並在 "A bird warbled" 比對出 'b'，但不會在 "A goat grunted" 比對出來。
+比對前面的字元 1 次以上。等價於 {1,}。舉例來說，/a+/ 在 "candy" 比對出 'a'，並在 "caaaaaaandy" 比對出所有的 a。
?比對前面的字元 0 次或 1 次。 +

舉例來說，/e?le?/ 在 "angel" 比對出 'el'，並在 "angle" 比對出 'le'。

+

如果緊接在任何一個數量子 *、+、?、{} 之後來使用，將使數量子非貪婪（比對出最小的次數），而預設值是貪婪的（比對出最大的次數）。舉例來說，使用 /\d+/ 比對 "123abc" 便返回 "123"，如果使用 /\d+?/，只有 "1" 會被比對出來。

+ 也用於表示預讀，在本表的 x(?=y) 和 x(?!y) 中有說明。
.小數點比對任意的單一字元，除了換行字元以外。舉例來說，/.n/ 在 "nay, an apple is on the tree" 比對出 'an' 和 'on'，而非 'nay'。
(x)比對 'x' 並記憶此項比對結果。又稱為截取括弧（capturing parentheses）。舉例來說，/(foo)/ 在 "foo bar" 裡比對出並記憶 'foo'。比對出來的子字串可以從比對結果的陣列的元素 1, ..., n 取回。
(?:x)比對 'x' 但不記憶此項比對結果。又稱為非截取括弧。比對出來的子字串無法從比對結果的陣列的元素 1, ..., n 取回。
x(?=y)比對 'x' 但只在 'x' 後面接續著 'y' 的時候。舉例來說，/Jack(?=Sprat)/ 只在後面接續著 'Sprat' 的時候比對出 'Jack'。/Jack(?=Sprat|Frost)/ 只在後面接續著 'Sprat' 或 'Frost' 的時候比對出 'Jack'。然而，'Sprat' 或 'Frost' 都不是比對結果的一部分。
x(?!y)比對 'x' 但只在 'x' 後面沒有接續著 'y' 的時候。舉例來說，/\d+(?!\.)/ 只在後面沒有接續著小數點的時候比對出數字。正規表達式 /\d+(?!\.)/.exec("3.141") 比對出 '141' 而非 '3.141'。
x|y比對 'x' 或 'y'。舉例來說，/green|red/ 在 "green apple" 比對出 'green'，並在 "red apple"比對出 'red'。
{n}在此 n 是正整數。比對出恰好有 n 個的前面的字元。舉例來說，/a{2}/ 不會在 "candy" 裡比對出 'a'，但在 "caandy" 裡比對出全部的 a，並在 "caaandy" 裡比對出前兩個 a。
{n,}在此 n 是正整數。比對出至少 n 個的前面的字元。舉例來說，/a{2,}/ 不會在 "candy" 裡比對出 'a'，但在 "caandy" 還有在 "caaaaaaandy" 裡比對出全部的 a。
{n,m}在此 n 和 m 是正整數。比對出至少 n 個且至多 m 個的前面的字元。舉例來說，/a{1,3}/ 在 "cndy" 裡比對不出來，但在 "candy" 比對出 'a'，在 "caandy" 比對出前兩個 a，並在 "caaaaaaandy" 比對出前三個 a，注意，當比對 "caaaaaaandy" 的時候，比對的是 "aaa"，即使字串裡有更多的 a。
xyz字元集。比對出包含在括號裡的其中任何一個字元。你可以使用連接符號 (-) 指定字元的範圍。舉例來說，abcd 等於 a-d。這些都能在 "brisket" 裡比對 'b'，並在 "city" 裡比對 'c'。
^xyz字元否定集、或字元補集。也就是比對出任何不包含在括號裡的一切。你可以使用連接符號 (-) 指定字元的範圍。舉例來說，^abc 等於 ^a-c。這些都能在 "brisket" 裡比對出第一個字母 'r'，並在 "chop" 比對出 'h'。
\\b比對退格。（別和 \b 混淆。）
\b比對文字邊界，如空白或換行字元。（別和 \\b 混淆。）舉例來說，/\bn\w/ 在 "noonday" 裡比對出 'no'，/\wy\b/ 在 "possibly yesterday" 比對出 'ly'。
\B比對非文字邊界。舉例來說，/\w\Bn/ 在 "noonday" 裡比對出 'on'，/y\B\w/ 在 "possibly yesterday" 裡比對出 'ye'。
\cX在此 X 是控制字元。在字串中比對控制字元。舉例來說，/\cM/ 在字串裡比對出 control-M。
\d比對數字字元。等於 0-9。舉例來說，/\d/ 或 /0-9/ 都在 "B2 is the suite number" 比對出 '2'。
\D比對非數字字元。等於 ^0-9。舉例來說，/\D/ 或 /^0-9/ 都在 "B2 is the suite number" 比對出 'B'。
\f比對換頁（form-feed）。
\n比對換行。
\r比對歸位。
\s比對單一空白字元，包括空白、TAB、換頁、換行。等於 +

\\f\\n\\r\\t\\v\\u00A0\\u2028\\u2029。

+ 舉例來說，/\s\w*/ 在 "foo bar" 裡比對出 ' bar'。
\S比對除了空白字元以外的單一字元。等於 +

^ \\f\\n\\r\\t\\v\\u00A0\\u2028\\u2029。

+ 舉例來說，/\S\w*/ 在 "foo bar" 裡比對出 'foo'。
\t比對 TAB。
\v比對垂直 TAB。
\w比對任何字母和數字的字元，包括底線。等於 A-Za-z0-9_。舉例來說，/\w/ 在 "apple" 裡比對出 'a'，在 "$5.28" 裡比對出 '5'，並在 "3D" 比對出 '3'。
\W比對任何非字母和數字的字元。等於 {{ mediawiki.external('^A-Za-z0-9_') }}。舉例來說，/\W/ 或 /{{ mediawiki.external('^A-Za-z0-9_') }}/ 在 "50%" 裡比對出 '%'。
\n在此 n 是正整數。回向參考在正規表達式中的第 n 個括弧中比對的最後的子字串（對左括弧計數）。舉例來說，/apple(,)\sorange\1/ 在 "apple, orange, cherry, peach" 裡比對出 'apple, orange,'。
\0比對 NUL 字元。後面不可以接續其他數字。
\xhh比對內碼為 hh 的字元（兩個十六進位數）
\uhhhh比對內碼為 hhhh 的字元（四個十六進位數）
+

表 4.1: 正規表達式裡的特殊字元。

+

括弧的使用

+

使用括弧把正規表達式的模式的某一部分括起來，就會記憶那部分被比對出來的子字串。一經記憶，就可以在其他地方取回並使用。可在 括弧子字串的比對結果的運用 一文中找到說明。

+

舉例來說，以 /Chapter (\d+)\.\d*/ 的模式來解說額外的跳脫和特殊字元，那些用來指示某一部分模式需要記憶的部分。他會比對恰好是 'Chapter ' 的字元，隨後是 1 個以上的數字（\d 的意思是任意數字字元，+ 的意思是 1 次以上），隨後是一個小數點（點本身是特殊字元，前面附上 \ 的點的意思是這個模式必須尋找字面為 '.' 的字元），隨後是任何 0 個以上的數字（\d 的意思是任意數字字元，* 的意思是 0 次以上）。此外，括弧被用來記憶第一次比對出來的數字字元。

+

在 "Open Chapter 4.3, paragraph 6" 裡可以找出這個模式，且 '4' 會被記憶。在 "Chapter 3 and 4" 裡則找不出這個模式，因為字串裡的 '3' 後面沒有點。

+

若要比對子字串，且不要記憶比對出來的那一部分，可在括弧裡面的最前面加上 ?:。舉例來說，(?:\d+) 比對 1 個以上的數字字元，但不會記憶那些比對出來的字元。

+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:正規表達式的建立", "Core_JavaScript_1.5_教學:正規表達式的運用") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" new file mode 100644 index 0000000000..ffeee0f5c7 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" @@ -0,0 +1,34 @@ +--- +title: 正規表達式的建立 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 +--- +

正規表達式的建立

+

正規表達式有兩種建構方式︰

+ +
 re = /ab+c/;
+
+
+
+
+ 正規表達式的字面表達會在對 Script 求值時提供正規表達式的編譯產物。這時正規表達式將成為常數而遺留下來，採用這個方式可以得到較好的效能。
+
+
+
+ +
 re = new RegExp("ab+c");
+
+
+
+
+ 使用建構子函數可在執行時期提供正規表達式的編譯產物。當你知道正規表達式的模式將會變更時，或者當你無法預知取自其他來源的模式（如使用者的輸入）時，就使用建構子函數。
+
+
+
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:運算子:特殊運算子", "Core_JavaScript_1.5_教學:正規表達式模式的編寫") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\347\257\204\344\276\213/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\347\257\204\344\276\213/index.html" new file mode 100644 index 0000000000..0bd61d90e5 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\347\257\204\344\276\213/index.html" @@ -0,0 +1,114 @@ +--- +title: 正規表達式的範例 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 +--- +

範例

+

以下範例示範正規表達式的一些用法。

+

改變輸入字串的順序

+

以下範例解說了正規表達式的構造，以及 string.split() 和 string.replace() 的用法。他會整理凌亂的格式化輸入字串，字串中內含以空白、TAB、和唯一的分號所分割的姓名（名字在前）。最後，他會調換姓名的順序（姓氏在前）並重新排序列表。

+
<script type="text/javascript">
+
+// 內含很多空白和 TAB 的 names 字串，
+// 在名字和姓氏之間也會有很多空白。
+var names = "Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ; Chris Hand ";
+
+var output = new Array(
+  "---------- Original String<br><br>",
+  names + "<br><br>");
+
+// 預備兩個正規表達式的模式和儲存用的陣列。
+// 把字串分割存入陣列元素裡。
+
+// 模式︰可能的空白，然後是分號，然後是可能的空白
+var pattern = /\s*;\s*/;
+
+// 使用上面的模式把字串分割成多個斷片，
+// 並且把斷片儲存至稱為 nameList 的陣列。
+var nameList = names.split(pattern);
+
+// 新的模式︰1 個以上的字元，然後是空白字元，然後是 1 個以上的字元。
+// 使用括弧來記憶模式的某一部分。
+// 已記憶的部分稍後會被參考。
+var pattern = /(\w+)\s+(\w+)/;
+
+// 用來保存已處理的姓名的新陣列。
+var bySurnameList = new Array();
+
+// 顯示 names 陣列，並移動以逗號分隔且姓氏在前的姓名到新的陣列。
+//
+// replace 方法除去符合模式的所有內容，並以已記憶的字串取代。
+// 字串是以第二個已記憶的部分、後接逗號和空格、後接第一個已記憶的部分所組成。
+//
+// 變數 $1 和 $2 參考了符合模式的已記憶的部分。
+
+output.push("---------- After Split by Regular Expression<br>");
+
+var i, len;
+for (i = 0, len = nameList.length; i < len; i++)
+{
+  output.push(nameList[i] + "<br>");
+  bySurnameList[i] = nameList[i].replace(pattern, "$2, $1")
+}
+
+// 顯示新的陣列。
+output.push("---------- Names Reversed<br>");
+for (i = 0, len = bySurnameList.length; i < len; i++)
+{
+  output.push(bySurnameList[i] + "<br>")
+}
+
+// 以姓氏來排序，然後顯示已排序的陣列。
+bySurnameList.sort();
+output.push("---------- Sorted<br>");
+for (i = 0, len = bySurnameList.length; i < len; i++)
+{
+  output.push(bySurnameList[i] + "<br>")
+}
+
+output.push("---------- End<br>");
+
+document.write(output.join("\n"));
+
+</script>
+
+

使用特殊字元來對輸入進行驗證

+

在以下的範例中，有位使用者輸入電話號碼。當使用者按下 Enter 時，Script 就會檢查電話號碼的有效性。如果電話號碼有效（符合由正規表達式所指定的字元序列），Script 在視窗上表示感謝使用者，並確認了電話號碼。如果電話號碼無效，Script 在視窗上表示使用者的電話號碼有誤的資訊。

+

正規表達式尋找 0 或 1 個左括弧 \(?，後接三個數字 \d{3}，後接 0 或 1 個右括弧 \)?，如果有的話，就後接橫線 (-) 或斜線 (\) 或小數點 (.)，並記憶字元 (-\\/\\.)，後接三個數字 \d{3}，後接已記憶的橫線、斜線、小數點的比對結果 \1，後接四個數字 \d{4}。

+

當使用者按下 Enter 設定 RegExp.input 的值時，就會發動 Change 事件。

+
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+  "http://www.w3.org/TR/html4/loose.dtd">
+<html>
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
+    <meta http-equiv="Content-Script-Type" content="text/javascript">
+    <script type="text/javascript">
+      var re = /\(?\d{3}\)?([-\/\.])\d{3}\1\d{4}/;
+
+      function testInfo(phoneInput)
+      {
+        var OK = re.exec(phoneInput.value);
+
+        if (!OK)
+        {
+          window.alert(RegExp.input + " isn't a phone number with area code!");
+        }
+        else
+        {
+          window.alert("Thanks, your phone number is " + OK[0]);
+        }
+      }
+    </script>
+  </head>
+
+  <body>
+    <p>Enter your phone number (with area code) and then press Enter.</p>
+    <form action="">
+      <input name="phone" onchange="testInfo(this);">
+    </form>
+  </body>
+</html>
+
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:正規表達式的運用:使用標誌的進階搜尋", "Core_JavaScript_1.5_教學:區塊語法") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\347\232\204\346\223\215\344\275\234\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\347\232\204\346\223\215\344\275\234\350\252\236\346\263\225/index.html" new file mode 100644 index 0000000000..f1e46206fe --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\347\232\204\346\223\215\344\275\234\350\252\236\346\263\225/index.html" @@ -0,0 +1,53 @@ +--- +title: 物件的操作語法 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法 +--- +

物件的操作語法

+

JavaScript 使用 for...in、for each...in、with 語法來操作物件。

+

for...in 語法

+

for...in 語法可處理對應物件的所有屬性的指定變數。JavaScript 會對每一個對應的屬性來執行指定的語句。for...in 語句如下︰

+
for (variable in object) {
+   statements
+}
+
+

範例
+ 以下函數接受物件和物件的名稱作為自己的參數。然後函數反覆遍歷物件的屬性，並返回列出屬性名稱和值的字串。

+
function dump_props(obj, obj_name) {
+   var result = "";
+   for (var i in obj) {
+      result += obj_name + "." + i + " = " + obj[i] + "<br>";
+   }
+   result += "<hr>";
+   return result;
+}
+
+

以帶有屬性 make 和 model 的物件 car 為例，輸出結果如下︰

+
car.make = Ford
+car.model = Mustang
+
+

陣列
+ 雖然使用這個方法來處理所有的 Array 元素很是誘人，但如果你修改了 Array 物件，例如加入自訂的屬性或方法，for...in 語法就只會處理除了陣列元素以外的所有使用者定義的屬性，for...in 語法將會返回你的使用者定義的屬性的名稱，除了數字索引以外。因此在處理陣列時，最好還是使用傳統的 for 循環，並配合數字索引。

+

for each...in 語法

+

for each...in 是在 JavaScript 1.6 中引入的循環語法，他很類似 for...in，但不是針對物件的屬性的名稱，而是物件的屬性的值。

+

with 語法

+

with 語法為一整組的語句確立了預設的物件。JavaScript 會在一整組語法之內找出所有不合格的名稱，只要這個名稱是預設物件的屬性，就會將其確定。如果有一個不合格的名稱符合其中一個屬性，然後就會在語句中使用這個屬性。否則，就會被當成局域或全域的變數。

+

with 語法如下︰

+
with (object) {
+   statements
+}
+
+

範例
+ 以下 with 語法指定 Math 物件為預設的物件。with 語法裡面使用了 PI 屬性和 cos、sin 方法的語句，而無需指定物件。JavaScript 會假定他們參照的是 Math 物件。

+
var a, x, y;
+var r = 10;
+with (Math) {
+   a = PI * r * r;
+   x = r * cos(PI);
+   y = r * sin(PI/2);
+}
+
+

附註︰雖然使用 with 語句可以使你的程式更加簡潔，但不當使用 with 也會在一定程度上使你的程式速度變慢。參閱 Core JavaScript 1.5 參考:語法:with。

+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:循環語法:continue_語法", "Core_JavaScript_1.5_教學:註解") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\271\274\346\211\277/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\271\274\346\211\277/index.html" new file mode 100644 index 0000000000..4b1e65afce --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\271\274\346\211\277/index.html" @@ -0,0 +1,146 @@ +--- +title: 繼承 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承 +--- +

 

+ +

繼承

+ +

這裡有很多有關如何在 JavaScript 中定義類型（類別）的困惑之處，包括繼承。這裡有很多方式和一些 次優的選擇。這裡所展示的運作的最好，而且簡單。

+ +

範例

+ +

B 繼承 A︰

+ +
function A(a)
+{
+  this.varA = a;
+}
+
+A.prototype =
+{
+  varA : null,
+  doSomething : function()
+  {
+     ...
+  }
+}
+
+function B(a, b)
+{
+  A.call(this, a);
+  this.varB = b;
+}
+
+B.prototype =
+{
+  varB : null,
+  doSomething : function() // 覆寫
+  {
+     A.prototype.doSomething.apply(this, arguments); // 呼叫親類型
+     ...
+  }
+}
+
+extend(B, A);
+
+var b = new B();
+b.doSomething();
+
+ +

重點部分是︰

+ + + +

此處的 extend() 並不是內建的函數，其定義如下︰

+ +
function extend(child, supertype)
+{
+   child.prototype.__proto__ = supertype.prototype;
+}
+
+ +

prototype 和 __proto__

+ +

JavaScript 對於來自 Java 或 C++ 的開發者而言會感到一些困惑，因為他完全動態，完全執行時期，而且完全沒有類別。他完全只有實體（物件）。甚至〝類別〞也只是函數物件模擬出來的。

+ +

你或許已經注意到前面我們的 function A 很特別，這並不是普通的函數，但可以和關鍵字 new 結合使用來實體化新的物件。他也可以有稱作 prototype 的特別的屬性（由 JS 標準所定義）。這個函數所做的不過是，當你呼叫 new 的時候，參考的 prototype 物件被複製到新的實體的屬性 __proto__。也就是當你這樣做 var a1 = new A() 的時候，JS（在記憶體中建立物件之後，並在使用 this 執行函數 A() 來定義他之前）只是簡單的這樣做 a1.__proto__ = A.prototype。然後當你存取實體的屬性的時候，JS 首先會檢查那些是否直接存在於物件上，如果不是的話，就從 __proto__ 搜尋。這意思是所有你定義在 prototype 裡的東西，實際上會被所有的實體所共用，而且你甚至可以在稍後修改 prototype 的部分，並且在所有既存的實體上表現出這個改變，只要你想要的話。

+ +

舉例來說，當你在上面的範例中這樣做 var a1 = new A(); var a2 = new A();，然後 a1.doSomething 實際上會參考 a1.__proto__.doSomething，這些和你定義的 A.prototype.doSomething 相同，也就是 a1.__proto__.doSomething == a2.__proto__.doSomething == A.prototype.doSomething。

+ +

簡而言之，prototype 是對類型而言，而 __proto__ 對實體而言都相同。

+ +

__proto__ 是以遞歸的方式來看待的，也就是 a1.doSomething、a1.__proto__.doSomething、a1.__proto__.__proto__.doSomething 等等，直到找到或不存在 __proto__ 為止。

+ +

所以，發生了什麼︰當你呼叫
+   var o = new Foo()
+ JS 實際上只是這樣做
+   var o = new Object();
+   o.__proto__ = Foo.prototype;
+   o.Foo(); （諸如此類）
+
+ 以及當你隨後這樣做
+   o.someProp
+ 他會檢查 o 是否有屬性 someProp，如果沒有就檢查 o.__proto__.someProp，如果沒有就檢查 o.__proto__.__proto__.someProp 依此類推。這個最後的步驟就是 extend() 函數運作的原因。

+ +

 

+ +

注意，__proto__ 只能在 Mozilla 的 JS 引撉中存取。其他引撉的也有相同的運作，但不能存取 __proto__。參閱以下內容來補救。

+ +

extend() 的另一個選擇

+ +

還有另一個選擇，你也可以定義 extend() 如下︰

+ +
function extend(child, supertype)
+{
+   child.prototype.__proto__ = supertype.prototype;
+   child.prototype.__super = supertype;
+}
+
+ +

因此，當你想要在 B 中呼叫親函數的時候，你可以使用 this.__super 取代 A，例如 this.__super.call(this, a) 用於建構子，以及 this.__super.prototype.doSomething.apply(this, arguments) 用於覆載函數。

+ +

注意，__proto__ 在 Mozilla 以外的 JavaScript 版本中可能無法使用。還有另一個選擇，但不是 extend() 的最佳版本，這次應該到處都可以用︰

+ +
function extend(child, super)
+{
+  for (var property in super.prototype) {
+    if (typeof child.prototype[property] == "undefined")
+      child.prototype[property] = super.prototype[property];
+  }
+  return child;
+}
+
+ +

這次簡單的直接把親類型的 prototype 裡所有的屬性和函數，放入到子類型的 prototype 裡。這對多重繼承而言非常有用，但要小心使用，沒有親類別會把屬性或函數定義成同樣的，或者你需要明確的把那些覆載並定義那些該怎麼做。

+ +

阻礙

+ +

這裡有另一個方法用來定義類型，例如︰

+ +
function A()
+{
+  this.varA = "bla";
+  this.isNotSoGood = function()
+  {
+    ...
+  };
+}
+
+ +

這樣也可以運作，但只是次優的選擇，因為每次你建立這個類型的物件的時候，isNotSoGood 會在每一個實體中定義一次。如果是在 .prototype 定義這些的話，就只會定義一次。

+ +


+ 你可以使用下面的方式來繼承︰

+ +
B.prototype = new A();
+
+ +

不在載入 JS 檔案的時候建立 A() 的實體。這是非常壞的點子，因為你可能需要在 A 的建構子裡做一些處理，這可能會耗費時間並因此大幅延遲載入，或嘗試存取尚未載入的東西（例如，在 utils.js 裡的函數）。

+ +

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的物件:String_物件", "Core_JavaScript_1.5_教學:以類別為基礎的語言_vs._以原型為基礎的語言") }}

+ +

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Inheritance" } ) }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/index.html" new file mode 100644 index 0000000000..a9a7200773 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/index.html" @@ -0,0 +1,31 @@ +--- +title: 職員的例子 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子 +--- +

職員的例子

+

本章的剩餘部分會使用如下所示的職員的階層圖。

+

Image:hier01.gif

+

圖 8.1: 簡單的物件的階層

+

本範例使用了下面的物件︰

+ +

其餘的範例︰

+ +
+

{{ PreviousNext("Core_JavaScript_1.5_教學:以類別為基礎的語言_vs._以原型為基礎的語言", "Core_JavaScript_1.5_教學:職員的例子:階層的建立") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/index.html" new file mode 100644 index 0000000000..01d23df274 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/index.html" @@ -0,0 +1,14 @@ +--- +title: 物件的屬性 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性 +--- +

物件的屬性

+

本節討論物件如何從原型鏈上的其他物件來繼承屬性，以及當你在執行時期加入屬性的時候，發生了什麼事。

+ +
+

{{ PreviousNext("Core_JavaScript_1.5_教學:職員的例子:階層的建立", "Core_JavaScript_1.5_教學:職員的例子:物件的屬性:屬性的繼承") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\345\212\240\345\205\245/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\345\212\240\345\205\245/index.html" new file mode 100644 index 0000000000..4d5a456ad4 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\345\212\240\345\205\245/index.html" @@ -0,0 +1,19 @@ +--- +title: 屬性的加入 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入 +--- +

屬性的加入

+

在 JavaScript 中，你可以在執行時期把屬性加入到任何的物件。你不會受到只能使用由建構子函數提供屬性的限制。若要為特定的單一物件加入屬性，你可以把值代入給物件，如下︰

+
mark.bonus = 3000;
+
+

現在，mark 物件有了額外的屬性，而其他的 WorkerBee 不會有這個屬性。

+

如果你把新的屬性加入到已經被用作建構子函數的原型物件裡的話，就會把新的屬性加入到從原型繼承屬性的所有物件裡。例如，你可以使用如下語句把 specialty 屬性加入到所有的職員︰

+
Employee.prototype.specialty = "none";
+
+

JavaScript 一執行這個語句，mark 物件也就會有這個值為 "none" 的 specialty 屬性。下面的圖解顯示出加入這個屬性給 Employee 原型的效果，以及從 Engineer 原型覆蓋這個屬性。

+

Image:hier04.gif
+ 圖 8.4: 加入屬性

+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:職員的例子:物件的屬性:屬性的繼承", "Core_JavaScript_1.5_教學:職員的例子:更靈活的建構子") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html" new file mode 100644 index 0000000000..fa38245533 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html" @@ -0,0 +1,24 @@ +--- +title: 屬性的繼承 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承 +--- +

屬性的繼承

+

假定你以如下語句建立了作為 WorkerBee 的 mark 物件（如同 圖 8.3 所示）︰

+
mark = new WorkerBee;
+
+

當 JavaScript 看見 new 運算子的時候，他就會建立新的通用物件，並且把這個新物件當作 this 關鍵字的值傳給 WorkerBee 的建構子函數。建構子函數會明確的設定 projects 屬性的值，並且隱含的把 __proto__ 屬性內部的值設定成 WorkerBee.prototype 的值。（這個屬性的名稱前後各有兩個底線字元。）__proto__ 屬性決定了用來返回屬性值的原型鏈。這些屬性一經設定，JavaScript 返回新的物件，且代入語句會把變數 mark 設定給這個物件。

+

這個過程並不會把 mark 從原型鏈上繼承下來的屬性明確的放置在 mark 物件裡的值（局域值）。當你需要某個屬性值的時候，JavaScript 首先檢查這個值是否存在於物件裡。如果存在，就直接返回這個值。如果這些變數不在局域區塊裡，JavaScript 就會檢查原型鏈（使用 __proto__ 屬性）。如果在原型鏈上的物件有這個屬性的值，就會返回這個值。如果找不到這些屬性，JavaScript 會說這個物件並沒有這個屬性。以這種方式，mark 物件就有了如下屬性和值︰

+
mark.name = "";
+mark.dept = "general";
+mark.projects = [];
+
+

mark 物件從 mark.__proto__ 裡的原型物件繼承了 name 和 dept 屬性的值。他還藉由 WorkerBee 的建構子給 projects 屬性代入局域值。JavaScript 就這樣達成了屬性和值的繼承。這個過程的部分細節會在 再談屬性的繼承 裡討論。

+

因為這些建構子並不能讓你傳入特定實體的值，這些資訊是通用的。這些屬性值預設會被所有從 WorkerBee 建立的新物件所共享。當然你也可以修改任何屬性的值。因此，你可以給 mark 特定的資訊如下︰

+
mark.name = "Doe, Mark";
+mark.dept = "admin";
+mark.projects = ["navigator"];
+
+
+

{{ PreviousNext("Core JavaScript 1.5 教學:職員的例子:物件的屬性", "Core JavaScript 1.5 教學:職員的例子:物件的屬性:屬性的加入") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\351\232\216\345\261\244\347\232\204\345\273\272\347\253\213/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\351\232\216\345\261\244\347\232\204\345\273\272\347\253\213/index.html" new file mode 100644 index 0000000000..3e7a144656 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\351\232\216\345\261\244\347\232\204\345\273\272\347\253\213/index.html" @@ -0,0 +1,135 @@ +--- +title: 階層的建立 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立 +--- +

階層的建立

+

這裡有一些方式可以定義適當的建構子函數，以實現 Employee 的階層結構。該如何選擇定義這些的方式，主要取決於你希望你的應用程式能做什麼。

+

本節展示如何使用非常簡單的（相對來說也比較沒有彈性）定義，以示範繼承是如何運作的。在這些定義中，當你建立物件的時候，你不能指定任何的屬性值。這些新建立的物件會簡單的取得預設值，稍後你就可以修改這些值。圖 8.2 以這些簡單的定義解說了階層結構。

+

在實際的應用程式中，你可能會定義允許你在建立物件的時候提供屬性值的建構子（參閱 更靈活的建構子 以取得資訊）。現在，這些簡單的定義示範繼承是如何發生的。

+

Image:hier02.gif
+ 圖 8.2: Employee 物件的定義

+

下面 Java 和 JavaScript 的 Employee 定義很類似。唯一的不同點是，在 Java 中，你需要為每一個屬性指定類型，但 JavaScript 不需要。而且你需要為 Java 類別建立明確的建構子方法。

+ + + + + + + + + + + +
JavaScriptJava
+ 
+function Employee () {
+this.name = "";
+this.dept = "general";
+}
+
+ 		+ 
+public class Employee {
+   public String name;
+   public String dept;
+   public Employee () {
+      this.name = "";
+      this.dept = "general";
+   }
+}
+
+
+

Manager 和 WorkerBee 的定義顯現出在如何指定高於繼承鏈的下一個物件時的不同點。在 JavaScript 中，你把原型實體作為建構子函數的 prototype 屬性的值加了上去。在你定義了建構子以後的任何時間點上，你都可以這麼做。在 Java 中，你只能在類別定義的內部指定親類別。你不能在類別定義的外部改變親類別。

+ + + + + + + + + + + +
JavaScriptJava
+ 
+function Manager () {
+this.reports = [];
+}
+Manager.prototype = new Employee;
+
+function WorkerBee () {
+this.projects = [];
+}
+WorkerBee.prototype = new Employee;
+
+ 		+ 
+public class Manager extends Employee {
+   public Employee[] reports;
+   public Manager () {
+      this.reports = new Employee[0];
+   }
+}
+
+public class WorkerBee extends Employee {
+   public String[] projects;
+   public WorkerBee () {
+      this.projects = new String[0];
+   }
+}
+
+
+

Engineer 和 SalesPerson 的定義所建立的物件是傳承自 WorkerBee 以及 Employee。這些類型的物件具有在鏈上比他高層的所有物件的屬性。此外，定義中還使用指定給這些物件的新值來覆蓋被繼承的 dept 屬性的值。

+ + + + + + + + + + + +
JavaScriptJava
+ 
+function SalesPerson () {
+   this.dept = "sales";
+   this.quota = 100;
+}
+SalesPerson.prototype = new WorkerBee;
+
+function Engineer () {
+   this.dept = "engineering";
+   this.machine = "";
+}
+Engineer.prototype = new WorkerBee;
+
+ 		+ 
+public class SalesPerson extends WorkerBee {
+   public double quota;
+   public SalesPerson () {
+      this.dept = "sales";
+      this.quota = 100.0;
+   }
+}
+
+public class Engineer extends WorkerBee {
+   public String machine;
+   public Engineer () {
+      this.dept = "engineering";
+      this.machine = "";
+   }
+}
+
+
+

使用這些定義，你可以建立這些物件的實體，同時實體也為他們的屬性取得預設值。圖 8.3 解說使用這些 JavaScript 定義來建立新的物件，並顯示新物件的屬性值。

+

附註: 術語實體（instance）在以類別為基礎的語言中有特定的技術含義。在這些語言中，實體就是類別的獨立成員，而且在根本上就有別於類別。在 JavaScript 中，〝實體〞並沒有這些技術含義，因為 JavaScript 並沒有類別和實體的分別。然而，在談到 JavaScript 的時候，〝實體〞也可以在通俗上用來指，使用實際的建構子函數建立的物件。因此，在這些範例中，你也可以通俗的說 jane 是 Engineer 的實體。類似的，儘管術語 親（parent）、子（child）、祖先（ancestor）、子孫（descendant）在 JavaScript 中並沒有正式的含義；你也可以隨俗的使用這些術語，來談論在原型鏈中較高或較低的某個物件。

+

Image:hier03.gif
+ 圖 8.3: 使用簡單的定義來建立物件

+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:職員的例子", "Core_JavaScript_1.5_教學:職員的例子:物件的屬性") }}

+
+

 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\277\255\344\273\243\345\231\250\345\222\214\347\224\242\347\224\237\345\231\250/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\277\255\344\273\243\345\231\250\345\222\214\347\224\242\347\224\237\345\231\250/index.html" new file mode 100644 index 0000000000..21029266db --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\277\255\344\273\243\345\231\250\345\222\214\347\224\242\347\224\237\345\231\250/index.html" @@ -0,0 +1,293 @@ +--- +title: 迭代器和產生器 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器 +--- +

迭代器和產生器

+ +

處理集合中的每一項是很常見的操作。JavaScript 提供了許多迭代整個集合的方式，從簡單的 for 和 for each 循環到 map()、filter() 以及 陣列的簡約式。迭代器和產生器是在 JavaScript 1.7 引入的，帶來在核心語言中直接迭代的觀念，並提供自訂 for...in 和 for each 循環的行為的機制。

+ +
附注: yield 關鍵字只能在 HTML 裡包有 <script type="application/javascript;version=1.7"> 區塊（或更高的版本）的代碼區塊中使用。 XUL Script 標記可以存取這些功能，無須這個特別的區塊。
+ +

迭代器

+ +

迭代器（Iterator）是一種知道如何從集合裡每次以同樣的方式存取項目的物件。並保持對自己序列內部的目前位置的追蹤。在 JavaScript 中，迭代器是一種提供有能夠返回序列中的下一項的 next() 方法的物件。這個方法可以在序列用盡時，選擇性的出現 StopIteration 例外。

+ +

迭代器物件一經建立以後，可以明確的反覆呼叫 next() 來使用，或隱含的使用 JavaScript 的 for...in 和 for each 結構。

+ +

可以使用 Iterator() 函數來為物件和陣列建立簡單的迭代器︰

+ +
var lang = { name: 'JavaScript', birthYear: 1995 };
+var it = Iterator(lang);
+
+ +

一經初始化以後，就可以呼叫 next() 方法依序從物件中存取鍵值對（key-value pair）︰

+ +
var pair = it.next(); // 鍵值對是 ["name", "JavaScript"]
+pair = it.next(); // 鍵值對是 ["birthYear", 1995]
+pair = it.next(); // 拋出 StopIteration 例外
+
+ +

可以使用 for...in 循環來取代直接呼叫 next() 方法。循環會在 StopIteration 例外出現的時候自動終止。

+ +
var it = Iterator(lang);
+for (var pair in it)
+  print(pair); // 依序輸出每一個 [key, value] 對
+
+ +

如果我們只想要迭代物件的鍵（key），我們可以把第二個參數 true 傳給 Iterator() 函數︰

+ +
var it = Iterator(lang, true);
+for (var key in it)
+  print(key); // 依序輸出每一個鍵
+
+ +

使用 Iterator() 存取物件內容的其中一個好處是已經加入到 Object.prototype 的自訂屬性不會被包含在序列裡。

+ +

Iterator() 也可以和陣列一起使用︰

+ +
var langs = ['JavaScript', 'Python', 'C++'];
+var it = Iterator(langs);
+for (var pair in it)
+  print(pair); // 依序輸出每一個 [index, language] 對
+
+ +

如同物件一般，傳入 true 作為第二個參數，將導致迭代出存在於陣列裡的索引︰

+ +
var langs = ['JavaScript', 'Python', 'C++'];
+var it = Iterator(langs, true);
+for (var i in it)
+  print(i); // 輸出 0，然後是 1，然後是 2
+
+ +

他也可以把 for 循環內部使用的 let 關鍵字的索引和值兩者，代入給區塊作用域的變數，並分割代入︰

+ +
var langs = ['JavaScript', 'Python', 'C++'];
+var it = Iterator(langs);
+for (let [i, lang] in it)
+ print(i + ': ' + lang); // 輸出 "0: JavaScript" 等等。
+
+ +

自訂的迭代器的定義

+ +

有一些物件所表示的集合項，應該以特定的方式來迭代。

+ + + +

JavaScript 可讓你編寫表示自訂迭代器邏輯的代碼，並把他連結到物件上。

+ +

我們將會建立簡單的 Range 物件，這個物件存放了 low 和 high 值。

+ +
function Range(low, high)
+{
+  this.low = low;
+  this.high = high;
+}
+
+ +

現在我們將會建立自訂的迭代器，使其返回包含在某一範圍內的整數序列。迭代器的界面必須要有由我們提供的 next() 方法，這個方法會返回來自序列的某一項，或拋出 StopIteration 例外。

+ +
function RangeIterator(range)
+{
+  this.range = range;
+  this.current = this.range.low;
+}
+RangeIterator.prototype.next = function()
+{
+  if (this.current > this.range.high)
+    throw StopIteration;
+  var current = this.current;
+  this.current += 1;
+  return current;
+};
+
+ +

我們的 RangeIterator 就是有範圍限制的實體的實際例子，並維護他自己的 current 屬性用以追蹤他沿著序列已走了多遠。

+ +

最後，把我們的 RangeIterator 和 Range 物件連繫在一起，我們需要加入特別的 __iterator__ 方法給 Range。這個方法會在當我們試圖迭代 Range 實體的時候呼叫，而且應該會返回 RangeIterator 的實體，這個實體實裝了迭代器的邏輯。

+ +
Range.prototype.__iterator__ = function()
+{
+  return new RangeIterator(this);
+};
+
+ +

掛在我們自訂的迭代器以後，我們可以迭代實體的某一範圍內，如下︰

+ +
var range = new Range(3, 5);
+for (var i in range)
+  print(i); // 輸出序列中的 3，然後是 4，然後是 5
+
+ +

產生器︰建構迭代器的較佳方式

+ +

儘管自訂的迭代器是很好用的工具，但在建立時的程式設計必須要很謹慎，因為需要明確的維護他們的內部狀態。產生器（Generator）提供另一種更強大的選擇︰可讓你編寫能夠維護自身狀態的單一函數來定義迭代器的演算法。

+ +

產生器是一種特殊類型的函數，他的運作方式類似迭代器的生產廠房。只要函數內含有一個以上的 yield 語句，就會變成產生器。

+ +

當產生器函數被呼叫的時候，並不會立即執行函數的本體；取而代之的是，他會返回產生器迭代器（generator-iterator）物件。每次呼叫產生器迭代器的 next() 方法，就會執行函數本體直到下一個 yield 語句，並返回他的結果。如果執行到函數的末端或到達 return 語句，就會拋出 StopIteration 例外。

+ +

配合例子是最佳的說明︰

+ +
function simpleGenerator()
+{
+  yield "first";
+  yield "second";
+  yield "third";
+  for (var i = 0; i < 3; i++)
+    yield i;
+}
+
+var g = simpleGenerator();
+print(g.next()); // 輸出 "first"
+print(g.next()); // 輸出 "second"
+print(g.next()); // 輸出 "third"
+print(g.next()); // 輸出 0
+print(g.next()); // 輸出 1
+print(g.next()); // 輸出 2
+print(g.next()); // 拋出 StopIteration
+
+ +

產生器函數可以像類別的 __iterator__ 方法一般直接的使用，大幅減少建立自訂的迭代器的代碼量。這裡是我們的 Range，使用產生器重新編寫︰

+ +
function Range(low, high)
+{
+  this.low = low;
+  this.high = high;
+}
+Range.prototype.__iterator__ = function()
+{
+  for (var i = this.low; i <= this.high; i++)
+    yield i;
+};
+var range = new Range(3, 5);
+for (var i in range)
+  print(i); // 輸出序列中的 3，然後是 4，然後是 5
+
+ +

並不是所有的產生器都會終止；有可能建立出表示無限序列的產生器。下面的產生器實裝了費伯納契數列，每一個元素都是前面兩個元素的合︰

+ +
function fibonacci()
+{
+  var fn1 = 1;
+  var fn2 = 1;
+  while (1)
+  {
+    var current = fn2;
+    fn2 = fn1;
+    fn1 = fn1 + current;
+    yield current;
+  }
+}
+
+var sequence = fibonacci();
+print(sequence.next()); // 1
+print(sequence.next()); // 1
+print(sequence.next()); // 2
+print(sequence.next()); // 3
+print(sequence.next()); // 5
+print(sequence.next()); // 8
+print(sequence.next()); // 13
+
+ +

產生器函數可以接受參數，這個參數是用來約束第一次被呼叫的函數。產生器可以使用 return 語句來終止（並導致 StopIteration 例外的出現）。下面的 fibonacci() 變體接受選用性的 limit 參數，一旦通過限制就會終止。

+ +
function fibonacci(limit)
+{
+  var fn1 = 1;
+  var fn2 = 1;
+  while (1)
+  {
+    var current = fn2;
+    fn2 = fn1;
+    fn1 = fn1 + current;
+    if (limit && current > limit)
+      return;
+    yield current;
+  }
+}
+
+ +

高階的產生器

+ +

產生器會計算出要求他們產生的值，這可讓產生器更有效率的表示需要耗費大量計算的序列，甚至是上面示範的無窮數列。

+ +

除了 next() 方法以外，產生器迭代器物件還有 send() 方法，可以用來修改產生器的內部狀態。傳遞給 send() 的值將會被視為中止產生器的最後一個 yield 語句的結果。在你可以使用 send() 來傳送指定的值之前，你必須至少呼叫一次 next() 來啟動產生器。

+ +

這裡是使用 send() 來重新開始數列的費伯納契數產生器︰

+ +
function fibonacci()
+{
+  var fn1 = 1;
+  var fn2 = 1;
+  while (1)
+  {
+    var current = fn2;
+    fn2 = fn1;
+    fn1 = fn1 + current;
+    var reset = yield current;
+    if (reset){
+        fn1 = 1;
+        fn2 = 1;
+    }
+  }
+}
+
+var sequence = fibonacci();
+print(sequence.next());     // 1
+print(sequence.next());     // 1
+print(sequence.next());     // 2
+print(sequence.next());     // 3
+print(sequence.next());     // 5
+print(sequence.next());     // 8
+print(sequence.next());     // 13
+print(sequence.send(true)); // 1
+print(sequence.next());     // 1
+print(sequence.next());     // 2
+print(sequence.next());     // 3
+ +
附注: 作為有趣的一點，呼叫 send(undefined) 就相當於呼叫 next()。然而，使用除了 undefined 以外的任意值啟動新生的產生器，在呼叫 send() 的時候，將會引起 TypeError 例外。
+ +

你可以藉由呼叫產生器的 throw() 方法，並傳入他應該拋出的例外值，強迫產生器拋出例外。例外將會從目前被中止的產生器的位置拋出例外，就如同目前被中止的 yield 被替換成 throw value 語句一樣。

+ +

如果在拋出例外的處理期間沒有遇到 yield，然後例外將會不斷傳播直到呼叫 throw()，且隨後呼叫 next() 將導致 StopIteration 被拋出。

+ +

產生器有可以強迫關閉他自己的 close() 方法。關閉產生器的效果是︰

+ +
    +
  1. 執行所有在產生器函數裡的 finally 子句。
    2. +
  2. 如果 finally 子句拋出除了 StopIteration 以外的任何例外，例外會被傳播到 close() 方法的呼叫者。
    3. +
  3. 產生器終止。
    4. +
+ +

產生器的表達式

+ +

陣列簡約式主要的缺點是他們會造成在記憶體中建構出完整的新陣列。如果輸入的簡約式本身是小型的陣列其開銷還不明顯 - 但如果輸入的是大型的陣列或耗費資源（甚至是無限大）的產生器，新陣列的建立就會產生問題。

+ +

產生器能夠延後計算他們要求的所需計算的項的序列。產生器表達式在語法上幾乎等同於 陣列的簡約式 - 他們使用圓括弧取代方括號 - 但不是建構陣列，他們建立可以延後執行的產生器。你可以把他們想成建立產生器的簡寫語法。

+ +

假設我們有一個迭代器 it 可以迭代出大型的整數序列。我們想要建立可以迭代出雙倍的新迭代器。陣列簡約式會在記憶體中建立含有雙倍值的完整的陣列︰

+ +
var doubles = [i * 2 for (i in it)];
+
+ +

產生器表達式一方面會建立新的迭代器，能夠建立他們所需的雙倍值︰

+ +
var it2 = (i * 2 for (i in it));
+print(it2.next()); // 來自 it 的第一個值，雙倍
+print(it2.next()); // 來自 it 的第二個值，雙倍
+ +

如果把產生器表達式當作參數傳給函數，函數呼叫所使用的圓括弧意味著可以省略外部的圓括弧︰

+ +
var result = doSomething(i * 2 for (i in it));
+
+ +

 

+ +

{{ PreviousNext("Core_JavaScript_1.5_教學:陣列的運用", "Core_JavaScript_1.5_教學:物件模型的細節") }}

+ +

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Iterators_and_Generators" } ) }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\346\257\224\350\274\203\351\201\213\347\256\227\345\255\220/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\346\257\224\350\274\203\351\201\213\347\256\227\345\255\220/index.html" new file mode 100644 index 0000000000..2ce01c1501 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\346\257\224\350\274\203\351\201\213\347\256\227\345\255\220/index.html" @@ -0,0 +1,14 @@ +--- +title: 比較運算子 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子 +--- +

 

+

比較運算子

+

This seems to me kind of poorly explained, mostly the diference betwen "==" and "==="...比較運算子比較他的運算元，並根據比較是否為真的結果返回邏輯值。運算元可以是數值、字串、邏輯或物件的值。字串是以 Unicode 的值作為標準的字典順序來比較。在大多數情況下，如果兩個運算元不是同樣的類型，JavaScript 會為了比較而嘗試把運算元轉換為適當的類型。（本規則的唯一例外是 === 和 !==，他會進行“嚴格的”相等性和不相等性的檢查，且在檢查等相性之前，並不會把運算元轉換為相容的類型。）通常以數值進行比較。下表以範例代碼解明比較運算子︰

+
var var1 = 3, var2 = 4;
+
+ +
運算子 說明 返回 true 的範例
等於 (==) 運算元相等時，返回 true。 3 == var1

"3" == var1

3 == '3'
不等於 (!=) 運算元不相等時，返回 true。 var1 != 4
var2 != "3"
嚴格的等於 (===) 運算元相等且類型相同時，返回 true。 3 === var1
嚴格的不等於 (!==) 運算元不相等或類型不相同時，返回 true。 var1 !== "3"
3 !== '3'
大於 (>) 左邊的運算元大於右邊的運算元時，返回 true。 var2 > var1
"12" > 2
大於或等於 (>=) 左邊的運算元大於或等於右邊的運算元時，返回 true。 var2 >= var1
var1 >= 3
小於 (<) 左邊的運算元小於右邊的運算元時，返回 true。 var1 < var2
"12" < "2"
小於或等於 (<=) 左邊的運算元小於或等於右邊的運算元時，返回 true。 var1 <= var2
var2 <= 5
+

表 3.3: 比較運算子

+

{{ PreviousNext("Core_JavaScript_1.5_教學:Operators:代入運算子", "Core_JavaScript_1.5_教學:運算子:算術運算子") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/Comparison_Operators", "es": "es/Gu\u00eda_JavaScript_1.5/Operadores/Operadores_de_comparaci\u00f3n", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_de_comparaison", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/Comparison_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operatory_por\u00f3wnania" } ) }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\226\211\345\214\205\347\232\204\351\201\213\347\224\250/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\226\211\345\214\205\347\232\204\351\201\213\347\224\250/index.html" new file mode 100644 index 0000000000..0e0905730f --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\226\211\345\214\205\347\232\204\351\201\213\347\224\250/index.html" @@ -0,0 +1,227 @@ +--- +title: 閉包的運用 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用 +--- +

閉包的運用

+

閉包（Closure）經常會被認為是 JavaScript 的高級機能，但了解閉包是精通語言的必要之事。

+

思考以下的函數︰

+
function init() {
+  var name = "Mozilla";
+  function displayName() {
+    alert(name);
+  }
+  displayName();
+}
+
+

init() 函數建立了稱為 name 的局域變數，然後定義了稱為 displayName() 的函數。displayName() 是內部的函數 - 他是在 init() 內部定義的，而且只在函數本體內部才可使用。displayName() 沒有他自己的局域變數，但會重複使用在外部函數裡所宣告的 name 變數。

+

本例只會做一點事 - 試試執行代碼看會發生什麼。這是詞彙作用域的範例︰在 JavaScript 中，變數的作用域是由他自己在原始碼中的位置所定義的，且內部的函數能夠存取宣告於外部作用域的變數。

+

現在思考下例︰

+
function makeFunc() {
+  var name = "Mozilla";
+  function displayName() {
+    alert(name);
+  }
+  return displayName;
+}
+
+var myFunc = makeFunc();
+myFunc();
+
+

如果你執行這個代碼，將會發生和前一個 init() 例子完全相同的效果︰字串 "Mozilla" 將會被顯示在 JavaScript 的警告方框中。其中的不同點 - 以及有趣的一點 - 是內部的 displayName() 函數會在執行之前從外部的函數所返回。

+

代碼的運作看起來也許很不直覺。通常說，在函數內部的局域變數只存在於函數執行的期間。一旦 makeFunc() 執行完畢，預期不再需要 name 變數是很合理的。由於代碼仍舊以預期般的運作，很明顯情況並不如此。

+

對於這個難題的解答是 myFunc 已經變成閉包了。閉包是一種特殊的物件，其中結合了兩樣東西︰函數，和函數所建立的環境。環境由任意的局域變數所組成，這些變數是由在閉包建立的時間點上存在於作用域裡的所有變數。既然如此，myFunc 就是結合了 displayName 函數和閉包建立之後就存在的 "Mozilla" 字串這兩者的閉包。

+

這裡還有更為有趣的範例 - makeAdder 函數︰

+
function makeAdder(x) {
+  return function(y) {
+    return x + y;
+  };
+}
+
+var add5 = makeAdder(5);
+var add10 = makeAdder(10);
+
+print(add5(2));  // 7
+print(add10(2)); // 12
+
+

在這個範例中，我們已經定義了函數 makeAdder(x)，可接受單一參數 x，並返回新的函數。返回的函數會接受單一參數 y，並返回 x 和 y 的合。

+

就本質而言，makeAdder 是函數的製造機 - 他會建立可以把指定的值和他們的參數相加的函數。在上例中，我們使用了我們的函數製造機來建立兩個新的函數 - 一個給他自己的參數加上 5，另一個則加上 10。

+

add5 和 add10 兩個都是閉包。他們共享相同的函數本體的定義，但保存了不同的環境變數。在 add5 的環境中，x 是 5。至於互有關連的 add10，x 是 10。

+

實用的閉包

+

該是拋開理論的時候了 - 但是閉包真的有用嗎？讓我們思考閉包潛在的用處。閉包讓你把一些資料（環境）和可操作資料的函數聯繫在一起。這一點明顯和物件導向程式設式並行不悖，物件可讓我們把一些資料（物件的屬性）和一個以上的方法聯繫在一起。

+

因此，如果通常你會在某個地方使用附有單一方法的物件，你可以在這些地方使用閉包。

+

視情況你可能會想這樣做，這在 Web 上尤其常見。我們寫在 Web 上的 JavaScript 代碼多半是以事件為基礎 - 我們定義了一些行為，然後把這些行為和由使用者所觸發的事件（如 click 或 keypress）連繫在一起。我們的代碼通常被連繫為 Callback︰在回應事件時，所執行的單一函數。

+

這裡有個實際的例子︰假如我們希望在頁面上加入可以調整頁面文字的按鈕。以像素為單位，指定 body 元素的 font-size 是一個方法，然後以 em 為單位，設定在頁面上（如頁眉）的其他元素的大小︰

+
body {
+  font-family: Helvetica, Aria, sans-serif;
+  font-size: 12px;
+}
+
+h1 {
+  font-size: 1.5em;
+}
+h2 {
+  font-size: 1.2em;
+}
+
+

我們的互動式文字大小按鈕可以改變 body 元素的 font-size 屬性，拜相對單位之賜，接著對其他的元素做調整。

+

JavaScript 代碼︰

+
function makeSizer(size) {
+  return function() {
+    document.body.style.fontSize = size + 'px';
+  };
+}
+
+var size12 = makeSizer(12);
+var size14 = makeSizer(14);
+var size16 = makeSizer(16);
+
+

現在 size12、size14 和 size16 這些函數可分別調整 body 文字的大小為 12、14 和 16 像素。我們可以把代碼和按鈕（本例中使用的是連結）連繫在一起，如下︰

+
function setupButtons() {
+  document.getElementById('size-12').onclick = size12;
+  document.getElementById('size-14').onclick = size14;
+  document.getElementById('size-16').onclick = size16;
+}
+
<a href="#" id="size-12">12</a>
+<a href="#" id="size-14">14</a>
+<a href="#" id="size-16">16</a>
+
+

 

+

使用閉包模擬私有的方法

+

像 Java 這類語言可以把方法宣告為私有的，意思是這些方法只能被同一類別的其他方法所呼叫。

+

JavaScript 並不提供做這些事的原生方式，但可以使用閉包來模擬私有方法。私有方法不只是對限制代碼的存取這方面有用︰同時也是管理你的全域命名空間的強大方式，把非必要的方法堆在公開的界面裡。

+

這裡是如何使用閉包來定義可以存取私有函數和變數的公開函數︰

+
var Counter = (function() {
+  var privateCounter = 0;
+  function changeBy(val) {
+    privateCounter += val;
+  }
+  return {
+    increment: function() {
+      changeBy(1);
+    },
+    decrement: function() {
+      changeBy(-1);
+    },
+    value: function() {
+      return privateCounter;
+    }
+  }
+})();
+
+alert(Counter.value()); /* 顯示 0 */
+Counter.increment();
+Counter.increment();
+alert(Counter.value()); /* 顯示 2 */
+Counter.decrement();
+alert(Counter.value()); /* 顯示 1 */
+
+

在此完成了很多事。在上一個範例中，每一個閉包都有他自己的環境；此處我們建立了由三個函數所共享的單一環境︰Counter.increment、Counter.decrement、Counter.value。

+

共享的環境是建立在無名函數的本體內，無名函數一經定義就會開始執行。環境內含兩個私有項︰稱作 privateCounter 的變數，以及稱作 changeBy 的函數。這兩個私有項都不能在無名函數外部被直接存取。相對的，必須由三個公開的函數來存取這些私有項，這三個函數是從無名函數的封裝器所返回的。

+

這三個公開的函數共享閉包的同一個環境。感謝 JavaScript 的辭彙作用域，這三個函數都能存取 privateCounter 變數和 changeBy 函數。

+

按照這個方式來運用閉包，可以得到通常是附加在物件導向程式設計裡的資料隱藏和封裝的好處。

在循環中建立閉包︰常見的錯誤

+

在 JavaScript 1.7 引入 let 關鍵字以前，閉包常見的問題出現在當閉包是在循環內部建立的時候。思考以下的例子︰

+
<p id="help">這裡會顯示有用的提示</p>
+<p>E-mail: <input type="text" id="email" name="email"></p>
+<p>姓名: <input type="text" id="name" name="name"></p>
+<p>年齡: <input type="text" id="age" name="age"></p>
+
+
function showHelp(help) {
+  document.getElementById('help').innerHTML = help;
+}
+
+function setupHelp() {
+  var helpText = [
+      {'id': 'email', 'help': '你的 e-mail 位址'},
+      {'id': 'name', 'help': '你的完整姓名'},
+      {'id': 'age', 'help': '你的年齡（你必須大於 16 歲）'}
+    ];
+
+  for (var i = 0; i < helpText.length; i++) {
+    var item = helpText[i];
+    document.getElementById(item.id).onfocus = function() {
+      showHelp(item.help);
+    }
+  }
+}
+
+

helpText 陣列定義了三個有用的提示，每一個都和文件中的輸入欄位的 ID 連繫在一起。循環會在這些定義裡巡回一圈，給每一個顯示相關連的說明的方法使用 onfocus 事件。

+

如果你試著執行這個代碼，你會發現他並不如預期般的運作。不管你把焦點放在哪一個欄位上，都會顯示關於你的年齡的訊息。

+

這其中的原因是代入給 onfocus 的函數是閉包；這些閉包是由函數的定義和從 setupHelp 函數的作用域所捕捉到的環境所組成的。這三個閉包已經建立了，但每一個都共享同一個環境。每次執行 onfocus 的 Callback 的時候，循環執行的是他自己的閉包，以及指向 helpText 列表中的最後一項的變數 item（由三個閉包所共享）。

+

本例的解決方法是使用更多的閉包︰特別是使用稍早已描述過的函數製造機︰

+
function showHelp(help) {
+  document.getElementById('help').innerHTML = help;
+}
+
+function makeHelpCallback(help) {
+  return function() {
+    showHelp(help);
+  };
+}
+
+function setupHelp() {
+  var helpText = [
+      {'id': 'email', 'help': '你的 e-mail 位址'},
+      {'id': 'name', 'help': '你的完整姓名'},
+      {'id': 'age', 'help': '你的年齡（你必須大於 16 歲）'}
+    ];
+
+  for (var i = 0; i < helpText.length; i++) {
+    var item = helpText[i];
+    document.getElementById(item.id).onfocus = makeHelpCallback(item.help);
+  }
+}
+
+

這次就如預期般運作。而不是所有的 Callback 都共享單一的環境，makeHelpCallback 給每一個 help 建立新的環境，此處的 help 參照了相對應的 helpText 陣列的字串。

+

如果你使用 JavaScript 1.7 以上的版本，你可以使用 let 關鍵字建立具有區塊層級作用域的變數來解決這個問題︰

+
  for (var i = 0; i < helpText.length; i++) {
+    let item = helpText[i];
+    document.getElementById(item.id).onfocus = function() {
+      showHelp(item.help);
+    }
+  }
+
+

let 關鍵字使 item 變數改用具有區塊層級的作用域來建立，導致 for 循環每一次反復都能建立新的參考。意思是每一個閉包都會捕捉到個別的變數，解決因為共享同一環境所引起的問題。

效能的考量

+

如果並沒有特定的任務需要用到閉包，且閉包對 Script 的效能會有負面的影響，因此在其他函數的內部裡建立不必要的函數是很不智的。

+

例如，當建立新的物件或類別時，通常應該要把方法和物件的原型連繫在一起，而不是在物件的建構子中定義。這其中的理由是，每當呼叫建構子的時候，就要把方法代入（也就是每一個物件正在建立的時候）。

+

思考以下不切實際的例子︰

+
function MyObject(name, message) {
+  this.name = String(name);
+  this.message = String(message);
+  this.getName = function() {
+    return this.name;
+  };
+
+  this.getMessage = function() {
+    return this.message;
+  };
+}
+
+

上面的代碼並未從閉包的行為中取得好處，應該改用重整過的形式︰

+
function MyObject(name, message) {
+  this.name = String(name);
+  this.message = String(message);
+}
+MyObject.prototype = {
+  getName: function() {
+    return this.name;
+  },
+  getMessage: function() {
+    return this.message;
+  }
+};
+
+

或者是︰

+
function MyObject(name, message) {
+  this.name = String(name);
+  this.message = String(message);
+}
+MyObject.prototype.getName = function() {
+  return this.name;
+};
+MyObject.prototype.getMessage = function() {
+  return this.message;
+};
+
+

在上面這兩個範例中，繼承的原型可以被所有的物件所共享，而且在每一次建立物件時不再需要方法的定義。參閱 Core_JavaScript_1.5_教學#物件模型的細節 以取得更多細節。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的函數:escape_和_unescape_函數", "Core_JavaScript_1.5_教學:物件和屬性") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Working_with_Closures", "ja": "ja/Core_JavaScript_1.5_Guide/Working_with_Closures", "pl": "pl/Przewodnik_po_języku_JavaScript_1.5/Praca_z_zamknięciami" } ) }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\227\234\346\226\274/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\227\234\346\226\274/index.html" new file mode 100644 index 0000000000..de638e2a9f --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\227\234\346\226\274/index.html" @@ -0,0 +1,47 @@ +--- +title: 關於 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於 +--- +

 

+

JavaScript 各版本的新機能

+ +

你應該知道什麼

+

本教學假定你已具備如下背景知識︰

+ +

具有某些語言（如 C 或 Visual Basic）的程式設計經驗會很有幫助，但不是必要的。

+

JavaScript 的版本

+ +
JavaScript 的版本 Navigator 的版本
JavaScript 1.0 Navigator 2.0
JavaScript 1.1 Navigator 3.0
JavaScript 1.2 Navigator 4.0-4.05
JavaScript 1.3 Navigator 4.06-4.7x
JavaScript 1.4  
JavaScript 1.5 Navigator 6.0
Mozilla（開放源始碼的瀏覽器）
JavaScript 1.6 Firefox 1.5，其他以 Mozilla 1.8 為基礎的產品
JavaScript 1.7 Firefox 2，其他以 Mozilla 1.8.1 為基礎的產品
JavaScript 1.8 Firefox 3，其他以 Gecko 1.9 為基礎的產品
+

表 1: JavaScript 和 Navigator 版本
+
+Netscape Enterprise Server 的各版本亦分別支援不同的 JavaScript 版本。為幫助你編寫相容於 Enterprise Server 各版本的 Script，本教學使用略稱來表示 Server 的版本。

+ +
略稱 Enterprise Server 的版本
NES 2.0 Netscape Enterprise Server 2.0
NES 3.0 Netscape Enterprise Server 3.0
+

表 2: Netscape Enterprise Server 各版本的略稱

+

在何處取得 JavaScript 資訊

+

以下書藉內含核心 JavaScript 的文件︰

+ +

如果你是 JavaScript 的新手，就從 Core JavaScript 教學 著手。如果你已具備穩固的基礎，你可以從 Core JavaScript 參考 取得個別物件或語法的進一步細節。

+

JavaScript 的學習提示

+

JavaScript 的入門很簡單: 只需要有最新的 Web 瀏覽器。本教學使用了一些目前只能在最新版本的 Firefox（以及其化的 Gecko 瀏覽器）執行的 JavaScript 機能，所以建議使用最新版本的 Firefox。

+

互動式解譯器

+

互動式 JavaScript 的提示對於語言的學習有極大的幫助，使你不必儲存檔案或更新頁面就能以互動方式加以試驗。從 Firefox 的“工具”選單可以找到“錯誤主控台”，可提供嘗試互動式 JavaScript 的簡單途徑: 只需輸入一行代碼，並按下“執行”按鈕。

+

Image:ErrorConsole.png

+

Firebug

+

更高級的互動式提示還可使用第三方擴充套件 Firebug。Firebug 提供了高級的 DOM 檢視器（JavaScript 除錯器）、分析工具和各種實用工具︰

+

Image:Firebug.png

+

其中 Firebug 提供的最有用的功能是 console.log()，把自己的參數輸出到 Firebug 主控台的函數。有別於其他程式語言，JavaScript 並沒有輸出至標準輸出的概念。console.log() 提供了很有用的替代品，使你更容易觀察程式的執行。

+

本教學的許多範例中使用 alert() 顯示執行的訊息。如果你已安裝 Firebug，你可以使用 console.log() 取代 alert() 來執行這些範例。

+

文件慣例

+

JavaScript 應用程式可執行於許多的作業系統，本文的資訊可套用於所有的版本。檔案和資料夾路徑採用 Windows 格式（使用反斜線 (\) 分割資料夾名稱）。對 Unix 版本而言，資料夾路徑也是相同的，除非你使用斜線 (/) 取代反斜線來分割資料夾名稱。

+

本教學使用如下形式的 URL︰

+

http://server.domain/path/file.html

+

在上面的 URL 中，“server”表示執行應用程式的伺服器的名稱（例如︰research1、www），“domain”表示網際網路的域名（例如︰netscape.com、uiuc.edu），“path”表示在伺服器上的資料夾結構，“file.html”表示個別的檔名。一般來說，在 URL 裡以標準的等寬字型顯示的斜體表示是可修改的項目。如果你的伺服器已啟用 Secure Sockets Layer (SSL)，URL 的 http 就應該取代為 https。

+

本教程使用如下的字型慣例︰

+ +

{{ PreviousNext("Core_JavaScript_1.5_教學", "Core_JavaScript_1.5_教學:JavaScript_概要") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/About", "es": "es/Gu\u00eda_JavaScript_1.5/Acerca_de_esta_gu\u00eda", "fr": "fr/Guide_JavaScript_1.5/\u00c0_propos", "ja": "ja/Core_JavaScript_1.5_Guide/About", "ko": "ko/Core_JavaScript_1.5_Guide/About", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/O_tym_przewodniku", "zh-cn": "cn/Core_JavaScript_1.5_Guide/\u5173\u4e8e" } ) }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/parseint_\345\222\214_parsefloat_\345\207\275\346\225\270/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/parseint_\345\222\214_parsefloat_\345\207\275\346\225\270/index.html" new file mode 100644 index 0000000000..65d1287175 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/parseint_\345\222\214_parsefloat_\345\207\275\346\225\270/index.html" @@ -0,0 +1,21 @@ +--- +title: parseInt 和 parseFloat 函數 +slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數 +--- +

 

+
+

parseInt 和 parseFloat 函數

+

這兩個〝分析〞函數，parseInt 和 parseFloat，會在給與字串作為參數時返回數值。

+

parseFloat 的語句如下

+
parseFloat(str)
+
+

此處的 parseFloat 會分析他自己的參數，字串 str，並試著返回浮點數。如果遇到正負符號 (+ 或 -)、數字 (0-9)、小數點、指數以外的字元，他就會返回在此之前的數值，並忽略那些字元。如果連第一個字元也不可以轉換為數字，就會返回〝NaN〞（不是數字）。

+

parseInt 的語句如下

+
parseInt(str [, radix])
+
+

parseInt 會分析他自己的參數，字串 str，並試著返回由第二個參數所指定的 radix （基數）的整數。radix 為選用性參數。舉例來說，以 10 為底的基數表示要轉換為十進制數，8 是八進制，16 是十六進制，依此類推。對於 10 以上的基數，就會使用字母來表示大於九的數字。例如，十六進制數（基數 16），就會用到 A 到 F 的字母。

+

如果 parseInt 遇到不是在指定基數之內的字元，就會直接忽略這個字元及其隨後字元，並返回在此之前已經分析出來的整數值。如果連第一個字元也不可以轉換為指定基數之內的字元，就會返回〝NaN〞。parseInt 函數會切除字串以取得整數值。

+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的函數:isNaN_函數", "Core_JavaScript_1.5_教學:預先定義的函數:Number_和_String_函數") }}

+

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Predefined_Functions/parseInt_and_parseFloat_Functions", "es": "es/Gu\u00eda_JavaScript_1.5/Funciones_predefinidas/Funciones_parseInt_y_parseFloat", "fr": "fr/Guide_JavaScript_1.5/Fonctions_pr\u00e9d\u00e9finies/Les_fonctions_parseInt_et_parseFloat", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Functions/parseInt_and_parseFloat_Functions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Funkcje_predefiniowane/Funkcje_parseInt_i_parseFloat" } ) }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/array_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/array_\347\211\251\344\273\266/index.html" new file mode 100644 index 0000000000..a806c4dfac --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/array_\347\211\251\344\273\266/index.html" @@ -0,0 +1,151 @@ +--- +title: Array 物件 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件 +--- +

 

+

Array 物件

+

JavaScript 並沒有明確的陣列資料類型。不過你可以在你的應用程式中，使用預先定義的 Array 物件和他的方法來運用陣列。Array 物件有各種陣列的操作方法，如合併、反轉、排序。他還有用來確定陣列的長度的屬性，還有和正規表達式一起使用的屬性。

+

陣列是值的有序集合，你可以使用名稱或索引來參考這些值。例如，你有一個稱作 emp 的陣列，其中內含職員的名字，並按照職員的編號來索引。於是 emp{{ mediawiki.external(1) }} 就代表編號 1 的職員，emp{{ mediawiki.external(2) }} 就代表編號 2 的職員，依此類推。

+

 

+

陣列的建立

+

Array 物件的建立如下︰

+
1. arrayObjectName = new Array(element0, element1, ..., elementN)
+2. arrayObjectName = new Array(arrayLength)
+
+

arrayObjectName 就是新物件的名稱、或者是既存物件的屬性。當使用 Array 的屬性和方法的時候，arrayObjectName 就是既存的 Array 物件的名稱、或者是既存物件的屬性。

+

element0, element1, ..., elementN 就是陣列元素的值的列表。如果指定了這個形式的話，陣列就會以指定的值作為元素來初始化，且陣列的 length 屬性會被設為參數的數目。

+

arrayLength 就是陣列的初期長度。下面的代碼建立帶有五個元素的陣列︰

+
billingMethod = new Array(5)
+
+

陣列的字面表達同時也是 Array 物件；舉例來說，下面的字面表達就是 Array 物件。參閱 陣列的字面表達 以取得陣列的字面表達的細節。

+
coffees = ["French Roast", "Columbian", "Kona"]
+
+

陣列的存放

+

你可以藉由把值代入給陣列自己的元素的方式來存放到陣列裡。例如，

+
emp[1] = "Casey Jones"
+emp[2] = "Phil Lesh"
+emp[3] = "August West"
+
+

你也可以在建立陣列的同時來作存放︰

+
myArray = new Array("Hello", myVar, 3.14159)
+
+

陣列元素的參考

+

你可以使用元素的序號來參考陣列的元素。例如，假設你定義了如下的陣列︰

+
myArray = new Array("Wind","Rain","Fire")
+
+

然後你可以使用 myArray{{ mediawiki.external(0) }} 來參考第一個元素，使用 myArray{{ mediawiki.external(1) }} 來參考第二個元素。

+

元素的索引是從零 (0) 開始的，不過陣列的長度（例如，myArray.length）反映的是陣列中的元素的數目。

+

Array 的方法

+

Array 物件有以下的方法︰

+ +

 

+
   myArray = new Array("1","2","3")
+   myArray = myArray.concat("a", "b", "c"); // myArray 現在是 ["1", "2", "3", "a", "b", "c"]
+
+

 

+ +

 

+
   myArray = new Array("Wind","Rain","Fire")
+   list = myArray.join(" - "); // list 的內容是 "Wind - Rain - Fire"
+
+

 

+ +

 

+
   myArray = new Array("1", "2", "3");
+   last=myArray.pop(); // MyArray 現在是 ["1", "2"], last = "3"
+
+

 

+ +

 

+
   myArray = new Array("1", "2");
+   myArray.push("3"); // MyArray 現在是 ["1", "2", "3"]
+
+

 

+ +

 

+
   myArray = new Array ("1", "2", "3");
+   myArray.reverse(); // 調換陣列的結果是 myArray = [ "3", "2", "1" ]
+
+

 

+ +

 

+
   myArray = new Array ("1", "2", "3");
+   first=myArray.shift(); // MyArray 現在是 ["2", "3"]，first 是 "1"
+
+

 

+ +

 

+
   myArray = new Array ("a", "b", "c", "d", "e");
+   myArray = myArray.slice(1,4); // 從索引 1 為起點抽出所有的元素，直到索引 4 為止，返回 [ "b", "c", "d" ]
+
+

 

+ +

 

+
   myArray = new Array ("1", "2", "3", "4", "5");
+   myArray.splice(1,3,"a","b","c", "d"); // MyArray 現在是 ["1", "a", "b", "c", "d", "5"]
+   // 這個代碼從索引 1（也就是 "2"）開始，把那裡的 3 個元素移除掉，
+   // 然後把所有的連續元素插入到那個位置。
+
+

 

+ +

 

+
   myArray = new Array("Wind","Rain","Fire")
+   myArray.sort(); // 排序陣列的結果是 myArrray = [ "Fire", "Rain", "Wind" ]
+
+

 

+

sort 也接受 Callback 函數以確定該如何排序陣列的內容。這個函數會對兩個值作比較，並返回三個值的其中一者︰

+ +

舉例來說，下面的代碼將以陣列最後面的字母來排序︰

+

 

+
   var sortFn = function(a,b){
+       if (a[a.length - 1] < b[b.length - 1]) return -1;
+       if (a[a.length - 1] > b[b.length - 1]) return 1;
+       if (a[a.length - 1] == b[b.length - 1]) return 0;
+       }
+   myArray.sort(sortFn); // 排序陣列的結果是 myArray = ["Wind","Fire","Rain"]
+
+

 

+ +

二維陣列

+

下面的代碼建立二維陣列。

+
a = new Array(4)
+for (i=0; i < 4; i++) {
+   a[i] = new Array(4)
+   for (j=0; j < 4; j++) {
+      a[i][j] = "["+i+","+j+"]"
+   }
+}
+
+

本例以如下的行來建立陣列︰

+
行 0:[0,0][0,1][0,2][0,3]
+行 1:[1,0][1,1][1,2][1,3]
+行 2:[2,0][2,1][2,2][2,3]
+行 3:[3,0][3,1][3,2][3,3]
+
+

陣列和正規表達式

+

如果有一個陣列是正規表達式和字串之間比對的結果，這個陣列會返回有關比對的資訊的屬性和元素。陣列可以是 RegExp.exec、String.match、String.split 的返回值。若需要與正規表達式一同使用陣列的資訊，詳見第四章，正規表達式。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件", "Core_JavaScript_1.5_教學:預先定義的核心物件:Boolean_物件") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/boolean_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/boolean_\347\211\251\344\273\266/index.html" new file mode 100644 index 0000000000..02648f7073 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/boolean_\347\211\251\344\273\266/index.html" @@ -0,0 +1,12 @@ +--- +title: Boolean 物件 +slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件 +--- +

 

+

Boolean 物件

+

Boolean 物件是原始的 Boolean 資料類型包裝而成。使用下面的語法來建立 Boolean 物件︰

+
booleanObjectName = new Boolean(value)
+
+

別把原始的布林值的 true 和 false 與 Boolean 物件的 true 和 false 值給混淆了。任何物件的值只要不是 undefined、null、0、NaN、空字串，即使是值為 false 的 Boolean 物件，當傳入到條件語句裡的時候，其求值結果仍為 true。參閱 if...else 語法 取得更進一步資訊。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件:Array_物件", "Core_JavaScript_1.5_教學:預先定義的核心物件:Date_物件") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/date_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/date_\347\211\251\344\273\266/index.html" new file mode 100644 index 0000000000..ca94741f14 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/date_\347\211\251\344\273\266/index.html" @@ -0,0 +1,82 @@ +--- +title: Date 物件 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件 +--- +

 

+

Date 物件

+

JavaScript 並沒有日期的資料類型。不過你可以在你的應用程式中使用 Date 物件及其方法來使用日期和時間。Date 物件有非常大量的方法可用來設定、取得、操作日期。不過沒有任何的屬性。

+

JavaScript 處理日期的方式很類似 Java。這兩個語言有很多同樣的日期方法，而且這兩個語言都是以 1970 年 1 月 1 日 00:00:00 開始的毫秒數來儲存日期。

+

Date 物件的範圍是以 1970 年 1 月 1 日 (UTC) 為基準，從 -100,000,000 日一直到 100,000,000 日。

+

如下建立 Date 物件︰

+
dateObjectName = new Date([parameters])
+
+

此處的 dateObjectName 就是將要建立的 Date 物件的名稱；他可以是新的物件或是既存物件的屬性。

+

前敘語法中的 parameters 可以是下列的任何一種形式︰

+ +

JavaScript 1.2 及早期版本
+ Date 物件的行為如下︰

+ +

Date 物件的方法

+

用於處理日期和時間的 Date 物件的方法主要可分為這幾類︰

+ +

使用 "get" 和 "set" 方法，你可以分別取得或設定秒、分、時、日、星期、月、年。還有 getDay 方法可返回星期，但沒有相對應的 setDay 方法，因為星期會自動設定。這些方法使用整數來表示如下的這些值︰

+ +

舉例來說，假設你定義了如下日期︰

+
Xmas95 = new Date("December 25, 1995")
+
+

Xmas95.getMonth() 返回 11，而 Xmas95.getFullYear() 返回 1995。

+

getTime 和 setTime 方法對於日期的比較來說很有用。getTime 方法返回自 1970 年 1 月 1 日 00:00:00 以來的毫秒數。

+

例如，下面的代碼顯示今年的剩餘天數︰

+
today = new Date()
+endYear = new Date(1995,11,31,23,59,59,999) // 設定日和月
+endYear.setFullYear(today.getFullYear()) // 設定為今年
+msPerDay = 24 * 60 * 60 * 1000 // 一天的毫秒數
+daysLeft = (endYear.getTime() - today.getTime()) / msPerDay
+daysLeft = Math.round(daysLeft) // 返回今年的剩餘天數
+
+

本範例建立了名為 today 的 Date 物件，其中內含有今天的日期。然後，使用一天的毫秒數，計算今天和 endYear 之間的天數，使用 getTime 並捨入為天數。

+

The parse 方法對於把值從日期字串代入到既存的 Date 物件來說很有用。例如，下面的代碼使用 parse 和 setTime 把日期的值代入到 IPOdate 物件︰

+
IPOdate = new Date()
+IPOdate.setTime(Date.parse("Aug 9, 1995"))
+
+

Date 物件的使用︰範例

+

在下面的範例中，函數 JSClock() 返回以數位時鐘為格式的時間。

+
function JSClock() {
+   var time = new Date()
+   var hour = time.getHours()
+   var minute = time.getMinutes()
+   var second = time.getSeconds()
+   var temp = "" + ((hour > 12) ? hour - 12 : hour)
+   if (hour == 0)
+      temp = "12";
+   temp += ((minute < 10) ? ":0" : ":") + minute
+   temp += ((second < 10) ? ":0" : ":") + second
+   temp += (hour >= 12) ? " P.M." : " A.M."
+   return temp
+}
+
+

JSClock 函數首先建立稱為 time 的新 Date 物件；因為沒有提供參數，time 會以今天的日期和時間來建立。然後呼叫 getHours、getMinutes、getSeconds 方法把時、分、秒的值代入到 hour、minute、second。

+

以下的四個語句會以 time 為基準建立字串。第一個語句建立變數 temp，使用條件表達式把值代入；如果 hour 大於 12，就會是 (hour - 12)，否則會是單純的 hour，除非 hour 為 0，這時就會是 12。

+

下一個語句把 minute 的值附加到 temp 裡。如果 minute 的值小於 10，條件表達式就會加上前置為零的字串；否則加上分隔用分號的字串。接下來的語句把秒的值以同樣方式附加到 temp。

+

最後，如果 hour 大於 12，條件表達式就把 "PM" 附加到 temp；否則就把 "AM" 附加到 temp。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件:Boolean_物件", "Core_JavaScript_1.5_教學:預先定義的核心物件:Function_物件") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/function_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/function_\347\211\251\344\273\266/index.html" new file mode 100644 index 0000000000..4acf1e73ca --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/function_\347\211\251\344\273\266/index.html" @@ -0,0 +1,45 @@ +--- +title: Function 物件 +slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件 +--- +

 

+

Function 物件

+

預先定義的 Function 物件會把指定的 JavaScript 字串的代碼編譯成函數。

+

建立 Function 物件如下︰

+
functionObjectName = new Function ([arg1, arg2, ... argn], functionBody)
+
+

functionObjectName 就是變數的名稱或既存物件的屬性。他也可以是後跟小寫的事件處理器名稱的物件，如 window.onerror。

+

arg1, arg2, ... argn 就是要被函數用作形式參數的名稱的參數。其中每一個都必須是字串，並合於有效的 JavaScript 識別子。例如 "x" 或 "theForm"。

+

functionBody 就是指定的 JavaScript 代碼的字串，將會編譯成函數本體。

+

Function 物件會在每一次被用到時求值。這比宣告函數並在你的代碼中呼叫還要沒效率，因為宣告過的函數已經編譯過了。

+

除了此處所描述的函數的定義方式以外，你也可以使用 function 語句和函數的表達式。參閱 Core JavaScript 1.5 參考 取得更進一步資訊。

+

下面的代碼把函數代入到變數 setBGColor。這個函數會設定目前文件的背景色。

+
var setBGColor = new Function("document.bgColor='antiquewhite'")
+
+

若要呼叫這個 Function 物件，你可以把指定的變數名稱如同函數一般來使用。下面的代碼執行了由 setBGColor 變數所指定的函數︰

+
var colorChoice="antiquewhite"
+if (colorChoice=="antiquewhite") {setBGColor()}
+
+

你可以使用下列任一方式把函數代入給事件處理器︰

+
1. document.form1.colorButton.onclick=setBGColor
+2. <INPUT NAME="colorButton" TYPE="button"
+      VALUE="Change background color"
+      onClick="setBGColor()">
+
+

上面所建立的變數 setBGColor 類似於宣告下面的函數︰

+
function setBGColor() {
+   document.bgColor='antiquewhite'
+}
+
+

把函數代入給變數類似於宣告函數，但有幾點不同︰

+ +

你可以在函數的內部嵌入函數。內嵌的（內部）函數對於包含這個函數的（外部）函數而言是私有的︰

+ +

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件:Date_物件", "Core_JavaScript_1.5_教學:預先定義的核心物件:Math_物件") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/math_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/math_\347\211\251\344\273\266/index.html" new file mode 100644 index 0000000000..8aa6bb0223 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/math_\347\211\251\344\273\266/index.html" @@ -0,0 +1,69 @@ +--- +title: Math 物件 +slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件 +--- +

 

+

Math 物件

+

預先定義的 Math 物件具有針對數學常數和函數的屬性和方法。例如，Math 物件的 PI 屬性有圓周率的值 (3.141...)，你可以在應用程式中如下使用。

+
Math.PI
+
+

同樣的，Math 的方法就是標準的數學函數。其中包括三角函數、對數函數、指數函數、以及其他函數。例如，如果你想要使用三角函數 sine，你可以如下編寫。

+
Math.sin(1.56)
+
+

注意，Math 所有的三角函數的方法只接受以弧度為單位的參數。

+

下表列出了 Math 物件的方法。

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
方法說明
abs絕對值。
sin, cos, tan標準三角函數；參數以弧度為單位。
acos, asin, atan, atan2反三角函數；返回值以弧度為單位。
exp, log指數函數和以 e 為底的自然對數。
ceil返回大於等於參數的最小整數。
floor返回小於等於參數的最大整數。
min, max返回兩個參數中最大的或最小的。
pow指數函數；第一個參數為底數，第二個為指數。
random返回介於 0 和 1 之間的隨機數。
round把參數捨入至最接近的整數。
sqrt平方根。
+

表 7.1: Math 的方法

+

有別於其他的物件，你永遠不需要自行建立 Math 物件。你永遠可以使用預先定義的 Math 物件。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件:Function_物件", "Core_JavaScript_1.5_教學:預先定義的核心物件:Number_物件") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/number_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/number_\347\211\251\344\273\266/index.html" new file mode 100644 index 0000000000..01ff1ca26f --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/number_\347\211\251\344\273\266/index.html" @@ -0,0 +1,80 @@ +--- +title: Number 物件 +slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件 +--- +

 

+

Number 物件

+

The Number 物件具有用於數值常數的屬性，如最大值、非數字、無限大。你不能改變這些屬性的值，你可以如下使用這些屬性︰

+
biggestNum = Number.MAX_VALUE
+smallestNum = Number.MIN_VALUE
+infiniteNum = Number.POSITIVE_INFINITY
+negInfiniteNum = Number.NEGATIVE_INFINITY
+notANum = Number.NaN
+
+

你永遠可以如上方式參照預先定義的 Number 物件的屬性，而不是參照你自己建立的 Number 物件的屬性。

+

下表列出 Number 物件的屬性。

+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
屬性說明
MAX_VALUE所能表示的最大的數字
MIN_VALUE所能表示的最小的數字
NaN特殊的 "not a number"（非數字）值
NEGATIVE_INFINITY特殊的負無限大的值；溢出時返回
POSITIVE_INFINITY特殊的正無限大的值；溢出時返回
+

表 7.2: Number 的屬性

+

Number 的原型提供從 Number 物件取得各種格式的資訊的方法。下表列出 Number.prototype 的方法。

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
方法說明
toExponential返回以指數符號表示的數字的字串。
toFixed返回以固定小數點表示的數字的字串。
toPrecision返回以指定精度的固定小數點表示的數字的字串。
toSource返回表示指定的 Number 物件的字面表達。你可以使用這個值來建立新的物件。覆蓋 Object.toSource 方法。
toString返回表示指定物件的字串。覆蓋 Object.toString 方法。
valueOf返回指定物件的原始值。覆蓋 Object.valueOf 方法。
+

表 7.3: Number.prototype 的方法

+

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件:Math_物件", "Core_JavaScript_1.5_教學:預先定義的核心物件:RegExp_物件") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/regexp_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/regexp_\347\211\251\344\273\266/index.html" new file mode 100644 index 0000000000..6d26e86067 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/regexp_\347\211\251\344\273\266/index.html" @@ -0,0 +1,9 @@ +--- +title: RegExp 物件 +slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件 +--- +

 

+

RegExp 物件

+

RegExp 物件可讓你運用正規表達式。已在第 4 章中解說過，正規表達式。

+

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件:Number_物件", "Core_JavaScript_1.5_教學:預先定義的核心物件:String_物件") }}

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/string_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/string_\347\211\251\344\273\266/index.html" new file mode 100644 index 0000000000..9e18d6ca98 --- /dev/null +++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/string_\347\211\251\344\273\266/index.html" @@ -0,0 +1,88 @@ +--- +title: String 物件 +slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件 +--- +

 

+

String 物件

+

String 物件只有一個屬性，length，用來指明字串中的字元數目。例如，下面的代碼把 13 的值代入給 x，因為 "Hello, World!" 有 13 個字元︰

+
mystring = "Hello, World!"
+x = mystring.length
+
+

String 物件有兩種類型的方法︰一種是返回對字串本身的修改，如 substring 和 toUpperCase，另一種是返回字串的 HTML 格式版本，如 bold 和 link。

+

舉例來說，延用前面的例子，mystring.toUpperCase() 和 "hello, world!".toUpperCase() 都會返回字串 "HELLO, WORLD!"。

+

substring 方法接受兩個參數，並返回介於兩個參數之間的字串的子集。延用前面的例子，mystring.substring(4, 9) 返回字串 "o, Wo"。參閱 Core JavaScript 參考 中的 String 物件的 substring 方法，以取得更進一步資訊。

+

String 物件也有大量的針對自動的 HTML 格式化的方法，如 bold 建立粗體文字，link 建立超連結。例如，你可以使用 link 方法建立連結到某個 URL 的超連結，如下︰

+
mystring.link("http://www.helloworld.com")
+
+

下表列出 String 物件的方法。

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
方法說明
anchor建立已命名的 HTML 錨點。
big, blink, bold, fixed, italics, small, strike, sub, sup建立 HTML 格式的字串。
charAt, charCodeAt返回字串中指定位置的字元或者字元內碼。
indexOf, lastIndexOf返回字串中指定子字串的位置，或指定子字串的最後的位置。
link建立 HTML 超連結。
concat合併兩個字串的文字，並返回新的字串。
fromCharCode從指定的 Unicode 值的序列建構字串。這是 String 類別的方法，而不是 String 實體的。
split藉由把字串分成子字串的方式，把 String 物件分割成字串的陣列。
slice抽出字串的片斷，並返回新的字串。
substring, substr以指定的起始或終止索引、或起始索引和長度，返回指定字串的子集。
match, replace, search與正則表達式配合使用。
toLowerCase, toUpperCase返回全是大寫或全是小寫的字串。
+

表 7.4: String 實體的方法

+

字串的字面表達並不是 String 物件

+

String 物件只是字串的原始資料類型的包裝而已。別把字串的字面表達和 String 物件相混淆了。例如，下面的代碼建立字串的字面表達 s1 和 String 物件 s2︰

+
s1 = "foo" // 建立字串的字面表達值
+s2 = new String("foo") // 建立 String 物件
+
+

你可以在字串的字面表達值上呼叫所有的 String 物件的方法—JavaScript 會自動把字串的字面表達轉換成臨時的 String 物件，呼叫其方法，然後丟棄臨時的 String 物件。你也可以在字面表達上使用 String.length 屬性。

+

你應該使用字串的字面表達，除非你確定需要使用 String 物件，因為 String 物件會有反直覺的行為。例如︰

+
s1 = "2 + 2" // 建立字串的字面表達值
+s2 = new String("2 + 2") //建立 String 物件
+eval(s1) // 返回數字 4
+eval(s2) // 返回字串 "2 + 2"
+
+

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件:RegExp_物件", "Core_JavaScript_1.5_教學:繼承") }}

diff --git "a/files/zh-tw/orphaned/web/svg/\346\225\231\345\255\270/index.html" "b/files/zh-tw/orphaned/web/svg/\346\225\231\345\255\270/index.html" new file mode 100644 index 0000000000..5521386506 --- /dev/null +++ "b/files/zh-tw/orphaned/web/svg/\346\225\231\345\255\270/index.html" @@ -0,0 +1,13 @@ +--- +title: 教學 +slug: Web/SVG/教學 +--- +

 

+


+本教學解說 SVG（Scalable Vector Graphics）的 1.1 版本，是一種 W3C XML 的衍伸語言，且已部分實裝於 Firefox 1.5、Opera 8.5 還有其他的瀏覽器。

+

本教學仍處於非常早期的階段。如果可能的話，請幫忙彙整並寫成一、兩個段落。為本教學增添內容！

+
簡介
+ + +

{{ languages( { "en": "en/SVG/Tutorial", "fr": "fr/SVG/Tutoriel", "ja": "ja/SVG/Tutorial", "pl": "pl/SVG/Przewodnik" } ) }}

diff --git a/files/zh-tw/orphaned/xpcnativewrapper/index.html b/files/zh-tw/orphaned/xpcnativewrapper/index.html new file mode 100644 index 0000000000..dfd2d74d9d --- /dev/null +++ b/files/zh-tw/orphaned/xpcnativewrapper/index.html @@ -0,0 +1,237 @@ +--- +title: XPCNativeWrapper +slug: XPCNativeWrapper +--- +

XPCNativeWrapper是一種包裝物件讓他可以安全的存取特權程式的方法。It can be used in all Firefox versions, though the behavior changed somewhat starting with Firefox 1.5 (Gecko 1.8)。請看XPCNativeWrapper at the Mozilla knowledgeBase有更多在Firefox 1.5之前的版本的XPCNativeWrapper的行為。這個文件是對Firefox 版本1.5以上的。

+ + + +

XPCNativeWrapper做了什麼？

+

一個XPCNativeWrapper限制他偽裝之屬性的存取以及物件的方法。惟一經由XPCNativeWrapper存取的屬性與方法是那些定義在IDL中，或是由DOM level 0所定義的(雖然有些DOM level 0的屬性跟方法不能在XPCNativeWrapper中作用)。實務上，經由Javascript所增加的屬性不會被XPCNativeWrapper顯露，and nor are getters and setters defined with __defineGetter__ and __defineSetter__。這個目的是要允許對物件的IDL定義方法安全的存取。

+ + +

請確定閱讀know bugs章節，特別是當寫的程式是針對1.5.0.x的firefox版本。

+ + +

Types of XPCNativeWrapper

+ +

這裡有三種不同類型的XPCNativeWrapper在Firefox 1.5。三種類型都包裝一個可能不安全(possibly-unsafe)的物件以及提供對他的屬性及方法的安全存取。

+ +

三種不同類型的XPCNativeWrapper的行為的差異是由兩個XPCNativeWrpper偽裝器所擁有的特色來決定。一個XPCNativeWrapper可以是明示的Explicit(或是相反的，暗示的Implicit)，並且可以是徹底的deep(反之，表面的shallow)。偽裝器創造的類型是由他們被創造的方式所決定，如下：

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

創造

+ 		+

明示/暗示

+ 		+

徹底/表面

+
+

被保護的script存取未信任的物件

+ 		+

暗示

+ 		+

徹底

+
+

由字串參數呼叫的建構元

+ 		+

明示

+ 		+

表面

+
+

由非字串參數所呼叫的建構元

+ 		+

明示

+ 		+

徹底

+
+ + + +

Explicit vs. Implicit

+

介於explicit與Implicit的XPCNativeWrapper行為的不同是，由非保護的script對Implicit XPCNativeWrapper屬性的存取是不安全的。屬性的存取將經由XPCNativeWrapper的wrappedJSObject被轉交。

+ + + +

這意味著非保護的script不需要擔心關於bug出現因為其他的code會把他們當作是Implicit來處理。換句話說，這些scripts確實需要注意不安全的物件存取。

+ + + +

對explicit的XPCNativeWrapper的屬性存取不論是否由被保護的呼叫者呼叫，都是安全的。

+ + +

Deep vs. Shallow

+ + +

Deep和Shallow的XPCNativeWrapper行為的差異是在於一個deep wrapper的屬性被存取或是函式被呼叫時，傳回值也將會被以他自己的XPCNativeWrapper來包裝。新的XPCNativeWrapper也會是deep並且也會是explicit，若且為若屬性被存取的XPCNativeWrapper是explicit。反之，當被存取的屬性或是函式是用shallow wrapper來呼叫，回傳直也許會是不安全的物件。

+ + +

舉例來說，我們給3個XPCNativeWrapper的實例給同樣的window物件。讓我們叫他們做deepExplicitwindow，deepImplicitwindow和shallowwindow。那我們有：

+ +
var doc1 = deepExplicitwindow.document; // doc1現在是document物件的一個deep explicit XPCNativeWrapper //存取doc1.open()是安全的  var doc2 = deepImplicitwindow.document; //假如呼叫者有設定.XPCNativeWrappers=yes, 那doc2現在是document object的deep implicit XPCNativeWrapper //否則doc2現在是不安全的document object, 因為屬性存取是簡單的從不安全的window object被傳送  var doc3 = shallowwindow.document; //doc3現在是不安全的document object  創造XPCNativeWrapper物件 有三種創造XPCNativeWrapper的方式;每種方法對應一種類型的XPCNativeWrapper  被保護的script存取未信任的物件 任何時候一個保護的script存取存取一個未信任的物件將會得到一個implicit deep XPCNativeWrapper。從被保護的script存取這個XPCNativeWrapper的屬性是安全的。  一但物件被包裝，一個用這種方式建立的包裝將會逗留(stick around)，另外在一行內存取物件兩次也會拿到相同的XPCNativeWrapper  什麼是被保護的script? 在firefox版本1.5到1.5.0.5, 一個script是被保護的或是不被保護是單獨基於他的URI。一個script是被保護的只有當他的URI由已知被保護的前綴開頭；不是由UR被讀取的script(e.g. 由javascript實作的元件)不是被保護的。在Firefox 1.5內被保護的前綴由Chrome Registry決定。  預設所有的content package是被保護的，這意味著所有的URI開頭是"chrome:// <package name>/content/"(對任何package)是被保護的。單獨的package用flag覆寫在他們的chrome manifest檔案。  從firefox 1.5.0.6開始，Javascript實作的元件是被保護的script。所以一個script不論是由被URI開頭是保護的前綴所讀取或者是Javascript實作的元件都是被保護的。  什麼是未信任的物件? 所有的物件都是信任或是未信任的。一個物件是被信任的假如有以下任何一項： 1.他的parent(Javascript中的_parent_屬性)是一個信任的物件。 2.他是Javascript元件的根範圍(root scope)物件。 3.他是信任的視窗的window物件。
+ + + +

因為所有的DOM物件有window物件在他的_parent_串裡面，所以他們是被信任的若且唯若他的window是被信任的。

+

什麼是被信任的window?

+

一個window物見是否被信任是依據他的容器。一個window是被信任的假如有以下任何一項：

+

1.他是頂層window(e.g.<xul:window>, <xul:dialog>, 或是某些用命令列flag -chrome被傳送的URI)

+

2.他的parent是被信任的，且符合以下三種之一：

+

1.他不是在<xul:iframe>或是<xul:browser>中被讀取

+

2.<xul:iframe>或<xul:browser>沒有用type屬性讀取他

+

3.<xul:iframe>或<xul:browser>讀取他的type屬性執不是'content'且沒有用'content-'開頭

+

注意一個視窗是否是被信任的不依據在window被讀取的URI。所以舉例來說，當在window已經是信任的document內，以下將會件創造信任的視窗

+

<xul:browser>

+

<xul:browser type=”chrome”>

+

<xul:browser type=”rabid_dog”>

+

<xul:iframe type=”foofy”>

+

<html:iframe>

+

<html:iframe type=”content”>

+

以下不會建立信任的windows：

+

<xul:browser type=”content”>

+

<html:iframe type=”content_primary”>

+

進一步注意任何未信任的window的child window自動是未信任的。

+

當script存取物件時什麼會發生?

+

下面這個表描述當一個script存取物件時會發生什麼，以及偽裝器是如何的參與。

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

Script

+ 		+

Object

+ 		+

Effects

+
+

保護的

+ 		+

信任的

+ 		+

沒有偽裝器被創造，所以script可以完全存取Object

+
+

保護的

+ 		+

未信任的

+ 		+

Implicit deep XPCNativeWrapper被建立

+
+

未保護的

+ 		+

信任的

+ 		+

沒有偽裝器被建立，就像protected/trusted的狀況

+
+

未保護的

+ 		+

未信任的

+ 		+

沒有偽裝器被建立，就像protected/trusted的狀況

+
+

使用XPCNativeWrapper建構元

+

以上描述，預設在新的Firefox版本XPCNativeWrapper被自動建立。你不需要使用XPCNativeWrapper建構元，除非你打算讓你的code用在舊版本的瀏覽器或者你關閉了XPCNativeWrapper。

+

用字串參數呼叫XPCNativeWrapper建構元

+

舉例來說:

+

var contentWinWrapper = new XPCNativeWrapper(content, 'document');

+

這會創造出一個explicit shallow XPCNativeWrapper。這語法被保留為了Firefox 1.5之前的相容性。當contentWinWrapper所有的屬性可以被安全的存取，這些屬性的回傳值不是安全的去存取(就像在版本小於Firefox 1.5裡)，因為XPCNativeWrapper是shallow。所以去比較內容文件標題到現在的內容區段，必須要：

+

var winWrapper = new XPCNativeWrapper(content, 'document', 'getSelection()');

+

var docWrapper = new XPCNativeWrapper(winWrapper.document, 'title');

+

return docWrapper.title == winWrapper.getSelection();

+

沒有字串參數呼叫XPCNativeWrapper建構元

+

舉例來說:

+

var contentWinWrapper = new XPCNativeWrapper(content);

+

這創造了explicit deep XPCNativeWrapper。XPCNativeWrapper存取屬性是安全的，並且回傳值也將會是用explicit deep XPCNativeWrapper包裝的物件。

+

(譯注: 可參閱http://kb.mozillazine.org/XPCNativeWrapper)

+

XPCNativeWrapper生命週期

+

Explicit XPCNativeWrapper物件存在當他們被參考到。建立一個新的explicit XPCNativeWrapper給一樣的可能不安全的物件將會建立一個新的偽裝器物件；當設定'expando'參數時，有時要注意。

+

Implicit XPCNativeWrapper物件跟他包裝的物件有相同的生命週期。

+

設定XPCNativeWrapper的expando屬性

+

為XPCNativeWrapper物件設定expando屬性是可能的。假如這樣做了，那chrome將可以看到他們expando屬性，但內容不行。沒有安全的方式從chrome去設定expando屬性並且讓他從content可讀取。

+

存取不安全的屬性

+

假如為了某些理由，不安全的屬性存取是必要的，這可以經由偽裝器的wrappedJSObject屬性去來完成。舉例，假如docWrapper是一個doc的偽裝器，那

+

docWrapper.wrappedJSObject.prop

+

等同於

+

doc.prop

+

就像這節的名稱，這樣做是不安全的。你不因該使用wrappedJSObject去傳遞XPCNativeWrapper在產品的code裡面。

+

在firefox3，wrappedJSObject回傳另外一個包覆JS Object的偽裝器(XPCSafeJSObjectWrapper)，這允許你安全的觀察內容物件。請見XPCSafeJSObjectWrapper。

+

請見Interaction between privileged and non-priviledged pages有另外更好的。

+

已知Bugs

+

在1.5.0.x版本有兩個已知的bug在XPCNativeWrapper

+

1.Firefox versions 1.5 through 1.5.0.4 have bug 337095, which causes wrappers to not be created for protected scripts in some cases. Specifically, if a protected script makes a property access or function call that returns an untrusted object, a wrapper will be created. However, if a function in a protected script is called from C++ and an untrusted object is passed as an argument to this function, a wrapper will not be created. Functions that expect to be called in this way need to do their own wrapping. This bug is fixed in Firefox 1.5.0.5 and later.

+

2.Firefox versions 1.5 through 1.5.0.5 have bug 345991, which causes components written in JavaScript to not be protected scripts. This bug is fixed in Firefox 1.5.0.6 and later.

+

XPCNativeWrapper的限制

+

這裡有一些不能被用在XPCNativeWrapper的一般使用的屬性跟程式風格。

+

1.對一個DOM node或是window物件的XPCNativeWrapper給予或是讀取一個on*屬性將會丟出Exception。(使用addEventListener取代，並且用event.preventDefault();在你的處理器內假如你之前用了return false;)

+

2.不能夠在XPCNativeWrapper內用window名稱存取iframe(e.g. window.framename)。

+

3.document.all 在XPCNativeWrapper內不能用。

+

4.在XPCNativeWrapper內不行對HTML文件用name存取命名的東西。舉例，假如你有<form name=”foo”>並且docWrapper是一個對HTML文件doc的偽裝器，那當docWrapper為定義時，doc.foo是一個HTMLFormElement。希望這樣做的程式能夠使用docWrapper.forms.namedItem('foo')取代。

+

5.對HTML文件，在XPCNativeWrapper內用id存取node是不行的。因該用getElementById()取代。

+

6.對HTML form，在XPCNativeWrapper內用name存取input是不行的。想這樣做的程式必須使用form.elements.namedItem('foo')取代。

+

7.對HTMLCollection，在XPCNativeWrapper內用name存取元素是步行的。想這樣做的程式碼必須使用namedItem()方法。注意這個namedItem只回傳第一個有name的input元素，即使有很多個有相同名稱的元素(e.g. Radio buttons)。

+

8.同樣的，對plugin、pluginArray、或是MimeTypeArray，在XPCNativeWrapper內用name存取items是不行的。你必須使用namedItem()取代。

+

9.不能經由XPCNativeWrapper呼叫由NPAPI plugin實作的方法。

+

10.不能夠經由XPCNativeWrapper取得(getting)或是設定(setting)由NPAPI plugin實作的屬性。

+

11.不能夠經由XPCNativeWrapper呼叫經由XBL binding附加到node上的方法。

+

12.不能夠經由XPCNativeWrapper取得(getting)或是設定(setting)經由XBL binding附加到node上的屬性。

+

13.經由'for(var p in wrapper)'列舉XPCNativeWrapper的屬性不會列舉IDL定義的屬性。

+

14.Object.prototype不在XPCNativeWrapper的原型鍊裡面。As a result，變異的Object.prototype被定義在XPCNativeWrapper(更準確一點，這裡有__proto__，__parent__，__count__，toSource，toLocalString，valueOf，watch，unwatch，hasOwnProperty，isPrototypeOf，propertyIsEnumerable，__defineGetter__，__defineSetter__，__lookupGetter__，and__lookupSetter__)。

+

15.沒有實作舊的XPCNativeWrapper有的importXPCNative，

+

16.不能經由XPCNativeWrapper存取標準類別(例如Function)。要對特定的window的parent建立function和物件，使用window的eval() function。

+

17.對'expando'的屬性使用刪除操作元在XPCNativeWrapper會丟出安全性Exceprion。

diff --git a/files/zh-tw/orphaned/zh-tw/index.html b/files/zh-tw/orphaned/zh-tw/index.html new file mode 100644 index 0000000000..87489b35a7 --- /dev/null +++ b/files/zh-tw/orphaned/zh-tw/index.html @@ -0,0 +1,5 @@ +--- +title: zh-tw +slug: zh-tw +--- +This page was auto-generated because a user created a sub-page to this page. diff --git "a/files/zh-tw/orphaned/\345\217\203\350\210\207_mozilla_\345\260\210\346\241\210/index.html" "b/files/zh-tw/orphaned/\345\217\203\350\210\207_mozilla_\345\260\210\346\241\210/index.html" new file mode 100644 index 0000000000..ebd327fa1d --- /dev/null +++ "b/files/zh-tw/orphaned/\345\217\203\350\210\207_mozilla_\345\260\210\346\241\210/index.html" @@ -0,0 +1,10 @@ +--- +title: 參與 Mozilla 專案 +slug: 參與_Mozilla_專案 +--- +

如果你對幫忙修正錯誤有興趣，並以各種方式致力於 Mozilla 平台的代碼的話，這裡可以找到很多文件，並指引你往正確的方向走。

+ +

一般性主題

+
Mozilla 開發者教學
提供給奉獻於 Mozilla 基礎代碼的開發提示和教學。
Mozilla 原始碼
關於如何取得 Mozilla 代碼，不論是下載或透過版本控制，以及如何把你的代碼引入這棵樹的資訊。
建置文件
關於如何建置 Mozilla 專案的資訊，包括 Firefox 和 Thunderbird。本頁需要整理。
Mozilla 平台
關於 Mozilla 平台的資訊，包含所有的 API 和技術，以及如何在你的專案中使用這些。
Mozilla 的文件化
為了 Mozilla，也為了開放式 Web，幫助我們建立並改善我們的文件。
除錯
在對 Mozilla 代碼進行除錯時的有用提示和方針。
品質保證
關於測試和錯誤追蹤的資訊。
本地化
關於翻譯 Mozilla 專案、文件至各種語言的資訊。
+

專案頁面

Thunderbird
Mozilla 的電子郵件客戶端
Sunbird
Mozilla 的月曆專案

工具

Bugzilla
為 Mozilla 專案追蹤問題的 Bugzilla 資料庫。
MXR
在 Web 上瀏覽並搜尋 Mozilla 原始碼資料處。
Bonsai
Bonsai 工具讓你在資料處找出是誰修改了這些檔案，以及他們做了什麼。
Tinderbox
Tinderbox 顯示這棵樹的狀態（不論目前是否可以建置）。在登記和登出之前先檢查這裡，以確保你是和作業樹一起協作。
崩潰追蹤
關於 Socorro 和 Talkback 崩潰回報系統的資訊。
效能追蹤
檢視 Mozilla 專案的效能資訊。
開發者論壇
有各種特定主題的討論列表的論壇，此處你可以交流有關 Mozilla 開發上的問題。
+

  {{ languages( { "en": "en/Participating_in_the_Mozilla_project", "zh-cn": "cn/Participating_in_the_Mozilla_project", "ja": "ja/Participating_in_the_Mozilla_project"} ) }}

diff --git "a/files/zh-tw/orphaned/\345\273\272\347\253\213\346\223\264\345\205\205\345\245\227\344\273\266/index.html" "b/files/zh-tw/orphaned/\345\273\272\347\253\213\346\223\264\345\205\205\345\245\227\344\273\266/index.html" new file mode 100644 index 0000000000..4d6c1c5acf --- /dev/null +++ "b/files/zh-tw/orphaned/\345\273\272\347\253\213\346\223\264\345\205\205\345\245\227\344\273\266/index.html" @@ -0,0 +1,6 @@ +--- +title: 建立擴充套件 +slug: 建立擴充套件 +--- +

建立擴充套件 +

diff --git a/files/zh-tw/python/index.html b/files/zh-tw/python/index.html deleted file mode 100644 index 11e3c03038..0000000000 --- a/files/zh-tw/python/index.html +++ /dev/null @@ -1,66 +0,0 @@ ---- -title: Python -slug: Python -tags: - - Python -translation_of: Learn/Server-side/Django -translation_of_original: Python ---- -

Python 是一種直譯式的腳本語言，是一個跨平台的的語言，可以在各個平台上面使用，如：Linux、Mac OS X、以及Microsoft Windows.

-

學習 Python

-

免費的電子書

-

如果是初學 Python，可以考慮看 Dive Into Python，雖然他最後是更新的時間是2004年，但依然是一部免費而且很棒的教程。它含括了幾乎所有 Python 的基本元素，還有一些平常使用 Python 可以執行什麼任務，像是網頁的請求，檔案的處理。如果對於 Python 基礎已經基礎的概念，就可以參考 Text Processing In Python ，這本書將會對於 Python 有更進階的介紹。

-

其他相關的免費電子書或是線上資源 :

- -

當了解基礎的 Python，Code Like a Pythonista: Idiomatic Python 將幫助你了解一些 Python 特別的地方，還有跟別的語言的差異。

-

Free Online Courses

- -

Python in Mozilla-based applications

-

XPCOM in Mozilla is used to support inter-language communication. Out-of-box it only supports C++ <-> JavaScript communication. The Python XPCOM package (also called PyXPCOM) is the low-level glue that ties Python and Mozilla together, letting XPCOM components written in JavaScript or C++ to be used from Python and vice versa. PyXPCOM is not included in the default Firefox build, so you'll need to use a third-party build or build yourself to use it. The most known consumer of PyXPCOM is the Komodo family of products.

-

Starting with Mozilla 1.9, Python DOM (PyDOM) bindings are implemented. This lets chrome XUL and HTML authors use Python in their <script> tags (again, not in the official Firefox/Thunderbird builds).

-

Python-based tools for Mozilla development

-

Python is used by Mozillians for tools that do various things with Mozilla apps and infrastructure. It would be useful to have a document on Python Environment and Tools for Mozilla.

-

Tools are listed here: http://k0s.org/toolbox/?language=python

-

Use of Python at Mozilla

-

Mozilla has considerable infrastructure based on python:

- -

Python packaging

-

Python uses setup.py files to record metadata and installation instructions for python packages. Running (e.g.) python setup.py install will install the package, making its modules available on python's import path. For python 2.x, several distribution/installation modules exist. distutils is the only distribution package available in python's standard library. distutils has ability to upload to the python package index and to install python packages. See the Python documentation on distutils for details.

-

While distutils is built in to python's standard library, setuptools is a third-party ad hoc standard for packaging and distribution. It is mostly compatible with distutils, but importantly adds the ability for packages to include dependencies that are installed as prerequisites at the time setup.py is invoked as well as the ability to install python packages in development mode. This allows the files to be edited in place via .pth files which is handy if you are actively working on a project. setuptools also provides an easy_install script for installing packages and their dependencies through the web from PyPI. For instance, in order to install the PyYAML package, just run

-
easy_install PyYAML
-
-

Since setuptools is not included with python, you will need to install it in order to use it. You may install it from the setuptools PyPI page by downloading, extracting, and running python setup.py install. Or you can use the ez_setup.py script. You can download and run it with python (with root/Administrator privileges), or if you're in a bash shell, you can run

-
sudo python <(curl http://peak.telecommunity.com/dist/ez_setup.py)
-
-

setuptools is also provided with instances of virtualenv, so if you use virtualenvs for developing you may not need to install setuptools globally. distribute is a fork of setuptools written by Mozilla's own Tarek Ziade. It is compatible with setuptools and fixes a few bugs there.

-
- Note: It's highly recommended that you use virtualenv for development!
-

The Python Package Index (PyPI) is the standard distribution point for python packages. If you need some functionality in python, it is a good place to look!

-

See also: http://k0s.org/portfolio/packaging.html

-

See also

- diff --git a/files/zh-tw/svg/tutorial/basic_shapes/index.html b/files/zh-tw/svg/tutorial/basic_shapes/index.html deleted file mode 100644 index 579f39bbe9..0000000000 --- a/files/zh-tw/svg/tutorial/basic_shapes/index.html +++ /dev/null @@ -1,150 +0,0 @@ ---- -title: 基本形状 -slug: SVG/Tutorial/Basic_Shapes -translation_of: Web/SVG/Tutorial/Basic_Shapes ---- -
- {{ PreviousNext("SVG/Tutorial/Positions", "SVG/Tutorial/Paths") }}
-

下面将介绍一些SVG绘图常用的形状命令，通过它们名字，你可以很轻易的看出它们可以画出什么。这里也会给出一些定义位置和尺寸的属性，但不会介绍如何将元素定义得更准确更完善。在这里我们只介绍必须的基本功能，因为它们会被广泛应用在SVG文件里。

-

基本形状

-

你需要在文档里创建一个元素，来新增相应的形状。不同的元素用来定义不同的形状，并采用不同的属性定义尺寸和位置。其中一些是可以被其他形状命令替代的，所以显得有点多余，但是它们的存在是有意义的，它们可以让你用起来更方便，并且保证你的SVG文档尽可能简洁易懂。所有的基本形状都在右边的图例里展示出来了，生成它们的代码如下：

-

-
- 
<?xml version="1.0" standalone="no"?>
-<svg width="200" height="250" version="1.1" xmlns="http://www.w3.org/2000/svg">
-
-  <rect x="10" y="10" width="30" height="30" stroke="black" fill="transparent" stroke-width="5"/>
-  <rect x="60" y="10" rx="10" ry="10" width="30" height="30" stroke="black" fill="transparent" stroke-width="5"/>
-
-  <circle cx="25" cy="75" r="20" stroke="red" fill="transparent" stroke-width="5"/>
-  <ellipse cx="75" cy="75" rx="20" ry="5" stroke="red" fill="transparent" stroke-width="5"/>
-
-  <line x1="10" x2="50" y1="110" y2="150" stroke="orange" fill="transparent" stroke-width="5"/>
-  <polyline points="60 110 65 120 70 115 75 130 80 125 85 140 90 135 95 150 100 145"
-      stroke="orange" fill="transparent" stroke-width="5"/>
-
-  <polygon points="50 160 55 180 70 180 60 190 65 205 50 195 35 205 40 190 30 180 45 180"
-      stroke="green" fill="transparent" stroke-width="5"/>
-
-  <path d="M20,230 Q40,205 50,230 T90,230" fill="none" stroke="blue" stroke-width="5"/>
-</svg>
-
-
-注意： stroke, stroke-width 和 fill 等属性会在后面的章节里介绍。
-

矩形 rect

-

rect元素用来创建矩形，它有6个基本属性，用于设定它的位置以及样式。上面的图例里，最开始的两个图形都是矩形，右边的矩形设定了rx和ry属性，从而增加了圆角，如果不给它们赋值，其默认值为0，也就没有圆角。

-
<rect x="10" y="10" width="30" height="30"/>
-<rect x="60" y="10" rx="10" ry="10" width="30" height="30"/>
-
-
- x
-
- 矩形左上角的x轴坐标
-
- y
-
- 矩形左上角的y轴坐标
-
- width
-
- 矩形的宽
-
- height
-
- 矩形的高
-
- rx
-
- 圆角的x轴半径
-
- ry
-
- 圆角的y轴半径
-
-

圆形 circle

-

circle 元素用来创建圆形，这里给出了3个属性：

-
<circle cx="25" cy="75" r="20"/>
-
-
- r
-
- 半径
-
- cx
-
- 圆心的x轴坐标
-
- cy
-
- 圆心的y轴坐标
-
-

椭圆 ellipse

-

椭圆ellipse其实就是一种特殊的圆形，这里可以改变x和y轴的半径来区分它们（数学上称为长轴半径和短轴半径）。

-
<ellipse cx="75" cy="75" rx="20" ry="5"/>
-
-
- rx
-
- x轴半径
-
- ry
-
- y轴半径
-
- cx
-
- 圆心的x轴坐标
-
- cy
-
- 圆心的y轴坐标
-
-

线 line

-

line画的是线段，通过在属性中定义起点和终点的坐标，构成两点之间的线段。

-
<line x1="10" x2="50" y1="110" y2="150"/>
-
-
- x1
-
- 第一个点的x轴坐标
-
- y1
-
- 第一个点的y轴坐标
-
- x2
-
- 第二个点的x轴坐标
-
- y2
-
- 第二个点的y轴坐标
-
-

折线 polyline

-

折线polyline是一组连接起来的线段，折线上所有的点都放在一个属性里:

-
<polyline points="60 110, 65 120, 70 115, 75 130, 80 125, 85 140, 90 135, 95 150, 100 145"/>
-
-
- points属性
-
-points属性是点的列表，每个数字用空格、逗号、换行或回车分隔开。每个点包括两个数字，一个x轴坐标一个y轴坐标，所以，(0,0)、(1,1)、(2,2)这三个点的列表应该写成“0 0, 1 1, 2 2”。
-
-

多边形 polygon

-

多边形polygon和折线很像，它们都是定义一组点，然后将点用线段连接起来，从而形成一个图形。不同的是，多边形的起点和终点会连起来，形成一个闭合的形状。需要注意的是，矩形也是一种多边形，如果需要的话，你也可以用多边形来创建一个矩形。

-
<polygon points="50 160, 55 180, 70 180, 60 190, 65 205, 50 195, 35 205, 40 190, 30 180, 45 180"/>
-
-
- points属性
-
多边形的points属性也是点的列表，每个数字用空格、逗号、换行或回车分隔开。每个点包括两个数字，一个x轴坐标一个y轴坐标，所以，(0,0)、(1,1)、(2,2)这三个点的列表应该写成“0 0, 1 1, 2 2”。这些都和折线的points属性一样。不同的是，这里的最后一个点和第一个点会自动连接起来，形成闭合路径。
-
-

路径 path

-

路径path可能是SVG中最通用的一种形状，通过path元素，我们可以创建矩形（有没有圆角都行）、圆形、椭圆形、折线、多边形，以及其他一些形状，比如二次贝塞尔曲线、三次贝塞尔曲线，等等。因为path很强大也很复杂，所以会在下一章进行详细介绍。这里只介绍一个定义路径形状的属性。

-
<path d="M 20 230 Q 40 205, 50 230 T 90230"/>
-
-
- d属性
-
- d属性的值是由一些点的坐标，以及控制这些坐标的命令组成的，它们一起描述了路径的形状。具体内容在path章节里介绍。
-
-
- {{ PreviousNext("SVG/Tutorial/Positions", "SVG/Tutorial/Paths") }}
diff --git a/files/zh-tw/tools/web_console/opening_the_web_console/index.html b/files/zh-tw/tools/web_console/opening_the_web_console/index.html deleted file mode 100644 index 85d89608b0..0000000000 --- a/files/zh-tw/tools/web_console/opening_the_web_console/index.html +++ /dev/null @@ -1,23 +0,0 @@ ---- -title: 打開網頁主控台 -slug: Tools/Web_Console/Opening_the_Web_Console -translation_of: Tools/Web_Console/UI_Tour ---- -

要開啟網頁主控台：

- - - -

網頁工具箱將出現在瀏覽器視窗底部，網頁主控台也會隨之啟動（網頁工具箱只會稱它為「主控台」）：

- -

網頁主控台

- -

網頁主控台介面主要有三大部分：

- - diff --git a/files/zh-tw/tools/web_console/ui_tour/index.html b/files/zh-tw/tools/web_console/ui_tour/index.html new file mode 100644 index 0000000000..85d89608b0 --- /dev/null +++ b/files/zh-tw/tools/web_console/ui_tour/index.html @@ -0,0 +1,23 @@ +--- +title: 打開網頁主控台 +slug: Tools/Web_Console/Opening_the_Web_Console +translation_of: Tools/Web_Console/UI_Tour +--- +

要開啟網頁主控台：

+ + + +

網頁工具箱將出現在瀏覽器視窗底部，網頁主控台也會隨之啟動（網頁工具箱只會稱它為「主控台」）：

+ +

網頁主控台

+ +

網頁主控台介面主要有三大部分：

+ + diff --git a/files/zh-tw/web/api/canvas_api/drawing_graphics_with_canvas/index.html b/files/zh-tw/web/api/canvas_api/drawing_graphics_with_canvas/index.html deleted file mode 100644 index 63bd0017fc..0000000000 --- a/files/zh-tw/web/api/canvas_api/drawing_graphics_with_canvas/index.html +++ /dev/null @@ -1,162 +0,0 @@ ---- -title: Drawing graphics with canvas -slug: Web/API/Canvas_API/Drawing_graphics_with_canvas -translation_of: Web/API/Canvas_API/Tutorial -translation_of_original: Web/API/Canvas_API/Drawing_graphics_with_canvas ---- -
-

Most of this content (but not the documentation on drawWindow) has been rolled into the more expansive Canvas tutorial, this page should probably be redirected there as it's now redundant but some information may still be relevant.

-
-

介紹

-

  在 Firefox 1.5, Firefox 引入了新的 HTML 元素 <canvas> 來繪製圖形。<canvas> 是基於 WHATWG canvas specification 的技術 (其發軔於蘋果公司在 Safari 上的實做)。 我們可以用它來在使用者端進行圖形和 UI 元件的渲染。

-

  <canvas> 創建了一個具有一致多個 rendering contexts 的區域。在本文中，我們著重於 2D rendering context 的部份。對於 3D 圖形，您可以參考 WebGL rendering context。

-

2D Rendering Context

-

先來個簡單的範例

-

  以下的程式碼做了一個簡單的展示：繪製兩個部份交疊的矩形 (其中一個矩形有透明屬性) :

-
function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-
-  ctx.fillStyle = "rgb(200,0,0)";
-  ctx.fillRect (10, 10, 55, 50);
-
-  ctx.fillStyle = "rgba(0, 0, 200, 0.5)";
-  ctx.fillRect (30, 30, 55, 50);
-}
-
- -

{{EmbedLiveSample('A_Simple_Example','150','150','/@api/deki/files/602/=Canvas_ex1.png')}}

-

  這個名為 draw 的函式從 canvas element 取得 2d context。物件 ctx 可以被用來在 canvas 上頭繪製圖形。從程式碼可以看出，我們簡單的藉由設定 fillStyle 繪製了兩個顏色不同的矩形，並透過 fillRect 設定其位置。此外，第二個矩形透過 rgba() 配置了透明屬性。

-

  關於更複雜的圖形繪製，我們可以使用 fillRect, strokeRect 和 clearRect，他們分別可以畫出填滿的矩形, 僅有外框的矩形以及矩形區域清除。

-

路徑的使用

-

  beginPath 函式用來初始一段路徑的繪製，並且可以透過 moveTo, lineTo, arcTo, arc 以及相關的函式來描述路徑內容。要結束的時候呼叫 closePath 即可。一旦路徑描述完畢，就可以透過 fill 或 stroke 來渲染該路徑在 canvas 上。

-
function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-
-  ctx.fillStyle = "red";
-
-  ctx.beginPath();
-  ctx.moveTo(30, 30);
-  ctx.lineTo(150, 150);
-  // was: ctx.quadraticCurveTo(60, 70, 70, 150); which is wrong.
-  ctx.bezierCurveTo(60, 70, 60, 70, 70, 150); // <- this is right formula for the image on the right ->
-  ctx.lineTo(30, 30);
-  ctx.fill();
-}
-
- -

{{EmbedLiveSample('Using_Paths','190','190','/@api/deki/files/603/=Canvas_ex2.png')}}

-

  呼叫 fill() 或 stroke() 代表該路徑已經被使用。若要重新進行填滿等動作，則需要重頭創造一次路徑。

-

圖像狀態

-

  fillStyle, strokeStyle, lineWidth 和 lineJoin 等屬性是 graphics state 的一部分。關於這些屬性的修改，您可以透過 save() 及 restore() 來進行操作。

-

一個更為複雜的範例

-

  接著我們來看一個稍微複雜一點的範例，它同時引入了路徑, 狀態的修改以及變換矩陣。

-
function drawBowtie(ctx, fillStyle) {
-
-  ctx.fillStyle = "rgba(200,200,200,0.3)";
-  ctx.fillRect(-30, -30, 60, 60);
-
-  ctx.fillStyle = fillStyle;
-  ctx.globalAlpha = 1.0;
-  ctx.beginPath();
-  ctx.moveTo(25, 25);
-  ctx.lineTo(-25, -25);
-  ctx.lineTo(25, -25);
-  ctx.lineTo(-25, 25);
-  ctx.closePath();
-  ctx.fill();
-}
-
-function dot(ctx) {
-  ctx.save();
-  ctx.fillStyle = "black";
-  ctx.fillRect(-2, -2, 4, 4);
-  ctx.restore();
-}
-
-function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-
-  // note that all other translates are relative to this one
-  ctx.translate(45, 45);
-
-  ctx.save();
-  //ctx.translate(0, 0); // unnecessary
-  drawBowtie(ctx, "red");
-  dot(ctx);
-  ctx.restore();
-
-  ctx.save();
-  ctx.translate(85, 0);
-  ctx.rotate(45 * Math.PI / 180);
-  drawBowtie(ctx, "green");
-  dot(ctx);
-  ctx.restore();
-
-  ctx.save();
-  ctx.translate(0, 85);
-  ctx.rotate(135 * Math.PI / 180);
-  drawBowtie(ctx, "blue");
-  dot(ctx);
-  ctx.restore();
-
-  ctx.save();
-  ctx.translate(85, 85);
-  ctx.rotate(90 * Math.PI / 180);
-  drawBowtie(ctx, "yellow");
-  dot(ctx);
-  ctx.restore();
-}
-
- -

{{EmbedLiveSample('A_More_Complicated_Example','215','215','/@api/deki/files/604/=Canvas_ex3.png')}}

-

  我們自定義了兩個函式： drawBowtie 以及 dot，並且個別呼叫了四次。在呼叫他們之前，我們使用了 translate() 和 rotate() 來設定接著要繪製圖形的 transformation matrix，這將改變最終 dot 和 bowtie 的位置。dot 繪製了一個以 (0, 0) 為中心的小黑正方形，而 drawBowtie 產生了一個填滿的蝴蝶結樣貌的圖形。

-

  save() 和 restore() 規範了一系列動作的初始和結尾。一個值得注意的地方是，旋轉的動作是基於該圖形當下所在的位置， 所以 translate() -> rotate() -> translate() 的結果會和 translate() -> translate() -> rotate() 不同。

-

和 Apple <canvas> 的相容性

-

For the most part, <canvas> is compatible with Apple's and other implementations. There are, however, a few issues to be aware of, described here.

-

</canvas> tag 是必要的

-

In the Apple Safari implementation, <canvas> is an element implemented in much the same way <img> is; it does not have an end tag. However, for <canvas> to have widespread use on the web, some facility for fallback content must be provided. Therefore, Mozilla's implementation has a required end tag.

-

If fallback content is not needed, a simple <canvas id="foo" ...></canvas> will be fully compatible with both Safari and Mozilla -- Safari will simply ignore the end tag.

-

If fallback content is desired, some CSS tricks must be employed to mask the fallback content from Safari (which should render just the canvas), and also to mask the CSS tricks themselves from IE (which should render the fallback content).

-
canvas {
-  font-size: 0.00001px !ie;
-}
-

其他特性

-

藉由 Canvas 渲染網頁內容

-
- This feature is only available for code running with Chrome privileges. It is not allowed in normal HTML pages. Read why.
-

Mozilla's canvas is extended with the drawWindow() method. This method draws a snapshot of the contents of a DOM window into the canvas. For example,

-
ctx.drawWindow(window, 0, 0, 100, 200, "rgb(255,255,255)");
-
-

would draw the contents of the current window, in the rectangle (0,0,100,200) in pixels relative to the top-left of the viewport, on a white background, into the canvas. By specifying "rgba(255,255,255,0)" as the color, the contents would be drawn with a transparent background (which would be slower).

-

It is usually a bad idea to use any background other than pure white "rgb(255,255,255)" or transparent, as this is what all browsers do, and many websites expect that transparent parts of their interface will be drawn on white background.

-

With this method, it is possible to fill a hidden IFRAME with arbitrary content (e.g., CSS-styled HTML text, or SVG) and draw it into a canvas. It will be scaled, rotated and so on according to the current transformation.

-

Ted Mielczarek's tab preview extension uses this technique in chrome to provide thumbnails of web pages, and the source is available for reference.

-
- Note: Using canvas.drawWindow() while handling a document's onload event doesn't work. In Firefox 3.5 or later, you can do this in a handler for the MozAfterPaint event to successfully draw HTML content into a canvas on page load.
-

更多資訊

- diff --git a/files/zh-tw/web/api/closeevent/index.html b/files/zh-tw/web/api/closeevent/index.html new file mode 100644 index 0000000000..0a6d0977ff --- /dev/null +++ b/files/zh-tw/web/api/closeevent/index.html @@ -0,0 +1,145 @@ +--- +title: CloseEvent +slug: WebSockets/WebSockets_reference/CloseEvent +tags: + - WebSockets +translation_of: Web/API/CloseEvent +--- +

{{ draft() }}

+

當 WebSocket 連線關閉時，客戶端會收到一個 CloseEvent，由 WebSocket 物件 onclose 屬性表示的監聽器接收。

+

屬性

+ + + + + + + + + + + + + + + + + + + + + + + +
屬性形態描述
codeunsigned longWebSocket 伺服器給予的連線關閉代碼。「狀態代碼」列有所有可能值。
reason{{ domxref("DOMString") }}表示伺服器關閉連線的原因，這因不同的伺服器與子協定而定。
wasCleanboolean表示連線關閉情況是否乾淨。
+

狀態代碼

+

以下列有所有合法的狀態代碼。

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
狀態代碼描述
0-999尚未使用的保留值。
1000正常關閉，連線成功地達到建立時的目標。
1001端點去離，伺服器故障或是瀏覽器從開啟連線的頁面離去的情形。
1002因協定錯誤造成連線被端點消滅。
1003因端點接收不能處理的資料形態（舉例來說，文字端點收到二進制資料）而消滅連線。
1004端點收到過大的資料幀而消滅連線。
1005保留值。表示意外地未給予狀態代碼的情形。
1006保留值。用以表示在預期收到狀態代碼的情形下不正常（即未送關閉幀）的連線關閉。
1007-1999保留以作為未來的 WebSocket 標準之用。
2000-2999保留以作為 WebSocket 擴展之用。
3000-3999程式庫與框架使用的值，應用程式可不使用。
4000-4999應用程式使用的值。
+

參見

+ +

瀏覽器兼容

+

{{ CompatibilityTable() }}

+
+ + + + + + + + + + + + + + + + + + + +
功能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本支援{{ CompatUnknown() }}{{ CompatNo() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+
+ + + + + + + + + + + + + + + + + + + +
功能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本支援{{ CompatUnknown() }}{{ CompatNo() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+

Gecko 備註

+

此時此刻，Gecko 送至監聽器的 "close" 事件僅是簡單事件。

+

{{ languages ( {"en": "en/WebSockets/WebSockets_reference/CloseEvent"} ) }}

diff --git a/files/zh-tw/web/api/document.createtreewalker/index.html b/files/zh-tw/web/api/document.createtreewalker/index.html deleted file mode 100644 index 9e74411a14..0000000000 --- a/files/zh-tw/web/api/document.createtreewalker/index.html +++ /dev/null @@ -1,224 +0,0 @@ ---- -title: Document.createTreeWalker() -slug: Web/API/document.createTreeWalker -translation_of: Web/API/Document/createTreeWalker ---- -
- {{ApiRef("Document")}}
-

Document.createTreeWalker() 方法，能建立一個 {{domxref("TreeWalker")}} 物件並傳回.

-

語法

-
treeWalker = document.createTreeWalker(root, whatToShow, filter, entityReferenceExpansion);
-
-

參數

-
-
- root
-
- 是這個 {{domxref("TreeWalker")}} 遍歷的根節點(root {{domxref("Node")}}). Typically this will be an element owned by the document.
-
- whatToShow {{optional_inline}}
-
- Is an optional unsigned long representing a bitmask created by combining the constant properties of NodeFilter. 它是一種方便的方法，用來過濾某些類型的節點。 It defaults to 0xFFFFFFFF representing the SHOW_ALL constant.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Constant數值說明
NodeFilter.SHOW_ALL-1 (that is the max value of unsigned long)顯示所有節點.
NodeFilter.SHOW_ATTRIBUTE {{deprecated_inline}}2Shows attribute {{ domxref("Attr") }} nodes. This is meaningful only when creating a {{ domxref("TreeWalker") }} with an {{ domxref("Attr") }} node as its root; in this case, it means that the attribute node will appear in the first position of the iteration or traversal. Since attributes are never children of other nodes, they do not appear when traversing over the document tree.
NodeFilter.SHOW_CDATA_SECTION {{deprecated_inline}}8Shows {{ domxref("CDATASection") }} nodes.
NodeFilter.SHOW_COMMENT128Shows {{ domxref("Comment") }} nodes.
NodeFilter.SHOW_DOCUMENT256Shows {{ domxref("Document") }} nodes.
NodeFilter.SHOW_DOCUMENT_FRAGMENT1024Shows {{ domxref("DocumentFragment") }} nodes.
NodeFilter.SHOW_DOCUMENT_TYPE512Shows {{ domxref("DocumentType") }} nodes.
NodeFilter.SHOW_ELEMENT1Shows {{ domxref("Element") }} nodes.
NodeFilter.SHOW_ENTITY {{deprecated_inline}}32Shows {{ domxref("Entity") }} nodes. This is meaningful only when creating a {{ domxref("TreeWalker") }} with an {{ domxref("Entity") }} node as its root; in this case, it means that the {{ domxref("Entity") }} node will appear in the first position of the traversal. Since entities are not part of the document tree, they do not appear when traversing over the document tree.
NodeFilter.SHOW_ENTITY_REFERENCE {{deprecated_inline}}16Shows {{ domxref("EntityReference") }} nodes.
NodeFilter.SHOW_NOTATION {{deprecated_inline}}2048Shows {{ domxref("Notation") }} nodes. This is meaningful only when creating a {{ domxref("TreeWalker") }} with a {{ domxref("Notation") }} node as its root; in this case, it means that the {{ domxref("Notation") }} node will appear in the first position of the traversal. Since entities are not part of the document tree, they do not appear when traversing over the document tree.
NodeFilter.SHOW_PROCESSING_INSTRUCTION64Shows {{ domxref("ProcessingInstruction") }} nodes.
NodeFilter.SHOW_TEXT4顯示文字節點({{ domxref("Text") }} nodes).
-
-
- filter {{optional_inline}}
-
- 是一個可選的 {{domxref("NodeFilter")}}, 這是一個物件有著 acceptNode 方法, 這方法被 {{domxref("TreeWalker")}} 呼叫來決定是否接受通過 whatToShow 檢查的節點.
-
- entityReferenceExpansion {{optional_inline}} {{obsolete_inline}}
-
- Is a {{domxref("Boolean")}} flag indicating if when discarding an {{domxref("EntityReference")}} its whole sub-tree must be discarded at the same time.
-
-

Example

-

The following example goes through all nodes in the body, reduces the set of nodes to elements, simply passes through as acceptable each node (it could reduce the set in the acceptNode() method instead), and then makes use of tree walker iterator that is created to advance through the nodes (now all elements) and push them into an array.

-
var treeWalker = document.createTreeWalker(
-  document.body,
-  NodeFilter.SHOW_ELEMENT,
-  { acceptNode: function(node) { return NodeFilter.FILTER_ACCEPT; } },
-  false
-);
-
-var nodeList = [];
-
-while(treeWalker.nextNode()) nodeList.push(treeWalker.currentNode);
-
-

Specifications

- - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('DOM WHATWG', '#dom-document-createtreewalker', 'Document.createTreeWalker')}}{{Spec2('DOM WHATWG')}}Removed the expandEntityReferences parameter.
- Made the whatToShow and filter parameters optionals.
{{SpecName('DOM2 Traversal_Range', 'traversal.html#NodeIteratorFactory-createTreeWalker', 'Document.createTreeWalker')}}{{Spec2('DOM2 Traversal_Range')}}Initial definition.
-

Browser compatibility

-

{{CompatibilityTable}}

-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support1.0{{CompatGeckoDesktop("1.8.1")}}9.09.03.0
whatToShow and filter optional1.0{{CompatGeckoDesktop("12")}}{{CompatNo}}{{CompatVersionUnknown}}3.0
expandEntityReferences {{obsolete_inline}}1.0{{CompatGeckoDesktop("1.8.1")}}
- Removed in {{CompatGeckoDesktop("12")}}		9.09.03.0
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatGeckoMobile("1.8.1")}}{{CompatVersionUnknown}}9.03.0
whatToShow and filter optional{{CompatVersionUnknown}}{{CompatGeckoDesktop("12")}}{{CompatNo}}{{CompatVersionUnknown}}3.0
expandEntityReferences {{obsolete_inline}}{{CompatVersionUnknown}}{{CompatGeckoDesktop("1.8.1")}}
- Removed in {{CompatGeckoDesktop("12")}}		{{CompatVersionUnknown}}9.03.0
-
-

See also

- diff --git a/files/zh-tw/web/api/document/createevent/index.html b/files/zh-tw/web/api/document/createevent/index.html new file mode 100644 index 0000000000..e3fd9dcd4f --- /dev/null +++ b/files/zh-tw/web/api/document/createevent/index.html @@ -0,0 +1,30 @@ +--- +title: Event.createEvent() +slug: Web/API/Event/createEvent +translation_of: Web/API/Document/createEvent +translation_of_original: Web/API/Event/createEvent +--- +

{{APIRef("DOM")}}

+ +

建立一個新的事件，該事件必須先以其 init() method 初始化才行。

+ +

語法

+ +
document.createEvent(type)
+ +
+
type
+
一個 string 。表示所建立的事件名稱。
+
+ +

這個 method 會回傳一個新的 DOM {{ domxref("Event") }} object ，其事件類型為傳入的 type 。該事件必須先初始化才能使用。

+ +

範例

+ +
var newEvent = document.createEvent("UIEvents");
+ +

規格定義

+ + diff --git a/files/zh-tw/web/api/document/createtreewalker/index.html b/files/zh-tw/web/api/document/createtreewalker/index.html new file mode 100644 index 0000000000..9e74411a14 --- /dev/null +++ b/files/zh-tw/web/api/document/createtreewalker/index.html @@ -0,0 +1,224 @@ +--- +title: Document.createTreeWalker() +slug: Web/API/document.createTreeWalker +translation_of: Web/API/Document/createTreeWalker +--- +
+ {{ApiRef("Document")}}
+

Document.createTreeWalker() 方法，能建立一個 {{domxref("TreeWalker")}} 物件並傳回.

+

語法

+
treeWalker = document.createTreeWalker(root, whatToShow, filter, entityReferenceExpansion);
+
+

參數

+
+
+ root
+
+ 是這個 {{domxref("TreeWalker")}} 遍歷的根節點(root {{domxref("Node")}}). Typically this will be an element owned by the document.
+
+ whatToShow {{optional_inline}}
+
+ Is an optional unsigned long representing a bitmask created by combining the constant properties of NodeFilter. 它是一種方便的方法，用來過濾某些類型的節點。 It defaults to 0xFFFFFFFF representing the SHOW_ALL constant.
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Constant數值說明
NodeFilter.SHOW_ALL-1 (that is the max value of unsigned long)顯示所有節點.
NodeFilter.SHOW_ATTRIBUTE {{deprecated_inline}}2Shows attribute {{ domxref("Attr") }} nodes. This is meaningful only when creating a {{ domxref("TreeWalker") }} with an {{ domxref("Attr") }} node as its root; in this case, it means that the attribute node will appear in the first position of the iteration or traversal. Since attributes are never children of other nodes, they do not appear when traversing over the document tree.
NodeFilter.SHOW_CDATA_SECTION {{deprecated_inline}}8Shows {{ domxref("CDATASection") }} nodes.
NodeFilter.SHOW_COMMENT128Shows {{ domxref("Comment") }} nodes.
NodeFilter.SHOW_DOCUMENT256Shows {{ domxref("Document") }} nodes.
NodeFilter.SHOW_DOCUMENT_FRAGMENT1024Shows {{ domxref("DocumentFragment") }} nodes.
NodeFilter.SHOW_DOCUMENT_TYPE512Shows {{ domxref("DocumentType") }} nodes.
NodeFilter.SHOW_ELEMENT1Shows {{ domxref("Element") }} nodes.
NodeFilter.SHOW_ENTITY {{deprecated_inline}}32Shows {{ domxref("Entity") }} nodes. This is meaningful only when creating a {{ domxref("TreeWalker") }} with an {{ domxref("Entity") }} node as its root; in this case, it means that the {{ domxref("Entity") }} node will appear in the first position of the traversal. Since entities are not part of the document tree, they do not appear when traversing over the document tree.
NodeFilter.SHOW_ENTITY_REFERENCE {{deprecated_inline}}16Shows {{ domxref("EntityReference") }} nodes.
NodeFilter.SHOW_NOTATION {{deprecated_inline}}2048Shows {{ domxref("Notation") }} nodes. This is meaningful only when creating a {{ domxref("TreeWalker") }} with a {{ domxref("Notation") }} node as its root; in this case, it means that the {{ domxref("Notation") }} node will appear in the first position of the traversal. Since entities are not part of the document tree, they do not appear when traversing over the document tree.
NodeFilter.SHOW_PROCESSING_INSTRUCTION64Shows {{ domxref("ProcessingInstruction") }} nodes.
NodeFilter.SHOW_TEXT4顯示文字節點({{ domxref("Text") }} nodes).
+
+
+ filter {{optional_inline}}
+
+ 是一個可選的 {{domxref("NodeFilter")}}, 這是一個物件有著 acceptNode 方法, 這方法被 {{domxref("TreeWalker")}} 呼叫來決定是否接受通過 whatToShow 檢查的節點.
+
+ entityReferenceExpansion {{optional_inline}} {{obsolete_inline}}
+
+ Is a {{domxref("Boolean")}} flag indicating if when discarding an {{domxref("EntityReference")}} its whole sub-tree must be discarded at the same time.
+
+

Example

+

The following example goes through all nodes in the body, reduces the set of nodes to elements, simply passes through as acceptable each node (it could reduce the set in the acceptNode() method instead), and then makes use of tree walker iterator that is created to advance through the nodes (now all elements) and push them into an array.

+
var treeWalker = document.createTreeWalker(
+  document.body,
+  NodeFilter.SHOW_ELEMENT,
+  { acceptNode: function(node) { return NodeFilter.FILTER_ACCEPT; } },
+  false
+);
+
+var nodeList = [];
+
+while(treeWalker.nextNode()) nodeList.push(treeWalker.currentNode);
+
+

Specifications

+ + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('DOM WHATWG', '#dom-document-createtreewalker', 'Document.createTreeWalker')}}{{Spec2('DOM WHATWG')}}Removed the expandEntityReferences parameter.
+ Made the whatToShow and filter parameters optionals.
{{SpecName('DOM2 Traversal_Range', 'traversal.html#NodeIteratorFactory-createTreeWalker', 'Document.createTreeWalker')}}{{Spec2('DOM2 Traversal_Range')}}Initial definition.
+

Browser compatibility

+

{{CompatibilityTable}}

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support1.0{{CompatGeckoDesktop("1.8.1")}}9.09.03.0
whatToShow and filter optional1.0{{CompatGeckoDesktop("12")}}{{CompatNo}}{{CompatVersionUnknown}}3.0
expandEntityReferences {{obsolete_inline}}1.0{{CompatGeckoDesktop("1.8.1")}}
+ Removed in {{CompatGeckoDesktop("12")}}		9.09.03.0
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatGeckoMobile("1.8.1")}}{{CompatVersionUnknown}}9.03.0
whatToShow and filter optional{{CompatVersionUnknown}}{{CompatGeckoDesktop("12")}}{{CompatNo}}{{CompatVersionUnknown}}3.0
expandEntityReferences {{obsolete_inline}}{{CompatVersionUnknown}}{{CompatGeckoDesktop("1.8.1")}}
+ Removed in {{CompatGeckoDesktop("12")}}		{{CompatVersionUnknown}}9.03.0
+
+

See also

+ diff --git a/files/zh-tw/web/api/document_object_model/events/index.html b/files/zh-tw/web/api/document_object_model/events/index.html new file mode 100644 index 0000000000..ff4ecfe572 --- /dev/null +++ b/files/zh-tw/web/api/document_object_model/events/index.html @@ -0,0 +1,69 @@ +--- +title: 事件與DOM +slug: Web/API/Document_Object_Model/事件 +translation_of: Web/API/Document_Object_Model/Events +--- +

Introduction

+ +

This chapter describes the DOM Event Model. The Event interface itself is described, as well as the interfaces for event registration on nodes in the DOM, and event listeners, and several longer examples that show how the various event interfaces relate to one another.

+ +

There is an excellent diagram that clearly explains the three phases of event flow through the DOM in the DOM Level 3 Events draft.

+ +

Also see Example 5: Event Propagation in the Examples chapter for a more detailed example of how events move through the DOM.

+ +

Registering event listeners

+ +

There are 3 ways to register event handlers for a DOM element.

+ +

EventTarget.addEventListener

+ +
// Assuming myButton is a button element
+myButton.addEventListener('click', function(){alert('Hello world');}, false);
+
+ +

This is the method you should use in modern web pages.

+ +

Note: Internet Explorer 6-8 didn't support this method, offering a similar {{domxref("EventTarget.attachEvent")}} API instead. For cross-browser compatibility use one of the many JavaScript libraries available.

+ +

More details can be found on the {{domxref("EventTarget.addEventListener")}} reference page.

+ +

HTML attribute

+ +
<button onclick="alert('Hello world!')">
+
+ +

The JavaScript code in the attribute is passed the Event object via the event parameter. The return value is treated in a special way, described in the HTML specification.

+ +

This way should be avoided. This makes the markup bigger and less readable. Concerns of content/structure and behavior are not well-separated, making a bug harder to find.

+ +

DOM element properties

+ +
// Assuming myButton is a button element
+myButton.onclick = function(event){alert('Hello world');};
+
+ +

The function can be defined to take an event parameter. The return value is treated in a special way, described in the HTML specification.

+ +

The problem with this method is that only one handler can be set per element and per event.

+ +

Accessing Event interfaces

+ +

Event handlers may be attached to various objects including DOM elements, document, the window object, etc. When an event occurs, an event object is created and passed sequentially to the event listeners.

+ +

The {{domxref("Event")}} interface is accessible from within the handler function, via the event object passed as the first argument. The following simple example shows how an event object is passed to the event handler function, and can be used from within one such function.

+ +
function foo(evt) {
+  // the evt parameter is automatically assigned the event object
+  alert(evt);
+}
+table_el.onclick = foo;
+
+ + + + diff --git "a/files/zh-tw/web/api/document_object_model/\344\272\213\344\273\266/index.html" "b/files/zh-tw/web/api/document_object_model/\344\272\213\344\273\266/index.html" deleted file mode 100644 index ff4ecfe572..0000000000 --- "a/files/zh-tw/web/api/document_object_model/\344\272\213\344\273\266/index.html" +++ /dev/null @@ -1,69 +0,0 @@ ---- -title: 事件與DOM -slug: Web/API/Document_Object_Model/事件 -translation_of: Web/API/Document_Object_Model/Events ---- -

Introduction

- -

This chapter describes the DOM Event Model. The Event interface itself is described, as well as the interfaces for event registration on nodes in the DOM, and event listeners, and several longer examples that show how the various event interfaces relate to one another.

- -

There is an excellent diagram that clearly explains the three phases of event flow through the DOM in the DOM Level 3 Events draft.

- -

Also see Example 5: Event Propagation in the Examples chapter for a more detailed example of how events move through the DOM.

- -

Registering event listeners

- -

There are 3 ways to register event handlers for a DOM element.

- -

EventTarget.addEventListener

- -
// Assuming myButton is a button element
-myButton.addEventListener('click', function(){alert('Hello world');}, false);
-
- -

This is the method you should use in modern web pages.

- -

Note: Internet Explorer 6-8 didn't support this method, offering a similar {{domxref("EventTarget.attachEvent")}} API instead. For cross-browser compatibility use one of the many JavaScript libraries available.

- -

More details can be found on the {{domxref("EventTarget.addEventListener")}} reference page.

- -

HTML attribute

- -
<button onclick="alert('Hello world!')">
-
- -

The JavaScript code in the attribute is passed the Event object via the event parameter. The return value is treated in a special way, described in the HTML specification.

- -

This way should be avoided. This makes the markup bigger and less readable. Concerns of content/structure and behavior are not well-separated, making a bug harder to find.

- -

DOM element properties

- -
// Assuming myButton is a button element
-myButton.onclick = function(event){alert('Hello world');};
-
- -

The function can be defined to take an event parameter. The return value is treated in a special way, described in the HTML specification.

- -

The problem with this method is that only one handler can be set per element and per event.

- -

Accessing Event interfaces

- -

Event handlers may be attached to various objects including DOM elements, document, the window object, etc. When an event occurs, an event object is created and passed sequentially to the event listeners.

- -

The {{domxref("Event")}} interface is accessible from within the handler function, via the event object passed as the first argument. The following simple example shows how an event object is passed to the event handler function, and can be used from within one such function.

- -
function foo(evt) {
-  // the evt parameter is automatically assigned the event object
-  alert(evt);
-}
-table_el.onclick = foo;
-
- - - - diff --git a/files/zh-tw/web/api/elementcssinlinestyle/style/index.html b/files/zh-tw/web/api/elementcssinlinestyle/style/index.html new file mode 100644 index 0000000000..e9e6d1171a --- /dev/null +++ b/files/zh-tw/web/api/elementcssinlinestyle/style/index.html @@ -0,0 +1,79 @@ +--- +title: HTMLElement.style +slug: Web/API/HTMLElement/style +translation_of: Web/API/ElementCSSInlineStyle/style +--- +
{{ APIRef("HTML DOM") }}
+ +

The HTMLElement.style property is used to get as well as set the inline style of an element. While getting, it returns a CSSStyleDeclaration object that contains a list of all styles properties for that element with values assigned for the attributes that are defined in the element's inline style attribute. See the CSS Properties Reference for a list of the CSS properties accessible via style.The style property has the same (and highest) priority in the CSS cascade as an inline style declaration set via the style attribute.

+ +

設定 styles

+ +

Styles can be set by assigning a string directly to the style property (as in elt.style = "color: blue;") or by assigning values to the properties of style. For adding specific styles to an element without altering other style values, it is preferred to use the individual properties of style (as in elt.style.color = '...' ) as using elt.style.cssText = '...' or elt.setAttribute('style', '...') sets the complete inline style for the element by overriding the existing inline styles. Note that the property names are in camel-case and not kebab-case while setting the style using elt.style.<property> (i.e. elt.style.fontSize, not elt.style.font-size)

+ +

範例

+ +
// Set multiple styles in a single statement
+elt.style.cssText = "color: blue; border: 1px solid black";
+// OR
+elt.setAttribute("style", "color:red; border: 1px solid blue;");
+
+
+elt.style.color = "blue";  // Set specific style while leaving other inline style values untouched
+
+ +

取得樣式資訊

+ +

The style property is not useful for completely learning about the styles applied on the element, since it represents only the CSS declarations set in the element's inline style attribute, not those that come from style rules elsewhere, such as style rules in the {{HTMLElement("head")}} section, or external style sheets. To get the values of all CSS properties for an element you should use {{domxref("window.getComputedStyle()")}} instead.

+ +

The following code snippet demonstrates the difference between the values obtained using the element's style property and that obtained using the computedStyle() method:

+ +
<!DOCTYPE HTML>
+<html>
+ <body style="font-weight:bold;">
+
+    <div style="color:red" id="myElement">..</div>
+
+ </body>
+</html>
+
+ +
var element = document.getElementById("myElement");
+var out = "";
+var elementStyle = element.style;
+var computedStyle = window.getComputedStyle(element, null);
+
+for (prop in elementStyle) {
+  if (elementStyle.hasOwnProperty(prop)) {
+    out += "  " + prop + " = '" + elementStyle[prop] + "' > '" + computedStyle[prop] + "'\n";
+  }
+}
+console.log(out)
+
+ +

The output would be something like:

+ +
...
+fontWeight = '' > 'bold'
+color = 'red' > 'rgb(255, 0, 0)'
+...
+ +

Note the presence of the value "bold" for font-weight in the computed style and the absence of it in the element's style property

+ +

規範

+ +

DOM Level 2 Style: ElementCSSInlineStyle.style

+ +

瀏覽器相容性

+ +
+

Note: Starting in {{Gecko("2.0")}}, you can set SVG properties' values using the same shorthand syntax. For example:

+ +
element.style.fill = 'lime';
+
+ +

參見

+ + diff --git a/files/zh-tw/web/api/event/createevent/index.html b/files/zh-tw/web/api/event/createevent/index.html deleted file mode 100644 index e3fd9dcd4f..0000000000 --- a/files/zh-tw/web/api/event/createevent/index.html +++ /dev/null @@ -1,30 +0,0 @@ ---- -title: Event.createEvent() -slug: Web/API/Event/createEvent -translation_of: Web/API/Document/createEvent -translation_of_original: Web/API/Event/createEvent ---- -

{{APIRef("DOM")}}

- -

建立一個新的事件，該事件必須先以其 init() method 初始化才行。

- -

語法

- -
document.createEvent(type)
- -
-
type
-
一個 string 。表示所建立的事件名稱。
-
- -

這個 method 會回傳一個新的 DOM {{ domxref("Event") }} object ，其事件類型為傳入的 type 。該事件必須先初始化才能使用。

- -

範例

- -
var newEvent = document.createEvent("UIEvents");
- -

規格定義

- - diff --git a/files/zh-tw/web/api/geolocation/using_geolocation/index.html b/files/zh-tw/web/api/geolocation/using_geolocation/index.html deleted file mode 100644 index cdc56770c4..0000000000 --- a/files/zh-tw/web/api/geolocation/using_geolocation/index.html +++ /dev/null @@ -1,251 +0,0 @@ ---- -title: 地理位置定位 (Geolocation) -slug: Web/API/Geolocation/Using_geolocation -translation_of: Web/API/Geolocation_API ---- -

Web Apps 若需要使用者的位置，可透過 Geolocation API 取得相關資訊。而基於隱私權的考量，這些 Web Apps 均必須取得使用者的許可之後，才能發佈位置資訊。

- -

地理位置定位 (Geolocation) 物件

- -

Geolocation API，是透過 navigator.geolocation 物件所發佈。

- -

若該物件可用，即可進行地理位置定位服務。因此可先測試地理位置定位是否存在：

- -
if ("geolocation" in navigator) {
-  /* geolocation is available */
-} else {
-  /* geolocation IS NOT available */
-}
-
- -
注意：在 Firefox 24 之後的版本，即使停用此 API，navigator 中的「geolocation」也同樣回傳 true。此問題已根據規格而於 Firefox 25 中修正 (bug 884921)。
- -

取得目前位置

- -

若要取得使用者目前的位置，可呼叫 getCurrentPosition() 函式。如此將啟動非同步化的請求，以偵測使用者的位置，並將查詢定位硬體而取得最新資訊。一旦決定位置，隨即執行特定的回呼常式 (Callback routine)。若發生錯誤，則可選擇是否提供第二次回呼。第三項參數為選項介面 (亦可選擇是否使用之)，可設定位置回傳的的最長時間，與請求的等待時間。
- 若不論定位精確度而想儘快固定單一位置，則可使用 getCurrentPosition()。以具備 GPS 的裝置為例，往往需耗時 1 分鐘或更長的時間而固定 GPS 資訊。也因此，getCurrentPosition() 可能取得較低精確度的資料 (IP 位置或 WiFi) 而隨即開始作業。

- -
-

注意：依預設值，getCurrentPosition() 將儘快回傳較低精確度的結果。若不論精確度而只要儘快獲得答案，則可使用 getCurrentPosition()。舉例來說，搭載 GPS 的裝置可能需要一段時間才能取得 GPS 定位資訊，所以可能將低精確度的資料 (IP 位置或 Wifi) 回傳至 getCurrentPosition()。

-
- -
navigator.geolocation.getCurrentPosition(function(position) {
-  do_something(position.coords.latitude, position.coords.longitude);
-});
- -

一旦取得定位位置之後，上列範例隨即將執行 do_something() 函式。

- -

觀看目前位置

- -

如果定位資料改變 (可能是裝置移動，或取得更精確的地理位置資訊)，則可設定 1 組回呼函式，使其隨著更新過的定位資訊而呼叫之。而這個動作可透過 watchPosition() 函式完成。watchPosition() 所具備的輸入參數與 getCurrentPosition() 相同。回呼函式將呼叫數次，讓瀏覽器可於使用者移動期間更新位置，或可根據目前所使用的不同定位技術，提供更精確的定位資訊。若一直未回傳有效結果，則錯誤回呼 (Error Callback) 函式僅將呼叫 1 次。另請注意，錯誤回呼函式僅限於 getCurrentPosition()，因此為選填。

- -
-

注意：不需啟動 getCurrentPosition() 呼叫，亦可使用 watchPosition()。

-
- -
var watchID = navigator.geolocation.watchPosition(function(position) {
-  do_something(position.coords.latitude, position.coords.longitude);
-}
-);
- -

watchPosition() 函式將回傳 1 組 ID 編號，專用以識別必要的定位監看員 (Watcher)。而此數值若搭配 clearWatch() 函式，即可停止觀看使用者的位置。

- -
navigator.geolocation.clearWatch(watchID);
-
- -

微調回應

- -

getCurrentPosition() 與 watchPosition() 均可容納 1 組成功回呼、1 組錯誤回呼 (選填)、1 組 PositionOptions 物件 (選填)。

- -

對 watchPosition 的呼叫應類似如下：

- -
function geo_success(position) {
-  do_something(position.coords.latitude, position.coords.longitude);
-}
-
-function geo_error() {
-  alert("Sorry, no position available.");
-}
-
-var geo_options = {
-  enableHighAccuracy: true,
-  maximumAge        : 30000,
-  timeout           : 27000
-};
-
-var wpid = navigator.geolocation.watchPosition(geo_success, geo_error, geo_options);
- -

現成的 watchPosition Demo：http://www.thedotproduct.org/experiments/geo/
- 

- -

敘述位置

- -

以 Position 物件參照 Coordinates 物件，即可敘述使用者的位置。

- -

處理錯誤

- -

在呼叫 getCurrentPosition() 或 watchPosition() 時，若獲得錯誤回呼函式，則錯誤回呼函式的第一組參數將為 PositionError 物件：

- -
function errorCallback(error) {  alert('ERROR(' + error.code + '): ' + error.message);};
-
- -

地理位置定位實際範例

- -

HTML 內容

- -
<p><button onclick="geoFindMe()">Show my location</button></p>
-<div id="out"></div>
- -

JavaScript 內容

- -
function geoFindMe() {
-  var output = document.getElementById("out");
-
-  if (!navigator.geolocation){
-    output.innerHTML = "<p>Geolocation is not supported by your browser</p>";
-    return;
-  }
-
-  function success(position) {
-    var latitude  = position.coords.latitude;
-    var longitude = position.coords.longitude;
-
-    output.innerHTML = '<p>Latitude is ' + latitude + '° <br>Longitude is ' + longitude + '°</p>';
-
-    var img = new Image();
-    img.src = "http://maps.googleapis.com/maps/api/staticmap?center=" + latitude + "," + longitude + "&zoom=13&size=300x300&sensor=false";
-
-    output.appendChild(img);
-  };
-
-  function error() {
-    output.innerHTML = "Unable to retrieve your location";
-  };
-
-  output.innerHTML = "<p>Locating…</p>";
-
-  navigator.geolocation.getCurrentPosition(success, error);
-}
-
- -

現場測試結果

- -

若無法顯示，可至本文右上角「Language」切換回英文原文觀看。

- - -

{{EmbedLiveSample('Examples', 350, 150, "", "", "", "geolocation")}}

- - -

請求權限

- -

addons.mozilla.org 上所提供的任何附加元件，只要使用地理位置定位資料，均必須明確取得許可才能繼續作業。下列函式詢問許可的方法，則類似網頁詢問許可的自動提示方法，但更為簡單。若為可套用的狀態，則使用者的回應將儲存於 pref 參數所指定的偏好中。於 callback 參數中所提供的函式，將透過 1 組代表使用者反應的布林值而呼叫之。若使用者的回應為 true，則附加元件才會存取地理位置定位資料。

- -
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); });
-
- -

瀏覽器相容性

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
瀏覽器基本支援Geolocation Level 2
Internet ExplorerIE9 RC---
Firefox (Gecko)3.5 (1.9.1)---
Opera10.60---
Safari | Chrome | WebKit5 | 5 | 533---
- -

Gecko 註記

- -

Firefox 可透過 Google 的定位服務 (Google Location Services，GLS)，根據使用者的 WiFi 資訊而找出使用者的位置。與 Google 之間所交換的資料，包含 WiFi 存取點 (Access Point) 資料、Access token (類似 2 個禮拜的 cookie)、使用者的 IP 位址。若需更多資訊，可參閱 Mozilla 的隱私權政策與 Google 的隱私權政策。其內將詳述資料的使用方式。

- -

Firefox 3.6 (Gecko 1.9.2) 新支援了 GPSD (GPS daemon) 服務，適合 Linux 的地理位置定位。

- -

另請參閱

- - diff --git a/files/zh-tw/web/api/geolocation_api/index.html b/files/zh-tw/web/api/geolocation_api/index.html new file mode 100644 index 0000000000..cdc56770c4 --- /dev/null +++ b/files/zh-tw/web/api/geolocation_api/index.html @@ -0,0 +1,251 @@ +--- +title: 地理位置定位 (Geolocation) +slug: Web/API/Geolocation/Using_geolocation +translation_of: Web/API/Geolocation_API +--- +

Web Apps 若需要使用者的位置，可透過 Geolocation API 取得相關資訊。而基於隱私權的考量，這些 Web Apps 均必須取得使用者的許可之後，才能發佈位置資訊。

+ +

地理位置定位 (Geolocation) 物件

+ +

Geolocation API，是透過 navigator.geolocation 物件所發佈。

+ +

若該物件可用，即可進行地理位置定位服務。因此可先測試地理位置定位是否存在：

+ +
if ("geolocation" in navigator) {
+  /* geolocation is available */
+} else {
+  /* geolocation IS NOT available */
+}
+
+ +
注意：在 Firefox 24 之後的版本，即使停用此 API，navigator 中的「geolocation」也同樣回傳 true。此問題已根據規格而於 Firefox 25 中修正 (bug 884921)。
+ +

取得目前位置

+ +

若要取得使用者目前的位置，可呼叫 getCurrentPosition() 函式。如此將啟動非同步化的請求，以偵測使用者的位置，並將查詢定位硬體而取得最新資訊。一旦決定位置，隨即執行特定的回呼常式 (Callback routine)。若發生錯誤，則可選擇是否提供第二次回呼。第三項參數為選項介面 (亦可選擇是否使用之)，可設定位置回傳的的最長時間，與請求的等待時間。
+ 若不論定位精確度而想儘快固定單一位置，則可使用 getCurrentPosition()。以具備 GPS 的裝置為例，往往需耗時 1 分鐘或更長的時間而固定 GPS 資訊。也因此，getCurrentPosition() 可能取得較低精確度的資料 (IP 位置或 WiFi) 而隨即開始作業。

+ +
+

注意：依預設值，getCurrentPosition() 將儘快回傳較低精確度的結果。若不論精確度而只要儘快獲得答案，則可使用 getCurrentPosition()。舉例來說，搭載 GPS 的裝置可能需要一段時間才能取得 GPS 定位資訊，所以可能將低精確度的資料 (IP 位置或 Wifi) 回傳至 getCurrentPosition()。

+
+ +
navigator.geolocation.getCurrentPosition(function(position) {
+  do_something(position.coords.latitude, position.coords.longitude);
+});
+ +

一旦取得定位位置之後，上列範例隨即將執行 do_something() 函式。

+ +

觀看目前位置

+ +

如果定位資料改變 (可能是裝置移動，或取得更精確的地理位置資訊)，則可設定 1 組回呼函式，使其隨著更新過的定位資訊而呼叫之。而這個動作可透過 watchPosition() 函式完成。watchPosition() 所具備的輸入參數與 getCurrentPosition() 相同。回呼函式將呼叫數次，讓瀏覽器可於使用者移動期間更新位置，或可根據目前所使用的不同定位技術，提供更精確的定位資訊。若一直未回傳有效結果，則錯誤回呼 (Error Callback) 函式僅將呼叫 1 次。另請注意，錯誤回呼函式僅限於 getCurrentPosition()，因此為選填。

+ +
+

注意：不需啟動 getCurrentPosition() 呼叫，亦可使用 watchPosition()。

+
+ +
var watchID = navigator.geolocation.watchPosition(function(position) {
+  do_something(position.coords.latitude, position.coords.longitude);
+}
+);
+ +

watchPosition() 函式將回傳 1 組 ID 編號，專用以識別必要的定位監看員 (Watcher)。而此數值若搭配 clearWatch() 函式，即可停止觀看使用者的位置。

+ +
navigator.geolocation.clearWatch(watchID);
+
+ +

微調回應

+ +

getCurrentPosition() 與 watchPosition() 均可容納 1 組成功回呼、1 組錯誤回呼 (選填)、1 組 PositionOptions 物件 (選填)。

+ +

對 watchPosition 的呼叫應類似如下：

+ +
function geo_success(position) {
+  do_something(position.coords.latitude, position.coords.longitude);
+}
+
+function geo_error() {
+  alert("Sorry, no position available.");
+}
+
+var geo_options = {
+  enableHighAccuracy: true,
+  maximumAge        : 30000,
+  timeout           : 27000
+};
+
+var wpid = navigator.geolocation.watchPosition(geo_success, geo_error, geo_options);
+ +

現成的 watchPosition Demo：http://www.thedotproduct.org/experiments/geo/
+ 

+ +

敘述位置

+ +

以 Position 物件參照 Coordinates 物件，即可敘述使用者的位置。

+ +

處理錯誤

+ +

在呼叫 getCurrentPosition() 或 watchPosition() 時，若獲得錯誤回呼函式，則錯誤回呼函式的第一組參數將為 PositionError 物件：

+ +
function errorCallback(error) {  alert('ERROR(' + error.code + '): ' + error.message);};
+
+ +

地理位置定位實際範例

+ +

HTML 內容

+ +
<p><button onclick="geoFindMe()">Show my location</button></p>
+<div id="out"></div>
+ +

JavaScript 內容

+ +
function geoFindMe() {
+  var output = document.getElementById("out");
+
+  if (!navigator.geolocation){
+    output.innerHTML = "<p>Geolocation is not supported by your browser</p>";
+    return;
+  }
+
+  function success(position) {
+    var latitude  = position.coords.latitude;
+    var longitude = position.coords.longitude;
+
+    output.innerHTML = '<p>Latitude is ' + latitude + '° <br>Longitude is ' + longitude + '°</p>';
+
+    var img = new Image();
+    img.src = "http://maps.googleapis.com/maps/api/staticmap?center=" + latitude + "," + longitude + "&zoom=13&size=300x300&sensor=false";
+
+    output.appendChild(img);
+  };
+
+  function error() {
+    output.innerHTML = "Unable to retrieve your location";
+  };
+
+  output.innerHTML = "<p>Locating…</p>";
+
+  navigator.geolocation.getCurrentPosition(success, error);
+}
+
+ +

現場測試結果

+ +

若無法顯示，可至本文右上角「Language」切換回英文原文觀看。

+ + +

{{EmbedLiveSample('Examples', 350, 150, "", "", "", "geolocation")}}

+ + +

請求權限

+ +

addons.mozilla.org 上所提供的任何附加元件，只要使用地理位置定位資料，均必須明確取得許可才能繼續作業。下列函式詢問許可的方法，則類似網頁詢問許可的自動提示方法，但更為簡單。若為可套用的狀態，則使用者的回應將儲存於 pref 參數所指定的偏好中。於 callback 參數中所提供的函式，將透過 1 組代表使用者反應的布林值而呼叫之。若使用者的回應為 true，則附加元件才會存取地理位置定位資料。

+ +
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); });
+
+ +

瀏覽器相容性

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
瀏覽器基本支援Geolocation Level 2
Internet ExplorerIE9 RC---
Firefox (Gecko)3.5 (1.9.1)---
Opera10.60---
Safari | Chrome | WebKit5 | 5 | 533---
+ +

Gecko 註記

+ +

Firefox 可透過 Google 的定位服務 (Google Location Services，GLS)，根據使用者的 WiFi 資訊而找出使用者的位置。與 Google 之間所交換的資料，包含 WiFi 存取點 (Access Point) 資料、Access token (類似 2 個禮拜的 cookie)、使用者的 IP 位址。若需更多資訊，可參閱 Mozilla 的隱私權政策與 Google 的隱私權政策。其內將詳述資料的使用方式。

+ +

Firefox 3.6 (Gecko 1.9.2) 新支援了 GPSD (GPS daemon) 服務，適合 Linux 的地理位置定位。

+ +

另請參閱

+ + diff --git a/files/zh-tw/web/api/htmlelement/dataset/index.html b/files/zh-tw/web/api/htmlelement/dataset/index.html deleted file mode 100644 index 690f8e1189..0000000000 --- a/files/zh-tw/web/api/htmlelement/dataset/index.html +++ /dev/null @@ -1,167 +0,0 @@ ---- -title: HTMLElement.dataset -slug: Web/API/HTMLElement/dataset -translation_of: Web/API/HTMLOrForeignElement/dataset ---- -

{{ APIRef("HTML DOM") }}

- -

HTMLElement.dataset 允許在讀取與寫入模式時使用HTML或DOM裡，所有設置在元件上的自定義資料屬性(data-*)。他是一個DOMStringMap,每個項目表示一個不同的資料屬性。須注意的是，資料集(dataset)可以被讀取，但不能直接被修改。所有修改必須經由其眾多"屬性"才行，也就是資料屬性。另外，雖然HTML data- 屬性與它相關的 DOM dataset. 名稱不同，但是他們總是有相似之處： 

- - - -

除了以下的資訊之外，你也可以在 Using data attributes.此篇文章找到使用HTML資料屬性的用法。

- -

名稱變換

- -

 

- -

dash-style 到 camelCase: 將自訂義的資料屬性名稱變換至{{ domxref("DOMStringMap") }}各項目的key值，需根據以下規則：

- - - -

camelCase 到 dash-style: 與上述相反，將key值轉為資料屬性名稱，需根據以下規則：

- - - -

上面所提的限制是為了確保兩個轉換方法互為相反。

- -

舉例來說，資料屬性名稱 data-abc-def 之對應key值為abcDef。

- -

 

- -

存取數值

- - - -

語法

- - - -

範例

- -
<div id="user" data-id="1234567890" data-user="johndoe" data-date-of-birth>John Doe</div>
-
-let el = document.querySelector('#user');
-
-// el.id == 'user'
-// el.dataset.id === '1234567890'
-// el.dataset.user === 'johndoe'
-// el.dataset.dateOfBirth === ''
-
-el.dataset.dateOfBirth = '1960-10-03'; // 設定 DOB.
-
-// 'someDataAttr' in el.dataset === false
-el.dataset.someDataAttr = 'mydata';
-// 'someDataAttr' in el.dataset === true
-
- -

規範

- - - - - - - - - - - - - - - - - - - - - - - - -
規範狀態備註
{{SpecName('HTML WHATWG', "dom.html#dom-dataset", "HTMLElement.dataset")}}{{Spec2('HTML WHATWG')}}No change from latest snapshot, {{SpecName('HTML5.1')}}
{{SpecName('HTML5.1', "dom.html#dom-dataset", "HTMLElement.dataset")}}{{Spec2('HTML5.1')}}Snapshot of {{SpecName('HTML WHATWG')}}, no change from {{SpecName('HTML5 W3C')}}
{{SpecName('HTML5 W3C', "dom.html#dom-dataset", "HTMLElement.dataset")}}{{Spec2('HTML5 W3C')}}Snapshot of  {{SpecName('HTML WHATWG')}}, initial definition.
- -

瀏覽器相容性

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - - - -
功能ChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
基本支援8{{CompatVersionUnknown}}{{ CompatGeckoDesktop("6.0") }}1111.106
-
- -
- - - - - - - - - - - - - - - - - - - - - -
功能AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本支援{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatGeckoMobile(6)}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -

參見

- - diff --git a/files/zh-tw/web/api/htmlelement/innertext/index.html b/files/zh-tw/web/api/htmlelement/innertext/index.html new file mode 100644 index 0000000000..4c8a4272fc --- /dev/null +++ b/files/zh-tw/web/api/htmlelement/innertext/index.html @@ -0,0 +1,86 @@ +--- +title: Node.innerText +slug: Web/API/Node/innerText +translation_of: Web/API/HTMLElement/innerText +--- +
{{APIRef("DOM")}}
+ +

概述

+ +

Node.innerText 是一個代表節點及其後代之「已渲染」（rendered）文字內容的屬性。如同一個存取器，Node.innerText 近似於使用者利用游標選取成高亮後複製至剪貼簿之元素的內容。此功能最初由 Internet Explorer 提供，並在被所有主要瀏覽器採納之後，於 2016 年正式成為 HTML 標準。

+ +

{{domxref("Node.textContent")}} 屬性是一個相似的選擇，但兩者之間仍有非常不同的差異。

+ +

規範

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG', 'dom.html#the-innertext-idl-attribute', 'innerText')}}{{Spec2('HTML WHATWG')}}Introduced, based on the draft of the innerText specification. See whatwg/html#465 and whatwg/compat#5 for history.
+ +

瀏覽器相容性

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support4{{ CompatGeckoDesktop(45) }}69.6 (probably earlier)3
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support2.3 (probably earlier){{ CompatGeckoMobile(45) }}10 (probably earlier)124.1 (probably earlier)
+
+ +

參見

+ + diff --git a/files/zh-tw/web/api/htmlelement/style/index.html b/files/zh-tw/web/api/htmlelement/style/index.html deleted file mode 100644 index e9e6d1171a..0000000000 --- a/files/zh-tw/web/api/htmlelement/style/index.html +++ /dev/null @@ -1,79 +0,0 @@ ---- -title: HTMLElement.style -slug: Web/API/HTMLElement/style -translation_of: Web/API/ElementCSSInlineStyle/style ---- -
{{ APIRef("HTML DOM") }}
- -

The HTMLElement.style property is used to get as well as set the inline style of an element. While getting, it returns a CSSStyleDeclaration object that contains a list of all styles properties for that element with values assigned for the attributes that are defined in the element's inline style attribute. See the CSS Properties Reference for a list of the CSS properties accessible via style.The style property has the same (and highest) priority in the CSS cascade as an inline style declaration set via the style attribute.

- -

設定 styles

- -

Styles can be set by assigning a string directly to the style property (as in elt.style = "color: blue;") or by assigning values to the properties of style. For adding specific styles to an element without altering other style values, it is preferred to use the individual properties of style (as in elt.style.color = '...' ) as using elt.style.cssText = '...' or elt.setAttribute('style', '...') sets the complete inline style for the element by overriding the existing inline styles. Note that the property names are in camel-case and not kebab-case while setting the style using elt.style.<property> (i.e. elt.style.fontSize, not elt.style.font-size)

- -

範例

- -
// Set multiple styles in a single statement
-elt.style.cssText = "color: blue; border: 1px solid black";
-// OR
-elt.setAttribute("style", "color:red; border: 1px solid blue;");
-
-
-elt.style.color = "blue";  // Set specific style while leaving other inline style values untouched
-
- -

取得樣式資訊

- -

The style property is not useful for completely learning about the styles applied on the element, since it represents only the CSS declarations set in the element's inline style attribute, not those that come from style rules elsewhere, such as style rules in the {{HTMLElement("head")}} section, or external style sheets. To get the values of all CSS properties for an element you should use {{domxref("window.getComputedStyle()")}} instead.

- -

The following code snippet demonstrates the difference between the values obtained using the element's style property and that obtained using the computedStyle() method:

- -
<!DOCTYPE HTML>
-<html>
- <body style="font-weight:bold;">
-
-    <div style="color:red" id="myElement">..</div>
-
- </body>
-</html>
-
- -
var element = document.getElementById("myElement");
-var out = "";
-var elementStyle = element.style;
-var computedStyle = window.getComputedStyle(element, null);
-
-for (prop in elementStyle) {
-  if (elementStyle.hasOwnProperty(prop)) {
-    out += "  " + prop + " = '" + elementStyle[prop] + "' > '" + computedStyle[prop] + "'\n";
-  }
-}
-console.log(out)
-
- -

The output would be something like:

- -
...
-fontWeight = '' > 'bold'
-color = 'red' > 'rgb(255, 0, 0)'
-...
- -

Note the presence of the value "bold" for font-weight in the computed style and the absence of it in the element's style property

- -

規範

- -

DOM Level 2 Style: ElementCSSInlineStyle.style

- -

瀏覽器相容性

- -
-

Note: Starting in {{Gecko("2.0")}}, you can set SVG properties' values using the same shorthand syntax. For example:

- -
element.style.fill = 'lime';
-
- -

參見

- - diff --git a/files/zh-tw/web/api/htmlmediaelement/abort_event/index.html b/files/zh-tw/web/api/htmlmediaelement/abort_event/index.html new file mode 100644 index 0000000000..e0330135f4 --- /dev/null +++ b/files/zh-tw/web/api/htmlmediaelement/abort_event/index.html @@ -0,0 +1,68 @@ +--- +title: abort +slug: Web/Events/abort +translation_of: Web/API/HTMLMediaElement/abort_event +translation_of_original: Web/Events/abort +--- +

當資源載入被拒絕時將會觸發abort事件。

+ +

一般資訊

+ +
+
規範
+
DOM L3
+
介面
+
若由使用者介面產生，為UIEvent，否則為Event。
+
是否向上(冒泡)
+
否
+
是否為可取消
+
否
+
目標對象
+
Element
+
預設行為
+
無
+
+ +

屬性

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
屬性型態描述
target {{readonlyInline}}EventTarget事件的目標對象 (DOM樹中最頂層的對象)。
type {{readonlyInline}}DOMString事件的型態。
bubbles {{readonlyInline}}Boolean事件是否向上冒泡。
cancelable {{readonlyInline}}Boolean事件是否能夠取消。
view {{readonlyInline}}WindowProxydocument.defaultView (該文檔(Document)的window)
detail {{readonlyInline}}long (float)0.
diff --git a/files/zh-tw/web/api/htmlorforeignelement/dataset/index.html b/files/zh-tw/web/api/htmlorforeignelement/dataset/index.html new file mode 100644 index 0000000000..690f8e1189 --- /dev/null +++ b/files/zh-tw/web/api/htmlorforeignelement/dataset/index.html @@ -0,0 +1,167 @@ +--- +title: HTMLElement.dataset +slug: Web/API/HTMLElement/dataset +translation_of: Web/API/HTMLOrForeignElement/dataset +--- +

{{ APIRef("HTML DOM") }}

+ +

HTMLElement.dataset 允許在讀取與寫入模式時使用HTML或DOM裡，所有設置在元件上的自定義資料屬性(data-*)。他是一個DOMStringMap,每個項目表示一個不同的資料屬性。須注意的是，資料集(dataset)可以被讀取，但不能直接被修改。所有修改必須經由其眾多"屬性"才行，也就是資料屬性。另外，雖然HTML data- 屬性與它相關的 DOM dataset. 名稱不同，但是他們總是有相似之處： 

+ + + +

除了以下的資訊之外，你也可以在 Using data attributes.此篇文章找到使用HTML資料屬性的用法。

+ +

名稱變換

+ +

 

+ +

dash-style 到 camelCase: 將自訂義的資料屬性名稱變換至{{ domxref("DOMStringMap") }}各項目的key值，需根據以下規則：

+ + + +

camelCase 到 dash-style: 與上述相反，將key值轉為資料屬性名稱，需根據以下規則：

+ + + +

上面所提的限制是為了確保兩個轉換方法互為相反。

+ +

舉例來說，資料屬性名稱 data-abc-def 之對應key值為abcDef。

+ +

 

+ +

存取數值

+ + + +

語法

+ + + +

範例

+ +
<div id="user" data-id="1234567890" data-user="johndoe" data-date-of-birth>John Doe</div>
+
+let el = document.querySelector('#user');
+
+// el.id == 'user'
+// el.dataset.id === '1234567890'
+// el.dataset.user === 'johndoe'
+// el.dataset.dateOfBirth === ''
+
+el.dataset.dateOfBirth = '1960-10-03'; // 設定 DOB.
+
+// 'someDataAttr' in el.dataset === false
+el.dataset.someDataAttr = 'mydata';
+// 'someDataAttr' in el.dataset === true
+
+ +

規範

+ + + + + + + + + + + + + + + + + + + + + + + + +
規範狀態備註
{{SpecName('HTML WHATWG', "dom.html#dom-dataset", "HTMLElement.dataset")}}{{Spec2('HTML WHATWG')}}No change from latest snapshot, {{SpecName('HTML5.1')}}
{{SpecName('HTML5.1', "dom.html#dom-dataset", "HTMLElement.dataset")}}{{Spec2('HTML5.1')}}Snapshot of {{SpecName('HTML WHATWG')}}, no change from {{SpecName('HTML5 W3C')}}
{{SpecName('HTML5 W3C', "dom.html#dom-dataset", "HTMLElement.dataset")}}{{Spec2('HTML5 W3C')}}Snapshot of  {{SpecName('HTML WHATWG')}}, initial definition.
+ +

瀏覽器相容性

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + + + +
功能ChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
基本支援8{{CompatVersionUnknown}}{{ CompatGeckoDesktop("6.0") }}1111.106
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
功能AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本支援{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatGeckoMobile(6)}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

參見

+ + diff --git a/files/zh-tw/web/api/messageevent/index.html b/files/zh-tw/web/api/messageevent/index.html new file mode 100644 index 0000000000..f5c0212f78 --- /dev/null +++ b/files/zh-tw/web/api/messageevent/index.html @@ -0,0 +1,80 @@ +--- +title: MessageEvent +slug: WebSockets/WebSockets_reference/MessageEvent +tags: + - WebSockets +translation_of: Web/API/MessageEvent +--- +

{{ draft() }}

+

當伺服器傳來資料時，客戶端會收到一個 MessageEvent，由 WebSocket 物件 onmessage 表示的監聽器接收。

+

屬性

+ + + + + + + + + + + + + +
屬性形態描述
data{{ domxref("DOMString") }} | {{ domxref("Blob") }} | ArrayBuffer伺服器傳來的資料。
+

參見

+ +

瀏覽器兼容

+

{{ CompatibilityTable() }}

+
+ + + + + + + + + + + + + + + + + + + +
功能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本支援{{ CompatUnknown() }}{{ CompatGeckoDesktop("2.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+
+ + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本支援{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+

Gecko 備註

+
+

{{ gecko_callout_heading("6.0") }}

+

此時此刻，Gecko 不支援 ArrayBuffer 或 {{ domxref("Blob") }} 作為 data。

+
+

{{ languages ( {"en": "en/WebSockets/WebSockets_reference/MessageEvent"} ) }}

diff --git a/files/zh-tw/web/api/node/innertext/index.html b/files/zh-tw/web/api/node/innertext/index.html deleted file mode 100644 index 4c8a4272fc..0000000000 --- a/files/zh-tw/web/api/node/innertext/index.html +++ /dev/null @@ -1,86 +0,0 @@ ---- -title: Node.innerText -slug: Web/API/Node/innerText -translation_of: Web/API/HTMLElement/innerText ---- -
{{APIRef("DOM")}}
- -

概述

- -

Node.innerText 是一個代表節點及其後代之「已渲染」（rendered）文字內容的屬性。如同一個存取器，Node.innerText 近似於使用者利用游標選取成高亮後複製至剪貼簿之元素的內容。此功能最初由 Internet Explorer 提供，並在被所有主要瀏覽器採納之後，於 2016 年正式成為 HTML 標準。

- -

{{domxref("Node.textContent")}} 屬性是一個相似的選擇，但兩者之間仍有非常不同的差異。

- -

規範

- - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('HTML WHATWG', 'dom.html#the-innertext-idl-attribute', 'innerText')}}{{Spec2('HTML WHATWG')}}Introduced, based on the draft of the innerText specification. See whatwg/html#465 and whatwg/compat#5 for history.
- -

瀏覽器相容性

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support4{{ CompatGeckoDesktop(45) }}69.6 (probably earlier)3
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support2.3 (probably earlier){{ CompatGeckoMobile(45) }}10 (probably earlier)124.1 (probably earlier)
-
- -

參見

- - diff --git a/files/zh-tw/web/api/performance.timing/index.html b/files/zh-tw/web/api/performance.timing/index.html deleted file mode 100644 index 33d0a54171..0000000000 --- a/files/zh-tw/web/api/performance.timing/index.html +++ /dev/null @@ -1,56 +0,0 @@ ---- -title: Performance.timing -slug: Web/API/Performance.timing -tags: - - API - - Navigation Timing - - Performance - - Property - - Read-only - - 唯讀 - - 屬性 - - 效能 -translation_of: Web/API/Performance/timing ---- -

{{APIRef("Performance")}}

- -

摘要

- -

Performance.timing 是唯讀的屬性，傳回的 {{domxref("PerformanceTiming")}} 物件當中包含了效能與時間延遲相關的資訊。

- -

語法

- -
timingInfo = performance.timing;
- -

規格

- - - - - - - - - - - - - - -
規格狀態備註
{{SpecName('Navigation Timing', '#sec-window.performance-attribute', 'Performance.timing')}}{{Spec2('Navigation Timing')}}初步定義
- -

瀏覽器支援狀況

- -
-
- - -

{{Compat("api.Performance.timing")}}

-
-
- -

參照

- - diff --git a/files/zh-tw/web/api/performance/timing/index.html b/files/zh-tw/web/api/performance/timing/index.html new file mode 100644 index 0000000000..33d0a54171 --- /dev/null +++ b/files/zh-tw/web/api/performance/timing/index.html @@ -0,0 +1,56 @@ +--- +title: Performance.timing +slug: Web/API/Performance.timing +tags: + - API + - Navigation Timing + - Performance + - Property + - Read-only + - 唯讀 + - 屬性 + - 效能 +translation_of: Web/API/Performance/timing +--- +

{{APIRef("Performance")}}

+ +

摘要

+ +

Performance.timing 是唯讀的屬性，傳回的 {{domxref("PerformanceTiming")}} 物件當中包含了效能與時間延遲相關的資訊。

+ +

語法

+ +
timingInfo = performance.timing;
+ +

規格

+ + + + + + + + + + + + + + +
規格狀態備註
{{SpecName('Navigation Timing', '#sec-window.performance-attribute', 'Performance.timing')}}{{Spec2('Navigation Timing')}}初步定義
+ +

瀏覽器支援狀況

+ +
+
+ + +

{{Compat("api.Performance.timing")}}

+
+
+ +

參照

+ + diff --git a/files/zh-tw/web/api/permissions_api/index.html b/files/zh-tw/web/api/permissions_api/index.html new file mode 100644 index 0000000000..d58d8466be --- /dev/null +++ b/files/zh-tw/web/api/permissions_api/index.html @@ -0,0 +1,85 @@ +--- +title: 權限 (Permissions) +slug: WebAPI/Permissions +translation_of: Web/API/Permissions_API +--- +

{{ draft() }}

+

{{ non-standard_header }}

+

{{ B2GOnlyHeader2('certified') }}

+

摘要

+

Permissions API 可顯示 Apps 所要求的所有權限，以利使用者管理。Apps 可透過此 API 而讀取其他 Apps 的權限並進一步變更。

+

透過 PermissionSettings 介面的 navigator.mozPermissionSettings 屬性，即可存取 Permission Manager。

+

已安裝 Apps 的權限

+

所有 Apps 均需透過自己的 manifest 檔案而要求權限。Apps 每次所使用的 API，均以「請求顯性權限 (Explicit Permission)」的 API 為主，並提示使用者是否通過權限。如果使用者選擇「不要再提示」，大概也就不太可能改變決定了。API 則能提供介面，以利使用者管理已發出的權限。

+

透過 PermissionSettings.get()、set()、isExplicit() 函式即可達到上述作業。

+

讀取權限

+

若要知道已發出權限的目前狀態，可使用 PermissionSettings.get() 函式。此函式可回傳字串，以顯示特定 Apps 權限的目前狀態。可能的數值有：

+
+
+ allow
+
+ 已通過該權限，且不需使用者的進一步互動。
+
+ denied
+
+ 已否決該權限；可能是系統或使用者所否決。
+
+ prompt
+
+ 代表該權限將以明顯的提示方法，詢問使用者是否給予權限。
+
+ unknown
+
+ 代表該 Apps 並未詢問此權限，也不會提示使用者是否給予權限。
+
+
// Let's check all installed apps
+var apps = navigator.mozApps.mgmt.getAll();
+
+apps.onsuccess = function () {
+  var permission = navigator.mozPermissionSettings;
+
+  // Let's check the permission of each app
+  apps.result.forEach(function (app) {
+    var request, appName = app.manifest.name;
+
+    for (request in app.manifest.permission) {
+      // Let's get the current permission for each permission request by the application
+      var p = permission.get(request, app.manifestUrl, app.origine, false);
+
+      console.log(appName + ' asked for "' + request + '" permission, which is "' + p + '"')
+    }
+  });
+}
+
+
+

設定權限

+

只要使用 PermissionSettings.set() 函式即可設定權限。可能的數值均與 get 函式所存取的相同。

+
+

注意：根據 Apps 權限的不同，某些可能為隱性 (Implicit) 權限。若因為某種理由，Apps 嘗試將權限變更為隱性權限，就會產生錯誤。為了避免這種錯誤，可透過 PermissionSettings.isExplicit() 函式而檢查是否為顯性權限。

+
+
// Let's check all installed apps
+var apps = navigator.mozApps.mgmt.getAll();
+
+apps.onsuccess = function () {
+  var permission = navigator.mozPermissionSettings;
+
+  // Let's grant the permission of each app
+  apps.result.forEach(function (app) {
+    var request, appName = app.manifest.name;
+
+    for (request in app.manifest.permission) {
+      // If the permission is not explicit
+      if (!permission.isExplicit(request, app.manifestUrl, app.origine, false) {
+        // Let's ask the user for all permissions requested by the application
+        permission.set(request, app.manifestUrl, app.origine, false);
+      }
+    }
+  });
+}
+

規格

+

不屬於任何規格。

+

另可參閱

+ diff --git a/files/zh-tw/web/api/web_video_text_tracks_format/index.html b/files/zh-tw/web/api/web_video_text_tracks_format/index.html deleted file mode 100644 index e565d2d129..0000000000 --- a/files/zh-tw/web/api/web_video_text_tracks_format/index.html +++ /dev/null @@ -1,691 +0,0 @@ ---- -title: WebVTT -slug: Web/API/Web_Video_Text_Tracks_Format -translation_of: Web/API/WebVTT_API ---- -

WebVTT 是一種 UTF-8 編碼的文字檔案格式，可藉由 {{ HTMLElement("track") }} 元素顯示加註時間資訊之文字軌，其主要設計目的是為 {{ HTMLElement("video") }} 顯示字幕。

- -

WebVTT 當中可以採用空白或分隔字元（tab）。

- -

WebVTT 的 MIME Type 為 text/vtt。

- -

 

- -

WebVTT 文本

- -

WebVTT 檔的結構中，有兩項必備資訊、四項選用資訊。

- - - -
範例 1 - 最簡單的 WEBVTT 檔
- -
  WEBVTT
-
-
- -
範例 2 - 很簡單的 WebVTT 檔
- -
  WEBVTT - 這個檔案沒有時間節點
-
-
- -
範例 3 - 常見的 WebVTT 例子
- -
  WEBVTT - 這個檔案有時間節點
-
-  14
-  00:01:14.815 --> 00:01:18.114
-  - What?
-  - Where are we now?
-
-  15
-  00:01:18.171 --> 00:01:20.991
-  - This is big bat country.
-
-  16
-  00:01:21.058 --> 00:01:23.868
-  - [ Bats Screeching ]
-  - They won't get in your hair. They're after the bugs.
-
- -

 

- -

WebVTT 註解

- -

Comments are an optional component that can be used to add information to a WebVTT file. Comments are intended for those reading the file and are not seen by users. Comments may contain newlines but it cannot contain a blank line, which is equivalent to two consecutive newlines. A blank line signifies the end of a comment.

- -

註解中不能包含「-->」字串、「&」符號或「<」符號。如欲使用後兩者，可採跳脫字串「&amp;」或「&lt;」。此外雖規格上允許使用「>」字元，仍然建議跳脫為「&gt;」以避免混淆。

- -

註解由三個部分組成：

- - - -
範例 4 - 常見 WebVTT 範例
- -
  NOTE 這行是註解
-
- -
範例 5 - 多行註解
- -
  NOTE
-  這也是註解，
-  只是拆成多行。
-
-  NOTE 當然也可以像這樣
-  來分行寫註解。
-
- -
範例 6 - 常見註解使用方式
- -
  WEBVTT - 翻譯我喜歡的影片字幕
-
-  NOTE
-  本字幕由 Kyle 翻譯，
-  希望可以讓我的朋友跟家人一同觀賞。
-
-  1
-  00:02:15.000 --> 00:02:20.000
-  - Ta en kopp varmt te.
-  - Det är inte varmt.
-
-  2
-  00:02:20.000 --> 00:02:25.000
-  - Har en kopp te.
-  - Det smakar som te.
-
-  NOTE This last line may not translate well.
-
-  3
-  00:02:25.000 --> 00:02:30.000
-  -Ta en kopp.
-
- -

 

- -

WebVTT 時間節點

- -

時間節點（cue）是具備單一開始時間、結束時間、文字內容的字幕區段。 Example 6 consists of the header, a blank line, and then five cues separated by blank lines. 時間節點由五個部分組成：

- - - -
範例7 - Example of a cue
- -
1 - Title Crawl
-00:00:5.000 --> 00:00:10.000 line:0 position:20% size:60% align:start
-Some time ago in a place rather distant....
- -

 

- -

節點 ID

- -

此 ID 代表時間節點的名稱，可以用以在腳本語言中參照某段特定時間節點。ID 中禁用換行字元，也不可以包括「-->」字串。ID 最後必須以一個換行字元作為結束。

- -

雖然通常都用數字（1, 2, 3...）作為 ID，但規格上並不要求每個 ID 都是為一值。

- -
範例 8 - 範例 7 中的時間節點 ID
- -
1 - Title Crawl
- -
範例 9 - ID 常見用法
- -
WEBVTT
-
-1
-00:00:22.230 --> 00:00:24.606
-This is the first subtitle.
-
-2
-00:00:30.739 --> 00:00:34.074
-This is the second.
-
-3
-00:00:34.159 --> 00:00:35.743
-Third
-
- -

 

- -

時間資訊

- -

時間資訊標注了此段節點的出現時機，其中包括開始時間與結束時間。結束時間必須比開始時間晚，而開始時間必須比先前所有的開始時間晚，或至少是同一時間。

- -

不同時間節點可以設定為同時顯示，但若 WebVTT 檔案是用在 chapters（{{ HTMLElement("track") }} 的 {{ htmlattrxref("kind") }} 設定為 chapters），則不允許兩段節點同時出現。

- -

每項時間資訊都由五個部分組成：

- - - -

時間的表示方式，可以是以下兩種：

- - - -

其中的各元素說明如下：

- - - -
Example 10 - Basic cue timing examples
- -
00:22.230 --> 00:24.606
-00:30.739 --> 00:00:34.074
-00:00:34.159 --> 00:35.743
-00:00:35.827 --> 00:00:40.122
- -
Example 11 - Overlapping cue timing examples
- -
00:00:00.000 --> 00:00:10.000
-00:00:05.000 --> 00:01:00.000
-00:00:30.000 --> 00:00:50.000
- -
Example 12 - Non-overlapping cue timing examples
- -
00:00:00.000 --> 00:00:10.000
-00:00:10.000 --> 00:01:00.581
-00:01:00.581 --> 00:02:00.100
-00:02:01.000 --> 00:02:01.000
- -

 

- -

Cue Settings

- -

Cue settings are optional components used to position where the cue payload text will be displayed over the video. This includes whether the text is displayed horizontally or vertically. There can be zero or more of them, and they can be used in any order so long as each setting is used no more than once.

- -

The cue settings are added to the right of the cue timings. There must be one or more spaces between the cue timing and the first setting and between each setting. A setting's name and value are separated by a colon. The settings are case sensitive so use lower case as shown. There are five cue settings:

- - - -
Example 13 - Cue setting examples
- -

The first line demonstrates no settings. The second line might be used to overlay text on a sign or label. The third line might be used for a title. The last line might be used for an Asian language.

- -
00:00:5.000 --> 00:00:10.000
-00:00:5.000 --> 00:00:10.000 line:63% position:72% align:start
-00:00:5.000 --> 00:00:10.000 line:0 position:20% size:60% align:start
-00:00:5.000 --> 00:00:10.000 vertical:rt line:-1 align:end
-
- -

 

- -

文字內容

- -

The payload is where the main information or content is located. In normal usage the payload contains the subtitles to be displayed. The payload text may contain newlines but it cannot contain a blank line, which is equivalent to two consecutive newlines. A blank line signifies the end of a cue.

- -

文字內容中不能包含「-->」字串、「&」符號或「<」符號。如欲使用後兩者，可採跳脫字串「&amp;」或「&lt;」。此外雖規格上允許使用「>」字元，仍然建議跳脫為「&gt;」以避免混淆。若您使用 WebVTT 檔作為後設資料，則可不管這些限制。

- -

除了上述的三個跳脫字串外，還有其他四種跳脫字串，分列如下

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Table 6 - 跳脫字串
名稱字元跳脫字串
「與」&&amp;
小於<&lt;
大於>&gt;
左到右標記 &lrm;
右到左標記 &rlm;
不斷行空白 &nbsp;
- -

 

- -

文字內容中的標籤

- -

有很多標籤（例如 <bold>）可以用在文字內容中，但若 {{ HTMLElement("track") }} 的 {{ htmlattrxref("kind") }} 設定為 chapters 時，其中所用的 WebVTT  檔案裡就不能使用標籤。

- - - -

 

- -

以下則需要開頭標籤與結束標籤（例如 <b>text</b>）。

- - - -

 

- -

瀏覽器支援

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本支援18 以上24 (預設為關閉)10 以上15.0 以上 7 以上
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IChrome for MobileOpera MobileSafari Mobile
基本支援4.4 以上       目前尚不支援         35.0 以上   21.0 以上7 以上
- -

 

- -

 

-
- -

規格

- - diff --git a/files/zh-tw/web/api/websocket/index.html b/files/zh-tw/web/api/websocket/index.html new file mode 100644 index 0000000000..8acd8d03d5 --- /dev/null +++ b/files/zh-tw/web/api/websocket/index.html @@ -0,0 +1,276 @@ +--- +title: WebSocket +slug: WebSockets/WebSockets_reference/WebSocket +tags: + - WebSockets +translation_of: Web/API/WebSocket +--- +

{{ SeeCompatTable() }}

+ +

{{ draft() }}

+ +

WebSocket 物件提供了建立、管理 WebSocket 伺服器連線的 API，它也有在連線中傳送、接收資料的能力。

+ +

方法一覽

+ + + + + + + + + + +
void close(in optional unsigned long code, in optional DOMString reason);
void send(in DOMString data);
+ +

屬性

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
屬性形態描述
binaryType{{ DOMXref("DOMString") }}表示連線傳輸的二進制資料形態的字串，若使用 {{ domxref("Blob") }} 物件則為 "blob"，使用 ArrayBuffer 物件則為 "arraybuffer"。
bufferedAmountunsigned long呼叫 {{ manch("send") }} 隊列但尚未傳輸至網路上資料的位元數。連線關閉時此值不會重設為零。連續呼叫 {{ manch("send") }} 會讓此值不斷上升。唯讀
extensions{{ DOMXref("DOMString") }}伺服器選擇的擴展。目前僅有空字串或表示資料經過壓縮的 "deflate-stream"。唯讀
onclose{{ domxref("EventListener") }}當 WebSocket 連線的 readyState 切換至 CLOSED 時呼叫的事件監聽器。監聽器接收命名為 "close" 的 CloseEvent。
onerror{{ domxref("EventListener") }}當錯誤發生時呼叫的事件監聽器。事件為命名 "error" 的簡單事件。
onmessage{{ domxref("EventListener") }}當瀏覽器接收伺服器的訊息時呼叫的事件監聽器。監聽器接收命名為 "message" 的 MessageEvent。
onopen{{ domxref("EventListener") }}當 WebSocket 連線的 readyState 切換至 OPEN 時呼叫的事件監聽器，表示連線已準備傳送、接收資料。事件為命名 "open" 的簡單事件。
protocol{{ DOMXref("DOMString") }}伺服器選擇的子協定，這是建立 WebSocket 物件時 protocols 參數裡的其中一個字串。
readyStateunsigned short連線的目前狀態，是就緒狀態常數的其中一個。唯讀
url{{ DOMXref("DOMString") }}建構方法解析出來的 URL，總是絕對 URL。唯讀
+ +

常數

+ +

就緒狀態常數

+ +

readyState 屬性使用以下常數描述 WebSocket 的連線狀態。

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
常數值描述
CONNECTING0連線尚未打開。
OPEN1連線已打開，可以進行通訊。
CLOSING2連線正在進行關閉程序。
CLOSED3連線已關閉／連線不能打開。
+ +

方法

+ +

close()

+ +

關閉 WebSocket 連線／連線嘗試，若連線已為 CLOSED，此方法沒有作用。

+ +
void close(
+  in optional unsigned short code,
+  in optional DOMString reason
+);
+
+ +
參數
+ +
+
code {{ optional_inline() }}
+
表示狀態代碼，狀態代碼用以解釋連線關閉的原因。若未指定參數，預設值為 1000（表示正常的「事務完結（transaction complete）」關閉）。請參考 CloseEvent 頁面的狀態代碼列表，有所有的合法值。
+
reason {{ optional_inline() }}
+
解釋連線關閉原因的人類可讀字串，字串必不可大於 123 個 UTF-8 字符。
+
+ +
可丟例外
+ +
+
INVALID_ACCESS_ERR
+
指定不合法的 code。
+
SYNTAX_ERR
+
reason 字串太長或是含有未配對的代理對。
+
+ +

send()

+ +

透過 WebSocket 連線傳輸資料至伺服器。

+ +
void send(
+  in DOMString data
+);
+
+void send(
+  in ArrayBuffer data
+);
+
+void send(
+  in Blob data
+);
+
+ +
參數
+ +
+
data
+
要傳送至伺服器的字串。
+
+ +
可丟例外
+ +
+
INVALID_STATE_ERR
+
目前連線不為 OPEN。
+
SYNTAX_ERR
+
資料為帶有未配對代理對的字串。
+
+ +
註釋
+ +
+

{{ gecko_callout_heading("6.0") }}

+ +

Gecko send() 方法的實作與 Gecko 6.0 的規範有差別。Gecko 回傳一個 boolean 以表示連線是否仍處於開啟狀態（且資料成功隊列／傳輸）。另外，此時此刻，Gecko 不支援 ArrayBuffer 或 {{ domxref("Blob") }} 作為資料形態。

+
+ +

參見

+ + + +

瀏覽器兼容

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
功能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本支援{{ CompatUnknown() }}{{ CompatGeckoDesktop("2.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
子協定支援{{ CompatUnknown() }}{{ CompatGeckoDesktop("6.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
功能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本支援{{ CompatUnknown() }}{{ CompatGeckoMobile("7.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
子協定支援{{ CompatUnknown() }}{{ CompatGeckoMobile("7.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+ +

Gecko 備註

+ +

自從 Gecko 6.0，建構方法有前輟，須使用 MozWebSocket()：

+ +
var mySocket = new MozWebSocket("http://www.example.com/socketserver");
+
+ +

{{ languages ( {"en": "en/WebSockets/WebSockets_reference/WebSocket"} ) }}

diff --git a/files/zh-tw/web/api/websockets_api/index.html b/files/zh-tw/web/api/websockets_api/index.html new file mode 100644 index 0000000000..3cbb630f41 --- /dev/null +++ b/files/zh-tw/web/api/websockets_api/index.html @@ -0,0 +1,155 @@ +--- +title: WebSockets +slug: WebSockets +tags: + - WebSockets +translation_of: Web/API/WebSockets_API +--- +

{{ SeeCompatTable() }}

+

WebSocket 是一種讓瀏覽器與伺服器進行一段互動通訊的技術。這個 API 在不必輪詢（poll）伺服器下，讓使用者傳送訊息至伺服器並接受事件驅動回應。

+ + + + + + + +
+

文件

+
+
+ 製作 WebSocket 客戶端應用程式
+
+ 指導如何製作在瀏覽器上跑 WebSocket 客戶端的教程。
+
+ WebSockets 參考手冊
+
+ 客戶端的 WebSocket API 參考手冊。
+
+ The WebSocket protocol
+
+ WebSocket 協定參考。
+
+ Writing WebSocket servers
+
+ 處理 WebSocket 協定的伺服器端代碼書寫指引。
+
+

所有文件...

+ 		+

工具

+ +

 

+ +
+
+ AJAX、JavaScript
+
+
+

參見

+ +

瀏覽器兼容

+

{{ CompatibilityTable() }}

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
功能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
版本 -76 {{ obsolete_inline() }}6{{ CompatGeckoDesktop("2.0") }}{{ CompatNo() }}11.00 (禁用)5.0.1
協定版本 7{{ CompatNo() }} +

{{ CompatGeckoDesktop("6.0") }}

+
+ 請用 MozWebSocket。
+ 		{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
協定版本 1014 +

{{ CompatGeckoDesktop("7.0") }}

+
+ 請用 MozWebSocket。
+ 		HTML5 Labs{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
功能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
版本 -76 {{ obsolete_inline() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
協定版本 7{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
協定版本 8 (IETF 草案 10){{ CompatUnknown() }}{{ CompatGeckoMobile("7.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+

Gecko 附註

+

Firefox 的 WebSockets 支援正在持續追蹤發展中的 WebSocket 規範。Firefox 6 實作底層協定版號 7，Firefox 7 實作協定版號 8（IETF 草案 10 的內容）。Firefox mobile 在 7.0 版支援 WebSocket。

+
+

{{ gecko_callout_heading("6.0") }}

+

Gecko 6.0 {{ geckoRelease("6.0") }} 之前，不該存在的 WebSocket 物件使得某些開發者認為 WebSocket 服務沒有前輟，此物件已被更名為 MozWebSocket。

+
+
+

{{ gecko_callout_heading("7.0") }}

+

自從 Gecko 7.0 {{ geckoRelease("7.0") }}，偏好設定 network.websocket.max-connections 可以用來設定 WebSocket 連線同時開啟的最大個數。預設值為 200。

+
+
+ 警告：雖然不是唯一的理由，但是目前 WebSockets 被 Firefox 4 與 5 禁用的關鍵原因是一個協定設計上的安全問題，因此不建議在生產環境下使用這些 Firefox 版本的 WebSockets。若仍想測試 WebSockets，你可以開啟 about:config 並設定 network.websocket.enabled 的取值至 true，並需要同時設定 network.websocket.override-security-block 的取值至 true 才能允許 WebSocket 連線的初始化。
+

{{ HTML5ArticleTOC() }}

+

{{ languages ( {"en": "en/WebSockets", "es": "es/WebSockets"} ) }}

diff --git a/files/zh-tw/web/api/websockets_api/writing_websocket_client_applications/index.html b/files/zh-tw/web/api/websockets_api/writing_websocket_client_applications/index.html new file mode 100644 index 0000000000..8f1299379f --- /dev/null +++ b/files/zh-tw/web/api/websockets_api/writing_websocket_client_applications/index.html @@ -0,0 +1,179 @@ +--- +title: 製作 WebSocket 客戶端應用程式 +slug: WebSockets/Writing_WebSocket_client_applications +tags: + - WebSockets +translation_of: Web/API/WebSockets_API/Writing_WebSocket_client_applications +--- +

{{ draft() }}

+ +

WebSocket 是一種讓瀏覽器與伺服器進行一段互動通訊的技術。使用這項技術的 Webapp 可以直接進行即時通訊而不需要不斷對資料更改進行輪詢（polling）。

+ +
注：當我們的系統架構可以寄存 WebSocket 範例之後，我們會提供聊天／伺服器系統實例的幾個範例。
+ +

哪裡有 WebSocket

+ +

若 JavaScript 代碼的範疇是 {{ domxref("Window") }} 物件或是實作 {{ domxref("WorkerUtils") }} 的物件，則可使用 WebSocket API。也就是可以從 Web Workers 使用 WebSocket。

+ +
注：WebSockets API（與底層協定）的開發還在進展中，且目前不同瀏覽器（甚至瀏覽器的不同版本）有很多兼容問題。
+ +

建立一個 WebSocket 物件

+ +

你必須建立一個 WebSocket 物件才能讓瀏覽器／伺服器得以以 WebSocket 協定進行通訊，此物件在被建立之後會自動與伺服器連線。

+ +
注：別忘記在 Firefox 6.0 中 WebSocket 物件仍有前輟，所以在這裡須改成 MozWebSocket。
+ +

WebSocket 的建構方法有一個必要參數與一個選擇參數：

+ +
WebSocket WebSocket(
+  in DOMString url,
+  in optional DOMString protocols
+);
+
+WebSocket WebSocket(
+  in DOMString url,
+  in optional DOMString[] protocols
+);
+
+ +
+
url
+
連線用的 URL，WebSocket 伺服器會回應這個 URL。
+
+ 根據網際網路工程任務小組（Internet Engineering Task Force，IETF）定義之規範， URL 的協議類型必須是 ws:// （非加密連線）或是 wss:// （加密連線）
+
protocols {{ optional_inline() }}
+
一個表示協定的字串或者是一個表示協定的字串構成的陣列。這些字串可以用來指定子協定，因此一個伺服器可以實作多個 WebSocket 子協定（舉例來說，你可以讓一個伺服器處理不同種類的互動情形，各情形以 protocol 分別）。若不指定協定字串則預設值為空字串。
+
+ +

此建構方法可能拋出以下例外：

+ +
+
SECURITY_ERR
+
連線使用的埠被阻擋。
+
+ +

範例

+ +

此簡單範例建立了一個新的 WebSocket，連到位於 http://www.example.com/socketserver 的伺服器。指定的子協定是 "my-custom-protocol"。

+ +
var mySocket = new WebSocket("ws://www.example.com/socketserver", "my-custom-protocol");
+
+ +

回傳之後，mySocket 的 readyState 會變成 CONNECTING。當連線已可以傳輸資料時 readyState 會變成 OPEN。

+ +

要建立一個連線但不指定單一個特定協定，可以指定一個協定構成的陣列：

+ +
var mySocket = new WebSocket("ws://www.example.com/socketserver", ["protocol1", "protocol2"]);
+
+ +

當連線建立的時候（也就是 readyState 變成而 OPEN 的時候），protocol 屬性會回傳伺服器選擇的協定。

+ +

傳資料給伺服器

+ +

連線開啟之後即可開始傳資料給伺服器。呼叫 WebSocket 的 send() 來發送訊息：

+ +
mySocket.send("這是伺服器正迫切需要的文字！");
+
+ +

可以被傳送的內容包括字串、Blob 或是 ArrayBuffer。

+ +
注：Firefox 目前只支援字串傳送。
+ +

用 JSON 傳輸物件

+ +

有一個很方便的方法是用 JSON 傳送複雜的資料給伺服器，舉例來說，聊天程式可以設計一種協定，這個協定傳送以 JSON 封裝的資料封包：

+ +
// 透過伺服器傳送文字給所有使用者
+
+function sendText() {
+  var msg = {
+    type: "message",
+    text: document.getElementById("text").value,
+    id: clientID,
+    date: Date.now()
+  };
+
+  mySocket.send(JSON.stringify(msg));
+  document.getElementById("text").value = "";
+}
+
+ +

這份代碼先建立一個物件：msg，它包含伺服器處理訊息所需的種種資訊，然後呼叫 JSON.stringify() 使該物件轉換成 JSON 格式並呼叫 WebSocket 的 send() 方法來傳輸資料至伺服器。

+ +

從伺服器接收訊息

+ +

WebSockets 是一個事件驅動 API，當瀏覽器收到訊息時，一個「message」事件被傳入 onmessage 函數。使用以下方法開始傾聽傳入資料：

+ +
mySocket.onmessage = function(e) {
+  console.log(e.data);
+}
+
+ +

接收並解讀 JSON 物件

+ +

考慮先前在「用 JSON 傳輸物件」談起的聊天應用程式。客戶端可能收到的資料封包有幾種：

+ + + +

用來解讀傳入訊息的代碼可能像是：

+ +
connection.onmessage = function(evt) {
+  var f = document.getElementById("chatbox").contentDocument;
+  var text = "";
+  var msg = JSON.parse(evt.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>使用者 <em>" + msg.name + "</em> 登入於 " + timeStr + "</b><br>";
+      break;
+    case "message":
+      text = "(" + timeStr + ") <b>" + msg.name + "</b>: " + msg.text + "<br>";
+      break;
+    case "rejectusername":
+      text = "<b>由於你選取的名字已被人使用，你的使用者名稱已被設置為 <em>" + msg.name + "</em>。";
+      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);
+  }
+};
+
+ +

這裡我們使用 JSON.parse() 使 JSON 物件轉換成原來的物件，檢驗並根據內容採取行動。

+ +

關閉連線

+ +

當你想結束 WebSocket 連線的時候，呼叫 WebSocket 的 close() 方法：

+ +
mySocket.close();
+
+ +

參考資料

+ +

IETF: The WebSocket protocol draft-abarth-thewebsocketprotocol-01

+ +

 

+ +

{{ languages ( {"en": "en/WebSockets/Writing_WebSocket_client_applications"} ) }}

+ +
+
diff --git a/files/zh-tw/web/api/webvtt_api/index.html b/files/zh-tw/web/api/webvtt_api/index.html new file mode 100644 index 0000000000..e565d2d129 --- /dev/null +++ b/files/zh-tw/web/api/webvtt_api/index.html @@ -0,0 +1,691 @@ +--- +title: WebVTT +slug: Web/API/Web_Video_Text_Tracks_Format +translation_of: Web/API/WebVTT_API +--- +

WebVTT 是一種 UTF-8 編碼的文字檔案格式，可藉由 {{ HTMLElement("track") }} 元素顯示加註時間資訊之文字軌，其主要設計目的是為 {{ HTMLElement("video") }} 顯示字幕。

+ +

WebVTT 當中可以採用空白或分隔字元（tab）。

+ +

WebVTT 的 MIME Type 為 text/vtt。

+ +

 

+ +

WebVTT 文本

+ +

WebVTT 檔的結構中，有兩項必備資訊、四項選用資訊。

+ + + +
範例 1 - 最簡單的 WEBVTT 檔
+ +
  WEBVTT
+
+
+ +
範例 2 - 很簡單的 WebVTT 檔
+ +
  WEBVTT - 這個檔案沒有時間節點
+
+
+ +
範例 3 - 常見的 WebVTT 例子
+ +
  WEBVTT - 這個檔案有時間節點
+
+  14
+  00:01:14.815 --> 00:01:18.114
+  - What?
+  - Where are we now?
+
+  15
+  00:01:18.171 --> 00:01:20.991
+  - This is big bat country.
+
+  16
+  00:01:21.058 --> 00:01:23.868
+  - [ Bats Screeching ]
+  - They won't get in your hair. They're after the bugs.
+
+ +

 

+ +

WebVTT 註解

+ +

Comments are an optional component that can be used to add information to a WebVTT file. Comments are intended for those reading the file and are not seen by users. Comments may contain newlines but it cannot contain a blank line, which is equivalent to two consecutive newlines. A blank line signifies the end of a comment.

+ +

註解中不能包含「-->」字串、「&」符號或「<」符號。如欲使用後兩者，可採跳脫字串「&amp;」或「&lt;」。此外雖規格上允許使用「>」字元，仍然建議跳脫為「&gt;」以避免混淆。

+ +

註解由三個部分組成：

+ + + +
範例 4 - 常見 WebVTT 範例
+ +
  NOTE 這行是註解
+
+ +
範例 5 - 多行註解
+ +
  NOTE
+  這也是註解，
+  只是拆成多行。
+
+  NOTE 當然也可以像這樣
+  來分行寫註解。
+
+ +
範例 6 - 常見註解使用方式
+ +
  WEBVTT - 翻譯我喜歡的影片字幕
+
+  NOTE
+  本字幕由 Kyle 翻譯，
+  希望可以讓我的朋友跟家人一同觀賞。
+
+  1
+  00:02:15.000 --> 00:02:20.000
+  - Ta en kopp varmt te.
+  - Det är inte varmt.
+
+  2
+  00:02:20.000 --> 00:02:25.000
+  - Har en kopp te.
+  - Det smakar som te.
+
+  NOTE This last line may not translate well.
+
+  3
+  00:02:25.000 --> 00:02:30.000
+  -Ta en kopp.
+
+ +

 

+ +

WebVTT 時間節點

+ +

時間節點（cue）是具備單一開始時間、結束時間、文字內容的字幕區段。 Example 6 consists of the header, a blank line, and then five cues separated by blank lines. 時間節點由五個部分組成：

+ + + +
範例7 - Example of a cue
+ +
1 - Title Crawl
+00:00:5.000 --> 00:00:10.000 line:0 position:20% size:60% align:start
+Some time ago in a place rather distant....
+ +

 

+ +

節點 ID

+ +

此 ID 代表時間節點的名稱，可以用以在腳本語言中參照某段特定時間節點。ID 中禁用換行字元，也不可以包括「-->」字串。ID 最後必須以一個換行字元作為結束。

+ +

雖然通常都用數字（1, 2, 3...）作為 ID，但規格上並不要求每個 ID 都是為一值。

+ +
範例 8 - 範例 7 中的時間節點 ID
+ +
1 - Title Crawl
+ +
範例 9 - ID 常見用法
+ +
WEBVTT
+
+1
+00:00:22.230 --> 00:00:24.606
+This is the first subtitle.
+
+2
+00:00:30.739 --> 00:00:34.074
+This is the second.
+
+3
+00:00:34.159 --> 00:00:35.743
+Third
+
+ +

 

+ +

時間資訊

+ +

時間資訊標注了此段節點的出現時機，其中包括開始時間與結束時間。結束時間必須比開始時間晚，而開始時間必須比先前所有的開始時間晚，或至少是同一時間。

+ +

不同時間節點可以設定為同時顯示，但若 WebVTT 檔案是用在 chapters（{{ HTMLElement("track") }} 的 {{ htmlattrxref("kind") }} 設定為 chapters），則不允許兩段節點同時出現。

+ +

每項時間資訊都由五個部分組成：

+ + + +

時間的表示方式，可以是以下兩種：

+ + + +

其中的各元素說明如下：

+ + + +
Example 10 - Basic cue timing examples
+ +
00:22.230 --> 00:24.606
+00:30.739 --> 00:00:34.074
+00:00:34.159 --> 00:35.743
+00:00:35.827 --> 00:00:40.122
+ +
Example 11 - Overlapping cue timing examples
+ +
00:00:00.000 --> 00:00:10.000
+00:00:05.000 --> 00:01:00.000
+00:00:30.000 --> 00:00:50.000
+ +
Example 12 - Non-overlapping cue timing examples
+ +
00:00:00.000 --> 00:00:10.000
+00:00:10.000 --> 00:01:00.581
+00:01:00.581 --> 00:02:00.100
+00:02:01.000 --> 00:02:01.000
+ +

 

+ +

Cue Settings

+ +

Cue settings are optional components used to position where the cue payload text will be displayed over the video. This includes whether the text is displayed horizontally or vertically. There can be zero or more of them, and they can be used in any order so long as each setting is used no more than once.

+ +

The cue settings are added to the right of the cue timings. There must be one or more spaces between the cue timing and the first setting and between each setting. A setting's name and value are separated by a colon. The settings are case sensitive so use lower case as shown. There are five cue settings:

+ + + +
Example 13 - Cue setting examples
+ +

The first line demonstrates no settings. The second line might be used to overlay text on a sign or label. The third line might be used for a title. The last line might be used for an Asian language.

+ +
00:00:5.000 --> 00:00:10.000
+00:00:5.000 --> 00:00:10.000 line:63% position:72% align:start
+00:00:5.000 --> 00:00:10.000 line:0 position:20% size:60% align:start
+00:00:5.000 --> 00:00:10.000 vertical:rt line:-1 align:end
+
+ +

 

+ +

文字內容

+ +

The payload is where the main information or content is located. In normal usage the payload contains the subtitles to be displayed. The payload text may contain newlines but it cannot contain a blank line, which is equivalent to two consecutive newlines. A blank line signifies the end of a cue.

+ +

文字內容中不能包含「-->」字串、「&」符號或「<」符號。如欲使用後兩者，可採跳脫字串「&amp;」或「&lt;」。此外雖規格上允許使用「>」字元，仍然建議跳脫為「&gt;」以避免混淆。若您使用 WebVTT 檔作為後設資料，則可不管這些限制。

+ +

除了上述的三個跳脫字串外，還有其他四種跳脫字串，分列如下

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Table 6 - 跳脫字串
名稱字元跳脫字串
「與」&&amp;
小於<&lt;
大於>&gt;
左到右標記 &lrm;
右到左標記 &rlm;
不斷行空白 &nbsp;
+ +

 

+ +

文字內容中的標籤

+ +

有很多標籤（例如 <bold>）可以用在文字內容中，但若 {{ HTMLElement("track") }} 的 {{ htmlattrxref("kind") }} 設定為 chapters 時，其中所用的 WebVTT  檔案裡就不能使用標籤。

+ + + +

 

+ +

以下則需要開頭標籤與結束標籤（例如 <b>text</b>）。

+ + + +

 

+ +

瀏覽器支援

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本支援18 以上24 (預設為關閉)10 以上15.0 以上 7 以上
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IChrome for MobileOpera MobileSafari Mobile
基本支援4.4 以上       目前尚不支援         35.0 以上   21.0 以上7 以上
+ +

 

+ +

 

+
+ +

規格

+ + diff --git a/files/zh-tw/web/api/window.history/index.html b/files/zh-tw/web/api/window.history/index.html deleted file mode 100644 index 67b79c5f82..0000000000 --- a/files/zh-tw/web/api/window.history/index.html +++ /dev/null @@ -1,51 +0,0 @@ ---- -title: Window.history -slug: Web/API/Window.history -translation_of: Web/API/Window/history ---- -

{{ APIRef }}

- -

Window.history 唯讀屬性會回傳一個 {{domxref("History")}} 物件，其提供了一個介面來操控瀏覽器的 session history 紀錄（為當前面頁所在分頁中訪問、或於當前面頁中透過頁面框架（frame）所載入的頁面）。

- -

相關範例及細節請參考操控瀏覽器歷史紀錄一文。文章中解釋了在使用 pushState() 與 replaceState() 方法前應該要知道的安全性功能。

- -

語法

- -
var historyObj = window.history;
-
- -

範例

- -
history.back();     // 相當於按下上一頁按鈕
-history.go(-1);     // 相當於 history.back();
-
- -

備註

- -

For top-level pages you can see the list of pages in the session history, accessible via the History object, in the browser's dropdowns next to the back and forward buttons.

- -

For security reasons the History object doesn't allow the non-privileged code to access the URLs of other pages in the session history, but it does allow it to navigate the session history.

- -

There is no way to clear the session history or to disable the back/forward navigation from unprivileged code. The closest available solution is the location.replace() method, which replaces the current item of the session history with the provided URL.

- -

規範

- - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('HTML WHATWG', 'browsers.html#the-history-interface', 'The History interface')}}{{Spec2('HTML WHATWG')}} 
{{SpecName('HTML5 W3C', 'browsers.html#the-history-interface', 'The History interface')}}{{Spec2('HTML5 W3C')}} 
diff --git a/files/zh-tw/web/api/window.onpopstate/index.html b/files/zh-tw/web/api/window.onpopstate/index.html deleted file mode 100644 index d98464d356..0000000000 --- a/files/zh-tw/web/api/window.onpopstate/index.html +++ /dev/null @@ -1,57 +0,0 @@ ---- -title: window.onpopstate -slug: Web/API/Window.onpopstate -translation_of: Web/API/WindowEventHandlers/onpopstate ---- -
{{ApiRef}} {{gecko_minversion_header("2")}}
- -

摘要

- -

視窗上 popstate 事件的事件處理器。

- -

在同一文件的當前歷史紀錄變動時，如果其變動介於兩個歷史紀錄間，popstate 就會被呼叫。如果當前的歷史紀錄是藉由呼叫 history.pushState() 建立，或曾被 history.replaceState() 修改過，popstate 事件的 state 屬性，將包含一份歷史紀錄的 state 物件。

- -

請注意：直接呼叫 history.pushState() 或 history.replaceState() 不會驅動 popstate 事件。popstate 事件只會被瀏覽器的行為驅動，例如點擊上一頁按鈕（或透過 JavaScript 呼叫 history.back()）。且此事件只會在用戶於同文件的兩個歷史紀錄間瀏覽時作動。

- -

在頁面載入時，不同瀏覽器具有不同的 popstate 行為。Chrome 與 Safari 會在頁面載入時觸發 popstate 事件，但 Firefox 則不會。

- -

語法

- -
window.onpopstate = funcRef;
-
- - - -

popstate 事件

- -

以下範例，位於 http://example.com/example.html 並執行下列程式的頁面，將會產生如標示的對話框：

- -
window.onpopstate = function(event) {
-  alert("location: " + document.location + ", state: " + JSON.stringify(event.state));
-};
-
-history.pushState({page: 1}, "title 1", "?page=1");
-history.pushState({page: 2}, "title 2", "?page=2");
-history.replaceState({page: 3}, "title 3", "?page=3");
-history.back(); // 跳出 "location: http://example.com/example.html?page=1, state: {"page":1}"
-history.back(); // 跳出 "location: http://example.com/example.html, state: null
-history.go(2);  // 跳出 "location: http://example.com/example.html?page=3, state: {"page":3}
-
- -

請注意，雖然原始的歷史紀錄（http://example.com/example.html）沒有關聯的 state 物件，在我們第二次呼叫 hitsory.back() 時仍然會觸發 popstate 事件。

- -

標準

- - - -

請參照

- - diff --git a/files/zh-tw/web/api/window.requestanimationframe/index.html b/files/zh-tw/web/api/window.requestanimationframe/index.html deleted file mode 100644 index 55aa85d292..0000000000 --- a/files/zh-tw/web/api/window.requestanimationframe/index.html +++ /dev/null @@ -1,94 +0,0 @@ ---- -title: Window.requestAnimationFrame() -slug: Web/API/Window.requestAnimationFrame -translation_of: Web/API/window/requestAnimationFrame ---- -
{{APIRef}}
- -

window.requestAnimationFrame()方法通知瀏覽器我們想要產生動畫，並且要求瀏覽器在下次重繪畫面前呼叫特定函數更新動畫。這個方法接受一個引數作為下次重繪前調用的回呼函數。

- -
Note: 若是想要在下次重繪時產生另一個動畫，這個回呼函數內必須自行呼叫 requestAnimationFrame()。
- -

當準備好更新頁面上的動畫時應當呼叫這個方法。這表示向瀏覽器請求在下次重繪前呼叫這個動畫函數。回呼的次數通常落在每秒 60 次，但通常會根據 W3C 的建議符合多數瀏覽器重新整理的頻率。當頁面處於背景或隱藏狀態時 {{ HTMLElement("iframe") }} ，多數的瀏覽器會暫停 requestAnimationFrame() 的呼叫，從而改善效能表現及電池壽命。

- -

回呼方法會得到一個 {{domxref("DOMHighResTimeStamp")}} 的引數，作為指示目前的時間（基於 time origin 之後經過的毫秒數）。當 requestAnimationFrame() 佇列了數個回呼並且在同一幀開始觸發多個回呼時，儘管每一個之前的回呼在運作時會消耗一定的時間，但它們都會取得同樣的時間戳記。時間戳記是由十進位數字表示的毫秒且最小的精準度為 1 毫秒（1000 µs）。

- -

語法

- -
window.requestAnimationFrame(callback);
-
- -

參數

- -
-
回呼
-
當下次重新繪製時用於呼叫並更新動畫。回呼函數會得到一個引數—— {{domxref("DOMHighResTimeStamp")}} ——類似於由 {{domxref('performance.now()')}} 回傳的結果，其用於指示當 requestAnimationFrame() 開始執行回呼函數的時間。
-
- -

回傳值

- -

long 型別的整數值表示請求的 id，作為其進入回呼清單中的唯一識別。雖然回傳值是一個非零值，但不應該對其有其他任何的假設。將這個值傳遞給 {{domxref("window.cancelAnimationFrame()")}} 可以取消重新整理頁面回呼的請求

- -

範例

- -
var start = null;
-var element = document.getElementById('SomeElementYouWantToAnimate');
-
-function step(timestamp) {
-  if (!start) start = timestamp;
-  var progress = timestamp - start;
-  element.style.transform = 'translateX(' + Math.min(progress / 10, 200) + 'px)';
-  if (progress < 2000) {
-    window.requestAnimationFrame(step);
-  }
-}
-
-window.requestAnimationFrame(step);
-
- -

備註

- -

Edge 低於 17 的版本和 Internet Explorer 無法保證在繪製循環前觸發 requestAnimationFrame。

- -

規格

- - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('HTML WHATWG', '#animation-frames', 'requestAnimationFrame')}}{{Spec2('HTML WHATWG')}}No change, supersedes the previous one.
{{SpecName('RequestAnimationFrame', '#dom-windowanimationtiming-requestanimationframe', 'requestAnimationFrame')}}{{Spec2('RequestAnimationFrame')}}Initial definition
- -

瀏覽器相容性

- -
-

{{Compat("api.Window.requestAnimationFrame")}}

-
- -

其他參考

- - diff --git a/files/zh-tw/web/api/window/domcontentloaded_event/index.html b/files/zh-tw/web/api/window/domcontentloaded_event/index.html new file mode 100644 index 0000000000..0ec78423ec --- /dev/null +++ b/files/zh-tw/web/api/window/domcontentloaded_event/index.html @@ -0,0 +1,133 @@ +--- +title: DOMContentLoaded +slug: Web/Events/DOMContentLoaded +translation_of: Web/API/Window/DOMContentLoaded_event +--- +

DOMContentLoaded事件是當document被完整的讀取跟解析後就會被觸發,不會等待 stylesheets, 圖片和subframes完成讀取  (load事件可以用來作為判斷頁面已經完整讀取的方法).

+ +
+

Note: Stylesheet loads block script execution, 如果 <script> 被放在 <link rel="stylesheet" ...>後面的話, 須等到前面的stylesheet載入並完成解析，此時 DOMContentLoaded才會被觸發。

+
+ +

Speeding up

+ +

If you want DOM to get parsed as fast as possible after the user had requested the page, some things you could do is turn your JavaScript asynchronous and to optimize loading of stylesheets which if used as usual, slow down page load due to being loaded in parallel, "stealing" traffic from the main html document.

+ +

General info

+ +
+
Specification
+
HTML5
+
Interface
+
Event
+
Bubbles
+
Yes
+
Cancelable
+
Yes (although specified as a simple event that isn't cancelable)
+
Target
+
Document
+
Default Action
+
None.
+
+ +

屬性

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
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.
+ +

瀏覽器相容性

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support0.2{{ CompatGeckoDesktop("1") }}9.09.03.1
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{ CompatVersionUnknown() }}{{ CompatGeckoMobile("1") }}{{ CompatUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
+
+ +

Bubbling for this event is supported by at least Gecko 1.9.2, Chrome 6, and Safari 4.

+ +

Cross-browser fallback

+ +

Internet Explorer 8 supports the <code>readystatechange</code> event, which can be used to detect that the DOM is ready. In earlier version of Internet Explorer, this state can be detected by regularily trying to execute <code>document.documentElement.doScroll("left");</code>, as this snippet will throw an error until the DOM is ready.

+ +

General-purpose JS libraries such as jQuery offer cross-browser methods to detect that the DOM is ready. There are also standalone scripts that offer this feature : contentloaded.js (supports only one listener) and jquery.documentReady.js (doesn't depend on jQuery, despite its name).

+ + + + diff --git a/files/zh-tw/web/api/window/history/index.html b/files/zh-tw/web/api/window/history/index.html new file mode 100644 index 0000000000..67b79c5f82 --- /dev/null +++ b/files/zh-tw/web/api/window/history/index.html @@ -0,0 +1,51 @@ +--- +title: Window.history +slug: Web/API/Window.history +translation_of: Web/API/Window/history +--- +

{{ APIRef }}

+ +

Window.history 唯讀屬性會回傳一個 {{domxref("History")}} 物件，其提供了一個介面來操控瀏覽器的 session history 紀錄（為當前面頁所在分頁中訪問、或於當前面頁中透過頁面框架（frame）所載入的頁面）。

+ +

相關範例及細節請參考操控瀏覽器歷史紀錄一文。文章中解釋了在使用 pushState() 與 replaceState() 方法前應該要知道的安全性功能。

+ +

語法

+ +
var historyObj = window.history;
+
+ +

範例

+ +
history.back();     // 相當於按下上一頁按鈕
+history.go(-1);     // 相當於 history.back();
+
+ +

備註

+ +

For top-level pages you can see the list of pages in the session history, accessible via the History object, in the browser's dropdowns next to the back and forward buttons.

+ +

For security reasons the History object doesn't allow the non-privileged code to access the URLs of other pages in the session history, but it does allow it to navigate the session history.

+ +

There is no way to clear the session history or to disable the back/forward navigation from unprivileged code. The closest available solution is the location.replace() method, which replaces the current item of the session history with the provided URL.

+ +

規範

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG', 'browsers.html#the-history-interface', 'The History interface')}}{{Spec2('HTML WHATWG')}} 
{{SpecName('HTML5 W3C', 'browsers.html#the-history-interface', 'The History interface')}}{{Spec2('HTML5 W3C')}} 
diff --git a/files/zh-tw/web/api/window/load_event/index.html b/files/zh-tw/web/api/window/load_event/index.html new file mode 100644 index 0000000000..7c6d314925 --- /dev/null +++ b/files/zh-tw/web/api/window/load_event/index.html @@ -0,0 +1,88 @@ +--- +title: load +slug: Web/Events/load +translation_of: Web/API/Window/load_event +--- +

load 事件發生在加載完目標資源、該資源依賴的其他資源時。

+ +

一般資訊

+ +
+
規範
+
DOM L3
+
介面
+
UIEvent
+
起泡事件
+
No
+
可取消
+
No
+
對象
+
Window
+
預設行為
+
None.
+
+ +

屬性

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
PropertyTypeDescription
target {{readonlyInline}}EventTargetThe event target (the topmost target in the DOM tree).
type {{readonlyInline}}DOMStringThe type of event.
bubbles {{readonlyInline}}BooleanWhether the event normally bubbles or not.
cancelable {{readonlyInline}}BooleanWhether the event is cancellable or not.
view {{readonlyInline}}WindowProxydocument.defaultView (window of the document)
detail {{readonlyInline}}long (float)0.
+ +

範例

+ +
<script>
+  window.addEventListener("load", function(event) {
+    console.log("All resources finished loading!");
+  });
+</script>
+
+ +

 

+ +

相關事件

+ + diff --git a/files/zh-tw/web/api/window/requestanimationframe/index.html b/files/zh-tw/web/api/window/requestanimationframe/index.html new file mode 100644 index 0000000000..55aa85d292 --- /dev/null +++ b/files/zh-tw/web/api/window/requestanimationframe/index.html @@ -0,0 +1,94 @@ +--- +title: Window.requestAnimationFrame() +slug: Web/API/Window.requestAnimationFrame +translation_of: Web/API/window/requestAnimationFrame +--- +
{{APIRef}}
+ +

window.requestAnimationFrame()方法通知瀏覽器我們想要產生動畫，並且要求瀏覽器在下次重繪畫面前呼叫特定函數更新動畫。這個方法接受一個引數作為下次重繪前調用的回呼函數。

+ +
Note: 若是想要在下次重繪時產生另一個動畫，這個回呼函數內必須自行呼叫 requestAnimationFrame()。
+ +

當準備好更新頁面上的動畫時應當呼叫這個方法。這表示向瀏覽器請求在下次重繪前呼叫這個動畫函數。回呼的次數通常落在每秒 60 次，但通常會根據 W3C 的建議符合多數瀏覽器重新整理的頻率。當頁面處於背景或隱藏狀態時 {{ HTMLElement("iframe") }} ，多數的瀏覽器會暫停 requestAnimationFrame() 的呼叫，從而改善效能表現及電池壽命。

+ +

回呼方法會得到一個 {{domxref("DOMHighResTimeStamp")}} 的引數，作為指示目前的時間（基於 time origin 之後經過的毫秒數）。當 requestAnimationFrame() 佇列了數個回呼並且在同一幀開始觸發多個回呼時，儘管每一個之前的回呼在運作時會消耗一定的時間，但它們都會取得同樣的時間戳記。時間戳記是由十進位數字表示的毫秒且最小的精準度為 1 毫秒（1000 µs）。

+ +

語法

+ +
window.requestAnimationFrame(callback);
+
+ +

參數

+ +
+
回呼
+
當下次重新繪製時用於呼叫並更新動畫。回呼函數會得到一個引數—— {{domxref("DOMHighResTimeStamp")}} ——類似於由 {{domxref('performance.now()')}} 回傳的結果，其用於指示當 requestAnimationFrame() 開始執行回呼函數的時間。
+
+ +

回傳值

+ +

long 型別的整數值表示請求的 id，作為其進入回呼清單中的唯一識別。雖然回傳值是一個非零值，但不應該對其有其他任何的假設。將這個值傳遞給 {{domxref("window.cancelAnimationFrame()")}} 可以取消重新整理頁面回呼的請求

+ +

範例

+ +
var start = null;
+var element = document.getElementById('SomeElementYouWantToAnimate');
+
+function step(timestamp) {
+  if (!start) start = timestamp;
+  var progress = timestamp - start;
+  element.style.transform = 'translateX(' + Math.min(progress / 10, 200) + 'px)';
+  if (progress < 2000) {
+    window.requestAnimationFrame(step);
+  }
+}
+
+window.requestAnimationFrame(step);
+
+ +

備註

+ +

Edge 低於 17 的版本和 Internet Explorer 無法保證在繪製循環前觸發 requestAnimationFrame。

+ +

規格

+ + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG', '#animation-frames', 'requestAnimationFrame')}}{{Spec2('HTML WHATWG')}}No change, supersedes the previous one.
{{SpecName('RequestAnimationFrame', '#dom-windowanimationtiming-requestanimationframe', 'requestAnimationFrame')}}{{Spec2('RequestAnimationFrame')}}Initial definition
+ +

瀏覽器相容性

+ +
+

{{Compat("api.Window.requestAnimationFrame")}}

+
+ +

其他參考

+ + diff --git a/files/zh-tw/web/api/window/sidebar/adding_search_engines_from_web_pages/index.html b/files/zh-tw/web/api/window/sidebar/adding_search_engines_from_web_pages/index.html deleted file mode 100644 index 780e92fb84..0000000000 --- a/files/zh-tw/web/api/window/sidebar/adding_search_engines_from_web_pages/index.html +++ /dev/null @@ -1,36 +0,0 @@ ---- -title: 自網頁添加搜尋引擎 -slug: Web/API/Window/sidebar/Adding_search_engines_from_Web_pages -tags: - - 搜尋模組 -translation_of: Web/OpenSearch -translation_of_original: Web/API/Window/sidebar/Adding_search_engines_from_Web_pages ---- -

Firefox 可以用 JavaScript 安裝搜尋引擎模組，且支援 OpenSearch 及 Sherlock 兩種模組格式。 -

-
註： 自 Firefox 2 起，偏好的模組格式為 OpenSearch。
-

當 JavaScript 程式碼要安裝新的搜尋模組時，Firefox 會詢問使用者是否允許安裝。 -

-

安裝 OpenSearch 模組

-

要安裝 OpenSearch 模組，必須使用 window.external.AddSearchProvider() DOM 方法。此方法的語法為： -

-
window.external.AddSearchProvider(搜尋模組 URL);
-
-

其中 搜尋模組 URL 為搜尋引擎模組之 XML 檔的絕對連結 URL。 -

-
注意： OpenSearch 自 Firefox 2 起的版本才支援。
-

安裝 Sherlock 模組

-

要安裝 Sherlock 模組，必須叫用 window.sidebar.addSearchEngine() 方法，語法為： -

-
window.sidebar.addSearchEngine(搜尋模組 URL, 圖示 URL, 建議名稱, 建議分類);
-
- -

Sherlock 的相關資訊可參考 http://developer.apple.com/macosx/sherlock/ -

-
-
-{{ languages( { "ca": "ca/Addici\u00f3_de_motors_de_cerca_a_les_p\u00e0gines_web", "en": "en/Adding_search_engines_from_web_pages", "es": "es/A\u00f1adir_motores_de_b\u00fasqueda_desde_p\u00e1ginas_web", "fr": "fr/Ajout_de_moteurs_de_recherche_depuis_des_pages_Web", "it": "it/Installare_plugin_di_ricerca_dalle_pagine_web", "ja": "ja/Adding_search_engines_from_web_pages", "pl": "pl/Dodawanie_wyszukiwarek_z_poziomu_stron_WWW" } ) }} diff --git a/files/zh-tw/web/api/windowbase64/index.html b/files/zh-tw/web/api/windowbase64/index.html deleted file mode 100644 index 6cf618070e..0000000000 --- a/files/zh-tw/web/api/windowbase64/index.html +++ /dev/null @@ -1,114 +0,0 @@ ---- -title: WindowBase64 -slug: Web/API/WindowBase64 -translation_of: Web/API/WindowOrWorkerGlobalScope -translation_of_original: Web/API/WindowBase64 ---- -

{{APIRef("HTML DOM")}}

- -

The WindowBase64 helper contains utility methods to convert data to and from base64, a binary-to-text encoding scheme. For example it is used in data URIs.

- -

There is no object of this type, though the context object, either the {{domxref("Window")}} for regular browsing scope, or the {{domxref("WorkerGlobalScope")}}  for workers, implements it.

- -

屬性

- -

This helper neither defines nor inherits any properties.

- -

方法

- -

This helper does not inherit any methods.

- -
-
{{domxref("WindowBase64.atob()")}}
-
Decodes a string of data which has been encoded using base-64 encoding.
-
{{domxref("WindowBase64.btoa()")}}
-
Creates a base-64 encoded ASCII string from a string of binary data.
-
- -

規範

- - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('HTML WHATWG', '#windowbase64', 'WindowBase64')}}{{Spec2('HTML WHATWG')}}No change since the latest snapshot, {{SpecName("HTML5.1")}}.
{{SpecName('HTML5.1', '#windowbase64', 'WindowBase64')}}{{Spec2('HTML5.1')}}Snapshot of {{SpecName("HTML WHATWG")}}. No change.
{{SpecName("HTML5 W3C", "#windowbase64", "WindowBase64")}}{{Spec2('HTML5 W3C')}}Snapshot of {{SpecName("HTML WHATWG")}}. Creation of WindowBase64 (properties where on the target before it).
- -

瀏覽器相容性

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Basic support{{CompatGeckoDesktop(1)}} [1]{{CompatVersionUnknown}}10.0{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureFirefox Mobile (Gecko)AndroidIE MobileOpera MobileSafari Mobile
Basic support{{CompatGeckoMobile(1)}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -

[1]  atob() is also available to XPCOM components implemented in JavaScript, even though {{domxref("Window")}} is not the global object in components.

- -

參見

- - diff --git a/files/zh-tw/web/api/windoweventhandlers/onpopstate/index.html b/files/zh-tw/web/api/windoweventhandlers/onpopstate/index.html new file mode 100644 index 0000000000..d98464d356 --- /dev/null +++ b/files/zh-tw/web/api/windoweventhandlers/onpopstate/index.html @@ -0,0 +1,57 @@ +--- +title: window.onpopstate +slug: Web/API/Window.onpopstate +translation_of: Web/API/WindowEventHandlers/onpopstate +--- +
{{ApiRef}} {{gecko_minversion_header("2")}}
+ +

摘要

+ +

視窗上 popstate 事件的事件處理器。

+ +

在同一文件的當前歷史紀錄變動時，如果其變動介於兩個歷史紀錄間，popstate 就會被呼叫。如果當前的歷史紀錄是藉由呼叫 history.pushState() 建立，或曾被 history.replaceState() 修改過，popstate 事件的 state 屬性，將包含一份歷史紀錄的 state 物件。

+ +

請注意：直接呼叫 history.pushState() 或 history.replaceState() 不會驅動 popstate 事件。popstate 事件只會被瀏覽器的行為驅動，例如點擊上一頁按鈕（或透過 JavaScript 呼叫 history.back()）。且此事件只會在用戶於同文件的兩個歷史紀錄間瀏覽時作動。

+ +

在頁面載入時，不同瀏覽器具有不同的 popstate 行為。Chrome 與 Safari 會在頁面載入時觸發 popstate 事件，但 Firefox 則不會。

+ +

語法

+ +
window.onpopstate = funcRef;
+
+ + + +

popstate 事件

+ +

以下範例，位於 http://example.com/example.html 並執行下列程式的頁面，將會產生如標示的對話框：

+ +
window.onpopstate = function(event) {
+  alert("location: " + document.location + ", state: " + JSON.stringify(event.state));
+};
+
+history.pushState({page: 1}, "title 1", "?page=1");
+history.pushState({page: 2}, "title 2", "?page=2");
+history.replaceState({page: 3}, "title 3", "?page=3");
+history.back(); // 跳出 "location: http://example.com/example.html?page=1, state: {"page":1}"
+history.back(); // 跳出 "location: http://example.com/example.html, state: null
+history.go(2);  // 跳出 "location: http://example.com/example.html?page=3, state: {"page":3}
+
+ +

請注意，雖然原始的歷史紀錄（http://example.com/example.html）沒有關聯的 state 物件，在我們第二次呼叫 hitsory.back() 時仍然會觸發 popstate 事件。

+ +

標準

+ + + +

請參照

+ + diff --git a/files/zh-tw/web/api/windowtimers/index.html b/files/zh-tw/web/api/windowtimers/index.html deleted file mode 100644 index c38c15b821..0000000000 --- a/files/zh-tw/web/api/windowtimers/index.html +++ /dev/null @@ -1,115 +0,0 @@ ---- -title: WindowTimers -slug: Web/API/WindowTimers -translation_of: Web/API/WindowOrWorkerGlobalScope -translation_of_original: Web/API/WindowTimers ---- -
{{APIRef("HTML DOM")}}
- -

WindowTimers is a mixin used to provide utility methods which set and clear timers. No objects of this type exist; instead, its methods are available on {{domxref("Window")}} for the standard browsing scope, or on {{domxref("WorkerGlobalScope")}} for workers.

- -

屬性

- -

WindowTimers 介面沒有繼承也沒有定義任何屬性。

- -

方法

- -

除以下自身方法外，WindowTimers 介面提沒有任何繼承方法。

- -
-
{{domxref("WindowTimers.clearInterval()")}}
-
Cancels the repeated execution set using {{domxref("WindowTimers.setInterval()")}}.
-
{{domxref("WindowTimers.clearTimeout()")}}
-
Cancels the delayed execution set using {{domxref("WindowTimers.setTimeout()")}}.
-
{{domxref("WindowTimers.setInterval()")}}
-
Schedules a function to execute every time a given number of milliseconds elapses.
-
{{domxref("WindowTimers.setTimeout()")}}
-
Schedules a function to execute in a given amount of time.
-
- -

規範

- - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('HTML WHATWG', '#windowtimers', 'WindowTimers')}}{{Spec2('HTML WHATWG')}}No change since the latest snapshot, {{SpecName("HTML5.1")}}.
{{SpecName('HTML5.1', '#windowtimers', 'WindowTimers')}}{{Spec2('HTML5.1')}}Snapshot of {{SpecName("HTML WHATWG")}}. No change.
{{SpecName("HTML5 W3C", "#windowtimers", "WindowTimers")}}{{Spec2('HTML5 W3C')}}Snapshot of {{SpecName("HTML WHATWG")}}. Creation of WindowBase64 (properties where on the target before it).
- -

瀏覽器相容性

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Basic support{{CompatGeckoDesktop(1)}}1.04.04.01.0
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureFirefox Mobile (Gecko)AndroidIE MobileOpera MobileSafari Mobile
Basic support{{CompatGeckoMobile(1)}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -

 

- -

參見

- - diff --git a/files/zh-tw/web/css/@viewport/height/index.html b/files/zh-tw/web/css/@viewport/height/index.html deleted file mode 100644 index 78d80ee35b..0000000000 --- a/files/zh-tw/web/css/@viewport/height/index.html +++ /dev/null @@ -1,121 +0,0 @@ ---- -title: height -slug: Web/CSS/@viewport/height -translation_of: Web/CSS/@viewport -translation_of_original: Web/CSS/@viewport/height ---- -
{{CSSRef}}
- -

概要

- -

高度 的 CSS 描述符是用於設定兩者的簡易描述符 {{cssxref("@viewport/min-height", "min-height")}} 與 {{cssxref("@viewport/max-height", "max-height")}} 的可視區域(viewport)。提供一個可視區域的長度值，將設定兩者的最小高度與最大高度的值。

- -

如果提供了兩個可視區域(viewport)，第一個值將設定為最小高度，而第二個值將設定為最大高度。

- -

語法

- -
/* One value */
-height: auto;
-height: 320px;
-height: 15em;
-
-/* Two values */
-height: 320px 200px;
-
- -

值

- -
-
auto
-
使用 CSS 描述符來進行值的計算。
-
<length>
-
非負絕對值或相對長度。
-
<percentage>
-
初始可視區域的相對寬度或相對高度百分比的縮放係數為 1.0，且必須是非負數。
-
- -

正式語法

- -
{{csssyntax}}
-
- -

舉例

- -
@viewport {
-  height: 500px;
-}
- -

格式

- - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('CSS3 Device', '#descdef-viewport-height', '"height" descriptor')}}{{Spec2('CSS3 Device')}}Initial definition
- -

瀏覽器兼容性

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support29 (behind a flag){{CompatNo}}10 {{property_prefix("-ms")}}11.10
- Removed in 15
- Reintroduced behind a flag in 16		{{CompatNo}}
-
- -
- - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support4.429{{CompatNo}}10{{property_prefix("-ms")}}11.10
- Removed in 15
- Reintroduced behind a flag in 16		{{CompatNo}}
-
diff --git a/files/zh-tw/web/css/border-image/border-image/index.html b/files/zh-tw/web/css/border-image/border-image/index.html deleted file mode 100644 index 210a2663eb..0000000000 --- a/files/zh-tw/web/css/border-image/border-image/index.html +++ /dev/null @@ -1,111 +0,0 @@ ---- -title: border-image -slug: Web/CSS/border-image/border-image -tags: - - CSS ---- -

摘要

- -

CSS 屬性 border-image 可以讓你在元素的邊框上擺上圖片。這讓呈現看似很複雜的一個網頁的小單元簡單很多，它可以省最多九個元素。

- -
緊告：官方的 CSS3 規範描述的 border-image 屬性在這個功能被凍結並出現在 Gecko 1.9.1 的釋出版之後改變很多。因此，這項功能的語法跟呈現方法很可能在未來 Gecko 的釋出版改變。特別是選擇性的 border-width 參數，它覆蓋既有 border-width 取值的這項特性已經從規範移除了，因此勢必也會在未來的 Gecko 被拿掉。
- -

瀏覽器會顯示 border-image 指定的圖片而不是 {{ cssxref("border-style") }} 給的邊框樣式，但是若它的取值是 none 或是因某些理由無法顯示該圖片，瀏覽器就會顯示邊框樣式。border-image 會畫一個額外的背景圖片在原來 {{ cssxref("background-image") }} 指 定的背景圖片之上。

- - - -

語法

- -
none |
-  [ <圖片> [ <數字> | <百分比> ]{1,4} [/ <邊框寬度>{1,4}]? ] && [ stretch | repeat | round ]{0,2}
- -

取值

- -
-
none
-
不顯示圖片，使用邊框樣式。
-
<圖片> （必填）
-
圖片值是一個 {{cssxref("<uri>")}}，例： url(http://example.org/image.png) 。
-
<數> | <百分比> （必填）
-
一個、兩個、三個、四個分別代表從頂邊、右邊、底邊、左邊從圖片外圍到切圖線的距離，將圖片切為九塊：四個角、四個邊跟一個中間部份。
-
- 一個值的話，該值用於圖片的全部四個邊。
- 兩個值得話，值用於：一、頂邊與底邊 二、右邊與左邊。
- 三個值的話，值用於：一、頂邊 二、右邊與左邊 三、底邊。
- 四個值的情況，四個值分邊用在圖片的頂邊、右邊、底邊、左邊。
-
- 在 Gecko 1.9.1 (Firefox 3.5) 圖片的中間那個部份會被當做元素的背景。這在未來的版本可能會改變。
-
- 百分比 由圖片的長度/寬度計算。
- 數 但表圖片的像素（若為點陣圖）或向量座標（若為 SVG）。
-
<邊框寬度> （選擇性）
-
如果斜線 / 出現在屬性值的話，一個、兩個、三個或是四個在它之後的取值會被當成是 {{ cssxref("border-width") }} 的取值使用。取值的順序如同 {{ cssxref("border-width") }} 。
-
stretch | round | repeat （選擇性）
-
一個或兩個關鍵字，指定邊上的圖片跟中間部份要如何縮放及鋪擺。
- stretch （預設值）縮放該圖片，使其與配置大小相等。
- round 鋪擺該圖片，但也縮放它使得被配置範圍鋪滿整數張該圖片。
- repeat   直接鋪擺該圖片。
- 第一個關鍵字的對象是頂邊，中間跟底邊的圖片，而第二個關鍵字的對象是左邊跟右邊的邊框。如果第二個不存在，則沿用第一個關鍵字的設定。如果兩者皆不存在，預設值為 stretch。
-
- -

範例

- -

[這裡還需要一些活範例]

- -
#header  { -moz-border-image: url(border.png) 27 27 27 27 round round; }
-
-.button  { -moz-border-image: url(button.png) 0 5 0 5; }
-
-.example { -moz-border-image: url(example.jpg) 3 4 6 8 / 10px 12px 14px 22px; }
-
- -
/* 鮮見例，在 Firefox 3.5 下看起來像是完全伸展的 background-image */
-
- div     { -moz-border-image: url(bgimage.png) 0; }
-
- -

瀏覽器兼容性

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
瀏覽器最小版本支援
Internet Explorer------
Firefox (Gecko)3.5 (1.9.1)-moz-border-image
Opera10.5border-image
Safari (WebKit)3.0 (522)-webkit-border-image
- -

規範

- - - -

{{ languages( { "en": "en/CSS/-moz-border-image"} ) }}

diff --git a/files/zh-tw/web/css/common_css_questions/index.html b/files/zh-tw/web/css/common_css_questions/index.html deleted file mode 100644 index b824c671c4..0000000000 --- a/files/zh-tw/web/css/common_css_questions/index.html +++ /dev/null @@ -1,165 +0,0 @@ ---- -title: CSS 一般問題 -slug: Web/CSS/Common_CSS_Questions -tags: - - CSS - - 待審閱技術 - - 待審閱文字 - - 所有類別 -translation_of: Learn/CSS/Howto/CSS_FAQ ---- -

-

-

我的 CSS 合乎規格，但繪出的版面有誤

-

如果想讓大部分的瀏覽器都能正確繪製標準 HTML/CSS 頁面，便須於 HTML 檔案中放上完整的正確 DOCTYPE。 -

新近瀏覽器都有兩種佈局模式： -

- -

以 Gecko 為核心的瀏覽器都有第三種近乎標準模式，其中只有一些些不合規範的地方。 -

如果你宣告的 DTD 不合標準或過期了，那麼瀏覽器就會進入 Quirks 模式。 -

以下是常用的 DTD 列表，可以讓瀏覽器進入標準或近乎標準模式。 -

-
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
-"http://www.w3.org/TR/html4/loose.dtd">
-
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
-"http://www.w3.org/TR/html4/strict.dtd">
-
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
-"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-
-

id 與 class 之間的差別

-

HTML 元素都可有 id 及 class 屬性。id 屬性是讓你為元素命名的，整個頁面中的元素名稱也不應有重複；class 屬性則可將元素歸為某特定類別，通常也會有很多元素屬於同一種類別 (意即 class 屬性值相同。) CSS 可以讓你以 id 或 class 來決定某元素的樣式。 -

如果你想指定某特定單一元素的樣式，則應使用 id。 -

-
-

若有很多個元素皆有相同樣式，則可使用 class。 -

這方面的資訊亦可參考 CSS 選取符。 -

-
-

恢復某特性的預設值

-

CSS2 並不提供任何指定某特性預設值的方法，所以要恢復某特性預設值的唯一方法就是重新指定此值。此外你自己得知道預設值是什麼，因為 CSS 也沒有所謂 default 的關鍵字。 -

所以，以選取符撰寫樣式時須特別注意 (例如以標籤名稱 p 作為選取符)，或許可以用更明確的選取符 (例如 ID 或 class)。以標籤名稱作選取符茲事體大，一旦使用便將影響整個網頁，而且沒有自動恢復預設值的方法。 -

此外，由於 CSS 具串聯特性，指定選取符時通常越明確越好，以免把不相干的元素都牽扯進來。 -

-

相依樣式

-

CSS 並不支援「以另一個樣式規則為基準」的樣式設定法。 (參考 Eric Meyer 所寫、關於 CSS 工作小組的說明。) 不過，你可以為某單一元素套上多重樣式，製作出類似效果。 -

-

套用多重類別

-

你可以在 HTML 元素的 class 屬性裡以空白字元分隔填上多個樣式類別名稱，便能同時套用多重類別。 -

-
<style type="text/css">
-.firstclass { background: black; color: white; }
-.secondclass { font-weight: bold; }
-</style>
-
-<div class="firstclass secondclass">
-... content ...
-... content ...
-... content ...
-</div>
-
-

若是這些規則中設定了同一種特性值，則會依序以明確性（specificity）、定義位置先後決定顯示方式，與class 屬性中的次序無關。 -

-

無用樣式

-

即使樣式規則已經正確設定完畢，還是可能為瀏覽器所忽略，此時通常是經過語法及優先權法則判斷後的正常現象。 -

以下是導致樣式被略過的常見情形： -

- -

你可以使用 DOM 觀察器 的 CSS Style Rules 來檢查上述問題。 -

HTML 元素層次問題 -

此時 CSS 樣式套用與否與元素的層次大有相關，請留意：套用到子元素的樣式必定會蓋過母元素的樣式，跟明確性或 CSS 規則的優先權無關。 -

-
#section { font-weight: bold; }
-.redtext { font-weight: normal; color: red; }
-
-<div id="section">
-   粗體、
-   <span class="redtext">正常紅字、</span>
-   又見粗體
-</div>
-
-

如果你的 HTML 層級錯綜複雜，發生規則意外被忽略的情形時，請檢查元素層級問題。可能有某個子元素套上了不該用的樣式。 -

樣式規則重新定義 -

在 CSS 樣式表中，先後次序非常重要。如果你定義了某規則後又重新定義一次，則晚定義的才算數。 -

-
#section { font-weight: bold; }
-.redtext { color: red; }
-/* 其他規則 */
-/* 其他規則 */
-/* 其他規則 */
-.redtext { color: green; }
-
-<div id="section">
-粗體、
-<span class="redtext">正常紅字？</span>
-又見粗體
-</div>
-
-

為避免此類錯誤發生，每個特定選取符請僅定義一次樣式，集中特性一次定義也便於管理些。 -


-特性的簡寫法 -

使用簡寫法來定義樣式簡明扼要，是個不錯的方法。你也可以用簡寫法設定某組特性中的部分特性值，但須留意其他沒寫到的部分會自動採用預設值。這表示之前的規則中為某單一特性定義的值可能失效。 -

-
#section { font-size: 12px; font-family: Verdana; font-weight: bold; }
-.redtext { font: 14px Arial; color: red; }
-
-<div id="section">
-   採用 Verdana 粗體的 12px 字樣；
-   <span class="redtext">採用 Arial 正常字體的 14px 紅字；</span>
-   還是採用 Verdana 粗體的 12px 字樣。
-</div>
-
-

前一個例子中，套用到不同元素範圍的同族特性是問題所在，但就算特性都寫在同一條規則裡也可能出問題，因為順序真的很重要。 -

-
#section {
-   font-weight: bold;
-   font: 12px Verdana;  /* 有了這行，font-weight 又回到預設的 normal 了 */
-}
-
-


-使用 * 選取符 -

* 選取符表示任何元素皆符合，但使用上應多加小心。 -

-
body * { font-weight: normal; }
-#section { font: 12px Verdana; }
-.boldtext { font-weight: bold; }
-.redtext { color: red; }
-
-<div id="section">
-   正常、
-   <span class="boldtext">
-      <span class="redtext">正常紅字、</span>
-   </span>
-   又見正常。
-</div>
-
-

在此例中，選取符為 body * 的規則會套用到所有 body 內的元素，也包括 redtext，所以原先套用到 boldtext 的 font-weight: bold; 就被覆蓋為 font-weight: normal; 了。 -


-CSS 明確性 -

如果某元素會套用好幾條規則，則相衝突的特性就要靠規則的明確性來分高下。行內樣式（放在 HTML 各標籤的 style 屬性中）優先權最高，其次是以 id 做選取符的規則，再其次是以 class 套用的類別，最後則是單純以元素名稱當選取符的規則。 -

-
div { color: black; }
-#orange { color: orange; }
-.green { color: green; }
-
-<div id="orange" class="green" style="color: red;">是紅的！</div>
-
-

如果樣式規則的選取符分成好幾段，計算方式就更為複雜一些。需要瞭解完整資訊者，請參考 CSS 2.1 規格書的 6.4.3 一節。 -

-

-moz-* 特性是什麼玩意？

-

請見 Mozilla 擴充的 CSS。由於這些擴充規格不是 W3C 標準的一部分，因此並不建議使用。 -

-
-
-{{ languages( { "en": "en/Common_CSS_Questions", "pl": "pl/Cz\u0119ste_pytania_o_CSS" } ) }} diff --git a/files/zh-tw/web/css/css_background_and_borders/index.html b/files/zh-tw/web/css/css_background_and_borders/index.html deleted file mode 100644 index c9232cbf7a..0000000000 --- a/files/zh-tw/web/css/css_background_and_borders/index.html +++ /dev/null @@ -1,153 +0,0 @@ ---- -title: CSS Background and Borders -slug: Web/CSS/CSS_Background_and_Borders -tags: - - CSS - - CSS Background and Borders - - CSS Reference - - Overview -translation_of: Web/CSS/CSS_Backgrounds_and_Borders -translation_of_original: Web/CSS/CSS_Background_and_Borders ---- -

{{CSSRef}}

- -

CSS Background and Borders is a module of CSS that defines how background and borders of elements are described. Borders can be lines or images, boxes can have one or multiple backgrounds, have rounded corners, and shadows.

- -

Reference

- -

CSS Properties

- -
- -
- -

Guides

- -
-
Using CSS multiple backgrounds
-
Explains how to set backgrounds on elements and how they will interact with it.
-
Scaling background images
-
Describes how to change the appearance of the background images, by stretching them or repeating them, to cover the whole background of the element, or not.
-
- -

Specifications

- - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{ SpecName('CSS3 Backgrounds') }}{{ Spec2('CSS3 Backgrounds') }} 
{{SpecName('CSS2.1', 'box.html')}}{{Spec2('CSS2.1')}} 
{{SpecName('CSS1', '#border')}}{{Spec2('CSS1')}} 
- -

Browser compatibility

- -

{{CompatibilityTable()}}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support1.0{{CompatGeckoDesktop("1.0")}}4.03.51.0 (85)
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown()}}{{CompatGeckoMobile("1.9.2")}}{{CompatVersionUnknown()}}{{CompatVersionUnknown()}}1.0
-
diff --git a/files/zh-tw/web/css/css_background_and_borders/using_css_multiple_backgrounds/index.html b/files/zh-tw/web/css/css_background_and_borders/using_css_multiple_backgrounds/index.html deleted file mode 100644 index 66451b2ae2..0000000000 --- a/files/zh-tw/web/css/css_background_and_borders/using_css_multiple_backgrounds/index.html +++ /dev/null @@ -1,85 +0,0 @@ ---- -title: 使用 CSS 多重背景 -slug: Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds -tags: - - CSS - - CSS Background - - Example - - Guide - - Intermediate -translation_of: Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds -translation_of_original: Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds ---- -

{{CSSRef}}

- -

藉由 CSS3 我們可以對元素使用 多重背景。每個設定的背景被一個個分層，第一個背景在最上面，最後一個背景是在最下面一層。 記得只有最後一個背景可以設定 background color。

- -

簡易的表達方式:

- -
.myclass {
-  background:
-      background 1, //第一層
-      background 2,
-      ...,
-      background N;  //最後一層
-}
-
- -

可以使用縮寫的方式 {{ cssxref("background") }} 和個別標記的方式設定多重背景，但是部分屬性無法設置多重背景，例如 {{ cssxref("background-color") }}。下面是能設置為多重背景的背景屬性： 

- - - -

範例

- -

下面的範例中，重疊三個背景：Firefox logo、線性漸層、一張泡泡的圖片

- -
.multi_bg_example {
-  background-image   : url(https://mdn.mozillademos.org/files/11305/firefox.png),
-                       url(https://mdn.mozillademos.org/files/11307/bubbles.png),
-                       linear-gradient(to right, rgba(30, 75, 115, 1),  rgba(255, 255, 255, 0));
-
-  background-repeat  : no-repeat,
-                       no-repeat,
-                       no-repeat;
-
-  background-position: bottom right,
-                       left,
-                       right;
-}
-
- - - -

結果

- -

{{EmbedLiveSample('範例','100%','400')}}

- -

如你所見，Firefox logo（列表第一個選項）在最上面，接著是漸層。每個隨後的子屬性（{{ cssxref("background-repeat") }} 和 {{ cssxref("background-position") }}）應用相對的背景上。所以第一個 {{ cssxref("background-repeat") }} 的值應用在第一個（最前面）背景。

- -

參見

- - diff --git a/files/zh-tw/web/css/css_backgrounds_and_borders/index.html b/files/zh-tw/web/css/css_backgrounds_and_borders/index.html new file mode 100644 index 0000000000..c9232cbf7a --- /dev/null +++ b/files/zh-tw/web/css/css_backgrounds_and_borders/index.html @@ -0,0 +1,153 @@ +--- +title: CSS Background and Borders +slug: Web/CSS/CSS_Background_and_Borders +tags: + - CSS + - CSS Background and Borders + - CSS Reference + - Overview +translation_of: Web/CSS/CSS_Backgrounds_and_Borders +translation_of_original: Web/CSS/CSS_Background_and_Borders +--- +

{{CSSRef}}

+ +

CSS Background and Borders is a module of CSS that defines how background and borders of elements are described. Borders can be lines or images, boxes can have one or multiple backgrounds, have rounded corners, and shadows.

+ +

Reference

+ +

CSS Properties

+ +
+ +
+ +

Guides

+ +
+
Using CSS multiple backgrounds
+
Explains how to set backgrounds on elements and how they will interact with it.
+
Scaling background images
+
Describes how to change the appearance of the background images, by stretching them or repeating them, to cover the whole background of the element, or not.
+
+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{ SpecName('CSS3 Backgrounds') }}{{ Spec2('CSS3 Backgrounds') }} 
{{SpecName('CSS2.1', 'box.html')}}{{Spec2('CSS2.1')}} 
{{SpecName('CSS1', '#border')}}{{Spec2('CSS1')}} 
+ +

Browser compatibility

+ +

{{CompatibilityTable()}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support1.0{{CompatGeckoDesktop("1.0")}}4.03.51.0 (85)
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown()}}{{CompatGeckoMobile("1.9.2")}}{{CompatVersionUnknown()}}{{CompatVersionUnknown()}}1.0
+
diff --git a/files/zh-tw/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html b/files/zh-tw/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html new file mode 100644 index 0000000000..66451b2ae2 --- /dev/null +++ b/files/zh-tw/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html @@ -0,0 +1,85 @@ +--- +title: 使用 CSS 多重背景 +slug: Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds +tags: + - CSS + - CSS Background + - Example + - Guide + - Intermediate +translation_of: Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds +translation_of_original: Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds +--- +

{{CSSRef}}

+ +

藉由 CSS3 我們可以對元素使用 多重背景。每個設定的背景被一個個分層，第一個背景在最上面，最後一個背景是在最下面一層。 記得只有最後一個背景可以設定 background color。

+ +

簡易的表達方式:

+ +
.myclass {
+  background:
+      background 1, //第一層
+      background 2,
+      ...,
+      background N;  //最後一層
+}
+
+ +

可以使用縮寫的方式 {{ cssxref("background") }} 和個別標記的方式設定多重背景，但是部分屬性無法設置多重背景，例如 {{ cssxref("background-color") }}。下面是能設置為多重背景的背景屬性： 

+ + + +

範例

+ +

下面的範例中，重疊三個背景：Firefox logo、線性漸層、一張泡泡的圖片

+ +
.multi_bg_example {
+  background-image   : url(https://mdn.mozillademos.org/files/11305/firefox.png),
+                       url(https://mdn.mozillademos.org/files/11307/bubbles.png),
+                       linear-gradient(to right, rgba(30, 75, 115, 1),  rgba(255, 255, 255, 0));
+
+  background-repeat  : no-repeat,
+                       no-repeat,
+                       no-repeat;
+
+  background-position: bottom right,
+                       left,
+                       right;
+}
+
+ + + +

結果

+ +

{{EmbedLiveSample('範例','100%','400')}}

+ +

如你所見，Firefox logo（列表第一個選項）在最上面，接著是漸層。每個隨後的子屬性（{{ cssxref("background-repeat") }} 和 {{ cssxref("background-position") }}）應用相對的背景上。所以第一個 {{ cssxref("background-repeat") }} 的值應用在第一個（最前面）背景。

+ +

參見

+ + diff --git a/files/zh-tw/web/css/css_color/index.html b/files/zh-tw/web/css/css_color/index.html new file mode 100644 index 0000000000..25cc1b29d8 --- /dev/null +++ b/files/zh-tw/web/css/css_color/index.html @@ -0,0 +1,120 @@ +--- +title: CSS Colors +slug: Web/CSS/CSS_Colors +tags: + - CSS + - CSS Colors + - NeedsTranslation + - Overview + - Reference + - TopicStub +translation_of: Web/CSS/CSS_Color +translation_of_original: Web/CSS/CSS_Colors +--- +

{{CSSRef}}

+ +

CSS Colors is a module of CSS that deals with colors, color types and transparency.

+ +

Reference

+ +

Properties

+ +
+ +
+ +

CSS Data Types

+ +

{{cssxref("<color>")}}

+ +

Guides

+ +

None.

+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('CSS3 Colors')}}{{Spec2('CSS3 Colors')}} 
{{SpecName('CSS2.1', 'colors.html')}}{{Spec2('CSS2.1')}} 
{{SpecName('CSS1')}}{{Spec2('CSS1')}} 
+ +

Browser compatibility

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support1.0{{CompatGeckoDesktop("1")}}3.03.51.0
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support1.0{{CompatGeckoMobile("1")}}6.06.01.0
+
+ +

See also

+ + diff --git a/files/zh-tw/web/css/css_colors/index.html b/files/zh-tw/web/css/css_colors/index.html deleted file mode 100644 index 25cc1b29d8..0000000000 --- a/files/zh-tw/web/css/css_colors/index.html +++ /dev/null @@ -1,120 +0,0 @@ ---- -title: CSS Colors -slug: Web/CSS/CSS_Colors -tags: - - CSS - - CSS Colors - - NeedsTranslation - - Overview - - Reference - - TopicStub -translation_of: Web/CSS/CSS_Color -translation_of_original: Web/CSS/CSS_Colors ---- -

{{CSSRef}}

- -

CSS Colors is a module of CSS that deals with colors, color types and transparency.

- -

Reference

- -

Properties

- -
- -
- -

CSS Data Types

- -

{{cssxref("<color>")}}

- -

Guides

- -

None.

- -

Specifications

- - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('CSS3 Colors')}}{{Spec2('CSS3 Colors')}} 
{{SpecName('CSS2.1', 'colors.html')}}{{Spec2('CSS2.1')}} 
{{SpecName('CSS1')}}{{Spec2('CSS1')}} 
- -

Browser compatibility

- -
{{CompatibilityTable}}
- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support1.0{{CompatGeckoDesktop("1")}}3.03.51.0
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support1.0{{CompatGeckoMobile("1")}}6.06.01.0
-
- -

See also

- - diff --git a/files/zh-tw/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html b/files/zh-tw/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html new file mode 100644 index 0000000000..af098dde55 --- /dev/null +++ b/files/zh-tw/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html @@ -0,0 +1,383 @@ +--- +title: CSS彈性盒子用法 +slug: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes +tags: + - '#RWD' + - CSS + - Web + - 例子 + - 先进的 + - 入门 + - 灵活 + - 盒 +translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox +translation_of_original: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes +--- +
{{CSSRef}}
+ +

CSS3 彈性盒子，又稱flexbox，是為了適應不同螢幕尺寸和顯示設備而生的佈局模式。針對許多應用而言，不用 floats 的彈性盒子模型會比塊狀模型（block model）易用，彈性容器的邊緣也不會與內容的邊緣重疊。

+ +

多數設計師會發現 flexbox 用起來比 box 簡單得多。像是不多注意 div 的話，它就會經常違反設計師意願地，跑到頁頂去──令 footer 附著在頁底，也因此變得很棘手。flexbox 的寬高能改變以適應顯示空間，將較低的元件固定住。Flexbox 邏輯也能讓你確實令 div 壓在頁面的右方或底部。Flexbox 元素的顯示順序，與原始碼的顯示順序相互獨立。

+ +

一些時髦的佈局，也能因而透過更簡潔的程式碼完成。這種有意的獨立性只影響視覺渲染，基於 HTML 原始碼的語意順序及瀏覽不會受到影響。

+ +
注：儘管 CSS 彈性盒子佈局規範還處於最終徵求意見稿（Last Call Working Draft）階段（參見最新編輯草案）、也不是所有瀏覽器都實做彈性盒子的所有功能。但這麼說好了，現在主流的瀏覽器，都對 flexbox 有著良好的支持。請參見相容性表格的具體屬性，以獲取最新的相容狀態。
+ +

彈性盒子的概念

+ +

Flex 排版的大致定義，是能更改該項目的長與（或）高，以便貼合任何顯示設備的空間。Flex container 能針對該元件擴張以便填補可用的空間、或收縮以便阻止空間溢出。

+ +

塊狀佈局（Block layout）以垂直方向為準、行內佈局（Inline layout）以水平方向為準、而彈性佈局（Flexbox layout）則同時允許這兩種。塊狀佈局雖適於頁面顯示，但在程式元件（application component）需要在用戶代理（user agent）變更、手機從垂直方向翻轉到水平方向……等變更定位、大小、拉伸、收縮的情形下，這種佈局就很難用了。彈性盒子佈局長於小規模佈局、而剛剛流行的格線佈局（Grid layout）則長於大規模佈局。二者皆為 CSS 工作小組為在不同用戶代理、書寫模式、和其他要求下的 Web 應用程式，提供良好互通性的一部分。

+ +

彈性盒子的字彙

+ +

在彈性盒子的世界，我們不會稱水平（inline）或垂直（block），而是主軸（main axis）與切軸（cross axis）。如果 flex-direction 是 column，主軸就會充當垂直、而切軸則充當水平。請參考下面的圖，它展示了一個 flex-direction 是 row 的彈性容器，意味著該彈性項目會基於主軸，作水平排列。

+ +

flex_terms.png

+ +
+
彈性容器（Flex container）
+
包住彈性項目（Flex item）的父元素。在 {{Cssxref("display")}} 屬性用上 flex 或 inline-flex 值的，就是彈性容器。
+
彈性項目（Flex item）
+
+

所有彈性容器的子元素都會變成彈性項目。直接包含在彈性容器的文字，會被包裝成匿名的 Flex 項目。

+
+
軸（Axes）
+
+

所有彈性盒子布局都有兩個軸。主軸（main axis）是跟隨著彈性項目順序的軸、而切軸(cross axis)是垂直於主軸的軸。

+ +
    +
  • flex-direction 屬性啟用主軸。
    • +
  • justify-content 屬性定義目前彈性項目的主軸如何擺放。
    • +
  • align-items 屬性定義目前彈性項目的切軸如何擺放。
    • +
  • align-self 屬性定義目前單一彈性項目如何對齊。這個設定會覆蓋 align-items 的預設值。
    • +
+
+
方向（Directions）
+
+

彈性容器的 main start/main end 與 cross start/cross end sides 描述了彈性項目流的起點與終點。它們跟隨著由 writing-mode 所建立的向量中，彈性容器的主軸與切軸排列（左至右或右至左……等等）。

+ +
    +
  • order assigns elements to ordinal groups and determines which elements appear first.
    • +
  • flex-flow 屬性是 flex-direction 與 flex-wrap 屬性的簡寫，描述了彈性項目的整體布局。
    • +
+
+
Lines
+
+

Flex items can be laid out on either a single line or on several lines according to the flex-wrap property, which controls the direction of the cross axis and the direction in which new lines are stacked.

+
+
Dimensions
+
+

The flex items' agnostic equivalents of height and width are main size and cross size, which respectively follow the main axis and cross axis of the flex container.

+ + +
+
+ +

設計一個彈性盒子

+ +

要設計基於這種風格的 CSS 元素，請把 display 屬性設為：

+ +
display: flex;
+ +

或：

+ +
display: inline-flex;
+ +

這樣一來，元素就會變成彈性容器，而它的子元素們就會變成彈性項目。flex 值會讓彈性容器變成塊級元素（block-level element）、inline-flex 則會讓彈性容器成為單一的行內元素（atomic inline-level element）。

+ +
注意：如果需要支援較舊的瀏覽器，請把廠商前輟標記（vendor prefix tag）寫在 display 屬性（property），而不是屬性值（attribute）。例如：display: -webkit-flex。
+ +

彈性項目需要留心……

+ +

Text that is directly contained inside a flex container is automatically wrapped in an anonymous flex item. However, an anonymous flex item that contains only white space is not rendered, as if it were designated display: none.

+ +

Absolutely positioned children of a flex container are positioned so that their static position is determined in reference to the main start content-box corner of their flex container.

+ +

The margins of adjacent flex items do not collapse. Using auto margins absorbs extra space in the vertical or horizontal direction and can be used for alignment or to separate adjacent flex items. See Aligning with 'auto' margins in the W3C CSS Flexible Box Layout Module specification for more details.

+ +

Flexbox's alignment properties do "true" centering, unlike other centering methods in CSS. This means that the flex items will stay centered, even if they overflow the flex container. This can sometimes be problematic, however, if they overflow past the top edge of the page, or the left edge (in LTR languages like English; the problem occurs on the right edge in RTL languages like Arabic), as you can't scroll to that area, even if there is content there! In a future release, the alignment properties will be extended to have a "safe" option as well. For now, if this is a concern, you can instead use margins to achieve centering, as they'll respond in a "safe" way and stop centering if they overflow. Instead of using the align- properties, just put auto margins on the flex items you wish to center. Instead of the justify- properties, put auto margins on the outside edges of the first and last flex items in the flex container. The auto margins will "flex" and assume the leftover space, centering the flex items when there is leftover space, and switching to normal alignment when not. However, if you're trying to replace justify-content with margin-based centering in a multi-line flexbox, you're probably out of luck, as you need to put the margins on the first and last flex item on each line. Unless you can predict ahead of time which items will end up on which line, you can't reliably use margin-based centering in the main axis to replace the justify-content property.

+ +

Recall that while the display order of the elements is independent of their order in the source code, this independence affects only the visual rendering, leaving speech order and navigation based on the source order. Even the {{cssxref("order")}} property does not affect speech or navigation sequence. Thus developers must take care to order elements properly in the source so as not to damage the document's accessibility.

+ +

彈性盒子的屬性

+ +

不對彈性盒子生效的屬性

+ +

由於彈性盒子使用不同的排版演算法，所以有些屬性不太適合用在彈性容器內：

+ + + +

示例

+ +

基本彈性排版示例

+ +

這個基本彈性將展示如何把「彈性化」引至某個元素、並在彈性狀態下相鄰該元素的表現。

+ +
​<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <style>
+    .flex {
+        /* basic styling */
+        width: 350px;
+        height: 200px;
+        border: 1px solid #555;
+        font: 14px Arial;
+
+        /* flexbox setup */
+        display: flex;
+        flex-direction: row;
+    }
+
+    .flex > div {
+        flex: 1 1 auto;
+        width: 30px; /* To make the transition work nicely. (Transitions to/from
+                        "width:auto" are buggy in Gecko and Webkit, at least.
+                        See http://bugzil.la/731886 for more info.) */
+        transition: width 0.7s ease-out;
+    }
+
+    /* colors */
+    .flex > div:nth-child(1){ background: #009246; }
+    .flex > div:nth-child(2){ background: #F1F2F1; }
+    .flex > div:nth-child(3){ background: #CE2B37; }
+
+    .flex > div:hover {
+        width: 200px;
+    }
+
+    </style>
+  </head>
+  <body>
+    <p>Flexbox nuovo</p>
+    <div class="flex">
+      <div>uno</div>
+      <div>due</div>
+      <div>tre</div>
+    </div>
+  </body>
+</html>
+ +

聖杯排版示例

+ +

本示例將示範彈性盒子在不同的解析度之下，如何提供動態變更的能力。下圖將說明轉換。

+ +

HolyGrailLayout.png

+ +

這裡展示了貼合了瀏覽器視窗的排版，必須為智慧型手機視窗最佳化的情況。不僅尺寸要縮減，呈現順序也要改變。彈性盒子把這件事變得相當簡單。

+ +
​<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <style>
+    body {
+        font: 24px Helvetica;
+        background: #999999;
+    }
+
+    #main {
+        min-height: 800px;
+        margin: 0;
+        padding: 0;
+        display: flex;
+        flex-flow: row;
+    }
+
+    #main > article {
+        margin: 4px;
+        padding: 5px;
+        border: 1px solid #cccc33;
+        border-radius: 7pt;
+        background: #dddd88;
+        flex: 3 1 60%;
+        order: 2;
+    }
+
+    #main > nav {
+        margin: 4px;
+        padding: 5px;
+        border: 1px solid #8888bb;
+        border-radius: 7pt;
+        background: #ccccff;
+        flex: 1 6 20%;
+        order: 1;
+    }
+
+    #main > aside {
+        margin: 4px;
+        padding: 5px;
+        border: 1px solid #8888bb;
+        border-radius: 7pt;
+        background: #ccccff;
+        flex: 1 6 20%;
+        order: 3;
+    }
+
+    header, footer {
+        display: block;
+        margin: 4px;
+        padding: 5px;
+        min-height: 100px;
+        border: 1px solid #eebb55;
+        border-radius: 7pt;
+        background: #ffeebb;
+    }
+
+    /* Too narrow to support three columns */
+    @media all and (max-width: 640px) {
+        #main, #page {
+            flex-direction: column;
+        }
+
+        #main > article, #main > nav, #main > aside {
+        /* Return them to document order */
+            order: 0;
+        }
+
+        #main > nav, #main > aside, header, footer {
+            min-height: 50px;
+            max-height: 50px;
+        }
+    }
+    </style>
+  </head>
+  <body>
+    <header>header</header>
+    <div id='main'>
+      <article>article</article>
+      <nav>nav</nav>
+      <aside>aside</aside>
+    </div>
+    <footer>footer</footer>
+  </body>
+</html>
+ +

遊樂場

+ +

以下提供一些與彈性盒子相關的網站讓你親手操作：

+ + + +

要注意的事情

+ +

有時候配置 Flex item 的演算法會有點難以理解。因此，在設計 Flexible box 時有一些指引，能讓你避免負面意義上的驚嘆。

+ +

Flexible box 通常會盡量貼合 writing mode 的配置，這意味著 main start 與 main end 會基於 start 與 end 的位置來配置。

+ +

cross start 與 cross end 依賴 start 或 before 的定義的位置，其依賴 direction 的值。

+ +

Page breaks are possible in flexible boxes layout as long as break- property allows it. CSS3 break-after, break-before, and break-inside as well as CSS 2.1 page-break-before, page-break-after, and page-break-inside properties are accepted on a flex container, flex items, and inside flex items.

+ +

瀏覽器相容性

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Basic support (single-line flexbox){{CompatGeckoDesktop("18.0")}}[6]{{property_prefix("-moz")}}[2]
+ {{CompatGeckoDesktop("22.0")}}		21.0{{property_prefix("-webkit")}}
+ 29.0		11[3]12.10{{property_prefix("-webkit")}}[5]6.1{{property_prefix("-webkit")}}[1]
Multi-line flexbox{{CompatGeckoDesktop("28.0")}}21.0{{property_prefix("-webkit")}}
+ 29.0		11[3]12.10[5]
+ 15 {{property_prefix("-webkit")}}		6.1{{property_prefix("-webkit")}}[1]
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureFirefox Mobile (Gecko)Firefox OSAndroidIE PhoneOpera MobileSafari Mobile
Basic support (single-line flexbox){{CompatGeckoMobile("18.0")}}{{property_prefix("-moz")}}[2]
+ {{CompatGeckoMobile("22.0")}}		 +

1.0{{property_prefix("-moz")}}[2]
+ 1.1

+ 		2.1{{property_prefix("-webkit")}}[4]
+ 4.4		1112.10[5]
+ 15{{property_prefix("-webkit")}}		7{{property_prefix("-webkit")}}[1]
Multi-line flexbox{{CompatGeckoMobile("28.0")}}1.32.1{{property_prefix("-webkit")}}[4]
+ 4.4		1112.10[5]
+ 15{{property_prefix("-webkit")}}		7{{property_prefix("-webkit")}}[1]
+
+ +

[1] Safari up to version 6.0 (iOS.1) supported an old incompatible draft version of the specification. Safari 6.1 (and Safari on iOS 7) has been updated to support the final version.

+ +

[2] Up to Firefox 22, to activate flexbox support, the user has to change the about:config preference layout.css.flexbox.enabled to true. From Firefox 22 to Firefox 27, the preference is true by default, but the preference has been removed in Firefox 28.

+ +

[3] Internet Explorer 10 supports an old incompatible draft version of the specification; Internet Explorer 11 has been updated to support the final version.

+ +

[4] Android browser up to 4.3 supported an old incompatible draft version of the specification. Android 4.4 has been updated to support the final version.

+ +

[5] While in the initial implementation in Opera 12.10 flexbox was not prefixed, it got prefixed in versions 15 to 16 of Opera and 15 to 19 of Opera Mobile with {{property_prefix("-webkit")}}. The prefix was removed again in Opera 17 and Opera Mobile 24.

+ +

[6] Up to Firefox 29, specifying visibility: collapse on a flex item causes it to be treated as if it were display: none instead of the intended behavior, treating it as if it were visibility: hidden. The suggested workaround is to use visibility:hidden for flex items that should behave as if they were designated visibility:collapse. For more information, see {{bug(783470)}}.

+ +

參見

+ + diff --git a/files/zh-tw/web/css/css_flexible_box_layout/using_css_flexible_boxes/index.html b/files/zh-tw/web/css/css_flexible_box_layout/using_css_flexible_boxes/index.html deleted file mode 100644 index af098dde55..0000000000 --- a/files/zh-tw/web/css/css_flexible_box_layout/using_css_flexible_boxes/index.html +++ /dev/null @@ -1,383 +0,0 @@ ---- -title: CSS彈性盒子用法 -slug: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes -tags: - - '#RWD' - - CSS - - Web - - 例子 - - 先进的 - - 入门 - - 灵活 - - 盒 -translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox -translation_of_original: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes ---- -
{{CSSRef}}
- -

CSS3 彈性盒子，又稱flexbox，是為了適應不同螢幕尺寸和顯示設備而生的佈局模式。針對許多應用而言，不用 floats 的彈性盒子模型會比塊狀模型（block model）易用，彈性容器的邊緣也不會與內容的邊緣重疊。

- -

多數設計師會發現 flexbox 用起來比 box 簡單得多。像是不多注意 div 的話，它就會經常違反設計師意願地，跑到頁頂去──令 footer 附著在頁底，也因此變得很棘手。flexbox 的寬高能改變以適應顯示空間，將較低的元件固定住。Flexbox 邏輯也能讓你確實令 div 壓在頁面的右方或底部。Flexbox 元素的顯示順序，與原始碼的顯示順序相互獨立。

- -

一些時髦的佈局，也能因而透過更簡潔的程式碼完成。這種有意的獨立性只影響視覺渲染，基於 HTML 原始碼的語意順序及瀏覽不會受到影響。

- -
注：儘管 CSS 彈性盒子佈局規範還處於最終徵求意見稿（Last Call Working Draft）階段（參見最新編輯草案）、也不是所有瀏覽器都實做彈性盒子的所有功能。但這麼說好了，現在主流的瀏覽器，都對 flexbox 有著良好的支持。請參見相容性表格的具體屬性，以獲取最新的相容狀態。
- -

彈性盒子的概念

- -

Flex 排版的大致定義，是能更改該項目的長與（或）高，以便貼合任何顯示設備的空間。Flex container 能針對該元件擴張以便填補可用的空間、或收縮以便阻止空間溢出。

- -

塊狀佈局（Block layout）以垂直方向為準、行內佈局（Inline layout）以水平方向為準、而彈性佈局（Flexbox layout）則同時允許這兩種。塊狀佈局雖適於頁面顯示，但在程式元件（application component）需要在用戶代理（user agent）變更、手機從垂直方向翻轉到水平方向……等變更定位、大小、拉伸、收縮的情形下，這種佈局就很難用了。彈性盒子佈局長於小規模佈局、而剛剛流行的格線佈局（Grid layout）則長於大規模佈局。二者皆為 CSS 工作小組為在不同用戶代理、書寫模式、和其他要求下的 Web 應用程式，提供良好互通性的一部分。

- -

彈性盒子的字彙

- -

在彈性盒子的世界，我們不會稱水平（inline）或垂直（block），而是主軸（main axis）與切軸（cross axis）。如果 flex-direction 是 column，主軸就會充當垂直、而切軸則充當水平。請參考下面的圖，它展示了一個 flex-direction 是 row 的彈性容器，意味著該彈性項目會基於主軸，作水平排列。

- -

flex_terms.png

- -
-
彈性容器（Flex container）
-
包住彈性項目（Flex item）的父元素。在 {{Cssxref("display")}} 屬性用上 flex 或 inline-flex 值的，就是彈性容器。
-
彈性項目（Flex item）
-
-

所有彈性容器的子元素都會變成彈性項目。直接包含在彈性容器的文字，會被包裝成匿名的 Flex 項目。

-
-
軸（Axes）
-
-

所有彈性盒子布局都有兩個軸。主軸（main axis）是跟隨著彈性項目順序的軸、而切軸(cross axis)是垂直於主軸的軸。

- -
    -
  • flex-direction 屬性啟用主軸。
    • -
  • justify-content 屬性定義目前彈性項目的主軸如何擺放。
    • -
  • align-items 屬性定義目前彈性項目的切軸如何擺放。
    • -
  • align-self 屬性定義目前單一彈性項目如何對齊。這個設定會覆蓋 align-items 的預設值。
    • -
-
-
方向（Directions）
-
-

彈性容器的 main start/main end 與 cross start/cross end sides 描述了彈性項目流的起點與終點。它們跟隨著由 writing-mode 所建立的向量中，彈性容器的主軸與切軸排列（左至右或右至左……等等）。

- -
    -
  • order assigns elements to ordinal groups and determines which elements appear first.
    • -
  • flex-flow 屬性是 flex-direction 與 flex-wrap 屬性的簡寫，描述了彈性項目的整體布局。
    • -
-
-
Lines
-
-

Flex items can be laid out on either a single line or on several lines according to the flex-wrap property, which controls the direction of the cross axis and the direction in which new lines are stacked.

-
-
Dimensions
-
-

The flex items' agnostic equivalents of height and width are main size and cross size, which respectively follow the main axis and cross axis of the flex container.

- - -
-
- -

設計一個彈性盒子

- -

要設計基於這種風格的 CSS 元素，請把 display 屬性設為：

- -
display: flex;
- -

或：

- -
display: inline-flex;
- -

這樣一來，元素就會變成彈性容器，而它的子元素們就會變成彈性項目。flex 值會讓彈性容器變成塊級元素（block-level element）、inline-flex 則會讓彈性容器成為單一的行內元素（atomic inline-level element）。

- -
注意：如果需要支援較舊的瀏覽器，請把廠商前輟標記（vendor prefix tag）寫在 display 屬性（property），而不是屬性值（attribute）。例如：display: -webkit-flex。
- -

彈性項目需要留心……

- -

Text that is directly contained inside a flex container is automatically wrapped in an anonymous flex item. However, an anonymous flex item that contains only white space is not rendered, as if it were designated display: none.

- -

Absolutely positioned children of a flex container are positioned so that their static position is determined in reference to the main start content-box corner of their flex container.

- -

The margins of adjacent flex items do not collapse. Using auto margins absorbs extra space in the vertical or horizontal direction and can be used for alignment or to separate adjacent flex items. See Aligning with 'auto' margins in the W3C CSS Flexible Box Layout Module specification for more details.

- -

Flexbox's alignment properties do "true" centering, unlike other centering methods in CSS. This means that the flex items will stay centered, even if they overflow the flex container. This can sometimes be problematic, however, if they overflow past the top edge of the page, or the left edge (in LTR languages like English; the problem occurs on the right edge in RTL languages like Arabic), as you can't scroll to that area, even if there is content there! In a future release, the alignment properties will be extended to have a "safe" option as well. For now, if this is a concern, you can instead use margins to achieve centering, as they'll respond in a "safe" way and stop centering if they overflow. Instead of using the align- properties, just put auto margins on the flex items you wish to center. Instead of the justify- properties, put auto margins on the outside edges of the first and last flex items in the flex container. The auto margins will "flex" and assume the leftover space, centering the flex items when there is leftover space, and switching to normal alignment when not. However, if you're trying to replace justify-content with margin-based centering in a multi-line flexbox, you're probably out of luck, as you need to put the margins on the first and last flex item on each line. Unless you can predict ahead of time which items will end up on which line, you can't reliably use margin-based centering in the main axis to replace the justify-content property.

- -

Recall that while the display order of the elements is independent of their order in the source code, this independence affects only the visual rendering, leaving speech order and navigation based on the source order. Even the {{cssxref("order")}} property does not affect speech or navigation sequence. Thus developers must take care to order elements properly in the source so as not to damage the document's accessibility.

- -

彈性盒子的屬性

- -

不對彈性盒子生效的屬性

- -

由於彈性盒子使用不同的排版演算法，所以有些屬性不太適合用在彈性容器內：

- - - -

示例

- -

基本彈性排版示例

- -

這個基本彈性將展示如何把「彈性化」引至某個元素、並在彈性狀態下相鄰該元素的表現。

- -
​<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8">
-    <style>
-    .flex {
-        /* basic styling */
-        width: 350px;
-        height: 200px;
-        border: 1px solid #555;
-        font: 14px Arial;
-
-        /* flexbox setup */
-        display: flex;
-        flex-direction: row;
-    }
-
-    .flex > div {
-        flex: 1 1 auto;
-        width: 30px; /* To make the transition work nicely. (Transitions to/from
-                        "width:auto" are buggy in Gecko and Webkit, at least.
-                        See http://bugzil.la/731886 for more info.) */
-        transition: width 0.7s ease-out;
-    }
-
-    /* colors */
-    .flex > div:nth-child(1){ background: #009246; }
-    .flex > div:nth-child(2){ background: #F1F2F1; }
-    .flex > div:nth-child(3){ background: #CE2B37; }
-
-    .flex > div:hover {
-        width: 200px;
-    }
-
-    </style>
-  </head>
-  <body>
-    <p>Flexbox nuovo</p>
-    <div class="flex">
-      <div>uno</div>
-      <div>due</div>
-      <div>tre</div>
-    </div>
-  </body>
-</html>
- -

聖杯排版示例

- -

本示例將示範彈性盒子在不同的解析度之下，如何提供動態變更的能力。下圖將說明轉換。

- -

HolyGrailLayout.png

- -

這裡展示了貼合了瀏覽器視窗的排版，必須為智慧型手機視窗最佳化的情況。不僅尺寸要縮減，呈現順序也要改變。彈性盒子把這件事變得相當簡單。

- -
​<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <style>
-    body {
-        font: 24px Helvetica;
-        background: #999999;
-    }
-
-    #main {
-        min-height: 800px;
-        margin: 0;
-        padding: 0;
-        display: flex;
-        flex-flow: row;
-    }
-
-    #main > article {
-        margin: 4px;
-        padding: 5px;
-        border: 1px solid #cccc33;
-        border-radius: 7pt;
-        background: #dddd88;
-        flex: 3 1 60%;
-        order: 2;
-    }
-
-    #main > nav {
-        margin: 4px;
-        padding: 5px;
-        border: 1px solid #8888bb;
-        border-radius: 7pt;
-        background: #ccccff;
-        flex: 1 6 20%;
-        order: 1;
-    }
-
-    #main > aside {
-        margin: 4px;
-        padding: 5px;
-        border: 1px solid #8888bb;
-        border-radius: 7pt;
-        background: #ccccff;
-        flex: 1 6 20%;
-        order: 3;
-    }
-
-    header, footer {
-        display: block;
-        margin: 4px;
-        padding: 5px;
-        min-height: 100px;
-        border: 1px solid #eebb55;
-        border-radius: 7pt;
-        background: #ffeebb;
-    }
-
-    /* Too narrow to support three columns */
-    @media all and (max-width: 640px) {
-        #main, #page {
-            flex-direction: column;
-        }
-
-        #main > article, #main > nav, #main > aside {
-        /* Return them to document order */
-            order: 0;
-        }
-
-        #main > nav, #main > aside, header, footer {
-            min-height: 50px;
-            max-height: 50px;
-        }
-    }
-    </style>
-  </head>
-  <body>
-    <header>header</header>
-    <div id='main'>
-      <article>article</article>
-      <nav>nav</nav>
-      <aside>aside</aside>
-    </div>
-    <footer>footer</footer>
-  </body>
-</html>
- -

遊樂場

- -

以下提供一些與彈性盒子相關的網站讓你親手操作：

- - - -

要注意的事情

- -

有時候配置 Flex item 的演算法會有點難以理解。因此，在設計 Flexible box 時有一些指引，能讓你避免負面意義上的驚嘆。

- -

Flexible box 通常會盡量貼合 writing mode 的配置，這意味著 main start 與 main end 會基於 start 與 end 的位置來配置。

- -

cross start 與 cross end 依賴 start 或 before 的定義的位置，其依賴 direction 的值。

- -

Page breaks are possible in flexible boxes layout as long as break- property allows it. CSS3 break-after, break-before, and break-inside as well as CSS 2.1 page-break-before, page-break-after, and page-break-inside properties are accepted on a flex container, flex items, and inside flex items.

- -

瀏覽器相容性

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Basic support (single-line flexbox){{CompatGeckoDesktop("18.0")}}[6]{{property_prefix("-moz")}}[2]
- {{CompatGeckoDesktop("22.0")}}		21.0{{property_prefix("-webkit")}}
- 29.0		11[3]12.10{{property_prefix("-webkit")}}[5]6.1{{property_prefix("-webkit")}}[1]
Multi-line flexbox{{CompatGeckoDesktop("28.0")}}21.0{{property_prefix("-webkit")}}
- 29.0		11[3]12.10[5]
- 15 {{property_prefix("-webkit")}}		6.1{{property_prefix("-webkit")}}[1]
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureFirefox Mobile (Gecko)Firefox OSAndroidIE PhoneOpera MobileSafari Mobile
Basic support (single-line flexbox){{CompatGeckoMobile("18.0")}}{{property_prefix("-moz")}}[2]
- {{CompatGeckoMobile("22.0")}}		 -

1.0{{property_prefix("-moz")}}[2]
- 1.1

- 		2.1{{property_prefix("-webkit")}}[4]
- 4.4		1112.10[5]
- 15{{property_prefix("-webkit")}}		7{{property_prefix("-webkit")}}[1]
Multi-line flexbox{{CompatGeckoMobile("28.0")}}1.32.1{{property_prefix("-webkit")}}[4]
- 4.4		1112.10[5]
- 15{{property_prefix("-webkit")}}		7{{property_prefix("-webkit")}}[1]
-
- -

[1] Safari up to version 6.0 (iOS.1) supported an old incompatible draft version of the specification. Safari 6.1 (and Safari on iOS 7) has been updated to support the final version.

- -

[2] Up to Firefox 22, to activate flexbox support, the user has to change the about:config preference layout.css.flexbox.enabled to true. From Firefox 22 to Firefox 27, the preference is true by default, but the preference has been removed in Firefox 28.

- -

[3] Internet Explorer 10 supports an old incompatible draft version of the specification; Internet Explorer 11 has been updated to support the final version.

- -

[4] Android browser up to 4.3 supported an old incompatible draft version of the specification. Android 4.4 has been updated to support the final version.

- -

[5] While in the initial implementation in Opera 12.10 flexbox was not prefixed, it got prefixed in versions 15 to 16 of Opera and 15 to 19 of Opera Mobile with {{property_prefix("-webkit")}}. The prefix was removed again in Opera 17 and Opera Mobile 24.

- -

[6] Up to Firefox 29, specifying visibility: collapse on a flex item causes it to be treated as if it were display: none instead of the intended behavior, treating it as if it were visibility: hidden. The suggested workaround is to use visibility:hidden for flex items that should behave as if they were designated visibility:collapse. For more information, see {{bug(783470)}}.

- -

參見

- - diff --git a/files/zh-tw/web/events/abort/index.html b/files/zh-tw/web/events/abort/index.html deleted file mode 100644 index e0330135f4..0000000000 --- a/files/zh-tw/web/events/abort/index.html +++ /dev/null @@ -1,68 +0,0 @@ ---- -title: abort -slug: Web/Events/abort -translation_of: Web/API/HTMLMediaElement/abort_event -translation_of_original: Web/Events/abort ---- -

當資源載入被拒絕時將會觸發abort事件。

- -

一般資訊

- -
-
規範
-
DOM L3
-
介面
-
若由使用者介面產生，為UIEvent，否則為Event。
-
是否向上(冒泡)
-
否
-
是否為可取消
-
否
-
目標對象
-
Element
-
預設行為
-
無
-
- -

屬性

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
屬性型態描述
target {{readonlyInline}}EventTarget事件的目標對象 (DOM樹中最頂層的對象)。
type {{readonlyInline}}DOMString事件的型態。
bubbles {{readonlyInline}}Boolean事件是否向上冒泡。
cancelable {{readonlyInline}}Boolean事件是否能夠取消。
view {{readonlyInline}}WindowProxydocument.defaultView (該文檔(Document)的window)
detail {{readonlyInline}}long (float)0.
diff --git a/files/zh-tw/web/events/domcontentloaded/index.html b/files/zh-tw/web/events/domcontentloaded/index.html deleted file mode 100644 index 0ec78423ec..0000000000 --- a/files/zh-tw/web/events/domcontentloaded/index.html +++ /dev/null @@ -1,133 +0,0 @@ ---- -title: DOMContentLoaded -slug: Web/Events/DOMContentLoaded -translation_of: Web/API/Window/DOMContentLoaded_event ---- -

DOMContentLoaded事件是當document被完整的讀取跟解析後就會被觸發,不會等待 stylesheets, 圖片和subframes完成讀取  (load事件可以用來作為判斷頁面已經完整讀取的方法).

- -
-

Note: Stylesheet loads block script execution, 如果 <script> 被放在 <link rel="stylesheet" ...>後面的話, 須等到前面的stylesheet載入並完成解析，此時 DOMContentLoaded才會被觸發。

-
- -

Speeding up

- -

If you want DOM to get parsed as fast as possible after the user had requested the page, some things you could do is turn your JavaScript asynchronous and to optimize loading of stylesheets which if used as usual, slow down page load due to being loaded in parallel, "stealing" traffic from the main html document.

- -

General info

- -
-
Specification
-
HTML5
-
Interface
-
Event
-
Bubbles
-
Yes
-
Cancelable
-
Yes (although specified as a simple event that isn't cancelable)
-
Target
-
Document
-
Default Action
-
None.
-
- -

屬性

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
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.
- -

瀏覽器相容性

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support0.2{{ CompatGeckoDesktop("1") }}9.09.03.1
-
- -
- - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{ CompatVersionUnknown() }}{{ CompatGeckoMobile("1") }}{{ CompatUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
-
- -

Bubbling for this event is supported by at least Gecko 1.9.2, Chrome 6, and Safari 4.

- -

Cross-browser fallback

- -

Internet Explorer 8 supports the <code>readystatechange</code> event, which can be used to detect that the DOM is ready. In earlier version of Internet Explorer, this state can be detected by regularily trying to execute <code>document.documentElement.doScroll("left");</code>, as this snippet will throw an error until the DOM is ready.

- -

General-purpose JS libraries such as jQuery offer cross-browser methods to detect that the DOM is ready. There are also standalone scripts that offer this feature : contentloaded.js (supports only one listener) and jquery.documentReady.js (doesn't depend on jQuery, despite its name).

- - - - diff --git a/files/zh-tw/web/events/load/index.html b/files/zh-tw/web/events/load/index.html deleted file mode 100644 index 7c6d314925..0000000000 --- a/files/zh-tw/web/events/load/index.html +++ /dev/null @@ -1,88 +0,0 @@ ---- -title: load -slug: Web/Events/load -translation_of: Web/API/Window/load_event ---- -

load 事件發生在加載完目標資源、該資源依賴的其他資源時。

- -

一般資訊

- -
-
規範
-
DOM L3
-
介面
-
UIEvent
-
起泡事件
-
No
-
可取消
-
No
-
對象
-
Window
-
預設行為
-
None.
-
- -

屬性

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyTypeDescription
target {{readonlyInline}}EventTargetThe event target (the topmost target in the DOM tree).
type {{readonlyInline}}DOMStringThe type of event.
bubbles {{readonlyInline}}BooleanWhether the event normally bubbles or not.
cancelable {{readonlyInline}}BooleanWhether the event is cancellable or not.
view {{readonlyInline}}WindowProxydocument.defaultView (window of the document)
detail {{readonlyInline}}long (float)0.
- -

範例

- -
<script>
-  window.addEventListener("load", function(event) {
-    console.log("All resources finished loading!");
-  });
-</script>
-
- -

 

- -

相關事件

- - diff --git a/files/zh-tw/web/guide/dom/index.html b/files/zh-tw/web/guide/dom/index.html deleted file mode 100644 index fc26bc0bee..0000000000 --- a/files/zh-tw/web/guide/dom/index.html +++ /dev/null @@ -1,22 +0,0 @@ ---- -title: DOM developer guide -slug: Web/Guide/DOM -tags: - - API - - DOM - - Guide - - NeedsTranslation - - TopicStub -translation_of: Web/API/Document_Object_Model -translation_of_original: Web/Guide/API/DOM ---- -

{{draft}}

-

The Document Object Model is an API for HTML and XML documents. It provides a structural representation of the document, enabling the developer to modify its content and visual presentation. Essentially, it connects web pages to scripts or programming languages.

-

All of the properties, methods, and events available to the web developer for manipulating and creating web pages are organized into objects (e.g., the document object that represents the document itself, the table object that represents a HTML table element, and so forth). Those objects are accessible via scripting languages in most recent web browsers.

-

The DOM is most often used in conjunction with JavaScript. However, the DOM was designed to be independent of any particular programming language, making the structural representation of the document available from a single, consistent API. Though we focus on JavaScript throughout this site, implementations of the DOM can be built for any language.

-

The World Wide Web Consortium establishes a standard for the DOM, called the W3C DOM. It should, now that the most important browsers correctly implement it, enable powerful cross-browser applications.

-

Why is the DOM important?

-

"Dynamic HTML" (DHTML) is a term used by some vendors to describe the combination of HTML, style sheets and scripts that allows documents to be animated. The W3C DOM Working Group is working hard to make sure interoperable and language-neutral solutions are agreed upon (see also the W3C FAQ). As Mozilla claims the title of "Web Application Platform", support for the DOM is one of the most requested features, and a necessary one if Mozilla wants to be a viable alternative to the other browsers.

-

Even more important is the fact that the user interface of Mozilla (also Firefox and Thunderbird) is built using XUL, using the DOM to manipulate its own UI.

-

More about the DOM

-

{{LandingPageListSubpages}}

diff --git a/files/zh-tw/web/guide/html/event_attributes/index.html b/files/zh-tw/web/guide/html/event_attributes/index.html deleted file mode 100644 index 102e9cd314..0000000000 --- a/files/zh-tw/web/guide/html/event_attributes/index.html +++ /dev/null @@ -1,85 +0,0 @@ ---- -title: Event attributes -slug: Web/Guide/HTML/Event_attributes -translation_of: >- - Learn/JavaScript/Building_blocks/Events#Inline_event_handlers_%E2%80%94_don%27t_use_these -translation_of_original: Web/Guide/HTML/Event_attributes ---- -

每一個 HTML 元素都可以放置事件屬性，以藉此於事件發生時能執行 JavaScripte 程式。事件屬性的名稱都有一個前綴「on」，例如當使用者點選元素時要執行指定的 JavaScript，可以使用 onclick 屬性並把要執行的 JavaScript 當成屬性值。

- -

In the JavaScript code executed in response to the event, this is bound to the HTML element and the {{domxref("Event")}} object can be reached using the event variable in the scope of the attribute.

- -
-

Warning: These attributes should be avoided. This makes the markup bigger and less readable. Concerns of content/structure and behavior are not well-separated, making a bug harder to find. Furthermore, usage of event attributes almost always causes scripts to expose global functions on the {{domxref("Window")}} object, polluting the global namespace.

-
- -

While these attributes can at times be attractively easy to use, you should avoid using them. Instead, use the {{domxref("EventTarget.addEventListener()")}} function to add a listener for the event.

- -

Event attributes can be blocked by using Content Security Policy which if used, blocks all inline scripts unless the 'unsafe-inline' keyword is used.

- -

Example using event attributes

- -

This example appends text to an element each time time the {{HTMLElement("div")}} is clicked.

- -
-

Note: This is an example of how not to do things, using one of these attributes.

-
- -
<!doctype html>
-<html>
-  <head>
-    <title>Event Attribute Example</title>
-    <script>
-      function doSomething() {
-        document.getElementById("thanks").innerHTML += "<p>Thanks for clicking!</p>";
-      }
-    </script>
-  </head>
-  <body>
-    <div onclick="doSomething();">Click me!</div>
-    <div id="thanks"></div>
-  </body>
-</html>
-
- -

Try this example below:

- -

{{ EmbedLiveSample('Example_using_event_attributes', '', '', '') }}

- -

Example using event listeners

- -

Instead, you should use {{domxref("EventTarget.addEventListener()")}}, as shown here:

- -
<!doctype html>
-<html>
-  <head>
-    <title>Event Attribute Example</title>
-    <script>
-      function doSomething() {
-        document.getElementById("thanks").innerHTML += "<p>Thanks for clicking!</p>";
-      }
-
-      // Called when the page is done loading; this is where we do any setup we need,
-      // such as creating event listeners for the elements in the page.
-
-      function setup() {
-        document.getElementById("click").addEventListener("click", doSomething, true);
-      }
-
-      // Install an event handler on the window to receive the "load" event, which
-      // indicates that the document has finished loading into the window.
-
-      window.addEventListener("load", setup, true);
-    </script>
-  </head>
-  <body>
-    <div id="click">Click me!</div>
-    <div id="thanks"></div>
-  </body>
-</html>
- -

You can see this in action below:

- -

{{ EmbedLiveSample('Example_using_event_listeners', '', '', '') }}

- - diff --git a/files/zh-tw/web/html/forms_in_html/index.html b/files/zh-tw/web/html/forms_in_html/index.html deleted file mode 100644 index 6d83f5efea..0000000000 --- a/files/zh-tw/web/html/forms_in_html/index.html +++ /dev/null @@ -1,83 +0,0 @@ ---- -title: Forms in HTML -slug: Web/HTML/Forms_in_HTML -translation_of: Learn/HTML/Forms/HTML5_updates ---- -
- {{gecko_minversion_header("2")}}
-

摘要

-

HTML5的Form元素及其屬性比HTML4提供更大程度的語意標記，也移除了原本許多在HTML4所需要的繁瑣程式碼腳本與樣式控制。HTML5的Form元素讓表單在跨網頁上有更好的一致性，也提供即時的使用者輸入回饋，因為這些特色，HTML5的Form元素在使用者體驗上有更好的表現，甚至，這些體驗依然適用在瀏覽器關閉程式碼腳本執行的情況下。

-

本文旨在討論Gecko/Firefox, version 4或更新版本在新的或變更後的Form元素特色上的支援。

-

<input>元素

-

<input>元素的type屬性新增了一些屬性值。

- -

<input>元素同時也新增了一些屬性:

- -

<form>元素

-

{{HTMLElement("form")}} 元素新增了一些屬性

- -

 <datalist>元素

-

{{HTMLElement("datalist")}}元素是{{HTMLElement("option")}}元素的列表，{{HTMLElement("option")}}元素會用於提示輸入建議。

-

可以利用{{HTMLElement("input")}}的{{htmlattrxref("list", "input")}}屬性來連結{{HTMLElement("input")}}元素與{{HTMLElement("datalist")}}

-

<output>元素

-

{{HTMLElement("output")}}元素代表運算結果。

-

可以利用{{htmlattrxref("for", "output")}}屬性來設定{{HTMLElement("output")}}元素和其他影響計算結果的元素(如input或參數)的關係，{{htmlattrxref("for", "output")}}屬性的值為一串以空白分隔的元素ID。

-

{{non-standard_inline}} Gecko2.0(不一定適用其他瀏覽器引擎)支援自定義{{HTMLElement("output")}}元素的驗證條件和錯誤訊息，所以提供了其{{Cssxref(":invalid")}}, {{Cssxref(":valid")}}, {{Cssxref(":-moz-ui-invalid")}}和 {{Cssxref(":-moz-ui-valid")}}的CSS pseudo-class，在以下狀況這個特色將很有用，例如沒有輸入值有問題，但計算結果違反了商業規則(好比說總百分比不可超過100)。

-

placeholder屬性

-

{{HTMLElement("input")}}元素和{{HTMLElement("textarea")}}元素的{{htmlattrxref("placeholder", "input")}}屬性會在輸入欄位上顯示輸入提示，這個屬性的值不可以含有回車或換行符號。

-

autofocus屬性

-

{{htmlattrxref("autofocus", "input")}}屬性指示除非使用者另有指定(例如在其他控制項上進行輸入操作)，否則當載入網頁時表單控制項要自動聚焦於特定元素上；autofocus屬性值為布林值(Boolean)，一份文件只能有一份表單設定autofocus屬性。能夠設定這個屬性的元素有{{HTMLElement("input")}}, {{HTMLElement("button")}}, {{HTMLElement("select")}}與{{HTMLElement("textarea")}}，不過當{{htmlattrxref("type", "input")}}屬性為隱藏(hidden)下，autofocus是無效的，也就是說，不能自動聚焦於隱藏元素上。

-

label.control DOM屬性

-

HTMLLabelElement DOM介面提供了{{HTMLElement("label")}}元素一個新的control屬性，control屬性會回傳被標記的控制項，這個控制項便是該label適用的控制項，也就是<label>元素{{htmlattrxref("for", "label")}}屬性指定的元素(如果有的話)或是第一個後代控制項元素。

-

約束驗證

-

HTML5提供了客戶端表單驗證的語法和API，基於安全性與資料正確性，雖然這並不能取代伺服器端驗證，但是客戶端驗證可以提拱使用者更好的立即輸入回饋體驗。

-

當{{HTMLElement("input")}}元素設定了title屬性，其值會作為提示框之內容，若是驗證失敗，提示框的內容會換成相關的錯誤訊息，我們可以利用非標準的{{htmlattrxref("x-moz-errormessage")}}屬性或setCustomValidity()方法來自定義錯誤訊息。

-
<input type="email" title="Please, provide an e-mail" x-moz-errormessage="This is not a valid e-mail">
-
- Note: 約束驗證不支援表單的{{HTMLElement("button")}}元素，若是想根據表單驗證果來設定按鈕樣式，可以利用{{cssxref(":-moz-submit-invalid")}} pseudo-class。
-

約束驗證的HTML語法

-

下列是HTML5用來約束表單資料的語法

- -

另外，我們可以在{{HTMLElement("form")}}元素上設定{{htmlattrxref("novalidate", "form")}}屬性或是在{{HTMLElement("button")}}元素以及{{htmlattrxref("type", "input")}}為submit或image的{{HTMLElement("input")}}元素上設定{{htmlattrxref("formnovalidate", "button")}}屬性來避免輸入約束驗證。這些屬性都會指示表單送出時不要進行驗證。

-

約束驗證API

-

下列是客戶端驗證可用的DOM屬性和方法:

- -

See also

- diff --git a/files/zh-tw/web/html/supported_media_formats/index.html b/files/zh-tw/web/html/supported_media_formats/index.html deleted file mode 100644 index 455655ba25..0000000000 --- a/files/zh-tw/web/html/supported_media_formats/index.html +++ /dev/null @@ -1,467 +0,0 @@ ---- -title: Media formats supported by the HTML audio and video elements -slug: Web/HTML/Supported_media_formats -translation_of: Web/Media/Formats -translation_of_original: Web/HTML/Supported_media_formats ---- -

The {{ HTMLElement("audio") }} and {{ HTMLElement("video") }} elements provide support for playing audio and video media without requiring plug-ins. Video codecs and audio codecs are used to handle video and audio, and different codecs offer different levels of compression and quality. A container format is used to store and transmit the coded video and audio (both together, the case of a video with a soundtrack). Many combinations of codecs and container formats exist, although only a handful of these are relevant on the Web.

- -

Different browsers do not support the same media formats in their implementations of HTML5 video and audio, mainly because of patent issues. The area of media formats on the Web has greatly suffered from patent law in many countries - including the USA and EU countries (the notes on patents in this article is provided as-is and without any warranty.) This article discusses the different codec and container combinations relevant to the web, including support in browsers on both desktop and other device types.

- -

To make an HTML5 video, which works in the newest versions of all major browsers, you can serve your video in both WebM format and MPEG H.264 AAC format, using the source element like this:

- -
<video controls>
-  <source src="somevideo.webm" type="video/webm">
-  <source src="somevideo.mp4" type="video/mp4">
-  I'm sorry; your browser doesn't support HTML5 video in WebM with VP8 or MP4 with H.264.
-  <!-- You can embed a Flash player here, to play your mp4 video in older browsers -->
-</video>
-
- -

WebM

- -

The WebM format is based on a restricted version of the Matroska container format. It always uses the VP8 or VP9 video codec and the Vorbis or Opus audio codec. WebM is natively supported in desktop and mobile Gecko (Firefox), Chrome and Opera, and support for the format can be added to Internet Explorer and Safari (but not on iOS) by installing an add-on.

- -

Statement from Microsoft on why IE9 does not have native WebM support.

- -

The WebM format, specifically the VP8 video codec, had been acccused of patent infringment by a group of companies answering a call by the MPEG LA for the formation of a patent pool, but MPEG LA has agreed to license those patents to Google under a "perpetual, transferable, royalty free license".  This means, effectively, that all known patents on the WebM format are licensed to everyone for free. 

- -

Gecko recognizes the following MIME types as WebM files:

- -
-
video/webm
-
A WebM media file containing video (and possibly audio as well).
-
audio/webm
-
A WebM media file containing only audio.
-
- -

Ogg Theora Vorbis

- -

The Ogg container format with the Theora video codec and the Vorbis audio codec is supported in desktop/mobile Gecko (Firefox), Chrome, and Opera, and support for the format can be added to Safari (but not on iOS) by installing an add-on. The format is not supported in Internet Explorer in any way.

- -

WebM is generally preferred over Ogg Theora Vorbis when available, because it provides a better compression to quality ratio and is supported in more browsers. The Ogg format can however be used to support older browser versions (for example Firefox 3.5/3.6 don't support WebM, but do support Ogg.)

- -

The patent situation of Theora is similar to that of WebM.

- -

You can learn more about creating Ogg media by reading the Theora Cookbook.

- -

Gecko recognizes the following MIME types as Ogg files:

- -
-
audio/ogg
-
An Ogg file containing only audio.
-
video/ogg
-
An ogg file containing video (and possibly also audio).
-
application/ogg
-
An Ogg file with unspecified content. Using one of the other two MIME types is preferred, but you can use this if you don't know what the contents of the file are.
-
- -

Ogg Opus

- -

The Ogg container can also contain audio encoded using the Opus codec. Support for this is available in Gecko 15.0 {{ geckoRelease("15.0") }} and later, on desktop and mobile browsers.

- -

MP4 H.264 (AAC or MP3)

- -

The MP4 container format with the H.264 video codec and the AAC audio codec is natively supported by desktop/mobile Internet Explorer, Safari and Chrome, but Chromium and Opera do not support the format. IE and Chrome also support the MP3 audio codec in the MP4 container, but Safari does not. Firefox/Firefox for Android/Firefox OS supports the format in some cases, but only when a third-party decoder is available, and the device hardware can handle the profile used to encode the MP4.

- -
-

Note: MP4s encoded with a high profile will not run on lower end hardware, such as low end Firefox OS phones.

-
- -

The MPEG media formats are covered by patents, which are not freely licensed. All the necessary licenses can be bought from MPEG LA. Since H.264 is currently not a royalty free format, it is unfit for the open web platform, according to Mozilla [1, 2], Google [1, 2] and Opera. However, since royalty free formats are not supported by Internet Explorer and Safari, Mozilla has decided to support the format anyway, and Google never fulfilled their promise to remove support for it in Chrome.

- -

MP3

- -

The MP3 audio format (.mp3, audio/mpeg; distinct from the above MP3 audio in an MP4 container case) is supported in <audio> by Firefox/Firefox for Android/Firefox OS when the operating system provides an MP3 decoder, and by Internet Explorer, Chrome and Safari.

- -

WAVE PCM

- -

The WAVE container format, with the PCM audio codec (WAVE codec "1") is supported by desktop/mobile Gecko (Firefox) and Safari. Files in the WAVE container format typically end with the ".wav" extension.

- -
Note: See RFC 2361 for the WAVE codec registry.
- -

Gecko recognizes the following MIME types as WAVE audio files:

- - - -

Browser compatibility

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support3.0{{ CompatGeckoDesktop("1.9.1") }}9.010.503.1
<audio>: PCM in WAVE{{ CompatVersionUnknown() }}{{ CompatGeckoDesktop("1.9.1") }}{{ CompatNo() }}10.503.1
<audio>: Vorbis in WebM{{ CompatVersionUnknown() }}{{ CompatGeckoDesktop("2.0") }}{{ CompatNo() }}10.603.1 (must be installed separately)
<audio>: Vorbis in Ogg{{ CompatVersionUnknown() }}{{ CompatGeckoDesktop("1.9.1") }}{{ CompatNo() }}10.503.1 (must be installed separately, e.g. XiphQT)
<audio>: MP3{{ CompatVersionUnknown() }} (Not in Chromium)Partial (see below)9.0{{ CompatNo() }}3.1
<audio>: MP3 in MP4 -

{{ CompatUnknown() }}

- 		{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
<audio>: AAC in MP4 -

{{ CompatVersionUnknown() }} (Main only) (Not in Chromium)

- 		-

Partial (see below)

- 		9.0{{ CompatNo() }}3.1
<audio>: Opus in Ogg27.0{{ CompatGeckoDesktop("15.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
<video>: VP8 and Vorbis in WebM6.0{{ CompatGeckoDesktop("2.0") }}9.0 (must be installed separately, e.g. WebM MF)10.603.1 (must be installed separately, e.g. Perian)
<video>: VP9 and Opus in WebM29.0{{ CompatGeckoDesktop("28.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
<video>:  Theora and Vorbis in Ogg{{ CompatVersionUnknown() }}{{ CompatGeckoDesktop("1.9.1") }}{{ CompatNo() }}10.503.1 (must be installed separately, e.g. XiphQT)
<video>:  H.264 and MP3 in MP4 -

{{ CompatVersionUnknown() }} (Not in Chromium)

- 		Partial (see below)9.0{{ CompatNo() }}{{ CompatNo() }}
<video>: H.264 and AAC in MP4 -

{{ CompatVersionUnknown() }} (Not in Chromium)

- 		Partial (see below)9.0{{ CompatNo() }}3.1
any other format{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}3.1 (plays all formats available via QuickTime)
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)Firefox OS (Gecko)IE MobileOpera MobileOpera MiniSafari MobileChrome for Android
Basic support2.324.01.0.110.011.0Partial (see below)3.229.0
<audio>: PCM in WAVE{{ CompatUnknown() }}24.01.0.1{{ CompatNo() }}{{ CompatNo() }}Partial (see below)3.2{{ CompatUnknown() }}
<audio>: Vorbis in WebM{{ CompatUnknown() }}24.01.0.1{{ CompatNo() }}11.0Partial (see below){{ CompatNo() }}{{ CompatUnknown() }}
<audio>: Vorbis in Ogg{{ CompatUnknown() }}24.01.0.1{{ CompatNo() }}11.0Partial (see below){{ CompatNo() }}{{ CompatUnknown() }}
<audio>: MP3{{ CompatUnknown() }}Partial (see below)Partial (see below)10.0{{ CompatNo() }}Partial (see below)3.2{{ CompatUnknown() }}
<audio>: MP3 in MP4{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
<audio>: AAC in MP4{{ CompatUnknown() }}Partial (see below)Partial (see below)10.0{{ CompatNo() }}Partial (see below){{ CompatUnknown() }}{{ CompatUnknown() }}
<audio>: Opus in Ogg{{ CompatNo() }}24.0{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}Partial (see below){{ CompatNo() }}{{ CompatNo() }}
<video>:  VP8 and Vorbis in WebM2.324.01.0.1{{ CompatNo() }}16.0Partial (see below){{ CompatNo() }}29.0
<video>: VP9 and Opus in WebM{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
<video>: Theora and Vorbis in Ogg{{ CompatNo() }}24.01.0.1{{ CompatNo() }}{{ CompatNo() }}Partial (see below){{ CompatNo() }}{{ CompatNo() }}
<video>:  H.264 and MP3 in MP4Partial (see below)24.0Partial (see below)10.0Partial since 11.0, full since 16.0Partial (see below){{ CompatUnknown() }}29.0
<video>: H.264 and AAC in MP4Partial (see below)24.0Partial (see below)10.0Partial since 11.0, full since 16.0Partial (see below)3.229.0
any other format{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
-
- -

Notes:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PlatformGecko (Firefox) version
Windows 7+21.0
Windows Vista22.0
Android20.0
Firefox OS15.0
Linux -

26.0 (relies on GStreamer codecs being installed)

-
OS X 10.7Not yet (see bug)
- - - -

See also

- - diff --git a/files/zh-tw/web/http/basics_of_http/data_uris/index.html b/files/zh-tw/web/http/basics_of_http/data_uris/index.html new file mode 100644 index 0000000000..a8332c7cf3 --- /dev/null +++ b/files/zh-tw/web/http/basics_of_http/data_uris/index.html @@ -0,0 +1,128 @@ +--- +title: data URIs +slug: Web/HTTP/data_URIs +tags: + - Base64 + - Guide + - URI +translation_of: Web/HTTP/Basics_of_HTTP/Data_URIs +--- +

data URIs, 由 RFC 2397 文件定義, 允許作者在文件中嵌入檔案.

+ +

表達式

+ +

data URI 的表達式如下：

+ +
data:[<mediatype>][;base64],<data>
+
+ +

mediatype 為一 MIME type 字串，例如 JPEG 圖檔為「image/jpeg」，為非必要參數，若省略的話，默認值為「text/plain;charset=US-ASCII」。

+ +

If the data is textual, you can simply embed the text (using the appropriate entities or escapes based on the enclosing document's type). Otherwise, you can specify base64 to embed base64-encoded binary data.

+ +

範例

+ +
+
data:,Hello%2C%20World!
+
一個簡單的 text/plain data
+
data:text/plain;base64,SGVsbG8sIFdvcmxkIQ%3D%3D
+
同前者，但經過 base64 編碼。
+
data:text/html,%3Ch1%3EHello%2C%20World!%3C%2Fh1%3E
+
一 HTML 檔，內容為<h1>Hello, World</h1>
+
+ +

以 base64 格式編碼資料

+ +

在 Linux 和 Mac OS X 中，可以在終端機輸入下面的程式碼來進行編碼：

+ +
uuencode -m infile remotename
+
+ +

The infile parameter is the name of the file you wish to encode into base64 format, and remotename is the remote name for the file, which isn't actually used in data URLs.

+ +

輸出結果如下所示：

+ +
begin-base64 664 test
+YSBzbGlnaHRseSBsb25nZXIgdGVzdCBmb3IgdGV2ZXIK
+====
+
+ +

The data URI will use the encoded data after the initial header line.

+ +

JavaScript

+ +

請先閱讀文章《 Base64 encoding and decoding. 》。

+ +

轉換 nsIFile 至data URI

+ +

This function returns a base 64-encoded data URI from the passed nsIFile.

+ +
function generateDataURI(file) {
+  var contentType = Components.classes["@mozilla.org/mime;1"]
+                              .getService(Components.interfaces.nsIMIMEService)
+                              .getTypeFromFile(file);
+  var inputStream = Components.classes["@mozilla.org/network/file-input-stream;1"]
+                              .createInstance(Components.interfaces.nsIFileInputStream);
+  inputStream.init(file, 0x01, 0600, 0);
+  var stream = Components.classes["@mozilla.org/binaryinputstream;1"]
+                         .createInstance(Components.interfaces.nsIBinaryInputStream);
+  stream.setInputStream(inputStream);
+  var encoded = btoa(stream.readBytes(stream.available()));
+  return "data:" + contentType + ";base64," + encoded;
+}
+
+ +

安全

+ +
+

Note: Prior to {{Gecko("6.0")}}, data URIs inherited the security context of the page currently in the browser window if the user enters a data URI into the location bar. Now data URIs get a new, empty, security context.

+
+ +

常見的問題

+ +

以下列舉幾個再使用 data URIs 時常遇到的問題.

+ +
+
表達式
+
data URIs 的格式十分簡單, 但是我們容易忘記在 "data" 區塊前面使用逗號, 或是不正確的將資料轉換為 base64 的格式.
+
在HTML 的格式
+
A data URI provides a file within a file, which can potentially be very wide relative to the width of the enclosing document. As a URL, the data should be formatable with whitespace (linefeed, tab, or spaces), but there are practical issues that arise when using base64 encoding.
+
長度限制
+
Although Mozilla supports data URIs of essentially unlimited length, browsers are not required to support any particular maximum length of data. For example, the Opera 11 browser limits data URIs to around 65000 characters.
+
缺乏錯誤處理
+
Invalid parameters in media, or typos when specifying "base64", are ignored, but no error is provided.
+
未支援 query 字串, etc.
+
+

The data portion of a data URI is opaque, so an attempt to use a query string (page-specific parameters, with the syntax <url>?parameter-data) with a data URI will just include the query string in the data the URI represents. For example:

+ + 
data:text/html,lots of text...<p><a name%3D"bottom">bottom</a>?arg=val
+
+ +

This represents an HTML resource whose contents are:

+ + 
lots of text...<p><a name="bottom">bottom</a>?arg=val
+
+ +

Note: as of Firefox 6, fragments (anchors) are processed consistent with other URI schemes, thus a bare "#" in the content needs to be escaped as '%23'.

+
+
+ +

瀏覽器的支援

+ +

The data scheme is supported by Opera 7.20 and above, as well as Safari and Konqueror. Internet Explorer 7 and below, however, do not currently support it. Internet Explorer 8 and above only supports data URIs for images in CSS, <link>, and <img>.

+ +

參見

+ + + +

資源

+ + diff --git a/files/zh-tw/web/http/data_uris/index.html b/files/zh-tw/web/http/data_uris/index.html deleted file mode 100644 index a8332c7cf3..0000000000 --- a/files/zh-tw/web/http/data_uris/index.html +++ /dev/null @@ -1,128 +0,0 @@ ---- -title: data URIs -slug: Web/HTTP/data_URIs -tags: - - Base64 - - Guide - - URI -translation_of: Web/HTTP/Basics_of_HTTP/Data_URIs ---- -

data URIs, 由 RFC 2397 文件定義, 允許作者在文件中嵌入檔案.

- -

表達式

- -

data URI 的表達式如下：

- -
data:[<mediatype>][;base64],<data>
-
- -

mediatype 為一 MIME type 字串，例如 JPEG 圖檔為「image/jpeg」，為非必要參數，若省略的話，默認值為「text/plain;charset=US-ASCII」。

- -

If the data is textual, you can simply embed the text (using the appropriate entities or escapes based on the enclosing document's type). Otherwise, you can specify base64 to embed base64-encoded binary data.

- -

範例

- -
-
data:,Hello%2C%20World!
-
一個簡單的 text/plain data
-
data:text/plain;base64,SGVsbG8sIFdvcmxkIQ%3D%3D
-
同前者，但經過 base64 編碼。
-
data:text/html,%3Ch1%3EHello%2C%20World!%3C%2Fh1%3E
-
一 HTML 檔，內容為<h1>Hello, World</h1>
-
- -

以 base64 格式編碼資料

- -

在 Linux 和 Mac OS X 中，可以在終端機輸入下面的程式碼來進行編碼：

- -
uuencode -m infile remotename
-
- -

The infile parameter is the name of the file you wish to encode into base64 format, and remotename is the remote name for the file, which isn't actually used in data URLs.

- -

輸出結果如下所示：

- -
begin-base64 664 test
-YSBzbGlnaHRseSBsb25nZXIgdGVzdCBmb3IgdGV2ZXIK
-====
-
- -

The data URI will use the encoded data after the initial header line.

- -

JavaScript

- -

請先閱讀文章《 Base64 encoding and decoding. 》。

- -

轉換 nsIFile 至data URI

- -

This function returns a base 64-encoded data URI from the passed nsIFile.

- -
function generateDataURI(file) {
-  var contentType = Components.classes["@mozilla.org/mime;1"]
-                              .getService(Components.interfaces.nsIMIMEService)
-                              .getTypeFromFile(file);
-  var inputStream = Components.classes["@mozilla.org/network/file-input-stream;1"]
-                              .createInstance(Components.interfaces.nsIFileInputStream);
-  inputStream.init(file, 0x01, 0600, 0);
-  var stream = Components.classes["@mozilla.org/binaryinputstream;1"]
-                         .createInstance(Components.interfaces.nsIBinaryInputStream);
-  stream.setInputStream(inputStream);
-  var encoded = btoa(stream.readBytes(stream.available()));
-  return "data:" + contentType + ";base64," + encoded;
-}
-
- -

安全

- -
-

Note: Prior to {{Gecko("6.0")}}, data URIs inherited the security context of the page currently in the browser window if the user enters a data URI into the location bar. Now data URIs get a new, empty, security context.

-
- -

常見的問題

- -

以下列舉幾個再使用 data URIs 時常遇到的問題.

- -
-
表達式
-
data URIs 的格式十分簡單, 但是我們容易忘記在 "data" 區塊前面使用逗號, 或是不正確的將資料轉換為 base64 的格式.
-
在HTML 的格式
-
A data URI provides a file within a file, which can potentially be very wide relative to the width of the enclosing document. As a URL, the data should be formatable with whitespace (linefeed, tab, or spaces), but there are practical issues that arise when using base64 encoding.
-
長度限制
-
Although Mozilla supports data URIs of essentially unlimited length, browsers are not required to support any particular maximum length of data. For example, the Opera 11 browser limits data URIs to around 65000 characters.
-
缺乏錯誤處理
-
Invalid parameters in media, or typos when specifying "base64", are ignored, but no error is provided.
-
未支援 query 字串, etc.
-
-

The data portion of a data URI is opaque, so an attempt to use a query string (page-specific parameters, with the syntax <url>?parameter-data) with a data URI will just include the query string in the data the URI represents. For example:

- - 
data:text/html,lots of text...<p><a name%3D"bottom">bottom</a>?arg=val
-
- -

This represents an HTML resource whose contents are:

- - 
lots of text...<p><a name="bottom">bottom</a>?arg=val
-
- -

Note: as of Firefox 6, fragments (anchors) are processed consistent with other URI schemes, thus a bare "#" in the content needs to be escaped as '%23'.

-
-
- -

瀏覽器的支援

- -

The data scheme is supported by Opera 7.20 and above, as well as Safari and Konqueror. Internet Explorer 7 and below, however, do not currently support it. Internet Explorer 8 and above only supports data URIs for images in CSS, <link>, and <img>.

- -

參見

- - - -

資源

- - diff --git a/files/zh-tw/web/http/server-side_access_control/index.html b/files/zh-tw/web/http/server-side_access_control/index.html deleted file mode 100644 index 29ba4ef791..0000000000 --- a/files/zh-tw/web/http/server-side_access_control/index.html +++ /dev/null @@ -1,213 +0,0 @@ ---- -title: 伺服器端存取控制（CORS） -slug: Web/HTTP/Server-Side_Access_Control -translation_of: Web/HTTP/CORS -translation_of_original: Web/HTTP/Server-Side_Access_Control ---- -

存取控制系統是執行授權識別、認證、存取核可的實體，也負責透過登入來進行驗證，包含密碼、個人身份識別碼（personal identification numbers，PINs）、生物辨識掃描，以及物理或電子的金鑰。

- -

存取控制是用於規範計算環境之資源可供哪些人或單位觀看、使用的一種安全技術。

- -

{{HTTPSidebar}}

- -

瀏覽器透過 {{domxref("XMLHttpRequest")}} 或 Fetch API 所發起的跨網域請求（cross-site request），會在寄送時使用特定的 HTTP 標頭。同樣的，由伺服器回傳的跨網域回應（cross-site response）中也能看到特定的 HTTP 標頭。關於這些特定標頭的簡介，包括使用 JavaScript 發起請求與處理來自伺服器回應的範例以及每一個標頭的討論，可以在 HTTP 存取控制（CORS）一文中找到，並應該搭配本文一起閱讀。這篇文章包含使用 PHP 處理存取控制請求與建立存取控制回應。本文的目標讀者為伺服器端程式設計師或管理員。僅管本篇範例使用的是 PHP，但類似的概念也適用於 ASP.net、Perl、Python、Java 等等其他語言；一般來說，這些概念也能套用在任何處理 HTTP 請求及動態建立 HTTP 回應的伺服器端程式環境中。

- -

HTTP 標頭討論

- -

討論到同時涵蓋客戶端及伺服器端使用的 HTTP 標頭的文章在此，建議先閱讀該篇文章。

- -

可執行的程式碼範例

- -

隨後章節的 PHP 程式碼片段（以及 JavaScript 呼叫伺服器）可以在這裡取得。這些程式在實作了跨網域 {{domxref("XMLHttpRequest")}} 的瀏覽器中都可以運作。

- -

簡單跨網域請求

- -

簡單存取控制請求會在以下情況下被建立發起：

- - - -

在此情況下，回傳回應需要考慮以下條件：

- - - -

在 HTTP 存取控制（CORS）一文的簡單存取控制請求章節示範了客戶端與伺服器端之間標頭的交流。下面是一個處理簡單請求的 PHP 程式碼片段：

- -
<?php
-
-// 我們僅授權讓 arunranga.com 網域來存取資源
-// 因為我們認為該網域存取本 application/xml 資源是安全的
-
-if($_SERVER['HTTP_ORIGIN'] == "http://arunranga.com") {
-    header('Access-Control-Allow-Origin: http://arunranga.com');
-    header('Content-type: application/xml');
-    readfile('arunerDotNetResource.xml');
-} else {
-  header('Content-Type: text/html');
-  echo "<html>";
-  echo "<head>";
-  echo "   <title>Another Resource</title>";
-  echo "</head>";
-  echo "<body>",
-       "<p>This resource behaves two-fold:";
-  echo "<ul>",
-         "<li>If accessed from <code>http://arunranga.com</code> it returns an XML document</li>";
-  echo   "<li>If accessed from any other origin including from simply typing in the URL into the browser's address bar,";
-  echo   "you get this HTML document</li>",
-       "</ul>",
-     "</body>",
-   "</html>";
-}
-?>
-
- -

以上的程式會檢查由瀏覽器所送出之請求的 {{HTTPHeader("Origin")}} 標頭（透過取得 $_SERVER['HTTP_ORIGIN']）是否為「http://arunranga.com」。若相符，則回傳之回應中加入 {{HTTPHeader("Access-Control-Allow-Origin")}}: http://arunranga.com 標頭值。這個範例可以在這裡看到執行的情形。

- -

預檢請求

- -

預檢存取控制請求在以下情況下發起：

- - - -

在 HTTP 存取控制（CORS）一文的預檢存取控制請求章節示範了客戶端與伺服器端之間標頭的交流。一個伺服器資源要回應預檢（preflighted）請求必須能夠進行以下的判斷：

- - - -

下面是一個使用 PHP 實作之處理預檢請求的範例：

- -
<?php
-
-if($_SERVER['REQUEST_METHOD'] == "GET") {
-
-  header('Content-Type: text/plain');
-  echo "This HTTP resource is designed to handle POSTed XML input";
-  echo "from arunranga.com and not be retrieved with GET";
-
-} elseif($_SERVER['REQUEST_METHOD'] == "OPTIONS") {
-  // 告訴客戶端我們支援來自 arunranga.com 的呼叫
-  // 以及這個預檢請求的有效期限僅有 20 天
-
-  if($_SERVER['HTTP_ORIGIN'] == "http://arunranga.com") {
-    header('Access-Control-Allow-Origin: http://arunranga.com');
-    header('Access-Control-Allow-Methods: POST, GET, OPTIONS');
-    header('Access-Control-Allow-Headers: X-PINGARUNER');
-    header('Access-Control-Max-Age: 1728000');
-    header("Content-Length: 0");
-    header("Content-Type: text/plain");
-    //exit(0);
-  } else {
-    header("HTTP/1.1 403 Access Forbidden");
-    header("Content-Type: text/plain");
-    echo "You cannot repeat this request";
-  }
-
-} elseif($_SERVER['REQUEST_METHOD'] == "POST") {
-  // 處理 POST 請求，第一步為取得 POST 請求中 blob 型態的 XML
-  // 並且對其做一些處理，再傳送結果給客戶端
-
-  if($_SERVER['HTTP_ORIGIN'] == "http://arunranga.com") {
-    $postData = file_get_contents('php://input');
-    $document = simplexml_load_string($postData);
-
-    // 對 POST 請求的資料做一些處理
-
-    $ping = $_SERVER['HTTP_X_PINGARUNER'];
-
-    header('Access-Control-Allow-Origin: http://arunranga.com');
-    header('Content-Type: text/plain');
-    echo // 在處理之後要回傳的一些回應字串
-  } else {
-    die("POSTing Only Allowed from arunranga.com");
-  }
-} else {
-    die("No Other Methods Allowed");
-}
-?>
-
- -

注意範例中在回應 {{HTTPMethod("OPTIONS")}} 預檢（preflighted）請求與回應 {{HTTPMethod("POST")}} 請求時都會回傳相對應的 HTTP 標頭值，因此一個伺服器資源可以處理預檢以及實際（actual）請求。在回應 OPTIONS 預檢請求之回應標頭中，伺服器告知客戶端可以使用 POST 方法發送實際（actual）請求，並且能於實際（actual）請求的 HTTP 標頭欄位中帶上 X-PINGARUNER 及其值。這個範例可以在這裡看到執行的情形。

- -

身分驗證請求

- -

身分驗證存取控制請求——即請求可以附帶 Cookies 或 HTTP 認證（Authentication）訊息（並期望回應攜帶 Cookies）——可以是簡單或預檢請求，根據請求使用之 HTTP 方法而定。

- -

於簡單請求情境中，請求將會連同 Cookies 一起發送（例如當 withCredentials 旗標被設置於 {{domxref("XMLHttpRequest")}} 時）。假如伺服器以附帶了 {{HTTPHeader("Access-Control-Allow-Credentials")}}: true 標頭值的身分驗證回應來回傳，則回應會被客戶端接受並且可被用於網頁內容中。在預檢請求中，伺服器可以用 Access-Control-Allow-Credentials: true 標頭來回應 OPTIONS 預檢請求。

- -

以下為一些處理身分驗證請求的 PHP 程式片段：

- -
<?php
-
-if($_SERVER['REQUEST_METHOD'] == "GET") {
-  header('Access-Control-Allow-Origin: http://arunranga.com');
-  header('Access-Control-Allow-Credentials: true');
-  header('Cache-Control: no-cache');
-  header('Pragma: no-cache');
-  header('Content-Type: text/plain');
-
-  // 檢查有沒有 Cookie，若沒有則當作是第一次訪問
-  if (!isset($_COOKIE["pageAccess"])) {
-    setcookie("pageAccess", 1, time()+2592000);
-    echo 'I do not know you or anyone like you so I am going to';
-    echo 'mark you with a Cookie :-)';
-  } else {
-    $accesses = $_COOKIE['pageAccess'];
-    setcookie('pageAccess', ++$accesses, time()+2592000);
-    echo 'Hello -- I know you or something a lot like you!';
-    echo 'You have been to ', $_SERVER['SERVER_NAME'], ';
-    echo 'at least ', $accesses-1, ' time(s) before!';
-  }
-} elseif($_SERVER['REQUEST_METHOD'] == "OPTIONS") {
-  // 告訴客戶端這個預檢請求的有效期限僅有 20 天
-  if($_SERVER['HTTP_ORIGIN'] == "http://arunranga.com") {
-    header('Access-Control-Allow-Origin: http://arunranga.com');
-    header('Access-Control-Allow-Methods: GET, OPTIONS');
-    header('Access-Control-Allow-Credentials: true');
-    header('Access-Control-Max-Age: 1728000');
-    header("Content-Length: 0");
-    header("Content-Type: text/plain");
-  } else {
-    header("HTTP/1.1 403 Access Forbidden");
-    header("Content-Type: text/plain");
-    echo "You cannot repeat this request";
-  }
-} else {
-  die("This HTTP Resource can ONLY be accessed with GET or OPTIONS");
-}
-?>
-
- -

注意此範例中的身分驗證請求，其中的 Access-Control-Allow-Origin: 標頭值不得是萬用字元（wildcard）「*」。此標頭值必須為一個有效的的來源網域（origin domain）。以上的範例可以在這裡看到執行的情形。

- -

Apache 範例

- -

限制存取某些 URI

- -

一個實用的訣竅是使用 Apache rewrite 環境變數（environment variable），並且讓 HTTP 標頭套用 Access-Control-Allow-* 至某些 URI。這相當有用，例如要限制跨來源（cross-origin）請求 GET /api(.*).json 為不帶身分驗證的請求：

- -
RewriteRule ^/api(.*)\.json$ /api$1.json [CORS=True]
-Header set Access-Control-Allow-Origin "*" env=CORS
-Header set Access-Control-Allow-Methods "GET" env=CORS
-Header set Access-Control-Allow-Credentials "false" env=CORS
-
- -

參見

- - diff --git a/files/zh-tw/web/http/status/418/index.html b/files/zh-tw/web/http/status/418/index.html new file mode 100644 index 0000000000..0f03f77c24 --- /dev/null +++ b/files/zh-tw/web/http/status/418/index.html @@ -0,0 +1,45 @@ +--- +title: 418 I'm a teapot +slug: Web/HTTP/Status/418_I_m_a_teapot +translation_of: Web/HTTP/Status/418 +--- +
{{HTTPSidebar}}
+ +

HTTP 418 I'm a teapot 用戶端錯誤碼表明了伺服器是個（永久性的）茶壺，所以拒絕煮咖啡。一個結合了咖啡與茶壺的壺子暫時沒咖啡的情境，應該回傳 503。這個錯誤是源自於 1998 與 2014 的愚人節玩笑「超文字咖啡壺控制協定」（Hyper Text Coffee Pot Control Protocol）。

+ +

狀態

+ +
418 I'm a teapot
+ +

規範

+ + + + + + + + + + + + + + + + + + +
規範標題
{{RFC("2324", "418 I'm a teapot" , "2.3.2")}}Hyper Text Coffee Pot Control Protocol (HTCPCP/1.0): Semantics and Content
{{RFC("7168", "418 I'm a teapot" , "2.3.3")}}The Hyper Text Coffee Pot Control Protocol for Tea Efflux Appliances (HTCPCP-TEA): Response Codes
+ +

瀏覽器相容性

+ + + +

{{Compat("http.status.418")}}

+ +

參見

+ + diff --git a/files/zh-tw/web/http/status/418_i_m_a_teapot/index.html b/files/zh-tw/web/http/status/418_i_m_a_teapot/index.html deleted file mode 100644 index 0f03f77c24..0000000000 --- a/files/zh-tw/web/http/status/418_i_m_a_teapot/index.html +++ /dev/null @@ -1,45 +0,0 @@ ---- -title: 418 I'm a teapot -slug: Web/HTTP/Status/418_I_m_a_teapot -translation_of: Web/HTTP/Status/418 ---- -
{{HTTPSidebar}}
- -

HTTP 418 I'm a teapot 用戶端錯誤碼表明了伺服器是個（永久性的）茶壺，所以拒絕煮咖啡。一個結合了咖啡與茶壺的壺子暫時沒咖啡的情境，應該回傳 503。這個錯誤是源自於 1998 與 2014 的愚人節玩笑「超文字咖啡壺控制協定」（Hyper Text Coffee Pot Control Protocol）。

- -

狀態

- -
418 I'm a teapot
- -

規範

- - - - - - - - - - - - - - - - - - -
規範標題
{{RFC("2324", "418 I'm a teapot" , "2.3.2")}}Hyper Text Coffee Pot Control Protocol (HTCPCP/1.0): Semantics and Content
{{RFC("7168", "418 I'm a teapot" , "2.3.3")}}The Hyper Text Coffee Pot Control Protocol for Tea Efflux Appliances (HTCPCP-TEA): Response Codes
- -

瀏覽器相容性

- - - -

{{Compat("http.status.418")}}

- -

參見

- - diff --git a/files/zh-tw/web/javascript/introduction_to_object-oriented_javascript/index.html b/files/zh-tw/web/javascript/introduction_to_object-oriented_javascript/index.html deleted file mode 100644 index 292229d00d..0000000000 --- a/files/zh-tw/web/javascript/introduction_to_object-oriented_javascript/index.html +++ /dev/null @@ -1,394 +0,0 @@ ---- -title: JavaScript 物件導向介紹 -slug: Web/JavaScript/Introduction_to_Object-Oriented_JavaScript -tags: - - 中階 - - 命名空間 - - 封裝 - - 建構子 - - 成員 - - 物件 - - 物件導向 - - 物件導向程式設計 -translation_of: Learn/JavaScript/Objects -translation_of_original: Web/JavaScript/Introduction_to_Object-Oriented_JavaScript ---- -
{{jsSidebar("Introductory")}}
- -

深入淺出物件導向，JavaScript 支援強大、彈性的物件導向程式設計 ({{Glossary("OOP")}})。本篇文章會先介紹物件導向程式設計，然後複習 JavaScript 物件模型，最後示範在 JavaScript 物件導向程式設計的概念。本篇文章並不會介紹 在 ECMAScript 6 的物件導向程式設計 的新語法。

- -

複習 JavaScript

- -

若您對 JavaScript 變數、型態、函數及作用範圍的觀念並不是很有信心，您可以閱讀 重新膫解 JavaScript 中相關的主題。您也可以參考 JavaScript 指南。

- -

物件導向程式設計

- -

物件導向程式設計 (Object-oriented programming, OOP) 是一種使用 {{glossary("abstraction")}} 概念表達現實世界的程式設計方式。物件導向程式設計運用數個先前所建立的技術所組成，包含模組化 ({{glossary("modularity")}})、多型 ({{glossary("polymorphism")}}) 以及封裝 ({{glossary("encapsulation")}}) 。直到今天許多主流的程式語言 (如 Java, JavaScript, C#, C++, Python, PHP, Ruby 與 Objective-C) 也都支援物件導向程式設計。

- -

物件導向程式設計是將軟體想像成由一群物件交互合作所組成，而非以往以函數 (Function) 或簡單的指令集交互合作所組成。在物件導向的架構中，每個物件都具有接收訊息，處理資料以及發送訊息給其他物件的能力。每個物件都可視為獨一無二的個體，他們扮演不同的角色並有不同的能力及責任。

- -

物作導向程式設計提出了一個一個更有彈性且易於維護的設計方法，且廣泛被許多大型軟體工程所採用。由於物件導向程式設計強調模組化，因為物件導向的程式碼變的較為容易開發且易於理解。與較少模組化的程式設計技術相比，物件導向的程式碼更能更直接分析、編寫、理解複雜的情況與程序。1

- -

JavaScript 是一個以雛型為基礎 (Prototype-based) 的程式設計語言 (或更準確的說是以雛型為基礎的腳本語言)，它採用了複製的模式而非繼承。以雛型為基礎的程式設計語言是一種物件導向程式設計，使用了函數來當做類別 (Class) 的建構子 (Constructor)，儘管 JavaScript 擁有類別 (Class) 的關鍵字，但它沒有類別敘述，當要拿 JavaScript 與其他物件導向程式語言相比時，這是很重要的區別。

- -

專門用語

- -
-
{{Glossary("Namespace")}}
-
可讓開發人員包裝所有功能到一個獨一無二、特定應用程式名稱的容器。
-
{{Glossary("Class")}}
-
用來定義物件的特徵，類別 (Class) 是物件屬性與方法的藍圖。
-
{{Glossary("Object")}}
-
類別 (Class) 的實際案例。
-
{{Glossary("Property")}}
-
物件 (Object) 的特徵，例如：顏色。
-
{{Glossary("Method")}}
-
物件 (Object) 的功能，例如：行走。它是與類別相關的子程序或函數。
-
{{Glossary("Constructor")}}
-
一個在物件產生時會被呼叫的方法。通常會使用與其所在類別 (Class) 相同的名稱。
-
{{Glossary("Inheritance")}}
-
一個類別 (Class) 可以繼承另一個類別的特徵與功能。
-
{{Glossary("Encapsulation")}}
-
可以將資料與方法包裝在一起使用的技術。
-
{{Glossary("Abstraction")}}
-
結合物件的複雜繼承關係、方法與屬性來充分反映現實的模型。
-
{{Glossary("Polymorphism")}}
-
Poly 指的是 "多" 而 Morphism 指的是 "型"。是指不同的類別可以定義相同的方法或屬性。
-
- -

要了解物件導向程式設計更廣泛的說明，請參考維基百科的  {{interwiki("wikipedia", "Object-oriented programming")}}。

- -

以雛型為基礎 (Prototype-based) 的程式設計

- -

以雛型為基礎的程式設計是一種不使用類別的物件導向程式設計模式，但它是第一個透過修改 (或者擴充) 既有的 prototype 來達到類別的功能並可重複使用 (等同在以類別為基礎的程式語言中的繼承)。 又稱作無類別 (Classless)、雛型導向 (Prototype-oriented) 或以實例為基的程式語言 (Instance-based programming)。

- -

最早 (最典型) 以雛型為基礎的程式語言的典範是由 David Ungar 與 Randall Smith 所開發的 {{interwiki("wikipedia", "Self (programming language)", "Self")}}。近年來無類別 (Class-less) 的程式設計風格越來越流行，並且被 JavaScript, Cecil, NewtonScript, Io, MOO, REBOL, Kevo, Squeak (在使用 Viewer 框架來處理 Morphic 元件時)，還有許多其他程式語言所採用。2

- -

JavaScript 物件導向程式設計

- -

命名空間

- -

命名空間是一個可讓開發人員包裝所有功能到一個獨一無二、特定應用程式名稱的容器。在 JavaScript 中命名空間其實是另一個包含方法、屬性及物件的物件。

- -
-

注意，在 JavaScript 中一般物件與命名空間並無語法上的差異，這於其他許多物件導向的語言並不相同，可能是初學 JavaScript 的程式設計師容易混淆的地方。

-
- -

在 JavaScript 建立一個命名空間背後的概念非常的簡單：建立一個全域的物件，然後將所有的變數、方法及函數設為該物件的屬性。使用命名空間可以減少應用程式中名稱衝突發生的機率，由於每個應用程式的物件皆會是應用程式定義的全域物件的屬性。

- -

讓我們來建立一個叫做 MYAPP 全域物件：

- -
// 全域命名空間
-var MYAPP = MYAPP || {};
- -

在上述程式範例，我們會先檢查 MYAPP 是否已經定義過 (不論是定義在同一檔案或在其他檔案)。若已定義過，便會使用現有的 MYAPP 全域物件，否則會建一個稱作 MYAPP 的空物件來包裝方法、函數、變數及物件。

- -

我們也可以建立子命名空間 (要注意，全域物件必須已事先定義)：

- -
// 子命名空間
-MYAPP.event = {};
- -

以下的程式碼會建立一個命名空間並加入變數、函數以及一個方法：

- -
// 建立一個稱作 MYAPP.commonMethod 的容器來存放常用方法與屬性
-MYAPP.commonMethod = {
-  regExForName: "", // define regex for name validation
-  regExForPhone: "", // define regex for phone no validation
-  validateName: function(name){
-    // Do something with name, you can access regExForName variable
-    // using "this.regExForName"
-  },
-
-  validatePhoneNo: function(phoneNo){
-    // do something with phone number
-  }
-}
-
-// 物件與方法宣告
-MYAPP.event = {
-    addListener: function(el, type, fn) {
-    // code stuff
-    },
-    removeListener: function(el, type, fn) {
-    // code stuff
-    },
-    getEvent: function(e) {
-    // code stuff
-    }
-
-    // 可以加入其他方法與屬性
-}
-
-// 使用 addListener 方法的語法：
-MYAPP.event.addListener("yourel", "type", callback);
- -

標準內建物件

- -

 JavaScript 的核心內建了許多物件，例如有 {{jsxref("Math")}}, {{jsxref("Object")}}, {{jsxref("Array")}} 以及 {{jsxref("String")}}。以下範例將示範如何使用 Math 物件中的 random() 方法來取得一個隨機的數字。

- -
console.log(Math.random());
-
- -
注意：這個例子及之後的例子會假設全域已經有定義名稱為 {{domxref("console.log()")}} 的函數。console.log() 函數並不算是 JavaScript 的一部份，但是有許多瀏覽器會實作這個功能來協助除錯使用。
- -

請參考 JavaScript 參考: 標準內建物件 來取得在 JavaScript 中所有核心物件的清單。

- -

每個在 JavaScript 中的物件均為物件 Object 的實例 (Instance)，因此會繼承其所有的屬性與方法。

- -

自訂物件

- -

類別 (Class)

- -

JavaScript 是以雛形為基礎的程式語言，並沒有像在 C++ 或 Java 中看以到的 class 敘述句，這有時會讓習慣使用有 class 敘述句的程式設計師混淆。JavaScript 使用函數來作為類別 (Class) 的建構子 (Constructor)，要定義一個類別 (Class) 如同定義一個函數 (Function)一樣簡單，以下例子中我們使用空的建構子來定義了一個新的 Person 類別。

- -
var Person = function () {};
-
- -

物件 (Object) - 類別的實例 (Instance)

- -

要建立物件 obj 的新實例，我們可以使用 new obj 敘述句，並將結果 (型態為 obj) 指派 (Assign) 到一個變數方便之後存取。

- -

在先前範例中我們定義了一個名稱為 Person 的類別 (Class)。在以下的例子我們會建立兩個實例 (person1 與 person2)。

- -
var person1 = new Person();
-var person2 = new Person();
-
- -
-

請參考 {{jsxref("Object.create()")}} 來了解建立未初始化實例的實例化新方法。

-
- -

建構子 (Constructor)

- -

建構子會在實例化 (Instantiation) 時被呼叫 (建立物件實例被建立時)。建構子是類別的一個方法，在 JavaScript 中會以函數來當做物件的建構子，因此無須明確的定義建構子方法，而每個在類別中宣告的動作均會在實例化時被執行。

- -

建構子會用來設定物件的屬性 (Property) 或是呼叫要準備讓物件可以使用的方法 (Method)。增加類別的方法及定義會使用另一種語法，在本文稍後會說明。

- -

在以下例之中，類別 Person 的建構子在 Person 實例化時會記錄下一個訊息。

- -
var Person = function () {
-  console.log('instance created');
-};
-
-var person1 = new Person(); // 會記錄 "instance created"
-var person2 = new Person(); // 會記錄 "instance created"
-
- -

屬性 (Property) - 物件的屬性

- -

屬性即為在類別中的變數，每個物件的實例都會有同樣的屬性。屬性會在類別的建構子 (函數) 中設定，所以屬性在每個實例產生時才會產生。

- -

關鍵字 this 可以引用目前的物件，讓您使用在該類別中的其他屬性。存取 (讀寫或寫入) 一個在類別之外的屬性可以用語法：InstanceName.Property，如同在 C++, Java 以及其他語言。 (在類別內會使用語法 this.Property 來取得或設定屬性的數值。)

- -

在以下例子中，我們會在實例化時定義 Person 類別的 firstName 屬性：

- -
var Person = function (firstName) {
-  this.firstName = firstName;
-  console.log('Person instantiated');
-};
-
-var person1 = new Person('Alice'); // 會記錄 "Person instantiated"
-var person2 = new Person('Bob'); // 會記錄 "Person instantiated"
-
-// 顯示物件的 firstName 屬性
-console.log('person1 is ' + person1.firstName); // 會記錄 "person1 is Alice"
-console.log('person2 is ' + person2.firstName); // 會記錄 "person2 is Bob"
-
- -

方法 (Method)

- -

方法即為函數 (也如同函數般定義)，但是依照屬性的邏輯來運作，呼叫一個方法如同存取一個屬性，但您需要在函數名稱後加上 () ，並有可能會有參數。要定義一個方法，只需將函數指定 (Assign) 給類別的 prototype 屬性中一個已命名的屬性，接著，您便可用剛指定的屬性名稱來呼叫該物件的方法。

- -

以下範例中，我們為 Person  類別定義了方法 sayHello() 並使用。

- -
var Person = function (firstName) {
-  this.firstName = firstName;
-};
-
-Person.prototype.sayHello = function() {
-  console.log("Hello, I'm " + this.firstName);
-};
-
-var person1 = new Person("Alice");
-var person2 = new Person("Bob");
-
-// 呼叫 Person sayHello 方法。
-person1.sayHello(); // 會記錄 "Hello, I'm Alice"
-person2.sayHello(); // 會記錄 "Hello, I'm Bob"
-
- -

在 JavaScript 中，方法其實是一般的函數物件 (Function object) 連結到一個物件的屬性，這意謂著您可以在  "物件之外" 呼叫方法。請看以下範例程式碼：

- -
var Person = function (firstName) {
-  this.firstName = firstName;
-};
-
-Person.prototype.sayHello = function() {
-  console.log("Hello, I'm " + this.firstName);
-};
-
-var person1 = new Person("Alice");
-var person2 = new Person("Bob");
-var helloFunction = person1.sayHello;
-
-// 會記錄 "Hello, I'm Alice"
-person1.sayHello();
-
-// 會記錄 "Hello, I'm Bob"
-person2.sayHello();
-
-// 會記錄 "Hello, I'm undefined" (或在 Strict
-// 模式會出現 TypeError)
-helloFunction();
-
-// 會記錄 true
-console.log(helloFunction === person1.sayHello);
-
-// 會記錄 true
-console.log(helloFunction === Person.prototype.sayHello);
-
-// 會記錄 "Hello, I'm Alice"
-helloFunction.call(person1);
- -

如範例中所示，我們讓所有的參考均指向 sayHello 函數 — 一個在 person1、一個在 Person.prototype、另一個在 helloFunction 變數 — 這些均參考相同的函數。在呼叫的過程中 this 的值會根據我們如何呼叫來決定，最常見的地方是：我們取得函數的物件屬性所在，在表示法中呼叫 this — person1.sayHello()— 會設定 this 為我們取得函數的地方 (person1)，這也是 person1.sayHello() 顯示的名稱為 "Alice" 以及 person2.sayHello() 顯示的名稱為 "Bob" 的原因。但如果我們以其他的方式來呼叫，那麼 this 結果將截然不同：在變數中呼叫 this — helloFunction()— 會設定 this 為所在的全域物件 (在瀏覽器即為 window)。由於物件 (可能) 並沒有 firstName 屬性，因此會得到 "Hello, I'm undefined" 這樣的結果 (在 Loose 模式才有這樣的結果，若在 strict mode 則會不同 [會出現錯誤]，為了避免混淆，此處將不會再詳述)。 或者我們可以像最後一個例子使用 call (或 apply) 來明確的設定 this。

- -
注意：請參考 call 及 apply 來取得更多有關 this 的資訊
- -

繼承

- -

繼承是一種用一個或多個類別建立一個特殊版本類別的方式 (JavaScript 僅支援單一繼承)。這個特殊的類別通常稱做子類別，而其引用的類別則通常稱作父類別。在 JavaScript 您可以指定父類別的實例到子類別來做到這件事。在最近的瀏覽器中您也可以使用 Object.create 來實作繼承。

- -
-

注意：JavaScript 不會偵測子類別的 prototype.constructor (請參考 Object.prototype)，所以我們必須手動處理。請參考在 Stackoverflow 的問題 "為什麼一定要設定 prototype 的建構子?"。

-
- -

於以下範例，我們會定義類別 Student 做為 Person 的子類別。然後我們會重新定義 sayHello() 方法然後加入 sayGoodBye() 方法。

- -
// 定義 Person 建構子
-var Person = function(firstName) {
-  this.firstName = firstName;
-};
-
-// 加入兩個方法到 Person.prototype
-Person.prototype.walk = function(){
-  console.log("I am walking!");
-};
-
-Person.prototype.sayHello = function(){
-  console.log("Hello, I'm " + this.firstName);
-};
-
-// 定義 Student 建構子
-function Student(firstName, subject) {
-  // Call the parent constructor, making sure (using call)
-  // that "this" is set correctly during the call
-  Person.call(this, firstName);
-
-  // Initialize our Student-specific properties
-  this.subject = subject;
-}
-
-// 建立 Student.prototype 物件來繼承 Person.prototype。
-// 注意: 在此處經常見的錯誤是使用 "new Person()" 來建立
-// Student.prototype。不正確的原因許多個，尤其是
-// 我們沒有給予 Person 任何 "firstName" 的參數。
-// 呼叫 Person 的正確位置在上方，也就是我們呼叫 Student
-// 的地方。
-Student.prototype = Object.create(Person.prototype); // 詳見以下說明
-
-// 設定 "constructor" 屬性參考 Student
-Student.prototype.constructor = Student;
-
-// 替換 "sayHello" 方法
-Student.prototype.sayHello = function(){
-  console.log("Hello, I'm " + this.firstName + ". I'm studying "
-              + this.subject + ".");
-};
-
-// 加入"sayGoodBye" 方法
-Student.prototype.sayGoodBye = function(){
-  console.log("Goodbye!");
-};
-
-// 範例用法:
-var student1 = new Student("Janet", "Applied Physics");
-student1.sayHello();   // "Hello, I'm Janet. I'm studying Applied Physics."
-student1.walk();       // "I am walking!"
-student1.sayGoodBye(); // "Goodbye!"
-
-// 檢查 instanceof 可正常運作
-console.log(student1 instanceof Person);  // true
-console.log(student1 instanceof Student); // true
-
- -

於 Student.prototype = Object.create(Person.prototype); 一行：在舊版的 JavaScript 引擎沒有 Object.create，可以使用 "polyfill" (又稱 "shim"，請參考以下文章連結) 或使用函數來達到同樣的效果，如：

- -
function createObject(proto) {
-    function ctor() { }
-    ctor.prototype = proto;
-    return new ctor();
-}
-
-// 用法:
-Student.prototype = createObject(Person.prototype);
-
- -
注意： 請參考 Object.create 來了解其功能與舊引擎使用的 shim。
- -

要在不管物件如何實例化的情況下確保 this 指向正確的地方並不簡單，儘管如此，這裡仍有一個簡單的習慣用法讓這件事變的較簡單。

- -
var Person = function(firstName) {
-  if (this instanceof Person) {
-    this.firstName = firstName;
-  } else {
-    return new Person(firstName);
-  }
-}
-
- -

封裝

- -

於上述例子中 Student 並不需要知道 Person 類別的 walk() 方法實作的方式，但仍可以使用該方法，除非我們想要更改該函數，否則 Student 類別並不需要明確的定義該函數。這樣的概念稱就叫作封裝 (Encapsulation)，透過將每個類別的資料與方法包裝成一個單位。

- -

隱藏資訊在其他語言是常見的功能，通當會使用私有 (Private) 與保護 (Protected) 方法/屬性。既使如此，您仍可在 JavaScript 模擬類似的操作，這並不是物件導向程式設計必要的功能。3

- -

抽象化

- -

抽象化是一個機制能讓您將工作問題的目前部份進行建立模型，不論是用繼承 (特殊化) 或是組合的方式。JavaScript 可以透過繼承達到特殊化 (Specialization)，並可讓類別實例成為其他物件的屬性來達到組合 (Composition)。

- -

JavaScript 的 Function 類別繼承 Object 類別 (這示範了模型的特殊化) 而 {{jsxref("Function.prototype")}} 屬性是 {{jsxref("Object")}} 的實例 (這示範了組合)。

- -
var foo = function () {};
-
-// 會記錄 "foo is a Function: true"
-console.log('foo is a Function: ' + (foo instanceof Function));
-
-// 會記錄 "foo.prototype is an Object: true"
-console.log('foo.prototype is an Object: ' + (foo.prototype instanceof Object));
- -

多型

- -

如同所有方法與屬性會定義在 prototype 之中，不同的類別可以定義相同名稱的方法，而這些方法的有效範圍其所在的類別之中，除非兩個類別之間有父子關係 (例如，其中一個類別是繼承另一個類別而來)。

- -

注意

- -

在 JavaScript 並不是只有這些方式可以實作物件導向程式設計，JavaScript 在這方面非常有彈性。另外，在此處示範的方法並沒有使用任何語言特殊技巧，也沒有模仿其他語言的物件理論來實作。

- -

在 JavaScript 也有其他的方式可以做更進階的物件導向程式設計，但已超出本篇簡介的範圍。

- -

參考文獻

- -
    -
  1. Wikipedia - Object-oriented programming
    2. -
  2. Wikipedia - Prototype-based programming
    3. -
  3. Wikipedia - Encapsulation (object-oriented programming)
    4. -
- -

相關資料

- - diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/javascript_\346\246\202\350\246\201/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/javascript_\346\246\202\350\246\201/index.html" deleted file mode 100644 index 9c74f992c9..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/javascript_\346\246\202\350\246\201/index.html" +++ /dev/null @@ -1,43 +0,0 @@ ---- -title: JavaScript 概要 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要 ---- -

 

-

什麼是 JavaScript？

-

JavaScript 是跨平台、物件導向的 Script 語言。JavaScript 是小巧、輕量的語言，以單獨的語言來看 JavaScript 並不是很有用，不過 JavaScript 被設計成易於嵌入至其他產品和應用程式（如 Web 瀏覽器）。在宿主環境裡，JavaScript 可連接至由環境提供的可操控的物件。

-

核心 JavaScript 包含 Array、Date、Math 等等的物件核心組件，以及運算子、控制結構、語法等等的語言元素的核心組件。核心 JavaScript 可藉由追加額外的物件而為各種用途來做擴充，例如︰

- -

藉由 JavaScript 的 LiveConnect 的機能，還可讓 Java 和 JavaScript 的代碼互相通訊。你可以從 JavaScript 生成 Java 物件，並存取他們的公開方法和欄位。也可以從 Java 存取 JavaScript 的物件、屬性、方法。

-

Netscape 發明 JavaScript，且 JavaScript 是初次用於 Netscape 瀏覽器。

-

JavaScript 和 Java

-

JavaScript 和 Java 在某些方面類似，但在很多方面完全不同。JavaScript 語言很像 Java，但沒有 Java 的靜態類型和強固的類型檢查。JavaScript 支援 Java 的表達結構和基本的流程控制結構。

-

相對於 Java 藉由宣告來建構類別的編譯時期系統，JavaScript 支援的執行時期系統，是建立在表示為數值、布林、字串值的少數幾個資料類型。JavaScript 使用以原型為基礎的物件模型，以代替更常見的以類別為基礎的物件模型。以原型為基礎的模型可提供動態繼承，也就是可對個別的物件變更繼承。JavaScript 亦支援無須特別宣告的函數。函數可以是物件的屬性，以寬鬆的類型執行方法。

-

JavaScript 與 Java 相比，是一種在形式上要自由很多的語言。你不必宣告所有的變數、類別或方法。你不必關心方法是不是公開、私有或保護，你也不必實作界面。變數、參數和函數返回的類型都不是明確的類型。

-

Java 是為了快速執行和類型的安全性而設計的一種以類別為基礎的程式語言。類型的安全性的意義，舉例來說，你不能把 Java 的整數類型強制轉換為物件類型，或有意的誤用 Java 的位元碼來存取私有記憶體。Java 的以類別為基礎的模型的意義是程式完全以類別及其方法所組成。Java 的類別階層和強固的類型通常需要緊密結合的物件階層。這些要求使 Java 的程式設計比 JavaScript 編寫要複雜的多。

-

相較之下，JavaScript 繼承了像 HyperTalk、dBASE 那樣的小型動態類型語言的精髓。這些 Script 語言提供工具給更廣大的使用者，因為他們的語法簡單、特殊的內建函數、對物件的建立的要求較少。

- -
JavaScript Java
物件導向。物件的類型之間沒有區別。繼承是透過原型機制達成，屬性和方法可動態的加入至任何物件。 以類別為基礎。物件可細分為類別和實體，所有的繼承是透過類別階層達成。類別和實體不可動態的加入屬性或方法。
不必宣告變數的資料類型（動態類型）。 必須宣告變數的資料類型（靜態類型）。
不可自動的寫入硬碟。 不可自動的寫入硬碟。
-

表 1.1: JavaScript 和 Java 的比較
-
-JavaScript 和 Java 之間的不同的更進一步資訊，參閱 物件模型的細節 章節。

-

JavaScript 和 ECMAScript 規範

-

Netscape 發明 JavaScript，且 JavaScript 最先使用於 Netscape 瀏覽器。然而，Netscape 與 Ecma International - 把資訊和通訊系統標準化的歐洲協會（以前稱為 ECMA - European Computer Manufacturers Association；歐洲電腦製造商協會）合作發表一份以核心 JavaScript 為基礎的國際程式語言的標準化。JavaScript 的標準化版本，稱為ECMAScript，使所有支援標準的應用程式都能有同樣的行為。企業可以使用這份開放的語言標準開發他們的 JavaScript 實作產品。ECMAScript 標準的文件在 ECMA-262 規範中。

-

ECMA-262 標準也受到 ISO（International Organization for Standardization；國際標準化組織）認可成為 ISO-16262。你可以在 Mozilla 網站上找到 ECMA-262 的 PDF 版本。你也可以在 Ecma International 網站 上找到這份標準。ECMAScript 標準並未提到 Document Object Model (DOM)，DOM 是由 World Wide Web Consortium (W3C) 所標準化。DOM 定義了在 Script 中處理 HTML 文件裡的物件的方法。

-

JavaScript 版本和 ECMAScript 修定版之間的關係

-

Netscape 與 Ecma International 緊密合作產生 ECMAScript 規範 (ECMA-262)。下表說明了 JavaScript 版本和 ECMAScript 版本間的關係。

- -
JavaScript 的版本 與 ECMAScript 修定版之間的關係
JavaScript 1.1 ECMA-262 第一版是以 JavaScript 1.1 為基礎。
JavaScript 1.2 在 JavaScript 1.2 釋出時，ECMA-262 尚未完成。JavaScript 1.2 因為以下原因而不完全相容於 ECMA-262 第一版︰
  • Netscape 在 JavaScript 1.2 中開發了未考慮到 ECMA-262 的額外機能。
  • ECMA-262 加入兩個新的機能︰使用 Unicode 來國際化，統一所有平台的行為。JavaScript 1.2 的若干機能，如 Date 物件，依賴於平台，且使用平台規範的行為。

JavaScript 1.3

JavaScript 1.3 完全相容於 ECMA-262 第一版。

JavaScript 1.3 解決了 JavaScript 1.2 和 ECMA-262 的不一致，除了 == 和 != 以外，保留 JavaScript 1.2 所有的額外機能，以符合 ECMA-262。

JavaScript 1.4

JavaScript 1.4 完全相容於 ECMA-262 第一版。

在 JavaScript 1.4 釋出時，ECMAScript 規範的第三版仍尚未完成。
JavaScript 1.5 JavaScript 1.5 完全相容於 ECMA-262 第三版。
-

表 1.2: JavaScript 版本和 ECMAScript 版本

-
附註: ECMA-262 第二版由次要的編修和對第一版規範的錯誤修正所組成。Ecma International 的 TC39 工作群組目前正工作於 ECMAScript 第四版，第四版將會對應下一個  JavaScript 的釋出版 JavaScript 2.0。
-

Core JavaScript 參考 指出哪些語言機能對應於 ECMAScript。

-

JavaScript 將會不斷包含尚未成為 ECMAScript 規範的新機能；JavaScript 在提供額外機能時仍會相容於 ECMAScript。

JavaScript 文件與 ECMAScript 規範

-

ECMAScript 規範是實作 ECMAScript 的必要條件的匯整；如果你想知道 JavaScript 機能 ECMAScript 規範是否支援，規範就會很有用。如果你有意只使用 ECMAScript 支援的機能來編寫 JavaScript 代碼，你會需要檢閱 ECMAScript 規範。

-

ECMAScript 文件不是為了幫助 Script 程式員；應該使用 JavaScript 文件取得有關編寫 Script 的資訊。

-

JavaScript 和 ECMAScript 術語

-

ECMAScript 規範使用的術語和語法對 JavaScript 程式員來說可能會很陌生。儘管在 ECMAScript 裡的語言說明有所不同，語言本身仍然是一樣的。JavaScript 支援所有在 ECMAScript 規範中描述的機能。

-

JavaScript 的文件為 JavaScript 程式員適當的描述語言的表面。例如︰

- -

{{ PreviousNext("Core_JavaScript_1.5_教學:關於", "Core_JavaScript_1.5_教學:值") }}

-

 

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/JavaScript_Overview", "es": "es/Gu\u00eda_JavaScript_1.5/Concepto_de_JavaScript", "fr": "fr/Guide_JavaScript_1.5/Aper\u00e7u_de_JavaScript", "ja": "ja/Core_JavaScript_1.5_Guide/JavaScript_Overview", "ko": "ko/Core_JavaScript_1.5_Guide/JavaScript_Overview", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Przegl\u0105d_JavaScriptu", "zh-cn": "cn/Core_JavaScript_1.5_Guide/JavaScript\u603b\u89c8" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/liveconnect_\346\246\202\350\246\201/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/liveconnect_\346\246\202\350\246\201/index.html" deleted file mode 100644 index 985cfe5989..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/liveconnect_\346\246\202\350\246\201/index.html" +++ /dev/null @@ -1,11 +0,0 @@ ---- -title: LiveConnect 概要 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要 ---- -

 

-

LiveConnect 概要

-

LiveConnect 是應用程式介面的名稱，可提供 JavaScript 呼叫 Java 類別的方法的能力，反之亦然，也可以使用 Java 既有的基礎反向運用。

-
包裝器的運用
JavaScript 向 Java 的通訊
Packages 物件
Java 陣列的運用
包裝和類別的參考
char 類型的參數
在 JavaScript 中處理 Java 的例外
Java 向 JavaScript 的通訊
LiveConnect 類別的使用
資料類型的轉換
從 JavaScript 到 Java 的轉換
從 Java 到 JavaScript 的轉換
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:再談屬性的繼承:沒有多重繼承", "Core_JavaScript_1.5_教學:LiveConnect_概要:包裝器的運用") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/LiveConnect_Overview", "es": "es/Gu\u00eda_JavaScript_1.5/Concepto_general_de_LiveConnect", "ja": "ja/Core_JavaScript_1.5_Guide/LiveConnect_Overview", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Podgl\u0105d_klas_LiveConnect" } ) }}

diff --git a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/unicode/index.html b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/unicode/index.html deleted file mode 100644 index 407d484a34..0000000000 --- a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/unicode/index.html +++ /dev/null @@ -1,33 +0,0 @@ ---- -title: Unicode -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/Unicode -translation_of: Web/JavaScript/Guide/Grammar_and_types -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Unicode ---- -

 

-

Unicode

-

Unicode 是一種全球通用的字元編碼標準，用於交換並顯示主要的書寫語言。Unicode 涵括了美國、歐洲、中東、非洲、印度、亞洲以及太平洋地區的語系，但不包括歷史手稿和專門符號。Unicode 可用於交換、處理並顯示多國語系的文書，除了一般的專門符號和數學符號以外。Unicode 期望能夠解決對於不同國家的字元標準的多國語言處理等國際化問題。但目前並未完整支援所有的現代或古代的文字。

-

Unicode 字元集可以使用所有已知編碼的字元。Unicode 是繼 ASCII（American Standard Code for Information Interchange；美國資訊交換標準碼）字元集之後的字元集模型。Unicode 為每一個字元分配一個數字和名稱。字元編碼規範了字元的識別資訊及其數值（編碼位置），但未指明數值的位元表示法。16 位元數值（編碼值）是以十六進制數並加上前綴 U 來定義的，例如，U+0041 表示 A。這個數值的專用名稱是 LATIN CAPITAL LETTER A。

-

JavaScript 1.3 以前的版本並不支援 Unicode。

-

Unicode 與 ASCII 和 ISO 的相容性

-

Unicode 完全相容於國際標準 ISO/IEC 10646-1; 1993，屬於 ISO 10646 的子集。

-

若干編碼標準（包括 UTF-8、UTF-16、ISO UCS-2）是用來把 Unicode 表示為實際的位元。

-

Unicode 的 UTF-8 編碼可相容於 ASCII 字元，並已有許多程式支援。並且把前 128 個 Unicode 字元對應至 ASCII 字元，而擁有相同的位元組內碼。從 U+0020 到 U+007E 的 Unicode 字元完全等價於從 0x20 到 0x7E 的 ASCII 字元。與 ASCII 不同之處在於，還支援了使用 7 位元字元集的拉丁字母，UTF-8 為各個字元使用 1 到 4 個位元組（原作“octet”，即位元組、8 位元），借此容納數以百萬計的字元。另一種編碼標準，UTF-16，使用 2 個位元組表示 Unicode 字元。藉由 4 位元組的跳脫序列，可讓 UTF-16 表示 Unicode 的全部範圍。ISO UCS-2（Universal Character Set）使用 2 個位元組。

-

JavaScript 和 Navigator 支援 UTF-8/Unicode，意味著你只需在 JavaScript 程式中加上特別的技術，就可以使用非拉丁文、國際性、地域性的文字。Unicode 為多國文字的編碼提供了標準方法。由於 Unicode 的 UTF-8 編碼可相容於 ASCII，程式可以使用 ASCII 字元。你可以在 JavaScript 的註解、字串的字面表達、識別子、正則表達式中使用非 ASCII 的 Unicode 字元。

-

Unicode 的跳脫序列

-

你可以在字串的字面表達、正則表達式、識別子中使用 Unicode 跳脫序列。跳脫序列是由 6 個 ASCII 字元所構成︰\u 和 4 個十六進制數。例如，\u00A9 表示版權符號。在 JavaScript 中，所有的 Unicode 跳脫序列都會被解譯為單一字元。

-

以下代碼返回版權符號和字串 "Netscape Communications"。

-
x="\u00A9 Netscape Communications"
-

下表列出最常用的特殊字元及其 Unicode 值。

- -
分類 Unicode 值 名稱 格式名稱
空白的值 \u0009 Tab <TAB>
  \u000B Vertical Tab <VT>
  \u000C Form Feed <FF>
  \u0020 Space <SP>
行終止的值 \u000A Line Feed <LF>
  \u000D Carriage Return <CR>
額外的 Unicode 跳脫序列的值 \u0008 Backspace <BS>
  \u0009 Horizontal Tab <HT>
  \u0022 Double Quote "
  \u0027 Single Quote '
  \u005C Backslash \
-

表 2.2: 特殊字元的 Unicode 值

-

JavaScript 使用的 Unicode 跳脫序列與 Java 不同。在 JavaScript 中，跳脫序列一開始不會被解譯為特殊字元。例如，字串裡的換行的跳脫序列，在給函數解譯以前，並不會使字串換行。JavaScript 會忽略所有使用在註解裡的跳脫序列。在 Java 中，如果跳脫序列使用在單行註解裡，就會被解譯為 Unicode 字元。對於字串的字面表達而言，Java 編譯器將首先解譯跳脫序列。例如，如果在 Java 中使用換行的跳脫字元（即 \u000A），就會使字串的字面表達換行。這在 Java 中會引起錯誤，因為換行不可以用在字串的字面表達。你必須給字串的字面表達的換行替換成 \n。在 JavaScript 中，也同樣使用 \n 作為跳脫序列。

-

在 JavaScript 檔案裡的 Unicode 字元

-

Gecko 的早期版本假設從 XUL 載入的 JavaScript 檔案使用的是 Latin-1 字元編碼。從 Gecko 1.8 開始，就從 XUL 檔案的編碼來推斷字元編碼。請參閱 在 XUL JavaScript 中的國際化字元 取得進一步資訊。

-

使用 Unicode 顯示字元

-

你可以使用 Unicode 顯示不同語言或專門符號的字元。為使字元正確的顯示，像 Mozilla Firefox 或 Netscape 這類客戶端也需要支援 Unicode。此外，客戶端也必須有可用的 Unicode 字型，客戶端平台也必須支援 Unicode。通常，Unicode 字型並不會顯示所有的 Unicode 字元。部分平台，如 Windows 95，只提供對 Unicode 的一部分支援。

-

要接收非 ASCII 字元的輸入，客戶端需要把傳送進來的輸入視為 Unicode。使用標準的增強式鍵盤，客戶端無法簡單的輸入由 Unicode 支援的額外字元。在某些時候，使用 Unicode 跳脫序列輸入 Unicode 字元是唯一的輸入方法。

-

有關 Unicode 的詳細資訊，參閱 Unicode 首頁 以及 1996 年由 Addison-Wesley 出版的 Unicode Standard, Version 2.0。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:字面表達", "Core_JavaScript_1.5_教學:表達式") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Unicode", "es": "es/Gu\u00eda_JavaScript_1.5/Unicode", "fr": "fr/Guide_JavaScript_1.5/Unicode", "ja": "ja/Core_JavaScript_1.5_Guide/Unicode", "ko": "ko/Core_JavaScript_1.5_Guide/Unicode", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Unicode" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\273\245\351\241\236\345\210\245\347\202\272\345\237\272\347\244\216\347\232\204\350\252\236\350\250\200_vs._\344\273\245\345\216\237\345\236\213\347\202\272\345\237\272\347\244\216\347\232\204\350\252\236\350\250\200/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\273\245\351\241\236\345\210\245\347\202\272\345\237\272\347\244\216\347\232\204\350\252\236\350\250\200_vs._\344\273\245\345\216\237\345\236\213\347\202\272\345\237\272\347\244\216\347\232\204\350\252\236\350\250\200/index.html" deleted file mode 100644 index 45678e3bdb..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\273\245\351\241\236\345\210\245\347\202\272\345\237\272\347\244\216\347\232\204\350\252\236\350\250\200_vs._\344\273\245\345\216\237\345\236\213\347\202\272\345\237\272\347\244\216\347\232\204\350\252\236\350\250\200/index.html" +++ /dev/null @@ -1,28 +0,0 @@ ---- -title: 以類別為基礎的語言 vs. 以原型為基礎的語言 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/以類別為基礎的語言_vs._以原型為基礎的語言 -translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Class-Based_vs._Prototype-Based_Languages ---- -

以類別為基礎的語言 vs. 以原型為基礎的語言

-

以類別為基礎的語言，如 Java 和 C++，是以兩種不同實體的概念為根基︰類別（Class）和實體（Instance）。

- -

以原型為基礎的語言，如 JavaScript，並沒有這些分別︰他簡單到只有物件。以原型為基礎的語言具有原型物件的概念。物件被當作模板來使用，從中取得最初的屬性以提供給新物件。不論是在你建立物件或執行時期的時候，任何物件都可以指定他自己的屬性。此外，任何物件都可以作為其他物件的原型而連繫起來，讓第二個物件共用第一個物件的屬性。

-

類別的定義

-

在以類別為基礎的語言中，你會在獨立的類別定義中定義類別。在這些定義中，你可以指定稱為建構子的特殊方法，用來建立類別的實體。建構子方法可以為實體的屬性指定初始值，並進行在建立時期的其他適當處理。你會使用 new 運算子配合建構子方法來建立類別的實體。

-

JavaScript 遵從類似的模型，但是建構子和其他類別的定義並沒有分別。取而代之，你會定義建構子函數來建立帶有特定初始值的一組屬性和值的物件。任何的 JavaScript 函數都可以用作建構子。你會使用 new 運算子配合建構子函數來建立新的物件。

-

子類別和繼承

-

在以類別為基礎的語言中，你會建立出類別定義整體的類別階層。在類別的定義中，你可以把新的類別指定為另一個既存類別的子類別。這個子類別會繼承親類別所有的屬性，也可以另外加入新的屬性或修改繼承下來的。例如，假定 Employee 類別只含有 name 和 dept 屬性，而 Manager 是 Employee 的子類別，且加入了 reports 屬性。在這個情況下，Manager 類別的實體將具有全部的三個屬性︰name、dept、reports。

-

JavaScript 可讓你把任意的建構子函數和原型物件連結在一起，以此實現繼承。因此，你可以準確的建立出 Employee 和 Manager 的範例，但是你會使用有點不一樣的術語。首先，你會定義 Employee 的建構子函數，指定 name 和 dept 屬性。接著，你會定義 Manager 的建構子函數，指定 reports 屬性。最後，你會把新的 Employee 物件作為原型代入給 Manager 的建構子函數。然後，當你建立新的 Manager 的時候，他就會從 Employee 物件繼承 name 和 dept 屬性。

-

屬性的加入和移除

-

在以類別為基礎的語言中，你通常會在編譯時期建立類別，然後你會在編譯時期或執行時期實體化類別的實體。在你定義了類別以後，你就不能改變類別的屬性的類型或數目。然而在JavaScript 中，你可以在執行時期加入或移除任何物件的屬性。如果你把屬性加入到用作為一整群物件的原型的物件裡，使用同一個原型的物件也會得到新的屬性。

-

不同點的摘要

-

下表給出了這些不同點的簡短摘要。本章的剩餘部分描述了使用 JavaScript 的建構子和原型來建立物件的階層，並和 Java 的做法來做比較。

- -
以類別為基礎 (Java) 以原型為基礎 (JavaScript)
類別和實體這兩者有分別。 所有的物件都是實體。
使用類別定義來定義類別；使用建構子方法來把類別實體化。 使用建構子函數來定義並建立一整群物件。
使用 new 運算子來建立單一的物件。 相同。
使用類別定義來建構物件的階層，用以定義既存類別的子類。 藉由代入，把作為原型的物件和建構子函數連結起來，來建構出物件的階層。
藉由遵從類別鏈來繼承屬性。 藉由遵從原型鏈來繼承屬性。
類別定義指定了類別的所有實體的所有屬性。不能在執行時期動態的加入屬性。 建構子函數或原型指定並初始化了一系列屬性。可以給單獨的物件或一整組物件來動態的加入或移除屬性。
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:迭代器和產生器", "Core_JavaScript_1.5_教學:職員的例子") }}

-
-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Class-Based_vs._Prototype-Based_Languages", "es": "es/Gu\u00eda_JavaScript_1.5/Lenguajes_basados_en_clases_frente_a_basados_en_prototipos", "fr": "fr/Guide_JavaScript_1.5/Langages_bas\u00e9s_sur_les_classes_et_langages_bas\u00e9s_sur_les_prototypes", "ja": "ja/Core_JavaScript_1.5_Guide/Class-Based_vs._Prototype-Based_Languages", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/J\u0119zyki_oparte_na_klasach_vs._oparte_na_prototypach", "zh-cn": "cn/Core_JavaScript_1.5_Guide/Class-Based_vs._Prototype-Based_Languages" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/index.html" deleted file mode 100644 index 9f369cbcac..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/index.html" +++ /dev/null @@ -1,39 +0,0 @@ ---- -title: 例外處理語法 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法 ---- -

例外處理語法

-

你可以使用 throw 語法來拋出例外，並使用 try...catch 語法來處理例外。

-

你也可以使用 try...catch 語法來處理 Java 的例外。參閱 在 JavaScript 中處理 Java 的例外 和 從 JavaScript 向 Java 的通訊 取得資訊。

- -

例外的類型

-

在此列出 JavaScript 中所有可以拋出的物件。不過並非所有的可拋出物件都以同樣方式產生。雖然只是非常普通的拋出數字或字串來表示錯誤，只使用其中幾個特別為某些用途而產生的例外的類型，往往會更加有效率︰

- -
-

{{ PreviousNext("Core_JavaScript_1.5_教學:註解", "Core_JavaScript_1.5_教學:例外處理語法:throw_語法") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/throw_\350\252\236\346\263\225/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/throw_\350\252\236\346\263\225/index.html" deleted file mode 100644 index 83230830e6..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/throw_\350\252\236\346\263\225/index.html" +++ /dev/null @@ -1,34 +0,0 @@ ---- -title: throw 語法 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法 ---- -

throw 語法

-

使用 throw 語法來拋出例外。當你準備要拋出例外時，指定內含想要拋出的值的表達式︰

-
throw expression;
-
-

你可以拋出任何的表達式，而不只是特定類型的表達式。以下代碼拋出各式各樣的例外︰

-
throw "Error2";
-throw 42;
-throw true;
-throw {toString: function() { return "I'm an object!"; } };
-
-
- 附註: 當拋出例外時，還可以指定物件。然後可以在 catch 區塊裡參考物件的屬性。以下範例建立 UserException 類型的物件 myUserException，並使用在拋出語法之中。
-
// 建立類型為 UserException 的物件
-function UserException (message)
-{
-  this.message=message;
-  this.name="UserException";
-}
-
-// 當用來當作字串時（例如，用於錯誤控制台），
-// 就把例外轉換成適當的字串。
-UserException.prototype.toString = function ()
-{
-  return this.name + ': "' + this.message + '"';
-}
-
-// 建立那一種物件類型的實體，並拋出
-throw new UserException("Value too high");
-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/try...catch_\350\252\236\346\263\225/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/try...catch_\350\252\236\346\263\225/index.html" deleted file mode 100644 index 2bc150c6fc..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/try...catch_\350\252\236\346\263\225/index.html" +++ /dev/null @@ -1,162 +0,0 @@ ---- -title: try...catch 語法 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法 ---- -

try...catch 語法

- -

try...catch 語法標記出一整塊需要測試的語句，並指定一個以上的回應方法，萬一有例外拋出時，try...catch 語句就會捕捉。

- -

try...catch 語法由 try 區塊所組成，其中內含一個以上的語句，和零個以上的 catch 區塊，其中內含語句用來指明當例外在 try 區塊裡拋出時要做些什麼。也就是當你希望 try 區塊成功，但如果他不成功時，你會想要把控制權移交給 catch 區塊。如果任何在 try 區塊內部裡的語句（或者在 try 區塊內部呼叫的函數裡）拋出例外，控制權將立即轉移給 catch 區塊。如果沒有例外從 try 區塊裡拋出，就會跳過 catch 區塊。finally 區塊會在 try 或 catch 區塊執行之後才執行，但會在 try...catch 語法後面的語句之前執行。

- -

以下範例使用 try...catch 語法。本範例呼叫函數，這個函數是用來在陣列裡根據傳給函數的值來查詢月份的名稱。如果傳入的值不符合月份的數字 (1-12)，就會拋出值為 InvalidMonthNo 的例外，而且在 catch 區塊裡的語句會把 monthName 變數設定為 unknown。

- -
function getMonthName (mo) {
-    mo=mo-1; // 針對陣列索引調整月份的數字 (1=Jan, 12=Dec)
-    var months=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul",
-          "Aug","Sep","Oct","Nov","Dec");
-    if (months[mo] != null) {
-       return months[mo]
-    } else {
-       throw "InvalidMonthNo"
-    }
-}
-
-try {
-// 需要測試的語句
-    monthName=getMonthName(myMonth) // 可拋出例外的函數
-}
-catch (e) {
-    monthName="unknown"
-    logMyErrors(e) // 把例外物件傳給錯誤處理器
-}
-
- -

catch 區塊

- -

你可以使用單一的 catch 區塊來處理所有在 try 區塊裡可能會產生的例外，或者你也可以使用分離的 catch 區塊，每一個皆各自處理特定的例外類型。

- -

單一 catch 區塊
- 使用單一 try...catch 語法的 catch 區塊針對在 try 區塊裡拋出的所有例外來執行錯誤處理的代碼。

- -

單一的 catch 區塊語句如下︰

- -
catch (catchID) {
-  statements
-}
-
- -

catch 區塊所指定的識別子（前面語句裡的 catchID）持有由 throw 語法所指定的值。你可以使用這個識別子來取得有關於被拋出的例外的資訊。當進入 catch 區塊時，JavaScript 就會建立這個識別子。識別子只能在 catch 區塊的期間內持續作用。catch 區塊執行結束以後，識別子就不再能使用。

- -

舉例來說，以下代碼會拋出例外。當例外出現的時候，控制權就轉移給 catch 區塊。

- -
try {
-   throw "myException" // 產生例外
-}
-catch (e) {
-// 用來處理任何例外的語句
-   logMyErrors(e) // 把例外物件傳給錯誤處理器
-}
-
- -

多重 catch 區塊
- 單一的 try 語句可以對應複數個有前提條件的 catch 區塊，每一個皆可處理特定的例外的類型。於是，當指定的的例外被拋出時，就只會進入適當條件的 catch 區塊。你也可以針對所有未指定的例外，使用選用性的對應所有例外的 catch 區塊來作為語法裡最後一個的 catch 區塊。

- -

舉例來說，以下函數呼叫三個其他的函數（已在別處定義了）來檢驗自己的參數。如果檢驗函數判斷出他所要檢驗的元素是無效的話，他就返回 0，導致呼叫者拋出對應的例外。

- -
function getCustInfo(name, id, email)
-{
-   var n, i, e;
-
-   if (!validate_name(name))
-       throw "InvalidNameException"
-   else
-       n = name;
-       if (!validate_id(id))
-          throw "InvalidIdException"
-       else
-          i = id;
-       if (!validate_email(email))
-          throw "InvalidEmailException"
-       else
-          e = email;
-       cust = (n + " " + i + " " + e);
-       return (cust);
-}
-
- -

有各種條件的 catch 區塊會把控制權安排給適當的例外處理器。

- -
try {
-// 可以拋出三個例外的函數
-   getCustInfo("Lee", 1234, "lee@netscape.com")
-}
-
-catch (e if e == "InvalidNameException") {
-// 針對無效的名稱呼叫處理器
-   bad_name_handler(e)
-}
-
-catch (e if e == "InvalidIdException") {
-// 針對無效的 ID 呼叫處理器
-   bad_id_handler(e)
-}
-
-catch (e if e == "InvalidEmailException") {
-// 針對無效的電子郵件位址呼叫處理器
-   bad_email_handler(e)
-}
-
-catch (e){
-// 不知道該做什麼，就記在日誌裡
-   logError(e)
-}
-
- -

finally 區塊

- -

finally 區塊內含的語句，會在 try 和 catch 區塊執行以後、並在 try...catch 語法後面的語句之前來執行。無論有沒有被拋出的例外，finally 區塊都會執行。如果有被拋出的例外，即使沒有 catch 區塊來處理這些例外，還是會執行 finally 區塊裡的語句。

- -

當出現例外時，你可以使用 finally 區塊來使你的 Script 優美的停止。舉例來說，你可能需要釋放 Script 所佔用的資源。以下範例開啟了檔案，並執行使用這個檔案（伺服端的 JavaScript 可讓你存取檔案）的語句。如果在開啟檔案時有例外被拋出，finally 區塊會在 Script 停止之前把檔案關閉。

- -
openMyFile();
-try {
-   writeMyFile(theData); // 這裡有可能拋出錯誤
-}catch(e){
-   handleError(e); // 如果我們得到錯誤，就處理他
-}finally {
-   closeMyFile(); // 永遠會關閉這項資源
-}
-
- -

try...catch 語法的嵌套

- -

你可以嵌套一個以上的 try...catch 語法。如果有一個內部的 try...catch 語法沒有 catch 區塊，圍住這些 try...catch 語法的 catch 區塊就會被用來比對。

- -

Error 物件的用處

- -

根據錯誤的類型，你有可能使用 “name” 和 “message” 屬性來取得更多明確的訊息。“name” 提供錯誤的一般類別（例如，“DOMException” 或 “Error”），“message” 通常提供更為簡練的訊息，如此就能把錯誤物件轉換為字串來取得訊息。

- -

如果你要拋出你自己的例外，以從這些屬性取得好處（例如，如果你的 catch 區塊不區分你自己的例外和系統的例外的話），你可以使用錯誤建構子。例如︰

- -
function doSomethingErrorProne () {
-   if (ourCodeMakesAMistake()) {
-      throw (new Error('The message'));
-   }
-   else {
-      doSomethingToGetAJavascriptError();
-   }
-}
-....
-try {
-   doSomethingErrorProne();
-}
-catch (e) {
-   alert(e.name);// 警報 'Error'
-   alert(e.message); // 警報 'The message' 或 JavaScript 錯誤訊息
-}
-
- -
-

{{ PreviousNext("Core_JavaScript_1.5_教學:例外處理語法:throw_語法", "Core_JavaScript_1.5_教學:函數的定義") }}

-
diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\200\274/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\200\274/index.html" deleted file mode 100644 index bea630e438..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\200\274/index.html" +++ /dev/null @@ -1,30 +0,0 @@ ---- -title: 值 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/值 -translation_of: Web/JavaScript/Guide/Grammar_and_types -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Values ---- -

 

-

值

-

JavaScript 識別下列值的類型︰

- -

這是相對來說比較小的一組值的類型，也就是資料類型，可讓你的應用程式發揮出有用的功能。整數和實數之間並沒有明顯的區別。在 JavaScript 中也沒有明確的日期資料類型。不過你還是可以使用 Date 物件及其方法來處理日期。物件 和 函數 也是語言的基礎元素。你可以把物件想成已命名的值的容器，而函數是使程式可以執行的處理程序。

-

資料類型的轉換

-

JavaScript 是動態類型的語言。這表示當你宣告變數時，你不必指定變數的資料類型，而且資料類型會在 Script 執行過程中按需要自動的轉換。所以，舉例如下，你可以如下定義變數︰

-
var answer = 42;
-
-

然後，你可以把字串值代入給值，如下︰

-
answer = "Thanks for all the fish...";
-
-

因為 JavaScript 的類型是動態的，這個代入的代碼不會引起錯誤訊息。

-

在含有數值和字串值並介以 + 運算子的表達式中，JavaScript 把數值轉換為字串。例如，考慮下面的語句︰

-
x = "The answer is " + 42 // 返回 "The answer is 42"
-y = 42 + " is the answer" // 返回 "42 is the answer"
-
-

在含有其他運算子的語句裡，JavaScript 不會把數值轉換為字串。例如︰

-
"37" - 7 // 返回 30
-"37" + 7 // 返回 "377"
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:JavaScript_概要", "Core_JavaScript_1.5_教學:變數") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Values", "es": "es/Gu\u00eda_JavaScript_1.5/Valores", "fr": "fr/Guide_JavaScript_1.5/Valeurs", "ja": "ja/Core_JavaScript_1.5_Guide/Values", "ko": "ko/Core_JavaScript_1.5_Guide/Values", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Warto\u015bci", "zh-cn": "cn/Core_JavaScript_1.5_Guide/Values" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html" deleted file mode 100644 index 3bba16f786..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html" +++ /dev/null @@ -1,14 +0,0 @@ ---- -title: 再談屬性的繼承 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承 -translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Property_Inheritance_Revisited ---- -

再談屬性的繼承

-

前面的章節說明了 JavaScript 建構子和原型如何提供階層組織和實體。本節將會討論一些稍早的討論中所看不到的細微差別。

- -
-

{{ PreviousNext("Core_JavaScript_1.5_教學:職員的例子:更靈活的建構子", "Core_JavaScript_1.5_教學:再談屬性的繼承:局域值和繼承值") }}

-
-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited", "es": "es/Gu\u00eda_JavaScript_1.5/M\u00e1s_sobre_la_herencia_de_propiedades", "ja": "ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Powr\u00f3t_dziedziczenia_w\u0142asno\u015bci" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\345\257\246\351\253\224\351\227\234\344\277\202\347\232\204\347\242\272\345\256\232/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\345\257\246\351\253\224\351\227\234\344\277\202\347\232\204\347\242\272\345\256\232/index.html" deleted file mode 100644 index 451fa3036e..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\345\257\246\351\253\224\351\227\234\344\277\202\347\232\204\347\242\272\345\256\232/index.html" +++ /dev/null @@ -1,46 +0,0 @@ ---- -title: 實體關係的確定 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/實體關係的確定 -translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model -translation_of_original: >- - Web/JavaScript/Guide/Obsolete_Pages/Property_Inheritance_Revisited/Determining_Instance_Relationships ---- -

實體關係的確定

-

Javascript 搜尋屬性時，會先從物件內部所擁有的屬性開始，如果找不到屬性的名稱，就會從特殊的物件屬性 __proto__ 內部搜尋。不斷反覆執行；這個過程就稱為〝在原型鏈中搜尋〞。

-

當物件建構完成時，就會設定這個特殊的屬性 __proto__；他會被設成建構子的 prototype 屬性的值。因此，表達式 new Foo() 會以 __proto__ == Foo.prototype 來建立物件。因此，變更 Foo.prototype 的屬性，就會改變所有由 new Foo() 所建立的物件的屬性的搜尋。

-

每一個物件都有 __proto__ 物件屬性（除了 Object 以外）；每一個函數都有 prototype 物件屬性。所以物件可藉由“原型的繼承”與其他物件建立起關係。你可以藉由物件的 __proto__ 與函數的 prototype 物件的比較來對繼承進行測試。JavaScript 也提供了便捷方式︰instanceof 運算子會對照函數以檢測物件，如果這個物件繼承自函數的原型，就返回 true。例如，

-
var f = new Foo();
-var isTrue = (f instanceof Foo);
-

舉個更詳細的例子，假設你有顯示在 屬性的繼承 中的同一組定義。並建立 Engineer 物件如下︰

-
chris = new Engineer("Pigman, Chris", ["jsd"], "fiji");
-
-

對於這個物件，以下語句全部為 true︰

-
chris.__proto__ == Engineer.prototype;
-chris.__proto__.__proto__ == WorkerBee.prototype;
-chris.__proto__.__proto__.__proto__ == Employee.prototype;
-chris.__proto__.__proto__.__proto__.__proto__ == Object.prototype;
-chris.__proto__.__proto__.__proto__.__proto__.__proto__ == null;
-
-

有鑑於此，你可以編寫 instanceOf 函數如下︰

-
function instanceOf(object, constructor) {
-   while (object != null) {
-      if (object == constructor.prototype)
-         return true;
-      object = object.__proto__;
-   }
-   return false;
-}
-
-

根據這個定義，以下語句全部為 true︰

-
instanceOf (chris, Engineer)
-instanceOf (chris, WorkerBee)
-instanceOf (chris, Employee)
-instanceOf (chris, Object)
-
-

但下面的表達式是 false︰

-
instanceOf (chris, SalesPerson)
-
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:再談屬性的繼承:局域值和繼承值", "Core_JavaScript_1.5_教學:再談屬性的繼承:建構子中的全域資訊") }}

-
-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/Determining_Instance_Relationships", "es": "es/Gu\u00eda_JavaScript_1.5/M\u00e1s_sobre_la_herencia_de_propiedades/Determinando_relaciones_de_instancia", "ja": "ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/Determining_Instance_Relationships", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Powr\u00f3t_dziedziczenia_w\u0142asno\u015bci/Okre\u015blanie_wzajemnych_relacji_obiektu" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\345\261\200\345\237\237\345\200\274\345\222\214\347\271\274\346\211\277\345\200\274/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\345\261\200\345\237\237\345\200\274\345\222\214\347\271\274\346\211\277\345\200\274/index.html" deleted file mode 100644 index e042494b71..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\345\261\200\345\237\237\345\200\274\345\222\214\347\271\274\346\211\277\345\200\274/index.html" +++ /dev/null @@ -1,57 +0,0 @@ ---- -title: 局域值和繼承值 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/局域值和繼承值 -translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model -translation_of_original: >- - Web/JavaScript/Guide/Obsolete_Pages/Property_Inheritance_Revisited/Local_versus_Inherited_Values ---- -

局域值和繼承值

-

當你存取物件屬性的時候，JavaScript 會進行這些步驟，如同本章前面所提到過的︰

-
  1. 檢查局域值是否存在。如果存在，就返回局域值。
  2. 如果局域值不存在，就檢查原型鏈（使用 __proto__ 屬性）。
  3. 如果在原型鏈上的物件具有所求的指定屬性，就返回這個屬性的值。
  4. 如果找不到這樣的屬性，這個物件就不具有這個屬性。
    5. -
-

這些步驟之後的結果，取決於你如何循著這個方式來定義。一開始的例子有這些定義︰

-
function Employee () {
-this.name = "";
-this.dept = "general";
-}
-
-function WorkerBee () {
-this.projects = [];
-}
-WorkerBee.prototype = new Employee;
-
-

藉由這些定義，假定你以如下語句建立 amy 作為 WorkerBee 的實體︰

-
amy = new WorkerBee;
-
-

amy 物件具有一個局域的屬性，projects。name 和 dept 屬性的值並不是 amy 的局域值，所以是從 amy 物件的 __proto__ 屬性得來的。因此，amy 具有這些屬性值︰

-
amy.name == "";
-amy.dept == "general";
-amy.projects == [];
-
-

現在假定你在與 Employee 連結的原型改變 name 屬性的值︰

-
Employee.prototype.name = "Unknown"
-
-

乍看之下，你可能會預期新的值會被向下傳播給 Employee 所有的實體。然而，事情並不如此。

-

當你建立 Employee 物件的任何實體，這些實體會取得 name 屬性的局域值（空字串的那個）。這意味著當你使用新建立的 Employee 物件來設定 WorkerBee 原型的時候，WorkerBee.prototype 就具有 name 屬性的局域值。因此，當 JavaScript 找到 amy 物件（WorkerBee 的實體）的 name 屬性的時候，JavaScript 在 WorkerBee.prototype 找到了這些屬性的局域值。也因此並不會進一步在鏈的上一層 Employee.prototype 裡尋找。

-

如果你想要在執行時期改變物件屬性的值，而且希望新的值能被這個物件的所有子孫所繼承，你就不能在物件的建構子函數中定義這個屬性。相對的，你要把這個屬性加入到與建構子相連結的原型。例如，假定你修改前面的代碼如下︰

-
function Employee () {
-   this.dept = "general";
-}
-Employee.prototype.name = "";
-
-function WorkerBee () {
-this.projects = [];
-}
-WorkerBee.prototype = new Employee;
-
-amy = new WorkerBee;
-
-Employee.prototype.name = "Unknown";
-
-

在這個情況下，amy 的 name 屬性就會變成 "Unknown"。

-

如同這些範例所示，如果你希望物件的屬性有預設值，而且還希望能夠在執行時期修改這些預設值，你就應該在建構子的原型中設定這些屬性，而不是在建構子函數本身。

-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:再談屬性的繼承", "Core_JavaScript_1.5_教學:再談屬性的繼承:實體關係的確定") }}

-
- -

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/Local_versus_Inherited_Values", "es": "es/Gu\u00eda_JavaScript_1.5/M\u00e1s_sobre_la_herencia_de_propiedades/Valores_locales_frente_a_los_heredados", "ja": "ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/Local_versus_Inherited_Values", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Powr\u00f3t_dziedziczenia_w\u0142asno\u015bci/Warto\u015bci_lokalne_vs._dziedziczone" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\345\273\272\346\247\213\345\255\220\344\270\255\347\232\204\345\205\250\345\237\237\350\263\207\350\250\212/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\345\273\272\346\247\213\345\255\220\344\270\255\347\232\204\345\205\250\345\237\237\350\263\207\350\250\212/index.html" deleted file mode 100644 index cece6b5a66..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\345\273\272\346\247\213\345\255\220\344\270\255\347\232\204\345\205\250\345\237\237\350\263\207\350\250\212/index.html" +++ /dev/null @@ -1,58 +0,0 @@ ---- -title: 建構子中的全域資訊 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/建構子中的全域資訊 -translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model -translation_of_original: >- - Web/JavaScript/Guide/Obsolete_Pages/Property_Inheritance_Revisited/Global_Information_in_Constructors ---- -

建構子中的全域資訊

-

當你建立建構子的時候，如果你在建構子中設定全域資訊，需要很小心。例如，假定你想要自動的給每一個新的職員指定一個專有的 ID。你可以給 Employee 使用下面的定義︰

-
var idCounter = 1;
-
-function Employee (name, dept) {
-   this.name = name || "";
-   this.dept = dept || "general";
-   this.id = idCounter++;
-}
-
-

根據這個定義，當你建立新的 Employee 的時候，建構子會依序把下一個 ID 指定給他，然後增加全域 ID 的計數器。因此，如果你的下一條語句如下，victoria.id 為 1，且 harry.id 為 2︰

-
victoria = new Employee("Pigbert, Victoria", "pubs")
-harry = new Employee("Tschopik, Harry", "sales")
-
-

乍看之下很好。然而，idCounter 會在每一次建立 Employee 物件的時候遞增，而不問用途。如果你建立顯示在本章中的整個 Employee 階層結構，Employee 建構子會在你每一次設定原型的時候被呼叫。假設你有下面的代碼︰

-
var idCounter = 1;
-
-function Employee (name, dept) {
-   this.name = name || "";
-   this.dept = dept || "general";
-   this.id = idCounter++;
-}
-
-function Manager (name, dept, reports) {...}
-Manager.prototype = new Employee;
-
-function WorkerBee (name, dept, projs) {...}
-WorkerBee.prototype = new Employee;
-
-function Engineer (name, projs, mach) {...}
-Engineer.prototype = new WorkerBee;
-
-function SalesPerson (name, projs, quota) {...}
-SalesPerson.prototype = new WorkerBee;
-
-mac = new Engineer("Wood, Mac");
-
-

在此略過 base 屬性的定義，並呼叫原型鏈中在他們之上的建構子。在這個情況下，等到 mac 物件被建立的時候，mac.id 是 5。

-

根據應用程式而定，計數器遞增了額外的次數，這也許重要，也許不重要。如果你很在意計數器額外的數值，有一個可能的解決方案是改用下面的建構子來代替︰

-
function Employee (name, dept) {
-   this.name = name || "";
-   this.dept = dept || "general";
-   if (name)
-      this.id = idCounter++;
-}
-
-

當你建立用作為原型的 Employee 實體時候，你並不需要提供參數給建構子。使用這個定義的建構子，當你並未提供參數時，建構子並不會把值代入給 id，也不會更新計數器。因此，若要 Employee 取得指定的 id，你就必須為職員指定名稱。在這個範例中，mac.id 將會是 1。

-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:再談屬性的繼承:實體關係的確定", "Core_JavaScript_1.5_教學:再談屬性的繼承:沒有多重繼承") }}

-
-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/Global_Information_in_Constructors", "es": "es/Gu\u00eda_JavaScript_1.5/M\u00e1s_sobre_la_herencia_de_propiedades/Informaci\u00f3n_global_en_los_constructores", "ja": "ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/Global_Information_in_Constructors", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Powr\u00f3t_dziedziczenia_w\u0142asno\u015bci/Globalne_informacje_w_konstruktorach" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\346\262\222\346\234\211\345\244\232\351\207\215\347\271\274\346\211\277/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\346\262\222\346\234\211\345\244\232\351\207\215\347\271\274\346\211\277/index.html" deleted file mode 100644 index b787de8dd0..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\206\215\350\253\207\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/\346\262\222\346\234\211\345\244\232\351\207\215\347\271\274\346\211\277/index.html" +++ /dev/null @@ -1,42 +0,0 @@ ---- -title: 沒有多重繼承 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/沒有多重繼承 -translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model -translation_of_original: >- - Web/JavaScript/Guide/Obsolete_Pages/Property_Inheritance_Revisited/No_Multiple_Inheritance ---- -

沒有多重繼承

-

部分物件導向語言允許多重繼承。也就是說，物件可以從互不相關的親物件繼承屬性和值。不過 JavaScript 並不支援多重繼承。

-

屬性值的繼承發生在執行時期，由 JavaScript 搜尋物件的原型鏈以找出繼承值。由於物件只有單一的已連結原型，因此 JavaScript 並不能從多於一個以上的原型鏈中動態的繼承。

-

在 JavaScript 中，建構子函數的內部可以有很多個其他的建構子函數的呼叫。如此可提供多重繼承的假象。例如，思考下面的語句︰

-
function Hobbyist (hobby) {
-   this.hobby = hobby || "scuba";
-}
-
-function Engineer (name, projs, mach, hobby) {
-   this.base1 = WorkerBee;
-   this.base1(name, "engineering", projs);
-   this.base2 = Hobbyist;
-   this.base2(hobby);
-   this.machine = mach || "";
-}
-Engineer.prototype = new WorkerBee;
-
-dennis = new Engineer("Doe, Dennis", ["collabra"], "hugo")
-
-

接著假定 WorkerBee 的定義使用的是本章先前的內容。在這個情況下，dennis 物件就有了這些屬性︰

-
dennis.name == "Doe, Dennis"
-dennis.dept == "engineering"
-dennis.projects == ["collabra"]
-dennis.machine == "hugo"
-dennis.hobby == "scuba"
-
-

所以 dennis 從 Hobbyist 建構子中得到了 hobby 的屬性。然而，假定你稍後把新的屬性加入到 Hobbyist 建構子的原型︰

-
Hobbyist.prototype.equipment = ["mask", "fins", "regulator", "bcd"]
-
-

dennis 物件並未繼承到這個新的屬性。

-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:再談屬性的繼承:建構子中的全域資訊", "Core_JavaScript_1.5_教學:LiveConnect_概要") }}

-
- -

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/No_Multiple_Inheritance", "es": "es/Gu\u00eda_JavaScript_1.5/M\u00e1s_sobre_la_herencia_de_propiedades/Herencia_no_m\u00faltiple", "ja": "ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited/No_Multiple_Inheritance", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Powr\u00f3t_dziedziczenia_w\u0142asno\u015bci/Brak_wielokrotnego_dziedziczenia" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\221\274\345\217\253/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\221\274\345\217\253/index.html" deleted file mode 100644 index 8999a04084..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\221\274\345\217\253/index.html" +++ /dev/null @@ -1,34 +0,0 @@ ---- -title: 函數的呼叫 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的呼叫 -translation_of: Web/JavaScript/Guide/Functions -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Calling_Functions ---- -

 

-
-

函數的呼叫

-

定義函數並不會執行函數。函數的定義只是簡單的給函數命名，並指定當函數被呼叫的時候要做些什麼。函數的呼叫會以指定的參數真正的執行指定的動作。例如，如果你定義了函數 square，你可以如下呼叫。

-
square(5)
-
-

上面的語句以 5 為參數呼叫函數。函數執行他的語句，並返回 25 的值。

-

函數的參數並不限於字串和數字。你也可以傳遞一整個物件給函數。show_props 函數（定義在 物件和屬性）即是接收一個物件作為參數的函數的範例。

-

函數甚至可以遞歸循環，也就是他可以呼叫他自己。例如，這裡有個計算階乘的函數︰

-
function factorial(n) {
-   if ((n == 0) || (n == 1))
-      return 1;
-   else {
-      var result = (n * factorial(n-1) );
-      return result;
-   }
-}
-
-

你可以計算一到五的階乘如下︰

-
a=factorial(1); // 返回 1
-b=factorial(2); // 返回 2
-c=factorial(3); // 返回 6
-d=factorial(4); // 返回 24
-e=factorial(5); // 返回 120
-
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:函數的定義", "Core_JavaScript_1.5_教學:arguments_物件的使用") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Calling_Functions", "fr": "fr/Guide_JavaScript_1.5/Appel_de_fonctions", "ja": "ja/Core_JavaScript_1.5_Guide/Calling_Functions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Wywo\u0142anie_funkcji" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\256\232\347\276\251/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\256\232\347\276\251/index.html" deleted file mode 100644 index f56f796a03..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\256\232\347\276\251/index.html" +++ /dev/null @@ -1,42 +0,0 @@ ---- -title: 函數的定義 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義 ---- -

函數的定義

函數的定義由以下的關鍵字所組成︰

簡單的範例

舉例來說，以下代碼定義了一個簡單的函數，名為 square︰

function square(number) {
-  return number * number;
-}
-

函數 square 接收一個參數，稱為 number。函數由一個語句所組成，指示要求返回函數的參數的平方。return 語句用來指定函數返回的值。

return number * number
-

原始的參數是以值傳遞給函數。值是傳遞給函數，但是如果函數修改了參數的值，這項改變不會影響到全域或呼叫端函數裡的值。

如果你以物件（例如，非原始值，如陣列或使用者定義的物件）作為參數來傳遞，物件的參考會被傳遞給函數。這意味著如果函數修改了物件的屬性，函數之外也看得見這項改變，如以下範例所示︰

function myFunc(theObject) {
-  theObject.make="Toyota";
-}
-var mycar = {make:"Honda", model:"Accord", year:1998};
-var x=mycar.make;     // 返回 Honda
-myFunc(mycar);
-var y=mycar.make;     // 返回 Toyota（屬性已被函數修改）
-

注意，把新的物件代入給參數，在呼叫端將不會有任何的影響︰

function myFunc(theObject) {
-  theObject = {make:"Ford", model:"Focus", year:2006};
-}
-var mycar = {make:"Honda", model:"Accord", year:1998};
-var x=mycar.make;     // 返回 Honda
-myFunc(mycar);
-var y=mycar.make;     // 仍然返回 Honda
-

有條件的函數的定義

函數可以根據條件來作定義。例如，給以下的函數定義︰

if (num == 0)
-{
-  function myFunc(theObject) {
-    theObject.make="Toyota"
-  }
-}
-

myFunc 函數只會在變數 num 等於 0 時被定義。如果 num 不等於 0，函數就不會被定義，且任何企圖執行這個函數的嘗試都將會失敗。

函數的表達式

函數也可以在表達式裡來作定義。這稱為函數表達式。一般這類函數都是無名的，他沒有名稱也沒關係。例如，函數 square 可以定義成︰

var square = function(number) {return number * number};
-

當要傳遞函數作為參數給另一個函數時，這個作法會很方便。以下範例示範了 map 函數的定義，然後呼叫端使用無名函數作為第一個參數︰

function map(f,a) {
-  var result=new Array;
-  for (var i = 0; i != a.length; i++)
-    result[i] = f(a[i]);
-  return result;
-}
-

接著呼叫

map(function(x) {return x * x * x}, [0, 1, 2, 5, 10]);
-

返回 {{ mediawiki.external('0, 1, 8, 125, 1000') }}。

-
-

參閱

-

除了如前所述定義函數以外，你也可以定義 函數物件。

-

方法就是和物件相關聯的函數。你將會在 第 8 章，「物件的運用」 中學到更多有關於物件和方法。{{ PreviousNext("Core_JavaScript_1.5_教學:例外處理語法:try...catch_語法", "Core_JavaScript_1.5_教學:函數的呼叫") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Defining_Functions", "fr": "fr/Guide_JavaScript_1.5/D\u00e9finition_de_fonctions", "ja": "ja/Core_JavaScript_1.5_Guide/Defining_Functions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Definiowanie_funkcji" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\215\200\345\241\212\350\252\236\346\263\225/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\215\200\345\241\212\350\252\236\346\263\225/index.html" deleted file mode 100644 index 24484bb5b3..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\215\200\345\241\212\350\252\236\346\263\225/index.html" +++ /dev/null @@ -1,34 +0,0 @@ ---- -title: 區塊語法 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊語法 -translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Block_Statement ---- -

區塊語法

-

區塊語法用於把語句群組化。區塊的範圍是由一對大括號所界定︰

-
{
-   statement_1
-   statement_2
-   .
-   .
-   .
-   statement_n
-}
-
-

範例
區塊語法通常和流程控制語法（例如 if、for、while）一併使用。

-
while (x < 10) {
-   x++;
-}
-
-

此處，{ x++; } 就是區塊語法。

-

重要: JavaScript 並沒有 區塊作用域。區塊裡的變數其作用域相當於函數或 Script，對變數的設定會一直持續到區塊本身之外。換言之，區塊語法並沒有作用域。儘管“單獨”的區塊仍是有效的句法，你也不會想要在 JavaScript 中使用單獨的區塊，因為這樣做並不會產生任何你所期待的機能，譬如說如果你期待類似 C 或 Java 而這樣做的話。例如︰

-
var x = 1;
-{
-   var x = 2;
-}
-alert(x); // 輸出 2
-
-

這樣會輸出 2，因為在區塊之內的 var x 語法，其作用域如同沒有區塊的 var x 語法。而在 C 或 Java 中，同樣的代碼將會輸出 1。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:正規表達式的運用:正規表達式的範例", "Core_JavaScript_1.5_教學:條件語法") }}

-
-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Block_Statement", "fr": "fr/Guide_JavaScript_1.5/D\u00e9claration_de_blocs", "ja": "ja/Core_JavaScript_1.5_Guide/Block_Statement", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Blok_instrukcji" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\255\227\351\235\242\350\241\250\351\201\224/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\255\227\351\235\242\350\241\250\351\201\224/index.html" deleted file mode 100644 index 0c66b79359..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\255\227\351\235\242\350\241\250\351\201\224/index.html" +++ /dev/null @@ -1,118 +0,0 @@ ---- -title: 字面表達 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/字面表達 -translation_of: Web/JavaScript/Guide/Grammar_and_types -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Literals ---- -

 

-

字面表達

-

你在 JavaScript 使用字面表達來表示值。這是由你在 Script 中直接寫下的固定值，這些不是變數。本節說明下列各類型的字面表達︰

- -

陣列的字面表達

-

陣列的字面表達是以零個以上的表達式所構成的列表，列表的每一項代表陣列的元素，以方括號 ([]) 包夾。當你使用陣列的字面表達建立陣列時，陣列會以指定的值作為元素來初始化，也會以指定的參數個數來設定陣列的長度。

-

以下範例以三個元素和長度建立 coffees 陣列︰

-
var coffees = ["French Roast", "Colombian", "Kona"];
-
-

附註: 陣列的字面表達是物件初始化子的一種類型。參閱 物件初始化子的使用。

-

如果在頂層 Script 裡使用字面表達建立陣列，每一次對含有陣列的字面表達的表達式求值時，JavaScript 就會解譯這些陣列。此外，每一次呼叫函數時，在函數中使用的字面表達就會被建立。

-

陣列的字面表達也是 Array 物件。參閱 Array 物件 取得有關 Array 物件的細節。

-

陣列的字面表達的額外的逗號

-

你不必在陣列的字面表達中指定所有的元素。如果你放上兩個連續的逗號，就會為未指定的元素預留空間來建立陣列。以下範例建立 fish 陣列︰

-
var fish = ["Lion", , "Angel"];
-
-

這個陣列含有兩個附有值的元素和一個空的元素（fish{{ mediawiki.external(0) }} 是“Lion”，fish{{ mediawiki.external(1) }} 是 undefined，fish{{ mediawiki.external(2) }} 是“Angel”）。

-

如果你在元表列表的尾部附帶逗號，這個逗號會被忽略。在下面的範例中，陣列的長度是 3，這裡不存在 myList{{ mediawiki.external(3) }}。所在位於列表裡面的逗號指的都是新的元素。

-
var myList = ['home', , 'school', ];
-
-

在下面的範例中，陣列的長度是 4，myList{{ mediawiki.external(0) }} 和 myList{{ mediawiki.external(2) }} 是空的。

-
var myList = [ , 'home', , 'school'];
-
-

在下面的範例中，陣列的長度是 4，myList{{ mediawiki.external(1) }} 和 myList{{ mediawiki.external(3) }} 是空的。只有最後面的逗號被忽略。

-
var myList = ['home', , 'school', , ];
-

布林的字面表達

-

布林類型有兩種字面表達︰true 和 false。

-

別被原始布林值的 true、false 和 Boolean 物件的 true、false 的值混淆了。Boolean 物件是以原始布林資料類型包裝起來的。參閱 Boolean 物件 取得更多資訊。

整數

-

整數可以表示為十進制、十六進制、八進制。十進制整數的字面表達由一系列不以 0 開頭的數字組成。以 0 開頭的整數的字面表達表示他是八進制，以 0x（或 0X）開頭表示十六進制。十六進制整數可以包含數字 (0-9) 和 a-f 和 A-F 的字母。八進制整數只可以包含 0-7 的數字。

-

八進制整數的字面表達在 ECMA-262 第三版的標準中已不被推薦。JavaScript 1.5 為了向後相容，仍然繼續支援。

-

整數的字面表達的一些範例︰

-
0、117、-345（十進制）
-015、0001、-077（八進制）
-0x1123、0x00111、-0xF1A7（十六進制）
-
-

浮點數的字面表達

-

浮點數的字面表達可分為以下部分︰

- -

指數部分是以一個“e”或“E”後接數字所組成，可帶正負符號（在前面加上“+”或“-”）。浮點數的字面表達至少必須要有一個數字和一個小數點或“e”（或“E”）。

-

浮點數的字面表達的一些範例有 3.1415、-3.1E12、.1e12、2E-12。

-

表示成更精簡的語法結構是︰

-
[digits][.digits][(E|e)[(+|-)]digits]
-
-

例如︰

-
3.14
-2345.789
-.3333333333333333333
-
-

物件的字面表達

-

物件的字面表達是以零個以上的 屬性名稱-關聯值 的配對所構成，以花括號 ({}) 包夾。你不應該在語句的開始處使用物件的字面表達。這會導致錯誤，或出現非預期的行為，因為 { 會被解譯成區塊的開始處。

-

以下是物件的字面表達的範例。car 物件的第一個元素定義了 myCar 屬性；第二個元素，getCar 屬性，含有函數 (CarTypes("Honda"));；第三個元素，special 屬性，使用了現存的變數（Sales）。

-
var Sales = "Toyota";
-
-function CarTypes(name) {
-  if (name == "Honda")
-     return name;
-  else
-     return "Sorry, we don't sell " + name + ".";
-}
-
-var car = { myCar: "Saturn", getCar: CarTypes("Honda"), special: Sales };
-
-document.write(car.myCar);   // Saturn
-document.write(car.getCar);  // Honda
-document.write(car.special); // Toyota
-
-

此外，你可以使用數值或字串的字面表達作為屬性的名稱，或者嵌入其他的物件。以下是上述的範例。

-
var car = { manyCars: {a: "Saab", b: "Jeep"}, 7: "Mazda" };
-
-document.write(car.manyCars.b); // Jeep
-document.write(car[7]); // Mazda
-
-

請注意︰

-
var foo = {a: "alpha", 2: "two"};
-document.write(foo.a);    // alpha
-document.write(foo[2]);   // two
-//document.write(foo.2);  // 錯誤: 參數列表後面少了 )
-//document.write(foo[a]); // 錯誤: a 尚未定義
-document.write(foo["a"]); // alpha
-document.write(foo["2"]); // two
-

字串的字面表達

-

字串的字面表達是以零個以上的字元所構成，並以雙引號 (") 或單引號 (') 包夾。字串必須以相同的引號包夾，也就是成對的單、雙引號。以下是字串的字面表達的範例︰

- -

你可以在字串的字面表達的值上呼叫 String 物件的所有方法—JavaScript 會自動的把字串的字面表達轉換成臨時的 String 物件，呼叫方法，然後丟棄臨時的 String 物件。你也可以使用 String.length 屬性︰

- -

除非你特別使用 String 物件，否則就應該使用字串的字面表達。參閱 String 物件 取得有關 String 物件的細節。

-
在字串中使用特殊字元
-

除了普通的字元以外，你也可以在字串中包含特殊字元，如下範例︰

-
"one line \n another line"
-
-

下表列出了你可以使用於 JavaScript 字串中的特殊字元。

- -
字元 意義
\b 後退一格
\f 換頁
\n 換行
\r 歸位
\t Tab
\v 垂直 Tab
\' 單引號
\" 雙引號
\\ 反斜線 (\)。
\XXX 使用介於 0 至 377 之間的三個八進制數 XXX 來表示以 Latin-1 編碼的字元。例如，\251 是版權符號的八進制內碼序列。
\xXX 使用介於 00 至 FF 之間的兩個十六進制數 XX 來表示以 Latin-1 編碼的字元。例如，\xA9 是版權符號的十六進制內碼序列。
\uXXXX 使用四個十六進制數 XXXX 來表示 Unicode 字元。例如，\u00A9 是版權符號的 Unicode 內碼序列。參閱 Unicode 的跳脫序列。
-

表 2.1: JavaScript 的特殊字元

-
字元的跳脫
-

對於未列在表 2.1 的字元，加在前面的反斜線將會被忽略，但是這個作法已被建議廢除，應該要避免。

-

你可以在字串裡面的引號前面插入反斜線。這就是引號的跳脫。例如︰

-
var quote = "He read \"The Cremation of Sam McGee\" by R.W. Service.";
-document.write(quote);
-
-

結果會是︰

-
He read "The Cremation of Sam McGee" by R.W. Service.
-
-

要在字串裡包含反斜線，你必須跳脫反斜線字元。例如，要把檔案路徑 c:\temp 代入成字串，方法如下︰

-
var home = "c:\\temp";
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:常數", "Core_JavaScript_1.5_教學:Unicode") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Literals", "es": "es/Gu\u00eda_JavaScript_1.5/Literales", "fr": "fr/Guide_JavaScript_1.5/Constantes_litt\u00e9rales", "ja": "ja/Core_JavaScript_1.5_Guide/Literals", "ko": "ko/Core_JavaScript_1.5_Guide/Literals", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Litera\u0142y", "zh-cn": "cn/Core_JavaScript_1.5_Guide/\u6587\u672c\u5316" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\270\270\346\225\270/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\270\270\346\225\270/index.html" deleted file mode 100644 index 9eedc7a21a..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\270\270\346\225\270/index.html" +++ /dev/null @@ -1,28 +0,0 @@ ---- -title: 常數 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/常數 -translation_of: Web/JavaScript/Guide/Grammar_and_types -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Constants ---- -

 

-

常數

-

你可以使用 const 關鍵字建立唯讀的常數。常數識別子的語法和變數識別子的相同︰以字母或底線開頭，可以包含字母、數值、底線字元。

-
const prefix = '212';
-
-

在 Script 執行時，常數不可以藉由代入或重新宣告來改變值。

-

常數的作用域規則和變數一樣，除了 const 關鍵字即使是全域常數也一直是必要的。如果省略了關鍵字，識別子就會被認定為變數。

-

你不可以在同一個作用域裡，使用和函數或變數的同樣的名稱來宣告常數。例如︰

-
// 這會引起錯誤
-function f() {};
-const f = 5;
-
-// 這也會引起錯誤
-function f() {
-  const g = 5;
-  var g;
-
-  //其他語句
-}
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:變數", "Core_JavaScript_1.5_教學:字面表達") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Constants", "es": "es/Gu\u00eda_JavaScript_1.5/Constantes", "fr": "fr/Guide_JavaScript_1.5/Constantes", "ja": "ja/Core_JavaScript_1.5_Guide/Constants", "ko": "ko/Core_JavaScript_1.5_Guide/Constants", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Sta\u0142e" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\273\272\347\253\213\346\226\260\347\232\204\347\211\251\344\273\266/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\273\272\347\253\213\346\226\260\347\232\204\347\211\251\344\273\266/index.html" deleted file mode 100644 index faadc10f07..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\273\272\347\253\213\346\226\260\347\232\204\347\211\251\344\273\266/index.html" +++ /dev/null @@ -1,9 +0,0 @@ ---- -title: 建立新的物件 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件 ---- -

 

- -

This page was auto-generated because a user created a sub-page to this page.

- -

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/break_\350\252\236\346\263\225/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/break_\350\252\236\346\263\225/index.html" deleted file mode 100644 index ea6551a851..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/break_\350\252\236\346\263\225/index.html" +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: break 語法 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法 ---- -

break 語法

-

使用 break 語法可以終止 loop、switch、label 語法。

- -

break 語法如下︰

-
    -
  1. break;
    2. -
  2. break label;
    3. -
-

第一個語句形式會終止最內層的循環或 switch，第二個語句形式會終止指定標籤的語句。

-

範例
- 在以下的範例中，反覆操作陣列裡的元素，直到找到某個索引的元素的值等於 theValue︰

-
for (i = 0; i < a.length; i++) {
-   if (a[i] == theValue)
-      break;
-}
-
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:循環語法:label_語法", "Core_JavaScript_1.5_教學:循環語法:continue_語法") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/continue_\350\252\236\346\263\225/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/continue_\350\252\236\346\263\225/index.html" deleted file mode 100644 index 68f757d572..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/continue_\350\252\236\346\263\225/index.html" +++ /dev/null @@ -1,49 +0,0 @@ ---- -title: continue 語法 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法 ---- -

continue 語法

-

continue 語法可用來重新開始 while、do-while、for、label 語法。

- -

continue 語法如下︰

-
    -
  1. continue
    2. -
  2. continue label
    3. -
-

範例 1
- 以下範例示範加上 continue 語法的 while 循環，continue 語法會在 i 值為 3 時執行。因此，n 的值依序為 1、3、7、12。

-
i = 0;
-n = 0;
-while (i < 5) {
-   i++;
-   if (i == 3)
-      continue;
-   n += i;
-}
-
-

範例 2
- 已加上標籤的語法 checkiandj 內含已加上標籤的語法 checkj。如果遇到 continue，程式會終止 checkj 這一次的反覆過程，並開始下一次的反覆過程。每當遇到 continue，就會反覆執行 checkj 直到他的條件返回 false 為止。當返回 false 時，checkiandj 語句完成了餘數的計算，且 checkiandj 會反覆執行，直到他的條件返回為 false 為止。當返回 false 時，程式繼續執行 checkiandj 後面的語句。

-

如果 continue 有一個 checkiandj 標籤，程式就會從 checkiandj 語句的開始處繼續執行。

-
checkiandj :
-   while (i < 4) {
-      document.write(i + "<br/>");
-      i += 1;
-      checkj :
-         while (j > 4) {
-            document.write(j + "<br/>");
-            j -= 1;
-            if ((j % 2) == 0)
-               continue checkj;
-            document.write(j + " is odd.<br/>");
-         }
-      document.write("i = " + i + "<br/>");
-      document.write("j = " + j + "<br/>");
-   }
-
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:循環語法:break_語法", "Core_JavaScript_1.5_教學:物件的操作語法") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/do...while_\350\252\236\346\263\225/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/do...while_\350\252\236\346\263\225/index.html" deleted file mode 100644 index 5091d476fd..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/do...while_\350\252\236\346\263\225/index.html" +++ /dev/null @@ -1,22 +0,0 @@ ---- -title: do...while 語法 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法 ---- -

do...while 語法

-

do...while 語法會反覆執行直到指定條件的求值結果為 false 為止。do...while 語法如下︰

-
do
-   statement
-while (condition);
-
-

statement 會在檢測條件之前就先執行一次。若要執行多個語句，就使用區塊語法（{ ... }）把語句群組化。如果 condition 為 true，就會再執行一次語句。每回執行以後，就會檢測條件。當條件為 false 時，就停止執行並把控制權轉移給 do...while 後面的語句。

-

範例
- 在以下範例中，do 循環至少會反覆執行一次，並一直反覆到 i 不再小於 5 為止。

-
do {
-   i += 1;
-   document.write(i);
-} while (i < 5);
-
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:循環語法:for_語法", "Core_JavaScript_1.5_教學:循環語法:while_語法") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/for_\350\252\236\346\263\225/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/for_\350\252\236\346\263\225/index.html" deleted file mode 100644 index 8978b7ed27..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/for_\350\252\236\346\263\225/index.html" +++ /dev/null @@ -1,53 +0,0 @@ ---- -title: for 語法 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法 ---- -

for 語法

-

for 循環反覆執行直到指定的條件的求值為 false 為止。JavaScript 的 for 循環和 Java 和 C 的 for 循環很類似。for 語法如下︰

-
for ([initialExpression]; [condition]; [incrementExpression])
-   statement
-
-

執行 for 循環時，會執行以下步驟︰

-
    -
  1. 執行初始化表達式 initialExpression。這個表達式通常會初始化為 1 以上的計數器，不過也可以是任意複雜程度的表達式。也可以在表達式裡宣告變數。
    2. -
  2. 對 condition 表達式求值。如果 condition 的值為 true，就會執行循環語法。如果 condition 的值為 false，就終止 for 循環。如果完全省略 condition 表達式，條件就會被代入為 true。
    3. -
  3. 執行 statement。若要執行多個語句，就使用區塊語法（{ ... }）把這些語句群組化。
    4. -
  4. 執行更新表達式 incrementExpression，並回到第 2 步驟。
    5. -
-

範例
- 以下函數內含 for 語法，計數至下拉式選單的已選擇選項的數目為止（Select 物件允許複選）。for 語法宣告變數 i 並以 0 初始化。他會檢驗 i 是否小於 Select 物件的選項數目，持續執行 if 語句，並在每一次循環之後以 1 遞增 i。

-
<script type="text/javascript">//<![CDATA[
-
-function howMany(selectObject) {
-   var numberSelected = 0;
-   for (var i = 0; i < selectObject.options.length; i++) {
-      if (selectObject.options[i].selected)
-         numberSelected++;
-   }
-   return numberSelected;
-}
-
-//]]></script>
-<form name="selectForm">
-   <p>
-      <strong>Choose some music types, then click the button below:</strong>
-      <br/>
-      <select name="musicTypes" multiple="multiple">
-         <option selected="selected">R&B</option>
-         <option>Jazz</option>
-         <option>Blues</option>
-         <option>New Age</option>
-         <option>Classical</option>
-         <option>Opera</option>
-      </select>
-   </p>
-   <p>
-      <input type="button" value="How many are selected?"
-         onclick="alert ('Number of options selected: ' + howMany(document.selectForm.musicTypes))"/>
-   </p>
-</form>
-
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:循環語法", "Core_JavaScript_1.5_教學:循環語法:do...while_語法") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/index.html" deleted file mode 100644 index af67cbfa03..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/index.html" +++ /dev/null @@ -1,16 +0,0 @@ ---- -title: 循環語法 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法 -translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Loop_Statements ---- -

循環語法

-

循環（或稱迴圈）是一組反覆執行的指令，直到滿足指定的條件為止。JavaScript 支援 for、do while、while 循環語法，除了 label 以外（label 本身不是循環語法，但經常和循環語法一起使用）。此外，你也可以在循環語法內部使用 break 和 continue 語法。

-

還有另一種語法 for...in 反覆執行語句，但是只用於物件的操作。參閱 物件的操作語法。

-

循環語法如下︰

- -
-

{{ PreviousNext("Core_JavaScript_1.5_教學:條件語法", "Core_JavaScript_1.5_教學:循環語法:for_語法") }}

-
-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Loop_Statements", "es": "es/Gu\u00eda_JavaScript_1.5/Sentencias_de_bucle", "fr": "fr/Guide_JavaScript_1.5/Boucles", "ja": "ja/Core_JavaScript_1.5_Guide/Loop_Statements", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Instrukcje_p\u0119tli" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/label_\350\252\236\346\263\225/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/label_\350\252\236\346\263\225/index.html" deleted file mode 100644 index 8b63254ac1..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/label_\350\252\236\346\263\225/index.html" +++ /dev/null @@ -1,22 +0,0 @@ ---- -title: label 語法 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法 ---- -

label 語法

-

label 提供識別子作為語法，可讓你的程式的任何一處都能參考得到。舉例來說，你可以使用標籤來標識循環，然後使用 break 或 continue 語法來指示程式是否要中斷循環或繼續執行。

-

label 語法如下︰

-
label :
-   statement
-
-

label 的值可以是任意的 JavaScript 識別子，只要不是保留字的話都可以使用。使用標籤來標識的 statement 可以是任意的語句。

-

範例
- 在以下範例中，標籤 markLoop 標識了 while 循環。

-
markLoop:
-while (theMark == true)
-   doSomething();
-}
-
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:循環語法:while_語法", "Core_JavaScript_1.5_教學:循環語法:break_語法") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/while_\350\252\236\346\263\225/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/while_\350\252\236\346\263\225/index.html" deleted file mode 100644 index 76beeaafeb..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/while_\350\252\236\346\263\225/index.html" +++ /dev/null @@ -1,38 +0,0 @@ ---- -title: while 語法 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法 ---- -

while 語法

-

while 語法會執行他的語句，只要指定的條件的求值結果為 true。while 語法如下︰

-
while (condition)
-   statement
-
-

如果條件變成 false，就停止執行循環內部的 statement，並把控制權移交給循環後面的語句。

-

條件的測試會發生在執行循環裡的 statement 之前。如果返回的條件為 true，就會執行 statement，並再次測試條件。如果返回的條件為 false，就停止執行並把控制權移交給 while 後面的語句。

-

若要執行多個語句，就使用區塊語法（{ ... }）把這些語句群組化。

-

範例 1
- 以下 while 循環會一直反覆直到 n 小於 3 為止︰

-
n = 0;
-x = 0;
-while (n < 3) {
-   n++;
-   x += n;
-}
-
-

每一次的反覆，循環便會遞增 n 並且把 n 的值代入給 x。因此，x 和 n 持有下列的值︰

- -

第三次的循環完成以後，條件 n < 3 不再為 true，所以終止循環。

-

範例 2
- 應避免無限循環。確認循環裡的條件最終一定會變成 false。否則循環永遠不會終止。下面的 while 循環裡的語句將會永遠執行下去，因為條件永遠不會變成 false︰

-
while (true) {
-   alert("Hello, world");
-}
-
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:循環語法:do...while_語法", "Core_JavaScript_1.5_教學:循環語法:label_語法") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/getter_\345\222\214_setter_\347\232\204\345\256\232\347\276\251/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/getter_\345\222\214_setter_\347\232\204\345\256\232\347\276\251/index.html" deleted file mode 100644 index 222529aa18..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/getter_\345\222\214_setter_\347\232\204\345\256\232\347\276\251/index.html" +++ /dev/null @@ -1,110 +0,0 @@ ---- -title: Getter 和 Setter 的定義 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義 ---- -

 

- -

Getter 和 Setter 的定義

- -

Getter 是用來取得指定屬性的值的方法。Setter 是用來設定指定屬性的值的方法。你可以在所有預先定義的核心物件或使用者定義的物件（這類可支援新屬性的附加）中定義 Getter 和 Setter。為了定義 Getter 和 Setter，需要使用物件的字面表達語法。

- -

自 JavaScript 1.8.1 起，在設定物件和陣列裡的初始化子的屬性時，不再可以呼叫 Setter。

- -

以下的 JS shell 會話說明了 Getter 和 Setter 是如何在使用者定義的物件 o 裡運作的。JS shell 是一種應用程式，可讓開發者在分批模式或互動性的測試 JavaScript 代碼。

- -
js> var o = {a:7, get b() {return this.a+1;}, set c(x) {this.a = x/2}};
-[object Object]
-js> o.a;
-7
-js> o.b;
-8
-js> o.c = 50;
-js> o.a;
-25
-
- -

o 物件的屬性為︰

- - - -

另一種（Mozilla 限定）表示成一行的方式，也支援在物件的屬性上（如 "foo-bar"）設定 Getter 和 Setter，其中物件需要加上引號。

- -
var o = {a:7, 'b' getter:function () {return this.a + 1;}, c setter:function (x) {this.a = x / 2;}};
- -

請注意定義在物件的字面表達中的 Getter 和 Setter 的函數名稱使用的〝[gs]et property()〞（有別於稍後介紹的 __define[GS]etter__）並不是 Getter 本身的名稱，即使 [gs]et propertyName(){ } 語法可能會使你把他誤解成別的事物。若要命名在 Getter 或 Setter 之中的函數的名稱，就使用〝[gs]et property()〞語法，把 Getter 的名稱放在 get 或 set 後面，然後在其後面放上函數的名稱。下面的範例示範如何在物件的字面表達中命名 Getter 函數︰

- -
var objects = [{get a b(){return 1}},
-               {a getter:function b(){return 1}},
-               {"a" getter:function b(){return 1}}];
-
-for (var i=0; i<objects.length; ++i)
-    print(objects[i].__lookupGetter__("a")) // 為每一個 Getter 輸出 "function b(){return 1}"。
-
- -

這次 JavaScript shell 會話說明 Getter 和 Setter 如何擴充 Date 的原型，給所有預先定義的 Date 類別的實體加入 year 屬性。他使用了 Date 類別中既存的 getFullYear 以及 setFullYear 方法，以支援 year 屬性的 Getter 和 Setter。

- -

以下語句針對 year 屬性定義 Getter 和 Setter︰

- -
js> var d = Date.prototype;
-js> d.__defineGetter__("year", function() { return this.getFullYear(); });
-js> d.__defineSetter__("year", function(y) { this.setFullYear(y); });
-
- -

以下語句在 Date 物件中使用 Getter 和 Setter︰

- -
js> var now = new Date;
-js> print(now.year);
-2000
-js> now.year = 2001;
-987617605170
-js> print(now);
-Wed Apr 18 11:13:25 GMT-0700 (Pacific Daylight Time) 2001
-
- -
在 JavaScript 1.5 的開發期間，這些是內含用來在既存的物件上定義新的 Getter 或 Setter 的 getter = 或 setter = 表達式的摘要，這些語法現在已被廢棄，將會在目前的 JS 1.5 引擎中引發警告，在未來的版本中將會變成語法錯誤。這些都應該要避免。
- -

概要

- -

原則上，Getter 和 Setter 可以

- - - -

當要使用 物件的初始化子 定義 Getter 和 Setter 的時候，你所需要做的是在 Getter 方法的前面加上 get 以及在 Setter 方法的前面加上 set。當然，Getter 方法不可以接受參數，Setter 方法則只能有一個參數（用來設定的新值）。舉例如下︰

- -
o = {
-  a:7,
-  get b() { return this.a+1; },
-  set c(x) { this.a = x/2; }
-};
-
- -

也可以在物件建立之後的任何時間點上，使用兩個稱作 __defineGetter__ 和 __defineSetter__ 的特殊方法，把 Getter 和 Setter 加到物件裡。這兩個方法需要 Getter 或 Setter 的名稱以字串的形式作為第一個參數。第二個參數是用來呼叫的函數作為 Getter 或 Setter。舉例如下（延用之前的例子）：

- -
o.__defineGetter__("b", function() { return this.a+1; });
-o.__defineSetter__("c", function(x) { this.a = x/2; });
-
- -

這兩種形式的選擇，取決於你的程式設計風格以及手上的工作。如果你已經在定義原型的時候，使用了物件的初始化子，或許你在大多數時候都會選擇第一種形式。這種形式更加密集且自然。然而，如果你需要稍後加入 Getter 和 Setter – 因為你並未編寫原型或實際的物件 – 這時第二種形式就是唯一可行的形式。第二種形式或許是 JavaScript 的動態性質中最佳的表現 – 但這會使代碼難以閱讀和理解。

- -
-

在 Firefox 3.0 以前，Getter 和 Setter 並不支援 DOM 元素。舊版本的 Firefox 會默默的出錯。如果需要這些例外，修改 HTMLElement 的原型 (HTMLElement.prototype.__define{{ mediawiki.external('SG') }}etter__)，並且避免拋出例外。

-在 Firefox 3.0 中，在已定義的原型上定義 Getter 或 Setter 將會拋出例外。必須事先刪除這些屬性。舊版本的 Firefox 則沒有這個問題。
- -

參閱

- - - -

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:使用_this_取得物件的參考", "Core_JavaScript_1.5_教學:新物件的建立:屬性的刪除") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/index.html" deleted file mode 100644 index 687b428275..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/index.html" +++ /dev/null @@ -1,18 +0,0 @@ ---- -title: 新物件的建立 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立 ---- -

 

-

新物件的建立

-

JavaScript 具備許多預先定義的物件。此外，你也可以建立你自己的物件。在 JavaScript 1.2 以後的版本中，你可以使用物件的初始化子來建立物件。另一個選擇是，你可以先建立建構子函數，然後使用這個函數以及 new 運算子來實體化物件。

- -

{{ PreviousNext("Core_JavaScript_1.5_教學:物件和屬性", "Core_JavaScript_1.5_教學:新物件的建立:物件初始化子的使用") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\344\275\277\347\224\250_this_\345\217\226\345\276\227\347\211\251\344\273\266\347\232\204\345\217\203\350\200\203/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\344\275\277\347\224\250_this_\345\217\226\345\276\227\347\211\251\344\273\266\347\232\204\345\217\203\350\200\203/index.html" deleted file mode 100644 index 6af61628b5..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\344\275\277\347\224\250_this_\345\217\226\345\276\227\347\211\251\344\273\266\347\232\204\345\217\203\350\200\203/index.html" +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: 使用 this 取得物件的參考 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考 ---- -

 

-

使用 this 取得物件的參考

-

JavaScript 有特別的關鍵字，this，你可以在方法內部使用，用來參考使用中的物件。舉例來說，假設你有稱為 validate 的函數可以檢驗物件的 value 屬性，傳入的參數是物件和上限、下限值︰

-
function validate(obj, lowval, hival) {
-   if ((obj.value < lowval) || (obj.value > hival))
-      alert("Invalid Value!");
-}
-
-

然後，你可以在每一個表單的 onchange 事件處理器中呼叫 validate，使用 this 把 form 元素傳給函數，如下所示︰

-
<input type="text" name="age" size="3"
-   onChange="validate(this, 18, 99)">
-
-

一般來說，this 會參考方法裡的呼叫端物件。

-

如果和 form 的屬性結合使用，this 可以參考使用中物件的親表單。在下面的範例中，表單 myForm 內含 Text 物件以及按鈕。當使用者按下按鈕，表單的名稱就會被設成 Text 物件裡的值。按鈕的 onclick 事件處理器使用 this.form 來參考親表單 myForm。

-
<form name="myForm">
-<p><label>Form name:<input type="text" name="text1" value="Beluga"></label>
-<p><input name="button1" type="button" value="Show Form Name"
-      onclick="this.form.text1.value=this.form.name">
-</p>
-</form>
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:方法的定義", "Core_JavaScript_1.5_教學:新物件的建立:Getter 和 Setter 的定義") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\261\254\346\200\247\347\232\204\345\210\252\351\231\244/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\261\254\346\200\247\347\232\204\345\210\252\351\231\244/index.html" deleted file mode 100644 index ba099fa041..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\261\254\346\200\247\347\232\204\345\210\252\351\231\244/index.html" +++ /dev/null @@ -1,21 +0,0 @@ ---- -title: 屬性的刪除 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除 ---- -

 

-

屬性的刪除

-

你可以使用 delete 運算子移除屬性。下面的代碼示範如何移除屬性︰

-
// 建立新的物件 myobj，以及兩個屬性 a 和 b。
-myobj = new Object;
-myobj.a = 5;
-myobj.b = 12;
-
-// 移除一個屬性，只剩 b 屬性留在 myobj 裡。
-delete myobj.a;
-
-

你也可以使用 delete 來刪除全域變數，只要這個變數不是使用 var 關鍵字宣告的話︰

-
g = 17;
-delete g;
-
-

參閱 delete 取得更多資訊。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:Getter_和_Setter_的定義", "Core_JavaScript_1.5_教學:預先定義的核心物件") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\273\272\346\247\213\345\255\220\345\207\275\346\225\270\347\232\204\344\275\277\347\224\250/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\273\272\346\247\213\345\255\220\345\207\275\346\225\270\347\232\204\344\275\277\347\224\250/index.html" deleted file mode 100644 index b9832bf245..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\273\272\346\247\213\345\255\220\345\207\275\346\225\270\347\232\204\344\275\277\347\224\250/index.html" +++ /dev/null @@ -1,58 +0,0 @@ ---- -title: 建構子函數的使用 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用 ---- -

 

-

建構子函數的使用

-

還有一個選擇，你可以按照這兩個步驟來建立物件︰

-
    -
  1. 編寫建構子函數以完成物件類型的定義。
    2. -
  2. 使用 new 建立物件的實體。
    3. -
-

若要定義物件類型，就指定物件類型的名稱、屬性、方法並建立函數。舉例來說，假設你想要給 car 建立物件類型。你希望這個物件的類型稱作 car，而且你還希望他有 make、model、year 這些屬性。要做到這些，你需要編寫出以下的函數︰

-
function car(make, model, year) {
-   this.make = make;
-   this.model = model;
-   this.year = year;
-}
-
-

注意 this 是用來把傳送給函數的值代入給物件的屬性。

-

現在你可以建立稱作 mycar 的物件如下所示︰

-
mycar = new car("Eagle", "Talon TSi", 1993);
-
-

這個語句建立 mycar 並且把指定的值代入給他自己的屬性。然後 mycar.make 的值是字串 "Eagle"，mycar.year 是整數 1993，依此類推。

-

你可以藉由呼叫 new 來建立許多個 car 的物件。例如，

-
kenscar = new car("Nissan", "300ZX", 1992);
-vpgscar = new car("Mazda", "Miata", 1990);
-
-

物件可以有另一個物件本身的屬性。例如，假設你定義稱為 person 的物件如下︰

-
function person(name, age, sex) {
-   this.name = name;
-   this.age = age;
-   this.sex = sex;
-}
-
-

然後實體化兩個新的 person 物件如下︰

-
rand = new person("Rand McKinnon", 33, "M");
-ken = new person("Ken Jones", 39, "M");
-
-

然後你可以改寫 car 的定義，加入用來接受 person 物件的 owner 屬性，如下︰

-
function car(make, model, year, owner) {
-   this.make = make;
-   this.model = model;
-   this.year = year;
-   this.owner = owner;
-}
-
-

若要實體化新的物件，你可以如下使用︰

-
car1 = new car("Eagle", "Talon TSi", 1993, rand);
-car2 = new car("Nissan", "300ZX", 1992, ken);
-
-

注意，當建立新的物件的時候，傳入的並不是字面表達字串或整數值，上面的語句把 rand 和 ken 物件當作參數傳給 owners。然後如果你希望找出 car2 的 owner 的名稱，你可以如下存取屬性︰

-
car2.owner.name
-
-

注意，你永遠可以給之前定義的物件加入屬性。例如，語句

-
car1.color = "black"
-
-

把 color 屬性加入給 car1，並且把 "black" 的值代入給新加入的屬性。然而，這樣並不能影響到其他的任何物件。若要給所有同樣類型的物件加入新的屬性，你必須把新的屬性加入到 car 物件類型的定義。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:物件初始化子的使用", "Core_JavaScript_1.5_教學:新物件的建立:物件屬性的索引") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\346\226\271\346\263\225\347\232\204\345\256\232\347\276\251/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\346\226\271\346\263\225\347\232\204\345\256\232\347\276\251/index.html" deleted file mode 100644 index 67a9250b8e..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\346\226\271\346\263\225\347\232\204\345\256\232\347\276\251/index.html" +++ /dev/null @@ -1,40 +0,0 @@ ---- -title: 方法的定義 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義 ---- -

 

-

方法的定義

-

方法就是和物件連繫在一起的函數。定義方法和定義標準函數的方式皆相同。然後使用下面的語句把函數和現存的物件連繫在一起︰

-
object.methodname = function_name
-
-

此處的 object 就是現存的物件，methodname 就是分配給方法的名稱，function_name 就是函數的名稱。

-

然後你可以呼叫物件中的方法如下︰

-
object.methodname(params);
-
-

你可以藉由含入物件的建構子函數裡的方法定義，針對物件的類型來定義方法。例如，你可以定義函數，用來格式化並顯示先前定義的 car 物件的屬性。例如，

-
function displayCar() {
-   var result = "A Beautiful " + this.year + " " + this.make
-      + " " + this.model;
-   pretty_print(result);
-}
-
-

此處的 pretty_print 是用來顯示水平格線和字串的函數。注意 this 是用來參考方法所屬的物件。

-

你可以在物件的定義中加上如下語句，把這個函數作為 car 的方法。

-
this.displayCar = displayCar;
-
-

於是，car 的完整定義就會變成這樣

-
function car(make, model, year, owner) {
-   this.make = make;
-   this.model = model;
-   this.year = year;
-   this.owner = owner;
-   this.displayCar = displayCar;
-}
-
-

然後你可以給每一個物件呼叫 displayCar 方法如下︰

-
car1.displayCar()
-car2.displayCar()
-
-

產生的輸出顯示在下圖中。

-

Image:obja.gif 圖 7.1: 方法的輸出的顯示

-

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:針對物件的類型定義屬性", "Core_JavaScript_1.5_教學:新物件的建立:使用_this_取得物件的參考") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\210\235\345\247\213\345\214\226\345\255\220\347\232\204\344\275\277\347\224\250/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\210\235\345\247\213\345\214\226\345\255\220\347\232\204\344\275\277\347\224\250/index.html" deleted file mode 100644 index 79b7e5041b..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\210\235\345\247\213\345\214\226\345\255\220\347\232\204\344\275\277\347\224\250/index.html" +++ /dev/null @@ -1,23 +0,0 @@ ---- -title: 物件初始化子的使用 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 ---- -

 

-

物件初始化子的使用

-

除了使用建構子函數來建立物件以外，你也可以使用物件的初始化子來建立物件。使用物件的初始化子，有時又被稱為以字面表達記法來建立物件。「物件初始化子」與 C++ 的術語一致。

-

使用物件初始化子的語句如下︰

-
var obj = { property_1:   value_1,   // 通常以 property_# 代表識別子...
-            2:            value_2,   // 或者使用數字...
-            ...,
-            "property_n": value_n }; // 或者使用字串
-

此處的 obj 就是新物件的名稱，每一個 property_i 都是識別子（可以是名稱、數字、字串的字面表達），而且每一個 value_i 都是表達式，其值會代入給 property_i。obj 和代入動作不是必要的；如果你不需要在其他地方參考這個物件，你就不需要把物件代入給變數。（注意，你也許需要以圓括弧代替花括弧來包裝物件的字面表達，如果預期物件出現的地方會有其他語句，就要避免和區塊語法相混淆。）

-

如果物件是在最頂層的 Script 中以物件初始化子來建立的，每一次要對內含該物件的字面表達求值時，JavaScript 就會把他解譯成物件。此外，用在函數裡的初始化子，會在每一次呼叫函數的時候建立。

-

以下的語句建立物件，並把他代入給變數 x，但只在表達式的條件為 true 時如此。

-
if (cond) x = {hi:"there"};
-
-

以下例子使用了三個屬性來建立 myHonda。注意，engine 屬性也是物件，並連結有自己的屬性。

-
var myHonda = {color:"red",wheels:4,engine:{cylinders:4,size:2.2}};
-
-

你也可以使用物件的初始化子來建立陣列。參閱 陣列的字面表達。

-

在 JavaScript 1.1 以後的版本中，你無法再使用物件的初始化子。你只能使用他們的建構子函數或者使用由某些其他用途的物件所提供的函數來建立物件。參閱 建構子函數的使用。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立", "Core_JavaScript_1.5_教學:新物件的建立:建構子函數的使用") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\261\254\346\200\247\347\232\204\347\264\242\345\274\225/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\261\254\346\200\247\347\232\204\347\264\242\345\274\225/index.html" deleted file mode 100644 index 08e243c78b..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\261\254\346\200\247\347\232\204\347\264\242\345\274\225/index.html" +++ /dev/null @@ -1,10 +0,0 @@ ---- -title: 物件屬性的索引 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引 ---- -

 

-

物件屬性的索引

-

在 JavaScript 1.0 中，你可以使用物件的屬性名稱或序號索引來參考物件的屬性。然而，在 JavaScript 1.1 以後的版本中，如果你最初使用名稱來定義屬性，你就必須永遠使用名稱來參考屬性，如果你最初使用索引來定義屬性，你就必須永遠使用索引來參考屬性。

-

這些限制出現在，當你使用建構子函數來建立物件及其屬性的時候（例如我們之前的 Car 物件類型），以及當你明確的定義個別的屬性的時候（例如，myCar.color = "red"）。如果你最初使用索引來定義物件的屬性，如 myCar{{ mediawiki.external(5) }} = "25 mpg"，隨後你只能以 myCar{{ mediawiki.external(5) }} 來參考這個屬性。

-

這個規則的例外是從 HTML 反映過來的物件，如 forms 陣列。你永遠可以使用序號（以在文件中出現的位置為基準）或他們的名稱（如果有定義的話）來參考這些陣列。舉例來說，如果在文件中的第二個 <FORM> 標記中有 "myForm" 的 NAME 屬性，你可以使用 document.forms{{ mediawiki.external(1) }} 或 document.forms{{ mediawiki.external('\"myForm\"') }} 或 document.myForm 來參考表單。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:建構子函數的使用", "Core_JavaScript_1.5_教學:新物件的建立:針對物件的類型定義屬性") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\351\207\235\345\260\215\347\211\251\344\273\266\347\232\204\351\241\236\345\236\213\345\256\232\347\276\251\345\261\254\346\200\247/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\351\207\235\345\260\215\347\211\251\344\273\266\347\232\204\351\241\236\345\236\213\345\256\232\347\276\251\345\261\254\346\200\247/index.html" deleted file mode 100644 index 0d1e55ac71..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\351\207\235\345\260\215\347\211\251\344\273\266\347\232\204\351\241\236\345\236\213\345\256\232\347\276\251\345\261\254\346\200\247/index.html" +++ /dev/null @@ -1,12 +0,0 @@ ---- -title: 針對物件的類型定義屬性 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性 ---- -

 

-

針對物件的類型定義屬性

-

你可以透過 prototype 屬性的使用來給之前定義的物件加入新的屬性。這種屬性的定義方式可以共用給所有指定類型的物件，而不只是針對單一的物件實體。以下代碼給所有的 car 類型的物件加入 color 屬性，然後把值代入給 car1 物件的 color 屬性。

-
Car.prototype.color=null;
-car1.color="black";
-
-

參閱 Core JavaScript 參考・函數物件・prototype 屬性 以取得更多資訊。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:物件屬性的索引", "Core_JavaScript_1.5_教學:新物件的建立:方法的定義") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\242\235\344\273\266\350\252\236\346\263\225/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\242\235\344\273\266\350\252\236\346\263\225/index.html" deleted file mode 100644 index c9f263afe1..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\242\235\344\273\266\350\252\236\346\263\225/index.html" +++ /dev/null @@ -1,104 +0,0 @@ ---- -title: 條件語法 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件語法 -translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Conditional_Statements ---- -

條件語法

-

條件語法是在當指定的條件為 true 時，就執行一整組指令。JavaScript 支援兩種條件語法︰if...else 和 switch。

-

if...else 語法

-

如果邏輯條件為 true 時，就執行 if 語法裡的語句。如果條件為 false 的話，可以使用選用性的 else 子句來執行語句。if 語法如下︰

-
if (condition)
-   statement_1
-[else
-   statement_2]
-
-

condition 可以是任何可求值為 true 或 false 的表達式。如果 condition 的求值為 true，就會執行 statement_1，否則執行 statement_2。statement_1 和 statement_2 可以是任何的語句，包括嵌套的 if 語法。

-

你也可以使用 else if 來組合語句，並依序測試各個條件，如下︰

-
if (condition)
-   statement_1
-[else if (condition_2)
-   statement_2]
-...
-[else if (condition_n_1)
-   statement_n_1]
-[else
-   statement_n]
-
-

要執行多個語句，就使用區塊語法（{ ... }）把語句群組化。一般來說，固定使用區塊語法是非常好的作法，尤其是當代碼內部還有嵌套的 if 語法時︰

-
if (condition) {
-   statements_1
-} else {
-   statements_2
-}
-
-

不要在條件表達式裡使用簡單的代入動作會比較明智，因為在快速瀏覽代碼時，代入和相等很容易彼此混淆。例如，不要使用如下代碼︰

-
if (x = y) {
-   /* 做一些事 */
-}
-
-

如果你需要在條件表達式中使用代入的話，常見的作法是在代入語句加上額外的括弧。例如︰

-
if ((x = y)) {
-   /* 做一些事 */
-}
-
-

不要把 Boolean 物件的 true、false 值和原始的布林值 true、false 相混淆。任何值只要不是 undefined、null、0、NaN、空字串 ("")、物件，即使是含有 false 值的 Boolean 物件，傳給條件語法的求值結果也會是 true。例如︰

-
var b = new Boolean(false);
-if (b) // 這個條件的求值結果為 true
-
-

範例
-在以下的範例中，如果在 Text 物件裡的字元數目為 3，函數 checkData 就返回 true。否則，他會顯示警報並返回 false。

-
function checkData() {
-   if (document.form1.threeChar.value.length == 3) {
-      return true;
-   } else {
-      alert("Enter exactly three characters. " +
-         document.form1.threeChar.value + " is not valid.");
-      return false;
-   }
-}
-

switch 語法

-

switch 語法可讓程式對表達式求值，並試著以表達式的值來一一比對 case 標籤。如果發現比對符合，程式就會執行與之關聯的語句。switch 語法如下︰

-
switch (expression) {
-   case label_1:
-      statements_1
-      [break;]
-   case label_2:
-      statements_2
-      [break;]
-   ...
-   default:
-      statements_def
-      [break;]
-}
-
-

程式首先從附有標籤的 case 子句找出能夠符合表達式的值的標籤，然後把控制權轉移到那個子句，並執行與之相關的語句。如果找不到相符的標籤，程式就會尋找選用性的 default 子句，如果找到的話，就把控制權轉移到那個子句，並執行與之相關的語句。如果找不到 default 子句，程式就會繼續執行 switch 語法後面的語句。根據慣例，default 語句一定是最後一個子句，但是並非只能這樣使用。

-

可用在每一個 case 子句的選用性 break 語法，可確實從 switch 裡已執行完且後面還有其他語句的符合語句中跳出。如果省略 break，程式就會繼續執行 switch 語法裡的下一個語法。

-

範例
-在以下範例中，如果 fruittype 求值為 "Bananas"，程式就會比對出 case "Bananas" 的值，並執行相聯的語句。如果遇到 break，程式就會終止 switch 並執行 switch 後面的語句。如果省略了 break，case "Cherries" 裡的語句也會被執行。

-
switch (fruittype) {
-   case "Oranges":
-      document.write("Oranges are $0.59 a pound.<br>");
-      break;
-   case "Apples":
-      document.write("Apples are $0.32 a pound.<br>");
-      break;
-   case "Bananas":
-      document.write("Bananas are $0.48 a pound.<br>");
-      break;
-   case "Cherries":
-      document.write("Cherries are $3.00 a pound.<br>");
-      break;
-   case "Mangoes":
-   case "Papayas":
-      document.write("Mangoes and papayas are $2.79 a pound.<br>");
-      break;
-   default:
-      document.write("Sorry, we are out of " + fruittype + ".<br>");
-}
-document.write("Is there anything else you'd like?<br>");
-
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:區塊語法", "Core_JavaScript_1.5_教學:循環語法") }}

-
-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Conditional_Statements", "fr": "fr/Guide_JavaScript_1.5/Instructions_conditionnelles", "ja": "ja/Core_JavaScript_1.5_Guide/Conditional_Statements", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Instrukcje_warunkowe" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\346\250\241\345\274\217\347\232\204\347\267\250\345\257\253/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\346\250\241\345\274\217\347\232\204\347\267\250\345\257\253/index.html" deleted file mode 100644 index e07b2f6aa4..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\346\250\241\345\274\217\347\232\204\347\267\250\345\257\253/index.html" +++ /dev/null @@ -1,184 +0,0 @@ ---- -title: 正規表達式模式的編寫 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 ---- -

正規表達式的模式是由簡單的字元所組成，如 /abc/，或由簡單的和特殊的字元所組成，如 /ab*c/ 或 /Chapter (\d+)\.\d*/。後者含有用來記憶的括弧。以模式的某一部分所產生的比對結果會被記憶起來以供稍後使用，已在 括弧子字串的比對結果的運用 一文中解說。

-

簡單模式的使用

-

簡單的模式直接由想要尋找的字元所組成。例如，/abc/ 的模式只在字元 'abc' 以同樣順序一起出現時，比對出字串裡的字元。在字串 "Hi, do you know your abc's?" 和 "The latest airplane designs evolved from slabcraft." 中將會比對成功。在兩個例子中，都比對出子字串 'abc'。在字串 "Grab crab" 中沒有比對結果，因為字串裡並未含有子字串 'abc'。

-

特殊字元的使用

-

當搜尋的需求遠遠超出直接比對的能力時，如尋找 1 個以上的全部的 b，或是尋找含有特殊字元的空白部分。舉例來說，/ab*c/ 的模式可比對出所有以 'a' 後接 0 個以上的全部的 'b'（* 的意思是前項出現 0 個以上）並緊接者 'c' 的字元。在字串 "cbbabbbbcdebc" 裡，可以比對出子字串 'abbbbc'。

-

下表提供完整的列表，並解說可用於正規表達式的特殊字元。

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
字元意義
\可分為以下兩種︰ -
    -
  • 對於那些沒有特殊意義的字元，反斜線可指示下一個字元為特殊的、不照字面解譯。舉例來說，/b/ 比對字元 'b'。藉由在 b 前面放置反斜線，也就是使用 /\b/，這個字元的特殊意義就變成比對文字的邊界。
    • -
  • 對於那些有特別意義的字元，就利用反斜線指示下一個字元並非特殊的、應該照字面解譯。舉例來說，* 是一個意義為前項出現 0 個以上的特殊字元。例如，/a*/ 意思是比對 0 個以上的全部的 a。如果要照字面比對 *，就在前面加上反斜線。例如，/a\*/ 比對出 'a*'。
    • -
-
^比對輸入的開頭處。如果把多行標誌設為 true，也會比對緊接在換行字元之後的字元。舉例來說，/^A/ 不會在 "an A" 裡比對出 'A'，但會在 "An A" 裡比對出第一個 'A'。
$比對輸入的末尾處。如果把多行標誌設為 true，也會比對緊接在換行字元之前的字元。舉例來說，/t$/ 不會在 "eater" 裡比對出 't'，但會在 "eat" 裡比對出來。
*比對前面的字元 0 次以上。舉例來說，/bo*/ 在 "A ghost booooed" 比對出 'boooo'，並在 "A bird warbled" 比對出 'b'，但不會在 "A goat grunted" 比對出來。
+比對前面的字元 1 次以上。等價於 {1,}。舉例來說，/a+/ 在 "candy" 比對出 'a'，並在 "caaaaaaandy" 比對出所有的 a。
?比對前面的字元 0 次或 1 次。 -

舉例來說，/e?le?/ 在 "angel" 比對出 'el'，並在 "angle" 比對出 'le'。

-

如果緊接在任何一個數量子 *、+、?、{} 之後來使用，將使數量子非貪婪（比對出最小的次數），而預設值是貪婪的（比對出最大的次數）。舉例來說，使用 /\d+/ 比對 "123abc" 便返回 "123"，如果使用 /\d+?/，只有 "1" 會被比對出來。

- 也用於表示預讀，在本表的 x(?=y) 和 x(?!y) 中有說明。
.小數點比對任意的單一字元，除了換行字元以外。舉例來說，/.n/ 在 "nay, an apple is on the tree" 比對出 'an' 和 'on'，而非 'nay'。
(x)比對 'x' 並記憶此項比對結果。又稱為截取括弧（capturing parentheses）。舉例來說，/(foo)/ 在 "foo bar" 裡比對出並記憶 'foo'。比對出來的子字串可以從比對結果的陣列的元素 1, ..., n 取回。
(?:x)比對 'x' 但不記憶此項比對結果。又稱為非截取括弧。比對出來的子字串無法從比對結果的陣列的元素 1, ..., n 取回。
x(?=y)比對 'x' 但只在 'x' 後面接續著 'y' 的時候。舉例來說，/Jack(?=Sprat)/ 只在後面接續著 'Sprat' 的時候比對出 'Jack'。/Jack(?=Sprat|Frost)/ 只在後面接續著 'Sprat' 或 'Frost' 的時候比對出 'Jack'。然而，'Sprat' 或 'Frost' 都不是比對結果的一部分。
x(?!y)比對 'x' 但只在 'x' 後面沒有接續著 'y' 的時候。舉例來說，/\d+(?!\.)/ 只在後面沒有接續著小數點的時候比對出數字。正規表達式 /\d+(?!\.)/.exec("3.141") 比對出 '141' 而非 '3.141'。
x|y比對 'x' 或 'y'。舉例來說，/green|red/ 在 "green apple" 比對出 'green'，並在 "red apple"比對出 'red'。
{n}在此 n 是正整數。比對出恰好有 n 個的前面的字元。舉例來說，/a{2}/ 不會在 "candy" 裡比對出 'a'，但在 "caandy" 裡比對出全部的 a，並在 "caaandy" 裡比對出前兩個 a。
{n,}在此 n 是正整數。比對出至少 n 個的前面的字元。舉例來說，/a{2,}/ 不會在 "candy" 裡比對出 'a'，但在 "caandy" 還有在 "caaaaaaandy" 裡比對出全部的 a。
{n,m}在此 n 和 m 是正整數。比對出至少 n 個且至多 m 個的前面的字元。舉例來說，/a{1,3}/ 在 "cndy" 裡比對不出來，但在 "candy" 比對出 'a'，在 "caandy" 比對出前兩個 a，並在 "caaaaaaandy" 比對出前三個 a，注意，當比對 "caaaaaaandy" 的時候，比對的是 "aaa"，即使字串裡有更多的 a。
xyz字元集。比對出包含在括號裡的其中任何一個字元。你可以使用連接符號 (-) 指定字元的範圍。舉例來說，abcd 等於 a-d。這些都能在 "brisket" 裡比對 'b'，並在 "city" 裡比對 'c'。
^xyz字元否定集、或字元補集。也就是比對出任何不包含在括號裡的一切。你可以使用連接符號 (-) 指定字元的範圍。舉例來說，^abc 等於 ^a-c。這些都能在 "brisket" 裡比對出第一個字母 'r'，並在 "chop" 比對出 'h'。
\\b比對退格。（別和 \b 混淆。）
\b比對文字邊界，如空白或換行字元。（別和 \\b 混淆。）舉例來說，/\bn\w/ 在 "noonday" 裡比對出 'no'，/\wy\b/ 在 "possibly yesterday" 比對出 'ly'。
\B比對非文字邊界。舉例來說，/\w\Bn/ 在 "noonday" 裡比對出 'on'，/y\B\w/ 在 "possibly yesterday" 裡比對出 'ye'。
\cX在此 X 是控制字元。在字串中比對控制字元。舉例來說，/\cM/ 在字串裡比對出 control-M。
\d比對數字字元。等於 0-9。舉例來說，/\d/ 或 /0-9/ 都在 "B2 is the suite number" 比對出 '2'。
\D比對非數字字元。等於 ^0-9。舉例來說，/\D/ 或 /^0-9/ 都在 "B2 is the suite number" 比對出 'B'。
\f比對換頁（form-feed）。
\n比對換行。
\r比對歸位。
\s比對單一空白字元，包括空白、TAB、換頁、換行。等於 -

\\f\\n\\r\\t\\v\\u00A0\\u2028\\u2029。

- 舉例來說，/\s\w*/ 在 "foo bar" 裡比對出 ' bar'。
\S比對除了空白字元以外的單一字元。等於 -

^ \\f\\n\\r\\t\\v\\u00A0\\u2028\\u2029。

- 舉例來說，/\S\w*/ 在 "foo bar" 裡比對出 'foo'。
\t比對 TAB。
\v比對垂直 TAB。
\w比對任何字母和數字的字元，包括底線。等於 A-Za-z0-9_。舉例來說，/\w/ 在 "apple" 裡比對出 'a'，在 "$5.28" 裡比對出 '5'，並在 "3D" 比對出 '3'。
\W比對任何非字母和數字的字元。等於 {{ mediawiki.external('^A-Za-z0-9_') }}。舉例來說，/\W/ 或 /{{ mediawiki.external('^A-Za-z0-9_') }}/ 在 "50%" 裡比對出 '%'。
\n在此 n 是正整數。回向參考在正規表達式中的第 n 個括弧中比對的最後的子字串（對左括弧計數）。舉例來說，/apple(,)\sorange\1/ 在 "apple, orange, cherry, peach" 裡比對出 'apple, orange,'。
\0比對 NUL 字元。後面不可以接續其他數字。
\xhh比對內碼為 hh 的字元（兩個十六進位數）
\uhhhh比對內碼為 hhhh 的字元（四個十六進位數）
-

表 4.1: 正規表達式裡的特殊字元。

-

括弧的使用

-

使用括弧把正規表達式的模式的某一部分括起來，就會記憶那部分被比對出來的子字串。一經記憶，就可以在其他地方取回並使用。可在 括弧子字串的比對結果的運用 一文中找到說明。

-

舉例來說，以 /Chapter (\d+)\.\d*/ 的模式來解說額外的跳脫和特殊字元，那些用來指示某一部分模式需要記憶的部分。他會比對恰好是 'Chapter ' 的字元，隨後是 1 個以上的數字（\d 的意思是任意數字字元，+ 的意思是 1 次以上），隨後是一個小數點（點本身是特殊字元，前面附上 \ 的點的意思是這個模式必須尋找字面為 '.' 的字元），隨後是任何 0 個以上的數字（\d 的意思是任意數字字元，* 的意思是 0 次以上）。此外，括弧被用來記憶第一次比對出來的數字字元。

-

在 "Open Chapter 4.3, paragraph 6" 裡可以找出這個模式，且 '4' 會被記憶。在 "Chapter 3 and 4" 裡則找不出這個模式，因為字串裡的 '3' 後面沒有點。

-

若要比對子字串，且不要記憶比對出來的那一部分，可在括弧裡面的最前面加上 ?:。舉例來說，(?:\d+) 比對 1 個以上的數字字元，但不會記憶那些比對出來的字元。

-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:正規表達式的建立", "Core_JavaScript_1.5_教學:正規表達式的運用") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" deleted file mode 100644 index ffeee0f5c7..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" +++ /dev/null @@ -1,34 +0,0 @@ ---- -title: 正規表達式的建立 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 ---- -

正規表達式的建立

-

正規表達式有兩種建構方式︰

- -
 re = /ab+c/;
-
-
-
-
- 正規表達式的字面表達會在對 Script 求值時提供正規表達式的編譯產物。這時正規表達式將成為常數而遺留下來，採用這個方式可以得到較好的效能。
-
-
-
- -
 re = new RegExp("ab+c");
-
-
-
-
- 使用建構子函數可在執行時期提供正規表達式的編譯產物。當你知道正規表達式的模式將會變更時，或者當你無法預知取自其他來源的模式（如使用者的輸入）時，就使用建構子函數。
-
-
-
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:運算子:特殊運算子", "Core_JavaScript_1.5_教學:正規表達式模式的編寫") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/index.html" deleted file mode 100644 index 792eec13b9..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/index.html" +++ /dev/null @@ -1,59 +0,0 @@ ---- -title: 正規表達式的運用 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用 -translation_of: Web/JavaScript/Guide/Regular_Expressions -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Working_with_Regular_Expressions ---- - -

正規表達式的運用

-

RegExp 的 test 和 exec 方法，還有 String 的 match、replace、search、split 方法都有使用到正規表達式。這些方法在 Core JavaScript 參考 中已有詳細說明。

- -
方法 說明
exec RegExp 的方法，在字串中比對以執行搜尋。他會返回搜尋資訊的陣列。
test RegExp 的方法，在字串中比對以進行測試。他會返回 true 或 false。
match String 的方法，在字串中比對以執行搜尋。他會返回搜尋資訊的陣列，或在比對不出時返回 null。
search String 的方法，在字串中比對以進行測試。他會返回符合比對的索引，或在搜尋失敗時返回 -1。
replace String 的方法，在字串中比對以執行搜尋，並以其他子字串取代符合比對的子字串。
split String 的方法，使用正規表達式或固定的字串，把字串分割為子字串的陣列。
-

表 4.2: 使用了正規表達式的方法

-

當你想知道是否可以在字串裡找出某個模式，可以使用 test 或 search 方法。要更詳細的資訊（不過執行速度也慢）可以使用 exec 或 match 方法。如果你使用 exec 或 match 並且比對成功，這些方法會返回陣列，並更新相關聯的正規表達式物件包括預先定義的 RegExp 的屬性，如果比對失敗，exec 方法返回 null（可轉換為 false）。

-

在以下的範例中，Script 使用了 exec 方法來在字串裡尋找符合的字串。

-
<SCRIPT type="text/javascript">
-  myRe = /d(b+)d/g;
-  myArray = myRe.exec("cdbbdbsbz");
-</SCRIPT>
-
-

如果你不需要存取正規表達式的屬性，另一個建立 myArray 的方式如下 Script︰

-
<SCRIPT type="text/javascript">
-  myArray = /d(b+)d/g.exec("cdbbdbsbz");
-</SCRIPT>
-
-

如果你想要從字串來建構正規表達式，還有其他選擇如下 Script︰

-
<SCRIPT type="text/javascript">
-  myRe = new RegExp ("d(b+)d", "g");
-  myArray = myRe.exec("cdbbdbsbz");
-</SCRIPT>
-
-

這些 Script 比對成功並返回陣列，並更新顯示在下表中的屬性。

- -
物件 屬性或索引 說明 上面的範例
myArray   比對符合的字串和所有已記憶的子字串。 {{ mediawiki.external('\"dbbd\", \"bb\"') }}
  index 在輸入的字串中比對符合的索引位置。索引從 0 開始。 1
  input 原始的字串。 "cdbbdbsbz"
  {{ mediawiki.external(0) }} 最後一次比對符合的字元。 "dbbd"
myRe lastIndex 下一個符合項的開始處的索引位置。（這個屬性只在正規表達式使用 g 選項時設定，選項的說明在 使用標誌的進階搜尋。） 5
  source 模式的文字。在正規表達式建立時更新，而非執行時。 "d(b+)d"
-

表 4.3: 正規表達式的執行結果。

-

如上第二個範例所示，你可以藉由物件的初始化子使用正規表達式，而無需代入到變數裡。然而，如果你這樣做的話，每一次使用的都會是新的正規表達式。因此，如果你使用這個形式而不代入到變數，之後你就沒辦法存取正規表達式的屬性。舉例來說，假設你有這個 Script︰

-
<SCRIPT type="text/javascript">
-  myRe = /d(b+)d/g;
-  myArray = myRe.exec("cdbbdbsbz");
-  document.writeln("The value of lastIndex is " + myRe.lastIndex);
-</SCRIPT>
-
-

Script 顯示︰

-
The value of lastIndex is 5
-
-

然而，如果你有這個 Script︰

-
<SCRIPT type="text/javascript">
-  myArray = /d(b+)d/g.exec("cdbbdbsbz");
-  document.writeln("The value of lastIndex is " + /d(b+)d/g.lastIndex);
-</SCRIPT>
-
-

他會顯示︰

-
The value of lastIndex is 0
-
-

/d(b+)d/g 在兩個語句中是不同的正規表達式物件，也因此各自對 lastIndex 屬性有著不同的變數。如果你需要存取以物件初始化子所建立的正規表達式的屬性，你應該先把他代入到變數裡。

-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:正規表達式模式的編寫", "Core_JavaScript_1.5_教學:正規表達式的運用:括弧子字串的比對結果的運用") }}

-
-

{{ languages( {"en": "en/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions", "es": "es/Gu\u00eda_JavaScript_1.5/Trabajar_con_expresiones_regulares", "fr": "fr/Guide_JavaScript_1.5/Travailler_avec_les_expressions_rationnelles", "ja": "ja/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Praca_z_wyra\u017ceniami_regularnymi" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\344\275\277\347\224\250\346\250\231\350\252\214\347\232\204\351\200\262\351\232\216\346\220\234\345\260\213/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\344\275\277\347\224\250\346\250\231\350\252\214\347\232\204\351\200\262\351\232\216\346\220\234\345\260\213/index.html" deleted file mode 100644 index 2dce68e5a9..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\344\275\277\347\224\250\346\250\231\350\252\214\347\232\204\351\200\262\351\232\216\346\220\234\345\260\213/index.html" +++ /dev/null @@ -1,37 +0,0 @@ ---- -title: 使用標誌的進階搜尋 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 -translation_of: Web/JavaScript/Guide/Regular_Expressions -translation_of_original: >- - Web/JavaScript/Guide/Obsolete_Pages/Working_with_Regular_Expressions/Advanced_Searching_With_Flags ---- -

使用標誌的進階搜尋

-

正規表達式有四個選用的標誌，這些標誌可用於全域或不分大小寫等的搜尋。若要指明為全域搜尋，就使用 g 標誌。若要指明為區分大小寫來搜尋，就使用 i 標誌。若要指明為在多行中搜尋，就使用 m 標誌。若要進行“定點”搜尋，也就是以目標字串的目前位置為開始點來搜尋，那就使用 y 標誌。這些標誌可以單獨或不分順序混合使用，並作為正規表達式的一部分。

-

{{ Fx_minversion_note(3, "Firefox 3 新增了對 y 標誌的支援。如果在目標字串的目前位置上比對不成功，y 標誌就會失敗。") }}

-

要在正規表達式中包含標誌，使用以下語法︰

-
re = /pattern/flags
-re = new RegExp("pattern", ["flags"])
-
-

注意，標誌也是正規表達式整體的一部分。之後就不能新增或移除標誌。

-

舉例來說，re = /\w+\s/g 建立了可尋找 1 個以上的字元並且後接空白的正規表達式，並找出整個字串的組合部分。

-
<script type="text/javascript">
- re = /\w+\s/g;
- str = "fee fi fo fum";
- myArray = str.match(re);
- document.write(myArray);
-</script>
-
-

顯示出 {{ mediawiki.external('\"fee \", \"fi \", \"fo \"') }}。在這個範例中，你可以取代一整行︰

-
re = /\w+\s/g;
-
-

改用︰

-
re = new RegExp("\\w+\\s", "g");
-
-

得到同樣的結果。

-

m 標誌用來指明輸入的多行字串應該視為多行。如果使用 m 標誌，^ 和 $ 就會在輸入字串裡比對每一行的開始處和結尾處，而非整個字串的開始處和結尾處。

-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:正規表達式的運用:括弧子字串的比對結果的運用", "Core_JavaScript_1.5_教學:正規表達式的運用:正規表達式的範例") }}

-
-

 

-

 

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions/Advanced_Searching_With_Flags", "es": "es/Gu\u00eda_JavaScript_1.5/Trabajar_con_expresiones_regulares/Ejecutar_una_busqueda_global,_discriminar_mayusculas_y_minusculas_y_considerar_entrada_multil\u00ednea", "fr": "fr/Guide_JavaScript_1.5/Travailler_avec_les_expressions_rationnelles/Ex\u00e9cution_de_recherches_globales,_ignorer_la_casse,_utilisation_de_cha\u00eenes_multilignes", "ja": "ja/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions/Advanced_Searching_With_Flags", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Praca_z_wyra\u017ceniami_regularnymi/Globalne_wyszukiwanie,_wielko\u015b\u0107_znak\u00f3w,_wieloliniowe_wej\u015bcie" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\213\254\345\274\247\345\255\220\345\255\227\344\270\262\347\232\204\346\257\224\345\260\215\347\265\220\346\236\234\347\232\204\351\201\213\347\224\250/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\213\254\345\274\247\345\255\220\345\255\227\344\270\262\347\232\204\346\257\224\345\260\215\347\265\220\346\236\234\347\232\204\351\201\213\347\224\250/index.html" deleted file mode 100644 index 8abec68f16..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\213\254\345\274\247\345\255\220\345\255\227\344\270\262\347\232\204\346\257\224\345\260\215\347\265\220\346\236\234\347\232\204\351\201\213\347\224\250/index.html" +++ /dev/null @@ -1,44 +0,0 @@ ---- -title: 括弧子字串的比對結果的運用 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 -translation_of: Web/JavaScript/Guide/Regular_Expressions#Using_Parenthesized_Substring_Matches -translation_of_original: >- - Web/JavaScript/Guide/Obsolete_Pages/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches ---- -

括弧子字串的比對結果的運用

-

在正規表達式的模式中包含括弧，對應的子比對結果就會被記憶。舉例來說，/a(b)c/ 比對字元 'abc' 並把 'b' 記憶起來。若要取回括弧子字串的比對結果，就使用 Array 元素 {{ mediawiki.external(1) }}, ..., {{ mediawiki.external('n') }}。

-

括弧子字串的可能數目並沒有限制。返回的陣列保留了所有找到的子字串。以下範例解說如何使用括弧子字串的比對結果。

-

範例 1
-以下 Script 使用 replace 方法來置換字串裡的文字。對於那些替換用的文字，Script 使用了 $1 和 $2 來表示第一個和第二個括弧子字串的比對結果。

-
<script type="text/javascript">
- re = /(\w+)\s(\w+)/;
- str = "John Smith";
- newstr = str.replace(re, "$2, $1");
- document.write(newstr);
-</script>
-
-

本例輸出 "Smith, John"。

-

範例 2
-附註: 在 getInfo 函數中，exec 方法是以 () 省略記法所呼叫的，這個記法在 Firefox 可以運作，其他瀏覽器則不一定。

-
<html>
-
-<script type="text/javascript">
- function getInfo(field){
-   var a = /(\w+)\s(\d+)/(field.value);
-   window.alert(a[1] + ", your age is " + a[2]);
- }
-</script>
-
-Enter your first name and your age, and then press Enter.
-
-<form>
-  <input type="text" name="NameAge" onchange="getInfo(this);">
-</form>
-
-</html>
-
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:正規表達式的運用", "Core_JavaScript_1.5_教學:正規表達式的運用:使用標誌的進階搜尋") }}

-
-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches", "es": "es/Gu\u00eda_JavaScript_1.5/Trabajar_con_expresiones_regulares/Usar_coincidencias_de_subcadenas_parentizadas", "fr": "fr/Guide_JavaScript_1.5/Travailler_avec_les_expressions_rationnelles/Utilisation_des_parenth\u00e8ses_de_capture", "ja": "ja/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Praca_z_wyra\u017ceniami_regularnymi/U\u017cycie_odpowiedniego_znaku" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\347\257\204\344\276\213/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\347\257\204\344\276\213/index.html" deleted file mode 100644 index 0bd61d90e5..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\347\257\204\344\276\213/index.html" +++ /dev/null @@ -1,114 +0,0 @@ ---- -title: 正規表達式的範例 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 ---- -

範例

-

以下範例示範正規表達式的一些用法。

-

改變輸入字串的順序

-

以下範例解說了正規表達式的構造，以及 string.split() 和 string.replace() 的用法。他會整理凌亂的格式化輸入字串，字串中內含以空白、TAB、和唯一的分號所分割的姓名（名字在前）。最後，他會調換姓名的順序（姓氏在前）並重新排序列表。

-
<script type="text/javascript">
-
-// 內含很多空白和 TAB 的 names 字串，
-// 在名字和姓氏之間也會有很多空白。
-var names = "Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ; Chris Hand ";
-
-var output = new Array(
-  "---------- Original String<br><br>",
-  names + "<br><br>");
-
-// 預備兩個正規表達式的模式和儲存用的陣列。
-// 把字串分割存入陣列元素裡。
-
-// 模式︰可能的空白，然後是分號，然後是可能的空白
-var pattern = /\s*;\s*/;
-
-// 使用上面的模式把字串分割成多個斷片，
-// 並且把斷片儲存至稱為 nameList 的陣列。
-var nameList = names.split(pattern);
-
-// 新的模式︰1 個以上的字元，然後是空白字元，然後是 1 個以上的字元。
-// 使用括弧來記憶模式的某一部分。
-// 已記憶的部分稍後會被參考。
-var pattern = /(\w+)\s+(\w+)/;
-
-// 用來保存已處理的姓名的新陣列。
-var bySurnameList = new Array();
-
-// 顯示 names 陣列，並移動以逗號分隔且姓氏在前的姓名到新的陣列。
-//
-// replace 方法除去符合模式的所有內容，並以已記憶的字串取代。
-// 字串是以第二個已記憶的部分、後接逗號和空格、後接第一個已記憶的部分所組成。
-//
-// 變數 $1 和 $2 參考了符合模式的已記憶的部分。
-
-output.push("---------- After Split by Regular Expression<br>");
-
-var i, len;
-for (i = 0, len = nameList.length; i < len; i++)
-{
-  output.push(nameList[i] + "<br>");
-  bySurnameList[i] = nameList[i].replace(pattern, "$2, $1")
-}
-
-// 顯示新的陣列。
-output.push("---------- Names Reversed<br>");
-for (i = 0, len = bySurnameList.length; i < len; i++)
-{
-  output.push(bySurnameList[i] + "<br>")
-}
-
-// 以姓氏來排序，然後顯示已排序的陣列。
-bySurnameList.sort();
-output.push("---------- Sorted<br>");
-for (i = 0, len = bySurnameList.length; i < len; i++)
-{
-  output.push(bySurnameList[i] + "<br>")
-}
-
-output.push("---------- End<br>");
-
-document.write(output.join("\n"));
-
-</script>
-
-

使用特殊字元來對輸入進行驗證

-

在以下的範例中，有位使用者輸入電話號碼。當使用者按下 Enter 時，Script 就會檢查電話號碼的有效性。如果電話號碼有效（符合由正規表達式所指定的字元序列），Script 在視窗上表示感謝使用者，並確認了電話號碼。如果電話號碼無效，Script 在視窗上表示使用者的電話號碼有誤的資訊。

-

正規表達式尋找 0 或 1 個左括弧 \(?，後接三個數字 \d{3}，後接 0 或 1 個右括弧 \)?，如果有的話，就後接橫線 (-) 或斜線 (\) 或小數點 (.)，並記憶字元 (-\\/\\.)，後接三個數字 \d{3}，後接已記憶的橫線、斜線、小數點的比對結果 \1，後接四個數字 \d{4}。

-

當使用者按下 Enter 設定 RegExp.input 的值時，就會發動 Change 事件。

-
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
-  "http://www.w3.org/TR/html4/loose.dtd">
-<html>
-  <head>
-    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
-    <meta http-equiv="Content-Script-Type" content="text/javascript">
-    <script type="text/javascript">
-      var re = /\(?\d{3}\)?([-\/\.])\d{3}\1\d{4}/;
-
-      function testInfo(phoneInput)
-      {
-        var OK = re.exec(phoneInput.value);
-
-        if (!OK)
-        {
-          window.alert(RegExp.input + " isn't a phone number with area code!");
-        }
-        else
-        {
-          window.alert("Thanks, your phone number is " + OK[0]);
-        }
-      }
-    </script>
-  </head>
-
-  <body>
-    <p>Enter your phone number (with area code) and then press Enter.</p>
-    <form action="">
-      <input name="phone" onchange="testInfo(this);">
-    </form>
-  </body>
-</html>
-
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:正規表達式的運用:使用標誌的進階搜尋", "Core_JavaScript_1.5_教學:區塊語法") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\345\222\214\345\261\254\346\200\247/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\345\222\214\345\261\254\346\200\247/index.html" deleted file mode 100644 index fc10840076..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\345\222\214\345\261\254\346\200\247/index.html" +++ /dev/null @@ -1,43 +0,0 @@ ---- -title: 物件和屬性 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件和屬性 -translation_of: Web/JavaScript/Guide/Working_with_Objects -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Objects_and_Properties ---- -

 

-

物件和屬性

-

JavaScript 的物件連結有屬性。你只需要使用簡單的記法就能存取物件的屬性︰

-
objectName.propertyName
-
-

物件的名稱和屬性的名稱兩者都區分大小寫。你可藉由給他代入值來定義屬性。例如，假設有名為 myCar 的物件（假設物件已經存在）。你可以把他的屬性命名為 make、model、year 如下所示︰

-
myCar.make = "Ford";
-myCar.model = "Mustang";
-myCar.year = 1969;
-
-

JavaScript 物件的屬性也可以使用方括號記法來存取或設定。物件有時又稱為關聯陣列，因為每一個屬性都和字串值連繫在一起，且可以用這些字串值來存取屬性。然後，舉例來說，你可以存取 myCar 物件的屬性如下所示︰

-
myCar["make"] = "Ford";
-myCar["model"] = "Mustang";
-myCar["year"] = 1969;
-
-

你也可以使用儲存在變數裡的字串值來存取屬性︰

-
var propertyName = "make";
-myCar[propertyName] = "Ford";
-
-propertyName = "model";
-myCar[propertyName] = "Mustang";
-
-

你也可以使用括弧和 for...in 來迭代物件所有的屬性。為解說這是如何運作的，以下函數用來顯示物件的屬性，當你把物件和物件的名稱作為參數傳給這個函數的時候︰

-
function show_props(obj, obj_name) {
-   var result = "";
-   for (var i in obj)
-      result += obj_name + "." + i + " = " + obj[i] + "\n";
-   return result;
-}
-
-

然後，呼叫函數 show_props(myCar, "myCar") 就會返回以下內容︰

-
myCar.make = Ford
-myCar.model = Mustang
-myCar.year = 1969
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:閉包的運用", "Core_JavaScript_1.5_教學:建立新的物件") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Objects_and_Properties", "es": "es/Gu\u00eda_JavaScript_1.5/Objetos_y_propiedades", "fr": "fr/Guide_JavaScript_1.5/Objets_et_propri\u00e9t\u00e9s", "ja": "ja/Core_JavaScript_1.5_Guide/Objects_and_Properties", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Obiekty_i_w\u0142asno\u015bci" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\347\232\204\346\223\215\344\275\234\350\252\236\346\263\225/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\347\232\204\346\223\215\344\275\234\350\252\236\346\263\225/index.html" deleted file mode 100644 index f1e46206fe..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\347\232\204\346\223\215\344\275\234\350\252\236\346\263\225/index.html" +++ /dev/null @@ -1,53 +0,0 @@ ---- -title: 物件的操作語法 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法 ---- -

物件的操作語法

-

JavaScript 使用 for...in、for each...in、with 語法來操作物件。

-

for...in 語法

-

for...in 語法可處理對應物件的所有屬性的指定變數。JavaScript 會對每一個對應的屬性來執行指定的語句。for...in 語句如下︰

-
for (variable in object) {
-   statements
-}
-
-

範例
- 以下函數接受物件和物件的名稱作為自己的參數。然後函數反覆遍歷物件的屬性，並返回列出屬性名稱和值的字串。

-
function dump_props(obj, obj_name) {
-   var result = "";
-   for (var i in obj) {
-      result += obj_name + "." + i + " = " + obj[i] + "<br>";
-   }
-   result += "<hr>";
-   return result;
-}
-
-

以帶有屬性 make 和 model 的物件 car 為例，輸出結果如下︰

-
car.make = Ford
-car.model = Mustang
-
-

陣列
- 雖然使用這個方法來處理所有的 Array 元素很是誘人，但如果你修改了 Array 物件，例如加入自訂的屬性或方法，for...in 語法就只會處理除了陣列元素以外的所有使用者定義的屬性，for...in 語法將會返回你的使用者定義的屬性的名稱，除了數字索引以外。因此在處理陣列時，最好還是使用傳統的 for 循環，並配合數字索引。

-

for each...in 語法

-

for each...in 是在 JavaScript 1.6 中引入的循環語法，他很類似 for...in，但不是針對物件的屬性的名稱，而是物件的屬性的值。

-

with 語法

-

with 語法為一整組的語句確立了預設的物件。JavaScript 會在一整組語法之內找出所有不合格的名稱，只要這個名稱是預設物件的屬性，就會將其確定。如果有一個不合格的名稱符合其中一個屬性，然後就會在語句中使用這個屬性。否則，就會被當成局域或全域的變數。

-

with 語法如下︰

-
with (object) {
-   statements
-}
-
-

範例
- 以下 with 語法指定 Math 物件為預設的物件。with 語法裡面使用了 PI 屬性和 cos、sin 方法的語句，而無需指定物件。JavaScript 會假定他們參照的是 Math 物件。

-
var a, x, y;
-var r = 10;
-with (Math) {
-   a = PI * r * r;
-   x = r * cos(PI);
-   y = r * sin(PI/2);
-}
-
-

附註︰雖然使用 with 語句可以使你的程式更加簡潔，但不當使用 with 也會在一定程度上使你的程式速度變慢。參閱 Core JavaScript 1.5 參考:語法:with。

-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:循環語法:continue_語法", "Core_JavaScript_1.5_教學:註解") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\271\274\346\211\277/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\271\274\346\211\277/index.html" deleted file mode 100644 index 4b1e65afce..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\271\274\346\211\277/index.html" +++ /dev/null @@ -1,146 +0,0 @@ ---- -title: 繼承 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承 ---- -

 

- -

繼承

- -

這裡有很多有關如何在 JavaScript 中定義類型（類別）的困惑之處，包括繼承。這裡有很多方式和一些 次優的選擇。這裡所展示的運作的最好，而且簡單。

- -

範例

- -

B 繼承 A︰

- -
function A(a)
-{
-  this.varA = a;
-}
-
-A.prototype =
-{
-  varA : null,
-  doSomething : function()
-  {
-     ...
-  }
-}
-
-function B(a, b)
-{
-  A.call(this, a);
-  this.varB = b;
-}
-
-B.prototype =
-{
-  varB : null,
-  doSomething : function() // 覆寫
-  {
-     A.prototype.doSomething.apply(this, arguments); // 呼叫親類型
-     ...
-  }
-}
-
-extend(B, A);
-
-var b = new B();
-b.doSomething();
-
- -

重點部分是︰

- - - -

此處的 extend() 並不是內建的函數，其定義如下︰

- -
function extend(child, supertype)
-{
-   child.prototype.__proto__ = supertype.prototype;
-}
-
- -

prototype 和 __proto__

- -

JavaScript 對於來自 Java 或 C++ 的開發者而言會感到一些困惑，因為他完全動態，完全執行時期，而且完全沒有類別。他完全只有實體（物件）。甚至〝類別〞也只是函數物件模擬出來的。

- -

你或許已經注意到前面我們的 function A 很特別，這並不是普通的函數，但可以和關鍵字 new 結合使用來實體化新的物件。他也可以有稱作 prototype 的特別的屬性（由 JS 標準所定義）。這個函數所做的不過是，當你呼叫 new 的時候，參考的 prototype 物件被複製到新的實體的屬性 __proto__。也就是當你這樣做 var a1 = new A() 的時候，JS（在記憶體中建立物件之後，並在使用 this 執行函數 A() 來定義他之前）只是簡單的這樣做 a1.__proto__ = A.prototype。然後當你存取實體的屬性的時候，JS 首先會檢查那些是否直接存在於物件上，如果不是的話，就從 __proto__ 搜尋。這意思是所有你定義在 prototype 裡的東西，實際上會被所有的實體所共用，而且你甚至可以在稍後修改 prototype 的部分，並且在所有既存的實體上表現出這個改變，只要你想要的話。

- -

舉例來說，當你在上面的範例中這樣做 var a1 = new A(); var a2 = new A();，然後 a1.doSomething 實際上會參考 a1.__proto__.doSomething，這些和你定義的 A.prototype.doSomething 相同，也就是 a1.__proto__.doSomething == a2.__proto__.doSomething == A.prototype.doSomething。

- -

簡而言之，prototype 是對類型而言，而 __proto__ 對實體而言都相同。

- -

__proto__ 是以遞歸的方式來看待的，也就是 a1.doSomething、a1.__proto__.doSomething、a1.__proto__.__proto__.doSomething 等等，直到找到或不存在 __proto__ 為止。

- -

所以，發生了什麼︰當你呼叫
-   var o = new Foo()
- JS 實際上只是這樣做
-   var o = new Object();
-   o.__proto__ = Foo.prototype;
-   o.Foo(); （諸如此類）
-
- 以及當你隨後這樣做
-   o.someProp
- 他會檢查 o 是否有屬性 someProp，如果沒有就檢查 o.__proto__.someProp，如果沒有就檢查 o.__proto__.__proto__.someProp 依此類推。這個最後的步驟就是 extend() 函數運作的原因。

- -

 

- -

注意，__proto__ 只能在 Mozilla 的 JS 引撉中存取。其他引撉的也有相同的運作，但不能存取 __proto__。參閱以下內容來補救。

- -

extend() 的另一個選擇

- -

還有另一個選擇，你也可以定義 extend() 如下︰

- -
function extend(child, supertype)
-{
-   child.prototype.__proto__ = supertype.prototype;
-   child.prototype.__super = supertype;
-}
-
- -

因此，當你想要在 B 中呼叫親函數的時候，你可以使用 this.__super 取代 A，例如 this.__super.call(this, a) 用於建構子，以及 this.__super.prototype.doSomething.apply(this, arguments) 用於覆載函數。

- -

注意，__proto__ 在 Mozilla 以外的 JavaScript 版本中可能無法使用。還有另一個選擇，但不是 extend() 的最佳版本，這次應該到處都可以用︰

- -
function extend(child, super)
-{
-  for (var property in super.prototype) {
-    if (typeof child.prototype[property] == "undefined")
-      child.prototype[property] = super.prototype[property];
-  }
-  return child;
-}
-
- -

這次簡單的直接把親類型的 prototype 裡所有的屬性和函數，放入到子類型的 prototype 裡。這對多重繼承而言非常有用，但要小心使用，沒有親類別會把屬性或函數定義成同樣的，或者你需要明確的把那些覆載並定義那些該怎麼做。

- -

阻礙

- -

這裡有另一個方法用來定義類型，例如︰

- -
function A()
-{
-  this.varA = "bla";
-  this.isNotSoGood = function()
-  {
-    ...
-  };
-}
-
- -

這樣也可以運作，但只是次優的選擇，因為每次你建立這個類型的物件的時候，isNotSoGood 會在每一個實體中定義一次。如果是在 .prototype 定義這些的話，就只會定義一次。

- -


- 你可以使用下面的方式來繼承︰

- -
B.prototype = new A();
-
- -

不在載入 JS 檔案的時候建立 A() 的實體。這是非常壞的點子，因為你可能需要在 A 的建構子裡做一些處理，這可能會耗費時間並因此大幅延遲載入，或嘗試存取尚未載入的東西（例如，在 utils.js 裡的函數）。

- -

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的物件:String_物件", "Core_JavaScript_1.5_教學:以類別為基礎的語言_vs._以原型為基礎的語言") }}

- -

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Inheritance" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/index.html" deleted file mode 100644 index a9a7200773..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/index.html" +++ /dev/null @@ -1,31 +0,0 @@ ---- -title: 職員的例子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子 ---- -

職員的例子

-

本章的剩餘部分會使用如下所示的職員的階層圖。

-

Image:hier01.gif

-

圖 8.1: 簡單的物件的階層

-

本範例使用了下面的物件︰

- -

其餘的範例︰

- -
-

{{ PreviousNext("Core_JavaScript_1.5_教學:以類別為基礎的語言_vs._以原型為基礎的語言", "Core_JavaScript_1.5_教學:職員的例子:階層的建立") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\346\233\264\351\235\210\346\264\273\347\232\204\345\273\272\346\247\213\345\255\220/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\346\233\264\351\235\210\346\264\273\347\232\204\345\273\272\346\247\213\345\255\220/index.html" deleted file mode 100644 index 5f071f0b00..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\346\233\264\351\235\210\346\264\273\347\232\204\345\273\272\346\247\213\345\255\220/index.html" +++ /dev/null @@ -1,145 +0,0 @@ ---- -title: 更靈活的建構子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/更靈活的建構子 -translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model -translation_of_original: >- - Web/JavaScript/Guide/Obsolete_Pages/The_Employee_Example/More_Flexible_Constructors ---- -

更靈活的建構子

-

目前為止所介紹的建構子函數並不能讓你在建立實體的時候指定屬性值。如同 Java 一般，你可以提供參數給建構子來為實體初始化屬性值。下圖顯示了做到這點的其中一個方式。

-

Image:hier05.gif
-圖 8.5: 在建構子中指定屬性，之一

-

下表顯示出 Java 和 JavaScript 對這些物件的定義。

- -
JavaScript Java 
-function Employee (name, dept) {
-  this.name = name || "";
-  this.dept = dept || "general";
-}
-
 
-public class Employee {
-   public String name;
-   public String dept;
-   public Employee () {
-      this("", "general");
-   }
-   public Employee (String name) {
-      this(name, "general");
-   }
-   public Employee (String name, String dept) {
-      this.name = name;
-      this.dept = dept;
-   }
-}
-
 
-function WorkerBee (projs) {
-  this.projects = projs || [];
-}
-WorkerBee.prototype = new Employee;
-
 
-import java.util.List;
-import java.util.ArrayList;
-
-public class WorkerBee extends Employee {
-   public List<String> projects;
-   public WorkerBee () {
-      this(new ArrayList<String>());
-   }
-   public WorkerBee (List<String> projs) {
-      projects = projs;
-   }
-}
-
-
 
-
-function Engineer (mach) {
-   this.dept = "engineering";
-   this.machine = mach || "";
-}
-Engineer.prototype = new WorkerBee;
-
 
-public class Engineer extends WorkerBee {
-   public String machine;
-   public Engineer () {
-      dept = "engineering";
-      machine = "";
-   }
-   public Engineer (String mach) {
-      dept = "engineering";
-      machine = mach;
-   }
-}
-
-


-JavaScript 的這些定義使用了特殊的用語來設定預設值︰

-
this.name = name || "";
-
-

JavaScript 的邏輯 OR 運算子 (||) 會對他的第一參數求值。如果參數轉換為 true，運算子就返回這個參數。否則，運算子返回第二個參數的值。因此，這一行測試代碼可以看成，如果 name 具有對 name 屬性而言有用的值。如果是的話，他就把 this.name 設定成這個值。否則，他就把 this.name 設定成空字串。為簡單起見，本章使用這個用語；然而，第一眼看到這種用法的時候會使人迷惑不解。請注意︰這個用法在數字或布林參數中，可能不會如預期般運作，例如 0（零）和 false 會導致預設值被選取；在這種情況下，你將會需要使用下面更為冗長的用語，他會使所有的資料類型都發生預期般的行為︰

-
this.authorized = typeof(authorized) !== 'undefined' ? authorized : true;
-
-

當你使用這個定義來建立物件的實體的時候，你可以為在局域中定義的屬性來指定值。如同圖 8.5 所示，你可以使用如下語句來建立新的 Engineer︰

-
jane = new Engineer("belau");
-
-

 Jane 的屬性現在是︰

-
jane.name == "";
-jane.dept == "engineering";
-jane.projects == [];
-jane.machine == "belau"
-
-

注意這些定義，你不能為像 name 這種繼承下來的屬性指定初始值。如果你想要在 JavaScript 中，給繼承下來的屬性指定初始值，你就需要加入更多的代碼到建構子函數中。

-

截至目前為止，建構子函數建立了通用的物件，然後為新物件指定局域的屬性和值。你的建構子也可以直接呼叫建構子函數，來為原型鏈中較高層的物件加入更多的屬性。下圖顯示了這些定義。

-

Image:hier06.gif
-圖 8.6 在建構子中指定屬性，之二

-

讓我們來更仔細的觀察其中一個定義。這是 Engineer 建構子的新定義︰

-
function Engineer (name, projs, mach) {
-  this.base = WorkerBee;
-  this.base(name, "engineering", projs);
-  this.machine = mach || "";
-}
-
-

假設你如下建立新的 Engineer 物件︰

-
jane = new Engineer("Doe, Jane", ["navigator", "javascript"], "belau");
-
-

JavaScript 遵循以下步驟︰

-
  1. new 運算子建立通用物件，並且把他的 __proto__ 屬性設定為 Engineer.prototype。
  2. new 運算子把新物件傳遞給 Engineer 建構子當作 this 關鍵字的值。
  3. 建構子為這個物件建立稱為 base 的新屬性，並且把 WorkerBee 建構子的值代入給 base 屬性。這會使 WorkerBee 建構子成為 Engineer 物件的一個方法。base 屬性的名稱並無特別之處。你可以使用任意的有效的屬性名稱；base 這個名稱只是簡單的為了他的用途而取的。
  4. 建構子呼叫 base 方法，把傳入給建構子的其中兩個參數（"Doe, Jane" 以及 {{ mediawiki.external('\"navigator\", \"javascript\"') }}）以及字串 "engineering" 當作自己的參數傳入。在建構子中明確的使用 "engineering"，表明了所有 Engineer 物件所繼承下來的 dept 屬性都有相同的值，而且這個值會覆蓋繼承自 Employee 的值。
  5. 因為 base 是 Engineer 的方法，base 呼叫端的內部是 JavaScript 在步驟 1 時和新建立的物件綁在一起的 this 關鍵字。因此，WorkerBee 函數依序把 "Doe, Jane" 以及 {{ mediawiki.external('\"navigator\", \"javascript\"') }} 參數傳遞給 Employee 建構子函數。從 Employee 建構子函數返回以後，WorkerBee 函數使用剩下的參數來設定 projects 屬性。
  6. 從 base 方法返回以後，Engineer 建構子把物件的 machine 屬性初始化成 "belau"。
  7. 從建構子返回以後，JavaScript 就把新物件代入給 jane 變數。
    8. -
-

你可能在想，要從 Engineer 建構子的內部呼叫 WorkerBee 的建構子，明明你已經為 Engineer 物件設置適當的繼承了。實際情形並非如此。呼叫 WorkerBee 建構子可以確保，與已指定屬性的 Engineer 物件一起開始的所有建構子函數都會被呼叫。然而，如果你稍後把屬性加入到 Employee 或者 WorkerBee 屬性，這些屬性並不會被 Engineer 物件所繼承。例如，假設你使用如下語句︰

-
function Engineer (name, projs, mach) {
-  this.base = WorkerBee;
-  this.base(name, "engineering", projs);
-  this.machine = mach || "";
-}
-jane = new Engineer("Doe, Jane", ["navigator", "javascript"], "belau");
-Employee.prototype.specialty = "none";
-
-

jane 物件並未繼承 specialty 屬性。你仍然需要明確的設置原型，以確保動態繼承。假設你改用這些語句︰

-
function Engineer (name, projs, mach) {
-  this.base = WorkerBee;
-  this.base(name, "engineering", projs);
-  this.machine = mach || "";
-}
-Engineer.prototype = new WorkerBee;
-jane = new Engineer("Doe, Jane", ["navigator", "javascript"], "belau");
-Employee.prototype.specialty = "none";
-
-

現在 jane 物件的 specialty 屬性的值是 "none"。

-
-

另一種繼承的方式是使用 .call/.apply 方法。以下兩者是等價的︰

- -
-function Engineer (name, projs, mach) {
-  this.base = WorkerBee;
-  this.base(name, "engineering", projs);
-  this.machine = mach || "";
-}
-
 
-function Engineer (name, projs, mach) {
-  WorkerBee.call(this, name, "engineering", projs);
-  this.machine = mach || "";
-}
-
-

使用 Javascript 的 .call 方法可以產生較為簡潔的實作，因為不再需要 ".base"。

-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:職員的例子:物件的屬性:屬性的加入", "Core_JavaScript_1.5_教學:再談屬性的繼承") }}

-
-

{{ languages( {"en": "en/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors", "es": "es/Gu\u00eda_JavaScript_1.5/El_ejemplo_Employee/Constructores_m\u00e1s_flexibles", "ja": "ja/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Praca_z_przyk\u0142adem/Wi\u0119cej_elastycznych_konstruktor\u00f3w" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/index.html" deleted file mode 100644 index 01d23df274..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/index.html" +++ /dev/null @@ -1,14 +0,0 @@ ---- -title: 物件的屬性 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性 ---- -

物件的屬性

-

本節討論物件如何從原型鏈上的其他物件來繼承屬性，以及當你在執行時期加入屬性的時候，發生了什麼事。

- -
-

{{ PreviousNext("Core_JavaScript_1.5_教學:職員的例子:階層的建立", "Core_JavaScript_1.5_教學:職員的例子:物件的屬性:屬性的繼承") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\345\212\240\345\205\245/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\345\212\240\345\205\245/index.html" deleted file mode 100644 index 4d5a456ad4..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\345\212\240\345\205\245/index.html" +++ /dev/null @@ -1,19 +0,0 @@ ---- -title: 屬性的加入 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入 ---- -

屬性的加入

-

在 JavaScript 中，你可以在執行時期把屬性加入到任何的物件。你不會受到只能使用由建構子函數提供屬性的限制。若要為特定的單一物件加入屬性，你可以把值代入給物件，如下︰

-
mark.bonus = 3000;
-
-

現在，mark 物件有了額外的屬性，而其他的 WorkerBee 不會有這個屬性。

-

如果你把新的屬性加入到已經被用作建構子函數的原型物件裡的話，就會把新的屬性加入到從原型繼承屬性的所有物件裡。例如，你可以使用如下語句把 specialty 屬性加入到所有的職員︰

-
Employee.prototype.specialty = "none";
-
-

JavaScript 一執行這個語句，mark 物件也就會有這個值為 "none" 的 specialty 屬性。下面的圖解顯示出加入這個屬性給 Employee 原型的效果，以及從 Engineer 原型覆蓋這個屬性。

-

Image:hier04.gif
- 圖 8.4: 加入屬性

-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:職員的例子:物件的屬性:屬性的繼承", "Core_JavaScript_1.5_教學:職員的例子:更靈活的建構子") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html" deleted file mode 100644 index fa38245533..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html" +++ /dev/null @@ -1,24 +0,0 @@ ---- -title: 屬性的繼承 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承 ---- -

屬性的繼承

-

假定你以如下語句建立了作為 WorkerBee 的 mark 物件（如同 圖 8.3 所示）︰

-
mark = new WorkerBee;
-
-

當 JavaScript 看見 new 運算子的時候，他就會建立新的通用物件，並且把這個新物件當作 this 關鍵字的值傳給 WorkerBee 的建構子函數。建構子函數會明確的設定 projects 屬性的值，並且隱含的把 __proto__ 屬性內部的值設定成 WorkerBee.prototype 的值。（這個屬性的名稱前後各有兩個底線字元。）__proto__ 屬性決定了用來返回屬性值的原型鏈。這些屬性一經設定，JavaScript 返回新的物件，且代入語句會把變數 mark 設定給這個物件。

-

這個過程並不會把 mark 從原型鏈上繼承下來的屬性明確的放置在 mark 物件裡的值（局域值）。當你需要某個屬性值的時候，JavaScript 首先檢查這個值是否存在於物件裡。如果存在，就直接返回這個值。如果這些變數不在局域區塊裡，JavaScript 就會檢查原型鏈（使用 __proto__ 屬性）。如果在原型鏈上的物件有這個屬性的值，就會返回這個值。如果找不到這些屬性，JavaScript 會說這個物件並沒有這個屬性。以這種方式，mark 物件就有了如下屬性和值︰

-
mark.name = "";
-mark.dept = "general";
-mark.projects = [];
-
-

mark 物件從 mark.__proto__ 裡的原型物件繼承了 name 和 dept 屬性的值。他還藉由 WorkerBee 的建構子給 projects 屬性代入局域值。JavaScript 就這樣達成了屬性和值的繼承。這個過程的部分細節會在 再談屬性的繼承 裡討論。

-

因為這些建構子並不能讓你傳入特定實體的值，這些資訊是通用的。這些屬性值預設會被所有從 WorkerBee 建立的新物件所共享。當然你也可以修改任何屬性的值。因此，你可以給 mark 特定的資訊如下︰

-
mark.name = "Doe, Mark";
-mark.dept = "admin";
-mark.projects = ["navigator"];
-
-
-

{{ PreviousNext("Core JavaScript 1.5 教學:職員的例子:物件的屬性", "Core JavaScript 1.5 教學:職員的例子:物件的屬性:屬性的加入") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\351\232\216\345\261\244\347\232\204\345\273\272\347\253\213/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\351\232\216\345\261\244\347\232\204\345\273\272\347\253\213/index.html" deleted file mode 100644 index 3e7a144656..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\351\232\216\345\261\244\347\232\204\345\273\272\347\253\213/index.html" +++ /dev/null @@ -1,135 +0,0 @@ ---- -title: 階層的建立 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立 ---- -

階層的建立

-

這裡有一些方式可以定義適當的建構子函數，以實現 Employee 的階層結構。該如何選擇定義這些的方式，主要取決於你希望你的應用程式能做什麼。

-

本節展示如何使用非常簡單的（相對來說也比較沒有彈性）定義，以示範繼承是如何運作的。在這些定義中，當你建立物件的時候，你不能指定任何的屬性值。這些新建立的物件會簡單的取得預設值，稍後你就可以修改這些值。圖 8.2 以這些簡單的定義解說了階層結構。

-

在實際的應用程式中，你可能會定義允許你在建立物件的時候提供屬性值的建構子（參閱 更靈活的建構子 以取得資訊）。現在，這些簡單的定義示範繼承是如何發生的。

-

Image:hier02.gif
- 圖 8.2: Employee 物件的定義

-

下面 Java 和 JavaScript 的 Employee 定義很類似。唯一的不同點是，在 Java 中，你需要為每一個屬性指定類型，但 JavaScript 不需要。而且你需要為 Java 類別建立明確的建構子方法。

- - - - - - - - - - - -
JavaScriptJava
- 
-function Employee () {
-this.name = "";
-this.dept = "general";
-}
-
- 		- 
-public class Employee {
-   public String name;
-   public String dept;
-   public Employee () {
-      this.name = "";
-      this.dept = "general";
-   }
-}
-
-
-

Manager 和 WorkerBee 的定義顯現出在如何指定高於繼承鏈的下一個物件時的不同點。在 JavaScript 中，你把原型實體作為建構子函數的 prototype 屬性的值加了上去。在你定義了建構子以後的任何時間點上，你都可以這麼做。在 Java 中，你只能在類別定義的內部指定親類別。你不能在類別定義的外部改變親類別。

- - - - - - - - - - - -
JavaScriptJava
- 
-function Manager () {
-this.reports = [];
-}
-Manager.prototype = new Employee;
-
-function WorkerBee () {
-this.projects = [];
-}
-WorkerBee.prototype = new Employee;
-
- 		- 
-public class Manager extends Employee {
-   public Employee[] reports;
-   public Manager () {
-      this.reports = new Employee[0];
-   }
-}
-
-public class WorkerBee extends Employee {
-   public String[] projects;
-   public WorkerBee () {
-      this.projects = new String[0];
-   }
-}
-
-
-

Engineer 和 SalesPerson 的定義所建立的物件是傳承自 WorkerBee 以及 Employee。這些類型的物件具有在鏈上比他高層的所有物件的屬性。此外，定義中還使用指定給這些物件的新值來覆蓋被繼承的 dept 屬性的值。

- - - - - - - - - - - -
JavaScriptJava
- 
-function SalesPerson () {
-   this.dept = "sales";
-   this.quota = 100;
-}
-SalesPerson.prototype = new WorkerBee;
-
-function Engineer () {
-   this.dept = "engineering";
-   this.machine = "";
-}
-Engineer.prototype = new WorkerBee;
-
- 		- 
-public class SalesPerson extends WorkerBee {
-   public double quota;
-   public SalesPerson () {
-      this.dept = "sales";
-      this.quota = 100.0;
-   }
-}
-
-public class Engineer extends WorkerBee {
-   public String machine;
-   public Engineer () {
-      this.dept = "engineering";
-      this.machine = "";
-   }
-}
-
-
-

使用這些定義，你可以建立這些物件的實體，同時實體也為他們的屬性取得預設值。圖 8.3 解說使用這些 JavaScript 定義來建立新的物件，並顯示新物件的屬性值。

-

附註: 術語實體（instance）在以類別為基礎的語言中有特定的技術含義。在這些語言中，實體就是類別的獨立成員，而且在根本上就有別於類別。在 JavaScript 中，〝實體〞並沒有這些技術含義，因為 JavaScript 並沒有類別和實體的分別。然而，在談到 JavaScript 的時候，〝實體〞也可以在通俗上用來指，使用實際的建構子函數建立的物件。因此，在這些範例中，你也可以通俗的說 jane 是 Engineer 的實體。類似的，儘管術語 親（parent）、子（child）、祖先（ancestor）、子孫（descendant）在 JavaScript 中並沒有正式的含義；你也可以隨俗的使用這些術語，來談論在原型鏈中較高或較低的某個物件。

-

Image:hier03.gif
- 圖 8.3: 使用簡單的定義來建立物件

-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:職員的例子", "Core_JavaScript_1.5_教學:職員的例子:物件的屬性") }}

-
-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\241\250\351\201\224\345\274\217/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\241\250\351\201\224\345\274\217/index.html" deleted file mode 100644 index 0d694e88f8..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\241\250\351\201\224\345\274\217/index.html" +++ /dev/null @@ -1,16 +0,0 @@ ---- -title: 表達式 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/表達式 -translation_of: Web/JavaScript/Guide/Expressions_and_Operators -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Expressions ---- -

 

-

表達式

-

表達式即任何有效的一組字面表達、變數、運算子、可求值的單一的值，值可以使用數字、字串、或邏輯值。

-

大致上來說，表達式可分為兩種︰把值代入給變數，和單純的持有值。例如，表達式 x = 7 是把值 7 代入給 x 的表達式。表達式本身的求值結果是 7。這些表達式使用代入運算子。換句話說，表達式 3 + 4 單純的求值結果為 7，且沒有代入動作。這些表達式使用的運算子又可以簡單的稱為運算子。

-

JavaScript 有以下幾種表達式︰

- -

{{ PreviousNext("Core_JavaScript_1.5_教學:Unicode", "Core_JavaScript_1.5_教學:運算子") }}

- -

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Expressions", "fr": "fr/Guide_JavaScript_1.5/Expressions", "ja": "ja/Core_JavaScript_1.5_Guide/Expressions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Wyra\u017cenia" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\250\273\350\247\243/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\250\273\350\247\243/index.html" deleted file mode 100644 index 1e922b72f2..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\250\273\350\247\243/index.html" +++ /dev/null @@ -1,21 +0,0 @@ ---- -title: 註解 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/註解 -translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Comments ---- -

註解

-

註解是作者用來解釋 Script 在做什麼的標記符號。註解會被解譯器忽略。JavaScript 支援 Java 和 C++ 形式的註解︰

- -

範例
-以下範例示範這兩種註解︰

-
// 這是單行註解。
-
-/* 這是多行註解。不管是什麼長度都可以，你也
-可以在任何你喜歡的地方使用。 */
-
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:物件的操作語法", "Core_JavaScript_1.5_教學:例外處理語法") }}

-
-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Comments", "es": "es/Gu\u00eda_JavaScript_1.5/Sentencias_para_comentarios", "fr": "fr/Guide_JavaScript_1.5/Commentaires", "ja": "ja/Core_JavaScript_1.5_Guide/Comments", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Instrukcje_komentarzy" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\256\212\346\225\270/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\256\212\346\225\270/index.html" deleted file mode 100644 index 151736f40c..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\256\212\346\225\270/index.html" +++ /dev/null @@ -1,57 +0,0 @@ ---- -title: 變數 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/變數 -translation_of: Web/JavaScript/Guide/Grammar_and_types -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Variables ---- -

 

-

變數

-

你會在你的應用程式中使用變數作為值的名稱。變數的名稱稱為識別子，並遵守以下規則。

-

JavaScript 識別子必須以字母、底線 (_)、美金符號 ($) 開頭；之後的字元就可以使用數字 (0-9)。因為 JavaScript 區分大小寫，字母包括從“A”到“Z”的字元（大寫）和從“a”到“z”的字元（小寫）。

-

從 JavaScript 1.5 開始，你可以在識別子中使用 ISO 8859-1 或 Unicode 字母，如 å、ü。你也可以使用表列於 Unicode 跳脫序列 頁面的 \uXXXX 的 Unicode 跳脫序列作為識別子。

-

合規則的名稱例子有 Number_hits、temp99 和 _name。

-

變數的宣告

-

你可以使用兩個方法宣告變數︰

- -

變數的求值

-

使用 var 語法宣告、且沒有初始值的變數，這個變數的值是 undefined。

-

企圖存取未宣告的變數，將導致 ReferenceError 例外的拋出︰

-
var a;
-print("The value of a is " + a); // 輸出 "a 的值是 undefined"
-print("The value of b is " + b); // 拋出 ReferenceError 例外
-
-

你可以使用 undefined 確認變數是否有值。在下列代碼中，變數 input 尚未代入值，所以 if 語法求出的是 true。

-
var input;
-if(input === undefined){
-  doThis();
-} else {
-  doThat();
-}
-
-

在用於布林邏輯時，undefined 值會被視為 false。例如，下面的代碼會執行函數 myFunction，因為 myArray 元素尚未定義︰

-
var myArray = new Array();
-if (!myArray[0]) myFunction();
-
-

當你對 null 變數求值時，null 值在用於數值時會被視為 0，而在用於布林邏輯時則視為 false。例如︰

-
var n = null;
-print(n * 32); // 輸出 0
-

變數的作用域

-

當你在任何函數之外宣告變數時，這個變數就稱為全域變數，因為這個變數可以在整份文件中的任何代碼裡使用。當你在函數之內宣告變數時，這個變數就稱為局域變數，因為這個變數只能在函數之內使用。

-

JavaScript 的 區塊語法 並沒有作用域；在區塊之內的代碼不會是局域的。例如在下面的代碼中，如果 condition 是 false，結果會輸出 0，而不是拋出例外︰

-
if (condition) {
-  var x = 5;
-}
-print(x ? x : 0);
-
-

另一個在 JavaScript 中關於變數的獨特行為是，你可以參考稍後才會宣告的變數，而不會引起例外︰

-
print(x === undefined); // 輸出 "true"
-var x = 3;
-
-

全域變數

-

全域變數其實就是全域物件的屬性。在 Web 頁面中，全域物件是 window，所以你可以使用 window.variable 語法設定並存取全域變數。

-

因此，你可以從另一個視窗或框架，藉由指定視窗或框架的名稱，來存取宣告在視窗或框架裡的全域變數。例如，如果有一個稱為 phoneNumber 的變數是在 FRAMESET 文件中宣告，你可以從名為 parent.phoneNumber 的子框架參考這個變數。

-

參閱

-

JavaScript 的 Sharp 變數

-

{{ PreviousNext("Core_JavaScript_1.5_教學:值", "Core_JavaScript_1.5_教學:常數") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Variables", "es": "es/Gu\u00eda_JavaScript_1.5/Variables", "fr": "fr/Guide_JavaScript_1.5/Variables", "ja": "ja/Core_JavaScript_1.5_Guide/Variables", "ko": "ko/Core_JavaScript_1.5_Guide/Variables", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Zmienne", "zh-cn": "cn/Core_JavaScript_1.5_Guide/\u53d8\u91cf" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\277\255\344\273\243\345\231\250\345\222\214\347\224\242\347\224\237\345\231\250/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\277\255\344\273\243\345\231\250\345\222\214\347\224\242\347\224\237\345\231\250/index.html" deleted file mode 100644 index 21029266db..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\277\255\344\273\243\345\231\250\345\222\214\347\224\242\347\224\237\345\231\250/index.html" +++ /dev/null @@ -1,293 +0,0 @@ ---- -title: 迭代器和產生器 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器 ---- -

迭代器和產生器

- -

處理集合中的每一項是很常見的操作。JavaScript 提供了許多迭代整個集合的方式，從簡單的 for 和 for each 循環到 map()、filter() 以及 陣列的簡約式。迭代器和產生器是在 JavaScript 1.7 引入的，帶來在核心語言中直接迭代的觀念，並提供自訂 for...in 和 for each 循環的行為的機制。

- -
附注: yield 關鍵字只能在 HTML 裡包有 <script type="application/javascript;version=1.7"> 區塊（或更高的版本）的代碼區塊中使用。 XUL Script 標記可以存取這些功能，無須這個特別的區塊。
- -

迭代器

- -

迭代器（Iterator）是一種知道如何從集合裡每次以同樣的方式存取項目的物件。並保持對自己序列內部的目前位置的追蹤。在 JavaScript 中，迭代器是一種提供有能夠返回序列中的下一項的 next() 方法的物件。這個方法可以在序列用盡時，選擇性的出現 StopIteration 例外。

- -

迭代器物件一經建立以後，可以明確的反覆呼叫 next() 來使用，或隱含的使用 JavaScript 的 for...in 和 for each 結構。

- -

可以使用 Iterator() 函數來為物件和陣列建立簡單的迭代器︰

- -
var lang = { name: 'JavaScript', birthYear: 1995 };
-var it = Iterator(lang);
-
- -

一經初始化以後，就可以呼叫 next() 方法依序從物件中存取鍵值對（key-value pair）︰

- -
var pair = it.next(); // 鍵值對是 ["name", "JavaScript"]
-pair = it.next(); // 鍵值對是 ["birthYear", 1995]
-pair = it.next(); // 拋出 StopIteration 例外
-
- -

可以使用 for...in 循環來取代直接呼叫 next() 方法。循環會在 StopIteration 例外出現的時候自動終止。

- -
var it = Iterator(lang);
-for (var pair in it)
-  print(pair); // 依序輸出每一個 [key, value] 對
-
- -

如果我們只想要迭代物件的鍵（key），我們可以把第二個參數 true 傳給 Iterator() 函數︰

- -
var it = Iterator(lang, true);
-for (var key in it)
-  print(key); // 依序輸出每一個鍵
-
- -

使用 Iterator() 存取物件內容的其中一個好處是已經加入到 Object.prototype 的自訂屬性不會被包含在序列裡。

- -

Iterator() 也可以和陣列一起使用︰

- -
var langs = ['JavaScript', 'Python', 'C++'];
-var it = Iterator(langs);
-for (var pair in it)
-  print(pair); // 依序輸出每一個 [index, language] 對
-
- -

如同物件一般，傳入 true 作為第二個參數，將導致迭代出存在於陣列裡的索引︰

- -
var langs = ['JavaScript', 'Python', 'C++'];
-var it = Iterator(langs, true);
-for (var i in it)
-  print(i); // 輸出 0，然後是 1，然後是 2
-
- -

他也可以把 for 循環內部使用的 let 關鍵字的索引和值兩者，代入給區塊作用域的變數，並分割代入︰

- -
var langs = ['JavaScript', 'Python', 'C++'];
-var it = Iterator(langs);
-for (let [i, lang] in it)
- print(i + ': ' + lang); // 輸出 "0: JavaScript" 等等。
-
- -

自訂的迭代器的定義

- -

有一些物件所表示的集合項，應該以特定的方式來迭代。

- - - -

JavaScript 可讓你編寫表示自訂迭代器邏輯的代碼，並把他連結到物件上。

- -

我們將會建立簡單的 Range 物件，這個物件存放了 low 和 high 值。

- -
function Range(low, high)
-{
-  this.low = low;
-  this.high = high;
-}
-
- -

現在我們將會建立自訂的迭代器，使其返回包含在某一範圍內的整數序列。迭代器的界面必須要有由我們提供的 next() 方法，這個方法會返回來自序列的某一項，或拋出 StopIteration 例外。

- -
function RangeIterator(range)
-{
-  this.range = range;
-  this.current = this.range.low;
-}
-RangeIterator.prototype.next = function()
-{
-  if (this.current > this.range.high)
-    throw StopIteration;
-  var current = this.current;
-  this.current += 1;
-  return current;
-};
-
- -

我們的 RangeIterator 就是有範圍限制的實體的實際例子，並維護他自己的 current 屬性用以追蹤他沿著序列已走了多遠。

- -

最後，把我們的 RangeIterator 和 Range 物件連繫在一起，我們需要加入特別的 __iterator__ 方法給 Range。這個方法會在當我們試圖迭代 Range 實體的時候呼叫，而且應該會返回 RangeIterator 的實體，這個實體實裝了迭代器的邏輯。

- -
Range.prototype.__iterator__ = function()
-{
-  return new RangeIterator(this);
-};
-
- -

掛在我們自訂的迭代器以後，我們可以迭代實體的某一範圍內，如下︰

- -
var range = new Range(3, 5);
-for (var i in range)
-  print(i); // 輸出序列中的 3，然後是 4，然後是 5
-
- -

產生器︰建構迭代器的較佳方式

- -

儘管自訂的迭代器是很好用的工具，但在建立時的程式設計必須要很謹慎，因為需要明確的維護他們的內部狀態。產生器（Generator）提供另一種更強大的選擇︰可讓你編寫能夠維護自身狀態的單一函數來定義迭代器的演算法。

- -

產生器是一種特殊類型的函數，他的運作方式類似迭代器的生產廠房。只要函數內含有一個以上的 yield 語句，就會變成產生器。

- -

當產生器函數被呼叫的時候，並不會立即執行函數的本體；取而代之的是，他會返回產生器迭代器（generator-iterator）物件。每次呼叫產生器迭代器的 next() 方法，就會執行函數本體直到下一個 yield 語句，並返回他的結果。如果執行到函數的末端或到達 return 語句，就會拋出 StopIteration 例外。

- -

配合例子是最佳的說明︰

- -
function simpleGenerator()
-{
-  yield "first";
-  yield "second";
-  yield "third";
-  for (var i = 0; i < 3; i++)
-    yield i;
-}
-
-var g = simpleGenerator();
-print(g.next()); // 輸出 "first"
-print(g.next()); // 輸出 "second"
-print(g.next()); // 輸出 "third"
-print(g.next()); // 輸出 0
-print(g.next()); // 輸出 1
-print(g.next()); // 輸出 2
-print(g.next()); // 拋出 StopIteration
-
- -

產生器函數可以像類別的 __iterator__ 方法一般直接的使用，大幅減少建立自訂的迭代器的代碼量。這裡是我們的 Range，使用產生器重新編寫︰

- -
function Range(low, high)
-{
-  this.low = low;
-  this.high = high;
-}
-Range.prototype.__iterator__ = function()
-{
-  for (var i = this.low; i <= this.high; i++)
-    yield i;
-};
-var range = new Range(3, 5);
-for (var i in range)
-  print(i); // 輸出序列中的 3，然後是 4，然後是 5
-
- -

並不是所有的產生器都會終止；有可能建立出表示無限序列的產生器。下面的產生器實裝了費伯納契數列，每一個元素都是前面兩個元素的合︰

- -
function fibonacci()
-{
-  var fn1 = 1;
-  var fn2 = 1;
-  while (1)
-  {
-    var current = fn2;
-    fn2 = fn1;
-    fn1 = fn1 + current;
-    yield current;
-  }
-}
-
-var sequence = fibonacci();
-print(sequence.next()); // 1
-print(sequence.next()); // 1
-print(sequence.next()); // 2
-print(sequence.next()); // 3
-print(sequence.next()); // 5
-print(sequence.next()); // 8
-print(sequence.next()); // 13
-
- -

產生器函數可以接受參數，這個參數是用來約束第一次被呼叫的函數。產生器可以使用 return 語句來終止（並導致 StopIteration 例外的出現）。下面的 fibonacci() 變體接受選用性的 limit 參數，一旦通過限制就會終止。

- -
function fibonacci(limit)
-{
-  var fn1 = 1;
-  var fn2 = 1;
-  while (1)
-  {
-    var current = fn2;
-    fn2 = fn1;
-    fn1 = fn1 + current;
-    if (limit && current > limit)
-      return;
-    yield current;
-  }
-}
-
- -

高階的產生器

- -

產生器會計算出要求他們產生的值，這可讓產生器更有效率的表示需要耗費大量計算的序列，甚至是上面示範的無窮數列。

- -

除了 next() 方法以外，產生器迭代器物件還有 send() 方法，可以用來修改產生器的內部狀態。傳遞給 send() 的值將會被視為中止產生器的最後一個 yield 語句的結果。在你可以使用 send() 來傳送指定的值之前，你必須至少呼叫一次 next() 來啟動產生器。

- -

這裡是使用 send() 來重新開始數列的費伯納契數產生器︰

- -
function fibonacci()
-{
-  var fn1 = 1;
-  var fn2 = 1;
-  while (1)
-  {
-    var current = fn2;
-    fn2 = fn1;
-    fn1 = fn1 + current;
-    var reset = yield current;
-    if (reset){
-        fn1 = 1;
-        fn2 = 1;
-    }
-  }
-}
-
-var sequence = fibonacci();
-print(sequence.next());     // 1
-print(sequence.next());     // 1
-print(sequence.next());     // 2
-print(sequence.next());     // 3
-print(sequence.next());     // 5
-print(sequence.next());     // 8
-print(sequence.next());     // 13
-print(sequence.send(true)); // 1
-print(sequence.next());     // 1
-print(sequence.next());     // 2
-print(sequence.next());     // 3
- -
附注: 作為有趣的一點，呼叫 send(undefined) 就相當於呼叫 next()。然而，使用除了 undefined 以外的任意值啟動新生的產生器，在呼叫 send() 的時候，將會引起 TypeError 例外。
- -

你可以藉由呼叫產生器的 throw() 方法，並傳入他應該拋出的例外值，強迫產生器拋出例外。例外將會從目前被中止的產生器的位置拋出例外，就如同目前被中止的 yield 被替換成 throw value 語句一樣。

- -

如果在拋出例外的處理期間沒有遇到 yield，然後例外將會不斷傳播直到呼叫 throw()，且隨後呼叫 next() 將導致 StopIteration 被拋出。

- -

產生器有可以強迫關閉他自己的 close() 方法。關閉產生器的效果是︰

- -
    -
  1. 執行所有在產生器函數裡的 finally 子句。
    2. -
  2. 如果 finally 子句拋出除了 StopIteration 以外的任何例外，例外會被傳播到 close() 方法的呼叫者。
    3. -
  3. 產生器終止。
    4. -
- -

產生器的表達式

- -

陣列簡約式主要的缺點是他們會造成在記憶體中建構出完整的新陣列。如果輸入的簡約式本身是小型的陣列其開銷還不明顯 - 但如果輸入的是大型的陣列或耗費資源（甚至是無限大）的產生器，新陣列的建立就會產生問題。

- -

產生器能夠延後計算他們要求的所需計算的項的序列。產生器表達式在語法上幾乎等同於 陣列的簡約式 - 他們使用圓括弧取代方括號 - 但不是建構陣列，他們建立可以延後執行的產生器。你可以把他們想成建立產生器的簡寫語法。

- -

假設我們有一個迭代器 it 可以迭代出大型的整數序列。我們想要建立可以迭代出雙倍的新迭代器。陣列簡約式會在記憶體中建立含有雙倍值的完整的陣列︰

- -
var doubles = [i * 2 for (i in it)];
-
- -

產生器表達式一方面會建立新的迭代器，能夠建立他們所需的雙倍值︰

- -
var it2 = (i * 2 for (i in it));
-print(it2.next()); // 來自 it 的第一個值，雙倍
-print(it2.next()); // 來自 it 的第二個值，雙倍
- -

如果把產生器表達式當作參數傳給函數，函數呼叫所使用的圓括弧意味著可以省略外部的圓括弧︰

- -
var result = doSomething(i * 2 for (i in it));
-
- -

 

- -

{{ PreviousNext("Core_JavaScript_1.5_教學:陣列的運用", "Core_JavaScript_1.5_教學:物件模型的細節") }}

- -

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Iterators_and_Generators" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/index.html" deleted file mode 100644 index 5c6eb2fb16..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/index.html" +++ /dev/null @@ -1,30 +0,0 @@ ---- -title: 運算子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子 -translation_of: Web/JavaScript/Guide/Expressions_and_Operators -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators ---- -

 

-

運算子

-

JavaScript 有以下幾種運算子。本節說明運算子，且包含有關運算子優先順序的資訊。

- -

JavaScript 有一元和二元兩種運算子，以及特殊的三元運算子，也就是條件運算子。二元運算子需要兩個運算元，一個在運算子之前，一個在運算子之後︰

-
operand1 operator operand2
-
-

例如，3+4 或 x*y。

-

一元運算子需要一個運算元，可以運算子之前或之後︰

-
operator operand
-
-

或

-
operand operator
-
-

例如，x++ 或 ++x。

-

運算子的優先順序

-

按照相關的討論，本表採用由高到低的優先順序。

- -
運算子類型 單獨的運算子
成員 .  []
呼叫 / 建立實體 ()  new
反轉 / 遞增 !  ~  -  +  ++  --  typeof  void  delete
乘法 / 除法 *  /  %
加法 / 減法 +  -
位元位移 <<  >>  >>>
關係 <  <=  >  >=  in  instanceof
等價 ==  !=  ===  !==
位元 AND &
位元 XOR ^
位元 OR |
邏輯 AND &&
邏輯 OR ||
條件 ?:
代入 =  +=  -=  *=  /=  %=  <<=  >>=  >>>=  &=  ^=  |=
逗號 ,
-

表 3.1: 運算子的優先順序

-

有關本表的詳細版本，且附有關於運算子的完整細節，請參閱 參考的章節。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:表達式", "Core_JavaScript_1.5_教學:運算子:代入運算子") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators", "es": "es/Gu\u00eda_JavaScript_1.5/Operadores", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs", "ja": "ja/Core_JavaScript_1.5_Guide/Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\344\273\243\345\205\245\351\201\213\347\256\227\345\255\220/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\344\273\243\345\205\245\351\201\213\347\256\227\345\255\220/index.html" deleted file mode 100644 index 31b103c23f..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\344\273\243\345\205\245\351\201\213\347\256\227\345\255\220/index.html" +++ /dev/null @@ -1,65 +0,0 @@ ---- -title: 代入運算子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/代入運算子 -translation_of: Web/JavaScript/Guide/Expressions_and_Operators -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Comparison_Operators ---- -

 

-

代入運算子

-

代入運算子根據右邊運算元的值，把值代入給左邊運算元的值。最基本的代入運算子是等號 (=)，他會把右邊運算元的值代入給左邊運算元的值。也就是說，x = y 就是把 y 的值代入給 x。

-

其餘的代入運算子只是標準運算子的簡記法，如下表所示。

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
運算子的簡記法意義
x += yx = x + y
x -= yx = x - y
x *= yx = x * y
x /= yx = x / y
x %= yx = x % y
x <<= yx = x << y
x >>= yx = x >> y
x >>>= yx = x >>> y
x &= yx = x & y
x ^= yx = x ^ y
x |= yx = x | y
-

表 3.2: 代入運算子

-

{{ PreviousNext("Core_JavaScript_1.5_教學:運算子", "Core_JavaScript_1.5_教學:運算子:比較運算子") }}

-

 

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\344\275\215\345\205\203\351\201\213\347\256\227\345\255\220/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\344\275\215\345\205\203\351\201\213\347\256\227\345\255\220/index.html" deleted file mode 100644 index 6109b2d6e3..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\344\275\215\345\205\203\351\201\213\347\256\227\345\255\220/index.html" +++ /dev/null @@ -1,31 +0,0 @@ ---- -title: 位元運算子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/位元運算子 -translation_of: Web/JavaScript/Guide/Expressions_and_Operators -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Bitwise_Operators ---- -

 

-

 

-

位元運算子

-

位元運算子把他們的運算元視為一組 32 位元的集合（零或一），而非十進制、十六進制、八進制。例如，十進制數 9 的二進制表示法為 1001。位元運算子對這些二進制表示法進行運算，並返回標準的 JavaScript 數值。

-

下表解說 JavaScript 的位元運算子。

- -
運算子 用法 說明
位元 AND a & b 每一個對應至同一位元位置的兩個運算元兩者為 1 時，返回 1。
位元 OR a | b 每一個對應至同一位元位置的兩個運算元兩者或其中一者為 1 時，返回 1。
位元 XOR a ^ b 每一個對應至同一位元位置的兩個運算元其中一者而非兩者為 1 時，返回 1。
位元 NOT ~ a 反轉運算元的位元。
左移 a << b 往左移動 a 的二進制表示法 b 位元，從右邊補 0。
維持符號右移 a >> b 往右移動 a 的二進制表示法 b 位元，丟棄移出的位元。
填 0 右移 a >>> b 往右移動 a 的二進制表示法 b 位元，丟棄移出的位元，並從左邊補 0。
-

表 3.5: 位元運算子

-

位元邏輯運算子

-

大致上，位元邏輯運算子的運作如下︰

- -

舉個例子，9 的二進制表示法是 1001，15 的二進制表示法是 1111。因此，當位元的運算子套用到這些值上時，結果如下︰

- -

位元位移運算子

-

位元位移運算子有兩個運算元︰第一個是被移動的數值，第二個指定第一個運算元要移動的位元位置的數目。位移運算元的方向是以使用的運算元來控制。

-

位移運算子轉換這些運算元為 32 位元整數，並返回與左邊運算元同類型的結果。

-

位移運算子列於下表。

- -
運算子 說明 範例
<<（左移） 這個運算子把第一個運算元向左移動指定的位元數。丟棄向左移出的多餘位元。從右邊填補 0 的位元。 9<<2 的結果是 36，因為 1001 向左移動 2 位元而變成 100100，此即 36。
>>（維持符號右移） 這個運算子把第一個運算元向右移動指定的位元數。丟棄向右移出的多餘位元。從左邊填補在最左邊複製的位元。 9>>2 的結果是 2，因為 1001 向右移動 2 位元而變成 10，此即 2。同樣的，-9>>2 的結果是 -3，因為保留了正負號。
>>>（填 0 右移） 這個運算子把第一個運算元向右移動指定的位元數。丟棄向右移出的多餘位元。從右邊填補 0 的位元。 19>>>2 的結果是 4，因為 10011 向右移動 2 位元而變成 100，此即 4。對於非負數而言，補 0 右移和維持符號右移的結果相同。
-

表 3.6: 位元位移運算子

-

{{ PreviousNext("Core_JavaScript_1.5_教學:運算子:算術運算子", "Core_JavaScript_1.5_教學:運算子:邏輯運算子") }}

- -

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/Bitwise_Operators", "es": "es/Gu\u00eda_JavaScript_1.5/Operadores/Operadores_sobre_bits", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_bit-\u00e0-bit", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/Bitwise_Operators", "ko": "ko/Core_JavaScript_1.5_Guide/Operators/Bitwise_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operatory_bitowe" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\345\255\227\344\270\262\351\201\213\347\256\227\345\255\220/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\345\255\227\344\270\262\351\201\213\347\256\227\345\255\220/index.html" deleted file mode 100644 index 0589aefd73..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\345\255\227\344\270\262\351\201\213\347\256\227\345\255\220/index.html" +++ /dev/null @@ -1,12 +0,0 @@ ---- -title: 字串運算子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/字串運算子 -translation_of: Web/JavaScript/Guide/Expressions_and_Operators -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/String_Operators ---- -

 

-

字串運算子

-

除了比較運算子可以用於字串值以外，連結運算子 (+) 把兩個字串值串連在一起，返回另一個以兩個運算元字串連結的字串。例如，"my " + "string" 返回 "my string" 字串。

-

代入運算子 += 的簡記法也可用於連結字串。例如，如果變數 mystring 內有 "alpha" 值，mystring += "bet" 表達式的求值為“alphabet”，並把這個值代入到 mystring。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:運算子:邏輯運算子", "Core_JavaScript_1.5_教學:運算子:特殊運算子") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/String_Operators", "es": "es/Gu\u00eda_JavaScript_1.5/Operadores/Operadores_de_cadenas_de_caracteres_(string)", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_li\u00e9s_aux_cha\u00eenes", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/String_Operators", "ko": "ko/Core_JavaScript_1.5_Guide/Operators/String_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operacje_na_\u0142a\u0144cuchach" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\346\257\224\350\274\203\351\201\213\347\256\227\345\255\220/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\346\257\224\350\274\203\351\201\213\347\256\227\345\255\220/index.html" deleted file mode 100644 index 2ce01c1501..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\346\257\224\350\274\203\351\201\213\347\256\227\345\255\220/index.html" +++ /dev/null @@ -1,14 +0,0 @@ ---- -title: 比較運算子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子 ---- -

 

-

比較運算子

-

This seems to me kind of poorly explained, mostly the diference betwen "==" and "==="...比較運算子比較他的運算元，並根據比較是否為真的結果返回邏輯值。運算元可以是數值、字串、邏輯或物件的值。字串是以 Unicode 的值作為標準的字典順序來比較。在大多數情況下，如果兩個運算元不是同樣的類型，JavaScript 會為了比較而嘗試把運算元轉換為適當的類型。（本規則的唯一例外是 === 和 !==，他會進行“嚴格的”相等性和不相等性的檢查，且在檢查等相性之前，並不會把運算元轉換為相容的類型。）通常以數值進行比較。下表以範例代碼解明比較運算子︰

-
var var1 = 3, var2 = 4;
-
- -
運算子 說明 返回 true 的範例
等於 (==) 運算元相等時，返回 true。 3 == var1

"3" == var1

3 == '3'
不等於 (!=) 運算元不相等時，返回 true。 var1 != 4
var2 != "3"
嚴格的等於 (===) 運算元相等且類型相同時，返回 true。 3 === var1
嚴格的不等於 (!==) 運算元不相等或類型不相同時，返回 true。 var1 !== "3"
3 !== '3'
大於 (>) 左邊的運算元大於右邊的運算元時，返回 true。 var2 > var1
"12" > 2
大於或等於 (>=) 左邊的運算元大於或等於右邊的運算元時，返回 true。 var2 >= var1
var1 >= 3
小於 (<) 左邊的運算元小於右邊的運算元時，返回 true。 var1 < var2
"12" < "2"
小於或等於 (<=) 左邊的運算元小於或等於右邊的運算元時，返回 true。 var1 <= var2
var2 <= 5
-

表 3.3: 比較運算子

-

{{ PreviousNext("Core_JavaScript_1.5_教學:Operators:代入運算子", "Core_JavaScript_1.5_教學:運算子:算術運算子") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/Comparison_Operators", "es": "es/Gu\u00eda_JavaScript_1.5/Operadores/Operadores_de_comparaci\u00f3n", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_de_comparaison", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/Comparison_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operatory_por\u00f3wnania" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\347\211\271\346\256\212\351\201\213\347\256\227\345\255\220/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\347\211\271\346\256\212\351\201\213\347\256\227\345\255\220/index.html" deleted file mode 100644 index a37ea47e50..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\347\211\271\346\256\212\351\201\213\347\256\227\345\255\220/index.html" +++ /dev/null @@ -1,186 +0,0 @@ ---- -title: 特殊運算子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/特殊運算子 -translation_of: Web/JavaScript/Guide/Expressions_and_Operators -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Special_Operators ---- -

 

-

特殊運算子

-

JavaScript 提供下列的特殊運算子︰

- -

條件運算子

-

條件運算子是 JavaScript 唯一使用三個運算元的運算子。運算子根據條件得到兩個值的其中一個。語法為︰

-
condition ? val1 : val2
-
-

如果 condition 為 true，運算子得到 val1 的值。否則得到 val2 的值。你可以在條件運算子上使用標準運算子。

-

例如，

-
status = (age >= 18) ? "adult" : "minor"
-
-

這個語句把“adult”的值代入給變數 status，只要 age 是 18 以上。否則，把“minor”的值代入給 status。

-

逗號運算子

-

逗號運算子 (,) 簡單的對他的兩個運算元求值，並返回第二個運算元的值。這個運算子主要用在 for 迴圈內部，使多個變數可在每一次的循環中更新。

-

例如，如果 a 是各邊含有 10 個元素的二維陣列，以下代碼使用逗號運算子同時遞增兩個變數。這個代碼在陣列裡輸出斜三角元素︰

-
for (var i=0, j=9; i <= 9; i++, j--)
-   document.writeln("a["+i+"]["+j+"]= " + a[i][j])
-
-

delete

-

delete 運算子可刪除物件、物件的屬性、陣列中指定索引的元素。語法為︰

-
delete objectName
-delete objectName.property
-delete objectName[index]
-delete property // 只在 with 語法之內有效
-
-

此處的 objectName 是指物件的名稱，property 是指現存的屬性，index 是指陣列中以整數表示的元素位置。

-

第四種於物件中刪除屬性的形式，只在 with 語法之內有效。

-

你可以使用 delete 運算子刪除以隱式宣告、沒有使用 var 語法的變數。

-

如果 delete 運算子成功的話，他會把屬性或元素設定為 undefined。如果操作是可行的話，delete 運算子返回 true；如果操作不可行，就返回 false。

-
x=42
-var y= 43
-myobj=new Number()
-myobj.h=4      // 建立屬性 h
-delete x       // 返回 true（如果以隱式宣告，就可以刪除）
-delete y       // 返回 false（如果以 var 宣告，就不能刪除）
-delete Math.PI // 返回 false（預先定義的屬性不能刪除）
-delete myobj.h // 返回 true（使用者定義的屬性可以刪除）
-delete myobj   // 返回 true（如果以隱式宣告，就可以刪除）
-

刪除陣列裡的元素
-當你刪除陣列元素時，陣列的長度並不受影響。舉例來說，如果你刪除 a{{ mediawiki.external(3) }}，a{{ mediawiki.external(4) }} 仍然是 {{ mediawiki.external(4) }}，a{{ mediawiki.external(3) }} 則是 undefined。

-

當 delete 運算子移除陣列的元素時，這個元素便不復存在於陣列之中。在以下範例中，使用 delete 移除 trees{{ mediawiki.external(3) }}。

-
trees=new Array("redwood","bay","cedar","oak","maple")
-delete trees[3]
-if (3 in trees) {
-   // 此處不會被執行
-}
-
-

如果你希望陣列元素存在、且元素的值是未定義，就使用 undefined 關鍵字取代 delete 運算子。在以下範例中，trees{{ mediawiki.external(3) }} 的值被代入為 undefined，而陣列元素仍然存在︰

-
trees=new Array("redwood","bay","cedar","oak","maple")
-trees[3]=undefined
-if (3 in trees) {
-   // 此處會被執行
-}
-

in

-

如果指定的屬性存在於指定的物件中，in 運算子返回 true。語法為︰

-
propNameOrNumber in objectName
-
-

此處 propNameOrNumber 是指表示為屬性名的字串、或表示為陣列索引的數值的表達式，objectName 是指物件的名稱。

-

以下範例示範 in 運算子的使用方法。

-
// 陣列
-trees=new Array("redwood","bay","cedar","oak","maple")
-0 in trees        // 返回 true
-3 in trees        // 返回 true
-6 in trees        // 返回 false
-"bay" in trees    // 返回 false（你必須指定索引編號，而不是索引上的值）
-"length" in trees // 返回 true（length 是 Array 的屬性）
-
-// 預先定義的物件
-"PI" in Math          // 返回 true
-myString=new String("coral")
-"length" in myString  // 返回 true
-
-// 自訂的物件
-mycar = {make:"Honda",model:"Accord",year:1998}
-"make" in mycar  // 返回 true
-"model" in mycar // 返回 true
-

instanceof

-

如果指定的物件屬於指定的物件的類型，instanceof 運算子返回 true。語法為︰

-
objectName instanceof objectType
-
-

此處 objectName 是指用來和 objectType 作比較的物件的名稱，objectType 是指物件的類型，如 Date 或 Array。

-

當你需要確認執行中物件的類型時，就使用 instanceof。舉個例子，當接受到例外時，你可以根據被拋出的例外來決定要執行哪一條例外處理。

-

例如，以下代碼使用 instanceof 確認 theDay 是否屬於 Date 物件。由於 theDay 屬於 Date 物件，所以會執行 if 語法裡的語句。

-
theDay=new Date(1995, 12, 17)
-if (theDay instanceof Date) {
-   // 被執行的語句
-}
-

new

-

你可以使用 new 運算子來建立使用者定義的物件類型的實體，或建立預先定義的物件類型 Array、Boolean、Date、Function、Image、Number、Object、Option、RegExp、String 其中之一。在伺服器上，你也可以用於 DbPool、Lock、File、SendMail。new 的使用方法如下︰

-
objectName = new objectType ( param1 [,param2] ...[,paramN] )
-
-

你也可以使用物件的初始化子來建立物件，如同 物件初始化子的使用 所述。

-

參閱 Core JavaScript 參考中的 new 運算子 頁面，以取得更多資訊。

this

-

使用 this 關鍵字可參考目前所使用的物件。一般而言，this 是在方法裡、並參考了呼叫這個方法的物件。this 的使用方法如下︰

-
this[propertyName]
-
-

範例 1
-假設有一個稱為 validate 的函數可驗證某一物件的 value 屬性，並以物件和上限、下限值作為參數︰

-
function validate(obj, lowval, hival) {
-   if ((obj.value < lowval) || (obj.value > hival))
-      alert("Invalid Value!")
-}
-
-

你可以在每一個表單元素的 onChange 事件處理器中呼叫 validate，並使用 this 傳送表單元素，如下範例︰

-
<B>Enter a number between 18 and 99:</B>
-<INPUT TYPE = "text" NAME = "age" SIZE = 3
-   onChange="validate(this, 18, 99)">
-
-

範例 2
-結合 form 屬性時，this 也可以參考目前所使用的物件的親表單。在以下範例中，表單 myForm 內含一個 Text 物件和按鈕。當使用者點擊按鈕，Text 物件的值便設定為表單的名稱。按鈕的 onClick 事件處理器使用 this.form 來參考親表單 myForm。

-
<FORM NAME="myForm">
-Form name:<INPUT TYPE="text" NAME="text1" VALUE="Beluga">
-<P>
-<INPUT NAME="button1" TYPE="button" VALUE="Show Form Name"
-   onClick="this.form.text1.value=this.form.name">
-</FORM>
-
-

typeof

-

typeof 運算子可按下列兩種方式來使用︰

-
1. typeof operand
-2. typeof (operand)
-
-

typeof 運算子可返回字串，這些字串指出未求值的運算元的類型。operand 是指字串、變數、關鍵字、物件，其類型可被 typeof 返回。括弧並非必要的。

-

假設你定義了以下變數︰

-
var myFun = new Function("5+2")
-var shape="round"
-var size=1
-var today=new Date()
-
-

typeof 運算子對以下變數返回以下結果︰

-
typeof myFun 返回的是 function
-typeof shape 返回的是 string
-typeof size 返回的是 number
-typeof today 返回的是 object
-typeof dontExist 返回的是 undefined
-
-

對於 true 和 null 關鍵字而言，typeof 運算子返回以下結果︰

-
typeof true 返回的是 boolean
-typeof null 返回的是 object
-
-

對於數字或字串而言，typeof 運算子返回以下結果︰

-
typeof 62 返回的是 number
-typeof 'Hello world' 返回的是 string
-
-

對於屬性值而言，typeof 運算子返回屬性裡的值的類型︰

-
typeof document.lastModified 返回的是 string
-typeof window.length 返回的是 number
-typeof Math.LN2 返回的是 number
-
-

對於方法和函數而言，typeof 運算子返回以下結果︰

-
typeof blur 返回的是 function
-typeof eval 返回的是 function
-typeof parseInt 返回的是 function
-typeof shape.split 返回的是 function
-
-

對於預先定義的物件而言，typeof 運算子返回以下結果︰

-
typeof Date 返回的是 function
-typeof Function 返回的是 function
-typeof Math 返回的是 function
-typeof Option 返回的是 function
-typeof String 返回的是 function
-
-

void

-

void 運算子可按下列兩種方式來使用︰

-
1. void (expression)
-2. void expression
-
-

void 運算子表示表達式求值之後不必把值返回。expression 是指可供求值的 JavaScript 表達式。表達式兩邊的圓括號並不是必要的，但圓括號的使用對閱讀有利。

-

你可以把 void 運算子使用於當作超連結的表達式。表達式會被求值，但不會被載入而取代目前的文件。

-

以下代碼建立了什麼也不做的超連結。當使用者點擊連結時，void(0) 的求值為 undefined，這在 JavaScript 中並沒有作用。

-
<A HREF="javascript:void(0)">Click here to do nothing</A>
-
-

以下代碼建立了超連結，當使用者點擊時，就傳送表單。

-
<A HREF="javascript:void(document.form.submit())">
-Click here to submit</A>
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:運算子:字串運算子", "Core_JavaScript_1.5_教學:正規表達式的建立") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/Special_Operators", "es": "es/Gu\u00eda_JavaScript_1.5/Operadores/Operadores_especiales", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_sp\u00e9ciaux", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/Special_Operators", "ko": "ko/Core_JavaScript_1.5_Guide/Operators/Special_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operatory_specjalne" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\347\256\227\350\241\223\351\201\213\347\256\227\345\255\220/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\347\256\227\350\241\223\351\201\213\347\256\227\345\255\220/index.html" deleted file mode 100644 index e00a0e612b..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\347\256\227\350\241\223\351\201\213\347\256\227\345\255\220/index.html" +++ /dev/null @@ -1,20 +0,0 @@ ---- -title: 算術運算子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/算術運算子 -translation_of: Web/JavaScript/Guide/Expressions_and_Operators -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Arithmetic_Operators ---- -

 

-

算術運算子

-

算術運算子把數值（字面表達或變數其中一種）作為運算元，並返回 1 個數值。標準的算術運算子有加法 (+)、減法 (-)、乘法 (*)、除法 (/)。這些運算子在大部分的程式語言中，都以原來的方式運作。當使用於浮點數時（須特別注意，除以零會產生 NaN）︰

-
1 / 2      // 在 JavaScript 中返回 0.5
-1 / 2      // 在 Java 中返回 0（這兩個數並未明確表示為浮點數）
-
-1.0 / 2.0  // 在 JavaScript 和 Java 中都返回 0.5
-
-

此外，JavaScript 提供了列於下表的算術運算子。

- -
運算子 說明 範例
%（模數） 二元運算子。返回兩數相除之後的整數餘數。 12 % 5 返回 2。
++（遞增） 一元運算子。運算元加 1。如果用作為前綴運算子 (++x)，返回運算元加 1 之後的值；如果用作為後綴運算子 (x++)，返回運算元加 1 之前的值。 如果 x 是 3，然後 ++x 把 x 設為 4 並返回 4，反之 x++ 返回 3，然後把 x 設為 4。
--（遞減） 一元運算子。運算元減 1。返回的值和遞增運算子類似。 如果 x 是 3，然後 --x 把 x 設為 2 並返回 2，反之 x-- 返回 3，然後把 x 設為 2。
-（正負反轉） 一元運算子。返回將運算子的正負號反轉的值。 如果 x 是 3，然後 -x 返回 -3。
-

表 3.4: 算術運算子

-

{{ PreviousNext("Core_JavaScript_1.5_教學:運算子:比較運算子", "Core_JavaScript_1.5_教學:運算子:位元運算子") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators", "es": "es/Gu\u00eda_JavaScript_1.5/Operadores/Operadores_aritm\u00e9ticos", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_arithm\u00e9tiques", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators", "ko": "ko/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operatory_arytmetyczne" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\351\202\217\350\274\257\351\201\213\347\256\227\345\255\220/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\351\202\217\350\274\257\351\201\213\347\256\227\345\255\220/index.html" deleted file mode 100644 index 7ba467a3cf..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\351\202\217\350\274\257\351\201\213\347\256\227\345\255\220/index.html" +++ /dev/null @@ -1,43 +0,0 @@ ---- -title: 邏輯運算子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/邏輯運算子 -translation_of: Web/JavaScript/Guide/Expressions_and_Operators -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Logical_Operators ---- -

 

-

邏輯運算子

-

邏輯運算子通常和布林（邏輯）值一起使用，並返回布林值。然而，&& 和 || 運算子實際上返回的是指定的運算元的其中一個的值，所以如果這些運算子與非布林值一起使用，有可能返回非布林值。邏輯運算子的說明如下表。

- -
運算子 用法 說明
&& expr1 && expr2 （邏輯 AND）如果 expr1 可以轉換為 false，就返回 expr1。否則返回 expr2。所以，當使用於布林值時，如果兩個運算元都為 true，&& 返回 true。否則返回 false。
|| expr1 || expr2 （邏輯 OR）如果 expr1 可以轉換為 true，就返回 expr1。否則返回 expr2。所以，當使用於布林值時，如果其中一個運算元為 true，|| 返回 true，如果兩個運算元都為 false，就返回 false。
! !expr （邏輯 NOT）如果運算元可以轉換為 true，就返回 false。否則返回 true。
-

表 3.7: 邏輯運算子

-

可以轉換成 false 的表達式的例子有︰對 null、0、空字串 ("") 或 undefined 求值。

-

以下代碼為 &&（邏輯 AND）運算子的範例。

-
a1=true && true       // t && t 返回 true
-a2=true && false      // t && f 返回 false
-a3=false && true      // f && t 返回 false
-a4=false && (3 == 4)  // f && f 返回 false
-a5="Cat" && "Dog"     // t && t 返回 Dog
-a6=false && "Cat"     // f && t 返回 false
-a7="Cat" && false     // t && f 返回 false
-
-

以下代碼為 ||（邏輯 OR）運算子的範例。

-
o1=true || true       // t || t 返回 true
-o2=false || true      // f || t 返回 true
-o3=true || false      // t || f 返回 true
-o4=false || (3 == 4)  // f || f 返回 false
-o5="Cat" || "Dog"     // t || t 返回 Cat
-o6=false || "Cat"     // f || t 返回 Cat
-o7="Cat" || false     // t || f 返回 Cat
-
-

以下代碼為 !（邏輯 NOT）運算子的範例。

-
n1=!true              // !t 返回 false
-n2=!false             // !f 返回 true
-n3=!"Cat"             // !t 返回 false
-
-

求值的最短路徑

-

由於邏輯表達式是由左往右求值，他們使用以下規則來測試，儘可能以“最短路徑”求值︰

- -

這些邏輯規則保證求出的值永遠正確。注意，上述表達式中的 anything 部分並未求值，因此所有未求值的部分都不會產生作用。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:運算子:位元運算子", "Core_JavaScript_1.5_教學:運算子:字串運算子") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Operators/Logical_Operators", "es": "es/Gu\u00eda_JavaScript_1.5/Operadores/Operadores_l\u00f3gicos", "fr": "fr/Guide_JavaScript_1.5/Op\u00e9rateurs/Op\u00e9rateurs_logiques", "ja": "ja/Core_JavaScript_1.5_Guide/Operators/Logical_Operators", "ko": "ko/Core_JavaScript_1.5_Guide/Operators/Logical_Operators", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Operatory/Operatory_logiczne" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\226\211\345\214\205\347\232\204\351\201\213\347\224\250/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\226\211\345\214\205\347\232\204\351\201\213\347\224\250/index.html" deleted file mode 100644 index 0e0905730f..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\226\211\345\214\205\347\232\204\351\201\213\347\224\250/index.html" +++ /dev/null @@ -1,227 +0,0 @@ ---- -title: 閉包的運用 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用 ---- -

閉包的運用

-

閉包（Closure）經常會被認為是 JavaScript 的高級機能，但了解閉包是精通語言的必要之事。

-

思考以下的函數︰

-
function init() {
-  var name = "Mozilla";
-  function displayName() {
-    alert(name);
-  }
-  displayName();
-}
-
-

init() 函數建立了稱為 name 的局域變數，然後定義了稱為 displayName() 的函數。displayName() 是內部的函數 - 他是在 init() 內部定義的，而且只在函數本體內部才可使用。displayName() 沒有他自己的局域變數，但會重複使用在外部函數裡所宣告的 name 變數。

-

本例只會做一點事 - 試試執行代碼看會發生什麼。這是詞彙作用域的範例︰在 JavaScript 中，變數的作用域是由他自己在原始碼中的位置所定義的，且內部的函數能夠存取宣告於外部作用域的變數。

-

現在思考下例︰

-
function makeFunc() {
-  var name = "Mozilla";
-  function displayName() {
-    alert(name);
-  }
-  return displayName;
-}
-
-var myFunc = makeFunc();
-myFunc();
-
-

如果你執行這個代碼，將會發生和前一個 init() 例子完全相同的效果︰字串 "Mozilla" 將會被顯示在 JavaScript 的警告方框中。其中的不同點 - 以及有趣的一點 - 是內部的 displayName() 函數會在執行之前從外部的函數所返回。

-

代碼的運作看起來也許很不直覺。通常說，在函數內部的局域變數只存在於函數執行的期間。一旦 makeFunc() 執行完畢，預期不再需要 name 變數是很合理的。由於代碼仍舊以預期般的運作，很明顯情況並不如此。

-

對於這個難題的解答是 myFunc 已經變成閉包了。閉包是一種特殊的物件，其中結合了兩樣東西︰函數，和函數所建立的環境。環境由任意的局域變數所組成，這些變數是由在閉包建立的時間點上存在於作用域裡的所有變數。既然如此，myFunc 就是結合了 displayName 函數和閉包建立之後就存在的 "Mozilla" 字串這兩者的閉包。

-

這裡還有更為有趣的範例 - makeAdder 函數︰

-
function makeAdder(x) {
-  return function(y) {
-    return x + y;
-  };
-}
-
-var add5 = makeAdder(5);
-var add10 = makeAdder(10);
-
-print(add5(2));  // 7
-print(add10(2)); // 12
-
-

在這個範例中，我們已經定義了函數 makeAdder(x)，可接受單一參數 x，並返回新的函數。返回的函數會接受單一參數 y，並返回 x 和 y 的合。

-

就本質而言，makeAdder 是函數的製造機 - 他會建立可以把指定的值和他們的參數相加的函數。在上例中，我們使用了我們的函數製造機來建立兩個新的函數 - 一個給他自己的參數加上 5，另一個則加上 10。

-

add5 和 add10 兩個都是閉包。他們共享相同的函數本體的定義，但保存了不同的環境變數。在 add5 的環境中，x 是 5。至於互有關連的 add10，x 是 10。

-

實用的閉包

-

該是拋開理論的時候了 - 但是閉包真的有用嗎？讓我們思考閉包潛在的用處。閉包讓你把一些資料（環境）和可操作資料的函數聯繫在一起。這一點明顯和物件導向程式設式並行不悖，物件可讓我們把一些資料（物件的屬性）和一個以上的方法聯繫在一起。

-

因此，如果通常你會在某個地方使用附有單一方法的物件，你可以在這些地方使用閉包。

-

視情況你可能會想這樣做，這在 Web 上尤其常見。我們寫在 Web 上的 JavaScript 代碼多半是以事件為基礎 - 我們定義了一些行為，然後把這些行為和由使用者所觸發的事件（如 click 或 keypress）連繫在一起。我們的代碼通常被連繫為 Callback︰在回應事件時，所執行的單一函數。

-

這裡有個實際的例子︰假如我們希望在頁面上加入可以調整頁面文字的按鈕。以像素為單位，指定 body 元素的 font-size 是一個方法，然後以 em 為單位，設定在頁面上（如頁眉）的其他元素的大小︰

-
body {
-  font-family: Helvetica, Aria, sans-serif;
-  font-size: 12px;
-}
-
-h1 {
-  font-size: 1.5em;
-}
-h2 {
-  font-size: 1.2em;
-}
-
-

我們的互動式文字大小按鈕可以改變 body 元素的 font-size 屬性，拜相對單位之賜，接著對其他的元素做調整。

-

JavaScript 代碼︰

-
function makeSizer(size) {
-  return function() {
-    document.body.style.fontSize = size + 'px';
-  };
-}
-
-var size12 = makeSizer(12);
-var size14 = makeSizer(14);
-var size16 = makeSizer(16);
-
-

現在 size12、size14 和 size16 這些函數可分別調整 body 文字的大小為 12、14 和 16 像素。我們可以把代碼和按鈕（本例中使用的是連結）連繫在一起，如下︰

-
function setupButtons() {
-  document.getElementById('size-12').onclick = size12;
-  document.getElementById('size-14').onclick = size14;
-  document.getElementById('size-16').onclick = size16;
-}
-
<a href="#" id="size-12">12</a>
-<a href="#" id="size-14">14</a>
-<a href="#" id="size-16">16</a>
-
-

 

-

使用閉包模擬私有的方法

-

像 Java 這類語言可以把方法宣告為私有的，意思是這些方法只能被同一類別的其他方法所呼叫。

-

JavaScript 並不提供做這些事的原生方式，但可以使用閉包來模擬私有方法。私有方法不只是對限制代碼的存取這方面有用︰同時也是管理你的全域命名空間的強大方式，把非必要的方法堆在公開的界面裡。

-

這裡是如何使用閉包來定義可以存取私有函數和變數的公開函數︰

-
var Counter = (function() {
-  var privateCounter = 0;
-  function changeBy(val) {
-    privateCounter += val;
-  }
-  return {
-    increment: function() {
-      changeBy(1);
-    },
-    decrement: function() {
-      changeBy(-1);
-    },
-    value: function() {
-      return privateCounter;
-    }
-  }
-})();
-
-alert(Counter.value()); /* 顯示 0 */
-Counter.increment();
-Counter.increment();
-alert(Counter.value()); /* 顯示 2 */
-Counter.decrement();
-alert(Counter.value()); /* 顯示 1 */
-
-

在此完成了很多事。在上一個範例中，每一個閉包都有他自己的環境；此處我們建立了由三個函數所共享的單一環境︰Counter.increment、Counter.decrement、Counter.value。

-

共享的環境是建立在無名函數的本體內，無名函數一經定義就會開始執行。環境內含兩個私有項︰稱作 privateCounter 的變數，以及稱作 changeBy 的函數。這兩個私有項都不能在無名函數外部被直接存取。相對的，必須由三個公開的函數來存取這些私有項，這三個函數是從無名函數的封裝器所返回的。

-

這三個公開的函數共享閉包的同一個環境。感謝 JavaScript 的辭彙作用域，這三個函數都能存取 privateCounter 變數和 changeBy 函數。

-

按照這個方式來運用閉包，可以得到通常是附加在物件導向程式設計裡的資料隱藏和封裝的好處。

在循環中建立閉包︰常見的錯誤

-

在 JavaScript 1.7 引入 let 關鍵字以前，閉包常見的問題出現在當閉包是在循環內部建立的時候。思考以下的例子︰

-
<p id="help">這裡會顯示有用的提示</p>
-<p>E-mail: <input type="text" id="email" name="email"></p>
-<p>姓名: <input type="text" id="name" name="name"></p>
-<p>年齡: <input type="text" id="age" name="age"></p>
-
-
function showHelp(help) {
-  document.getElementById('help').innerHTML = help;
-}
-
-function setupHelp() {
-  var helpText = [
-      {'id': 'email', 'help': '你的 e-mail 位址'},
-      {'id': 'name', 'help': '你的完整姓名'},
-      {'id': 'age', 'help': '你的年齡（你必須大於 16 歲）'}
-    ];
-
-  for (var i = 0; i < helpText.length; i++) {
-    var item = helpText[i];
-    document.getElementById(item.id).onfocus = function() {
-      showHelp(item.help);
-    }
-  }
-}
-
-

helpText 陣列定義了三個有用的提示，每一個都和文件中的輸入欄位的 ID 連繫在一起。循環會在這些定義裡巡回一圈，給每一個顯示相關連的說明的方法使用 onfocus 事件。

-

如果你試著執行這個代碼，你會發現他並不如預期般的運作。不管你把焦點放在哪一個欄位上，都會顯示關於你的年齡的訊息。

-

這其中的原因是代入給 onfocus 的函數是閉包；這些閉包是由函數的定義和從 setupHelp 函數的作用域所捕捉到的環境所組成的。這三個閉包已經建立了，但每一個都共享同一個環境。每次執行 onfocus 的 Callback 的時候，循環執行的是他自己的閉包，以及指向 helpText 列表中的最後一項的變數 item（由三個閉包所共享）。

-

本例的解決方法是使用更多的閉包︰特別是使用稍早已描述過的函數製造機︰

-
function showHelp(help) {
-  document.getElementById('help').innerHTML = help;
-}
-
-function makeHelpCallback(help) {
-  return function() {
-    showHelp(help);
-  };
-}
-
-function setupHelp() {
-  var helpText = [
-      {'id': 'email', 'help': '你的 e-mail 位址'},
-      {'id': 'name', 'help': '你的完整姓名'},
-      {'id': 'age', 'help': '你的年齡（你必須大於 16 歲）'}
-    ];
-
-  for (var i = 0; i < helpText.length; i++) {
-    var item = helpText[i];
-    document.getElementById(item.id).onfocus = makeHelpCallback(item.help);
-  }
-}
-
-

這次就如預期般運作。而不是所有的 Callback 都共享單一的環境，makeHelpCallback 給每一個 help 建立新的環境，此處的 help 參照了相對應的 helpText 陣列的字串。

-

如果你使用 JavaScript 1.7 以上的版本，你可以使用 let 關鍵字建立具有區塊層級作用域的變數來解決這個問題︰

-
  for (var i = 0; i < helpText.length; i++) {
-    let item = helpText[i];
-    document.getElementById(item.id).onfocus = function() {
-      showHelp(item.help);
-    }
-  }
-
-

let 關鍵字使 item 變數改用具有區塊層級的作用域來建立，導致 for 循環每一次反復都能建立新的參考。意思是每一個閉包都會捕捉到個別的變數，解決因為共享同一環境所引起的問題。

效能的考量

-

如果並沒有特定的任務需要用到閉包，且閉包對 Script 的效能會有負面的影響，因此在其他函數的內部裡建立不必要的函數是很不智的。

-

例如，當建立新的物件或類別時，通常應該要把方法和物件的原型連繫在一起，而不是在物件的建構子中定義。這其中的理由是，每當呼叫建構子的時候，就要把方法代入（也就是每一個物件正在建立的時候）。

-

思考以下不切實際的例子︰

-
function MyObject(name, message) {
-  this.name = String(name);
-  this.message = String(message);
-  this.getName = function() {
-    return this.name;
-  };
-
-  this.getMessage = function() {
-    return this.message;
-  };
-}
-
-

上面的代碼並未從閉包的行為中取得好處，應該改用重整過的形式︰

-
function MyObject(name, message) {
-  this.name = String(name);
-  this.message = String(message);
-}
-MyObject.prototype = {
-  getName: function() {
-    return this.name;
-  },
-  getMessage: function() {
-    return this.message;
-  }
-};
-
-

或者是︰

-
function MyObject(name, message) {
-  this.name = String(name);
-  this.message = String(message);
-}
-MyObject.prototype.getName = function() {
-  return this.name;
-};
-MyObject.prototype.getMessage = function() {
-  return this.message;
-};
-
-

在上面這兩個範例中，繼承的原型可以被所有的物件所共享，而且在每一次建立物件時不再需要方法的定義。參閱 Core_JavaScript_1.5_教學#物件模型的細節 以取得更多細節。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的函數:escape_和_unescape_函數", "Core_JavaScript_1.5_教學:物件和屬性") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Working_with_Closures", "ja": "ja/Core_JavaScript_1.5_Guide/Working_with_Closures", "pl": "pl/Przewodnik_po_języku_JavaScript_1.5/Praca_z_zamknięciami" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\227\234\346\226\274/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\227\234\346\226\274/index.html" deleted file mode 100644 index de638e2a9f..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\227\234\346\226\274/index.html" +++ /dev/null @@ -1,47 +0,0 @@ ---- -title: 關於 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於 ---- -

 

-

JavaScript 各版本的新機能

- -

你應該知道什麼

-

本教學假定你已具備如下背景知識︰

- -

具有某些語言（如 C 或 Visual Basic）的程式設計經驗會很有幫助，但不是必要的。

-

JavaScript 的版本

- -
JavaScript 的版本 Navigator 的版本
JavaScript 1.0 Navigator 2.0
JavaScript 1.1 Navigator 3.0
JavaScript 1.2 Navigator 4.0-4.05
JavaScript 1.3 Navigator 4.06-4.7x
JavaScript 1.4  
JavaScript 1.5 Navigator 6.0
Mozilla（開放源始碼的瀏覽器）
JavaScript 1.6 Firefox 1.5，其他以 Mozilla 1.8 為基礎的產品
JavaScript 1.7 Firefox 2，其他以 Mozilla 1.8.1 為基礎的產品
JavaScript 1.8 Firefox 3，其他以 Gecko 1.9 為基礎的產品
-

表 1: JavaScript 和 Navigator 版本
-
-Netscape Enterprise Server 的各版本亦分別支援不同的 JavaScript 版本。為幫助你編寫相容於 Enterprise Server 各版本的 Script，本教學使用略稱來表示 Server 的版本。

- -
略稱 Enterprise Server 的版本
NES 2.0 Netscape Enterprise Server 2.0
NES 3.0 Netscape Enterprise Server 3.0
-

表 2: Netscape Enterprise Server 各版本的略稱

-

在何處取得 JavaScript 資訊

-

以下書藉內含核心 JavaScript 的文件︰

- -

如果你是 JavaScript 的新手，就從 Core JavaScript 教學 著手。如果你已具備穩固的基礎，你可以從 Core JavaScript 參考 取得個別物件或語法的進一步細節。

-

JavaScript 的學習提示

-

JavaScript 的入門很簡單: 只需要有最新的 Web 瀏覽器。本教學使用了一些目前只能在最新版本的 Firefox（以及其化的 Gecko 瀏覽器）執行的 JavaScript 機能，所以建議使用最新版本的 Firefox。

-

互動式解譯器

-

互動式 JavaScript 的提示對於語言的學習有極大的幫助，使你不必儲存檔案或更新頁面就能以互動方式加以試驗。從 Firefox 的“工具”選單可以找到“錯誤主控台”，可提供嘗試互動式 JavaScript 的簡單途徑: 只需輸入一行代碼，並按下“執行”按鈕。

-

Image:ErrorConsole.png

-

Firebug

-

更高級的互動式提示還可使用第三方擴充套件 Firebug。Firebug 提供了高級的 DOM 檢視器（JavaScript 除錯器）、分析工具和各種實用工具︰

-

Image:Firebug.png

-

其中 Firebug 提供的最有用的功能是 console.log()，把自己的參數輸出到 Firebug 主控台的函數。有別於其他程式語言，JavaScript 並沒有輸出至標準輸出的概念。console.log() 提供了很有用的替代品，使你更容易觀察程式的執行。

-

本教學的許多範例中使用 alert() 顯示執行的訊息。如果你已安裝 Firebug，你可以使用 console.log() 取代 alert() 來執行這些範例。

-

文件慣例

-

JavaScript 應用程式可執行於許多的作業系統，本文的資訊可套用於所有的版本。檔案和資料夾路徑採用 Windows 格式（使用反斜線 (\) 分割資料夾名稱）。對 Unix 版本而言，資料夾路徑也是相同的，除非你使用斜線 (/) 取代反斜線來分割資料夾名稱。

-

本教學使用如下形式的 URL︰

-

http://server.domain/path/file.html

-

在上面的 URL 中，“server”表示執行應用程式的伺服器的名稱（例如︰research1、www），“domain”表示網際網路的域名（例如︰netscape.com、uiuc.edu），“path”表示在伺服器上的資料夾結構，“file.html”表示個別的檔名。一般來說，在 URL 裡以標準的等寬字型顯示的斜體表示是可修改的項目。如果你的伺服器已啟用 Secure Sockets Layer (SSL)，URL 的 http 就應該取代為 https。

-

本教程使用如下的字型慣例︰

- -

{{ PreviousNext("Core_JavaScript_1.5_教學", "Core_JavaScript_1.5_教學:JavaScript_概要") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/About", "es": "es/Gu\u00eda_JavaScript_1.5/Acerca_de_esta_gu\u00eda", "fr": "fr/Guide_JavaScript_1.5/\u00c0_propos", "ja": "ja/Core_JavaScript_1.5_Guide/About", "ko": "ko/Core_JavaScript_1.5_Guide/About", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/O_tym_przewodniku", "zh-cn": "cn/Core_JavaScript_1.5_Guide/\u5173\u4e8e" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\231\243\345\210\227\347\232\204\351\201\213\347\224\250/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\231\243\345\210\227\347\232\204\351\201\213\347\224\250/index.html" deleted file mode 100644 index 7f8133da58..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\231\243\345\210\227\347\232\204\351\201\213\347\224\250/index.html" +++ /dev/null @@ -1,452 +0,0 @@ ---- -title: 陣列的運用 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/陣列的運用 -translation_of: Web/JavaScript/Guide -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Working_with_Arrays ---- -

陣列是值的有序序列。有別於其他的語言，JavaScript 並沒有明確的陣列資料類型。取而代之，提供了 Array 物件，可以直接實體化或使用陣列的字面表達記法。

- -

Array 物件有以各種方式操作陣列的方法，如合併、反轉、排序。他有一個用來指定陣列長度的屬性。JavaScript 也提供有用的陣列的字面表達語法，用來建立這些物件。

- -

陣列的建立

- -

陣列可以使用字面表達語法（通常是首選）或使用 Array 的建構子（也可以稱作函數，兩者行為完全相同）來建立︰

- -
var colors = ["Red", "Green", "Blue"];
-var colors = new Array("Red", "Green", "Blue");
-var colors = Array("Red", "Green", "Blue");
-
- -

陣列具有 length 屬性，提供來存取陣列的長度。如果你使用上述其中一個例子來初始化陣列，陣列的長度將會是 3︰

- -
print(colors.length); // 3
-
- -

在建立陣列的時候，如果你知道你的陣列的預期長度，你可以給 Array 的建構子傳入長度︰

- -
var fiveItems = new Array(5);
-
- -

明確定義長度並不會影響陣列的實際容量；這樣只會影響新陣列的 length 屬性。（陣列本身並沒有小於指定值的索引的屬性。）構建子的變體極少使用到。

- -

JavaScript 1.7 引入陣列的簡約式作為建立新陣列的捷徑；下面 會討論。

- -

陣列元素的運用

- -

你可以透過把值代入給陣列元素的方式儲存陣列。下面是我們的範例 colors 陣列更為完整的實例︰

- -
var colors = []; // 空陣列
-print(colors.length); // 0
-
-colors[0] = 'Red';
-colors[1] = 'Green';
-colors[2] = 'Blue';
-print(colors.length); // 3
-
- -

附加元素至陣列的末端的常見習慣是使用 array.length 作為索引︰

- -
colors[colors.length] = 'Orange';
-
- -

可以使用 array.push() 方法達到同樣效果︰

- -
colors.push('Purple');
-
- -

陣列的元素使用元素的索引來存取。陣列是以 0 開始索引，因此陣列中的第一個元素是 0︰

- -
var red = colors[0];
-
- -

可以使用各式各樣的陣列方法來存取陣列的元素。例如，pop() 方法移除並返回陣列的最後一個元素︰

- -
var lastElement = colors.pop(); /* colors 的最後一個元素也被移除 */
-
- -

理解 length

- -

以實作的層級來說，JavaScript 的陣列實際上把元素存放成標準的物件屬性，並使用陣列的索引作為屬性的名稱。length 屬性很特別；他永遠會返回比保存在陣列中的最高索引值再高一的值︰

- -
var cats = [];
-cats[30] = ['Dusty'];
-print(cats.length); // 31
-
- -

你也可以把值代入給 length 屬性。寫下小於陣列中已存放的項目的數目，就會截掉其餘的項目；寫下 0 就完全清空陣列︰

- -
var cats = ['Dusty', 'Misty', 'Twiggy'];
-print(cats.length); // 3
-
-cats.length = 2;
-print(cats); // 輸出 "Dusty,Misty" - Twiggy 被移除了
-
-cats.length = 0;
-print(cats); // 什麼也沒輸出；cats 陣列是空的
-
- -

迭代整個陣列

- -

常見的操作就是迭代所有陣列的值，並以同樣方式處理每一個值。做到這一點的最簡單的方式如下︰

- -
var colors = ['red', 'green', 'blue'];
-for (var i = 0; i < colors.length; i++) {
-  alert(colors[i]);
-}
-
- -

如果你知道陣列中沒有一個元素會在布林的求值結果中為 false - 如果你的陣列只以 DOM 的結點組成，例如，你可以使用更有效率的習慣︰

- -
var divs = document.getElementsByTagName('div');
-for (var i = 0, div; div = divs[i]; i++) {
-  /* 以同樣方式處理 div */
-}
-
- -

這樣可以避免檢查陣列長度的開支，並且確保 div 變數被重新指定到每一次循環的使用中項目，以方便加入。

- -

 forEach 方法是在 JavaScript 1.6 引入的，提供了另一種迭代陣列的方式︰

- -
var colors = ['red', 'green', 'blue'];
-colors.forEach(function(color) {
-  alert(color);
-});
-
- -

傳給 forEach 的函數會在陣列中的每一個項目中執行一次，並把陣列的項目傳給函數作為參數。

- -

Array 的方法

- -

Array 物件有以下的方法︰

- - - -
var a1 = [1, 2, 3];
-var a2 = a1.concat(['a', 'b', 'c']);
-print(a2); // 1,2,3,a,b,c
-
- - - -
var a = ['Wind', 'Rain', 'Fire'];
-print(a.join(' - ')); // "Wind - Rain - Fire"
-
- - - -
var a = [1, 2, 3];
-var last = a.pop();
-print(a); // 1,2
-print(last); // 3
-
- - - -
var a = [1, 2];
-a.push(3);
-print(a); // 1,2,3
-
- - - -
var a = [1, 2, 3, 4];
-a.reverse();
-print(a); // 4,3,2,1
-
- - - -
var a = [1, 2, 3];
-var first = a.shift();
-print(a); // 2,3
-print(first); // 警報 1
-
- - - -
var a1 = [1, 2, 3];
-a1.unshift(4);
-print(a1); // 4,1,2,3
-
- - - -
var a1 = ['a', 'b', 'c', 'd', 'e'];
-var a2 = a1.slice(1, 4);
-print(a2); // 警報 b,c,d
-
- - - -
var a = ['a', 'b', 'c', 'd', 'e'];
-var removed = a.splice(1, 3, 'f', 'g', 'h', 'i');
-print(removed); // b,c,d
-print(a); // a,f,g,h,i,e
-
- - - -
var a = ['Wind', 'Rain', 'Fire'];
-a.sort();
-print(a); // Fire,Rain,Wind
-
- -

sort 也可以接受 Callback 函數來決定如何排序陣列的內容。這個函數會對兩個值做比較，並返回下列三個值其中之一︰

- - - -

例如，下面的例子會以字串的最後一個字母來排序︰

- -
var a = ['Wind', 'Rain', 'Fire'];
-function sortFn(a, b) {
-  var lastA = a[a.length - 1];
-  var lastB = b[b.length - 1];
-  if (lastA < lastB) return -1;
-  if (lastA > lastB) return 1;
-  if (lastA == lastB) return 0;
-}
-a.sort(sortFn);
-print(a); // Wind,Fire,Rain
-
- -

於 JavaScript 1.6 引入

- - - -

 

- -
   var a = ['a', 'b', 'a', 'b', 'a'];
-   alert(a.indexOf('b')); // 警報 1
-   // 現在再試一次，從最後的符合項之後的索引開始
-   alert(a.indexOf('b', 2)); // 警報 3
-   alert(a.indexOf('z')); // 警報 -1，因為找不到 'z'
-
- -

 

- - - -

 

- -
   var a = ['a', 'b', 'c', 'd', 'a', 'b'];
-   alert(a.lastIndexOf('b')); // 警報 5
-   // 現在再試一次，從最後的符合項之前的索引開始
-   alert(a.lastIndexOf('b', 4)); // 警報 1
-   alert(a.lastIndexOf('z')); // 警報 -1
-
- -

 

- - - -

 

- -
   var a = ['a', 'b', 'c'];
-   a.forEach(alert); // 依序警報每一個項目
-
- -

 

- - - -

 

- -
   var a1 = ['a', 'b', 'c'];
-   var a2 = a1.map(function(item) { return item.toUpperCase(); });
-   alert(a2); // 警報 A,B,C
-
- -

 

- - - -

 

- -
   var a1 = ['a', 10, 'b', 20, 'c', 30];
-   var a2 = a1.filter(function(item) { return typeof item == 'number'; });
-   alert(a2); // 警報 10,20,30
-
- -

 

- - - -

 

- -
   function isNumber(value) { return typeof value == 'number'; }
-   var a1 = [1, 2, 3];
-   alert(a1.every(isNumber)); // 警報 true
-   var a2 = [1, '2', 3];
-   alert(a2.every(isNumber)); // 警報 false
-
- -

 

- - - -

 

- -
   function isNumber(value) { return typeof value == 'number'; }
-   var a1 = [1, 2, 3];
-   alert(a1.some(isNumber)); // 警報 true
-   var a2 = [1, '2', 3];
-   alert(a2.some(isNumber)); // 警報 true
-   var a3 = ['1', '2', '3'];
-   alert(a3.some(isNumber)); // 警報 false
-
- -

 

- -

上面接受 Callback 的方法又稱為迭代方法，因為他們會以同樣的方式迭代整個陣列。其中第二個選用性的參數稱為 thisObject。如果有提供的話，thisObject 會變成 Callback 函數的本體內部的 this 關鍵字的值。

- -

實際上 Callback 函數會以三個參數來呼叫。第一個是使用中項目的值，第二個是他的陣列索引，第三個是陣列本身的參考。JavaScript 函數會忽略任何沒有在參數列表中命名的參數，因此提供只接受單一參數的 Callback 函數也很安全，如 alert。

- -

於 JavaScript 1.8 引入

- - - -

 

- -
   var a = [10, 20, 30];
-   var total = a.reduce(function(first, second) { return first + second; }, 0);
-   alert(total) // 警報 60
-
- -

 

- - - -

reduce 和 reduceRight 明顯是迭代陣列的方法中最少的。為了把序列降至單一的值，應該把他們用於遞歸合併兩個值的演算法。

- -

近似陣列的物件的運用

- -

 某些 JavaScript 物件，如 document.getElementsByTagName 返回的 NodeList，或者在函數本體內部可以利用的 arguments 物件，表面上看來外觀和行為和陣列很類似，但並未共用所有的方法。例如，arguments 物件提供 length 屬性，但並未實作 forEach 方法。

- -

在 JavaScript 1.6 中引入的通用陣列，為其他類似陣列的物件提供執行 Array 方法的途徑。每一個標準的陣列方法在 Array 物件本身都有相對應的方法；例如︰

- -
 function alertArguments() {
-   Array.forEach(arguments, function(item) {
-     alert(item);
-   });
- }
-
- -

這些通用方法可以在舊版本的 JavaScript 中，使用由 JavaScript 函數物件所提供的 call 方法，以更冗長的形式模擬。

- -
 Array.prototype.forEach.call(arguments, function(item) {
-   alert(item);
- });
-
- -

陣列的通用方法也可以使用在字串上，因為字串提供的對字元循序存取的方式，和陣列的很類似︰

- -
 Array.forEach("a string", function(char) {
-   alert(char);
- });
-
- -

二維陣列

- -

下面的代碼建立二維陣列。

- -
var a = [];
-for (i = 0; i < 4; i++) {
-   a[i] = [];
-   for (j = 0; j < 4; j++) {
-      a[i][j] = "[" + i + ", " + j + "]";
-   }
-}
-
- -

本例以如下的行來建立陣列︰

- -
行 0: [0,0][0,1][0,2][0,3]
-行 1: [1,0][1,1][1,2][1,3]
-行 2: [2,0][2,1][2,2][2,3]
-行 3: [3,0][3,1][3,2][3,3]
-
- -

陣列的簡約式

- -

在 JavaScript 1.7 中引入的陣列簡約式（array comprehension），對於以其他內容為基礎來建構新陣列提供了很有用的捷徑。簡約式通常可以用在 map() 和 filter() 呼叫的地方，或是結合這兩者的方式。

- -

下面的簡約式接收數字的陣列，並建立每一個數字的雙倍的新陣列。

- -
var numbers = [1, 2, 3, 4];
-var doubled = [i * 2 for each (i in numbers)];
-alert(doubled); // 警報 2,4,6,8
-
- -

這等同於下面的 map() 操作︰

- -
var doubled = numbers.map(function(i) { return i * 2; });
-
- -

簡約式也可以用於選取符合特定表達式的項目。這是只選取偶數的簡約式︰

- -
var numbers = [1, 2, 3, 21, 22, 30];
-var evens = [i for each (i in numbers) if (i % 2 == 0)];
-alert(evens); // 警報 2,22,30
-
- -

filter() 也可以用於同樣的用途︰

- -
var evens = numbers.filter(function(i) { return i % 2 == 0; });
-
- -

map() 和 filter() 這類型的操作可以合併至單一的陣列簡約式。這是只篩出偶數的簡約式，然後建立內含雙倍數值的新陣列。

- -
var numbers = [1, 2, 3, 21, 22, 30];
-var doubledEvens = [i * 2 for each (i in numbers) if (i % 2 == 0)];
-alert(doubledEvens); // 警報 4,44,60
-
- -

陣列簡約式的方括號導入了默許的作用域區塊。新的變數（如範例中的 i）會被視為已經使用 let 宣告過了。其意義是不能在簡約式的外部使用這些變數。

- -

輸入到陣列的簡約式本身並不需要是陣列；也可以使用 迭代器和產生器。

- -

{{ PreviousNext("Core_JavaScript_1.5_教學:繼承", "Core_JavaScript_1.5_教學:迭代器和產生器") }}

- -

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Working_with_Arrays" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/escape_\345\222\214_unescape_\345\207\275\346\225\270/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/escape_\345\222\214_unescape_\345\207\275\346\225\270/index.html" deleted file mode 100644 index 0533e2d1a4..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/escape_\345\222\214_unescape_\345\207\275\346\225\270/index.html" +++ /dev/null @@ -1,21 +0,0 @@ ---- -title: escape 和 unescape 函數 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/escape_和_unescape_函數 -translation_of: Web/JavaScript/Guide/Functions -translation_of_original: >- - Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions/escape_and_unescape_Functions ---- -

 

-
-

escape 和 unescape 函數

-

escape 和 unescape 函數可讓你把字串編碼或解碼。escape 函數會返回以 ISO Latin 字元集來表示參數的十六進制編碼。unescape 函數會對指定的十六進制編碼值返回 ASCII 字串。

-

這些函數的語句是︰

-
escape(string)
-unescape(string)
-
-

這些函數主要是在伺服端的 JavaScript 用來編碼或解碼 URL 裡的名稱和值的配對。

-

escape 和 unescape 函數在非 ASCII 字元下無法正確運作，也已被廢棄。在 JavaScript 1.5 及其後版本中，可以改用 encodeURI、decodeURI、encodeURIComponent、decodeURIComponent。

-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的函數:Number_和_String_函數", "Core_JavaScript_1.5_教學:閉鎖的運用") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Predefined_Functions/escape_and_unescape_Functions", "es": "es/Gu\u00eda_JavaScript_1.5/Funciones_predefinidas/Funciones_escape_y_unescape", "fr": "fr/Guide_JavaScript_1.5/Fonctions_pr\u00e9d\u00e9finies/Les_fonctions_escape_et_unescape", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Functions/escape_and_unescape_Functions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Funkcje_predefiniowane/Funkcje_escape_i_unescape" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/eval_\345\207\275\346\225\270/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/eval_\345\207\275\346\225\270/index.html" deleted file mode 100644 index fb257f891c..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/eval_\345\207\275\346\225\270/index.html" +++ /dev/null @@ -1,17 +0,0 @@ ---- -title: eval 函數 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/eval_函數 -translation_of: Web/JavaScript/Guide/Functions -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions/eval_Function ---- -

 

-
-

eval 函數

-

eval 函數無須參考實際的物件，就可以對 JavaScript 代碼的字串直接求值。eval 語法如下︰

-
eval(expr)
-
-

此處 expr 就是要被求值的字串。

-

如果字串表示成表達式，eval 就會對表達式求值。如果參數（expr）表示成一個以上的 JavaScript 語句，eval 就會對語句求值。eval 代碼的作用域等同於呼叫端代碼的作用域。不要用 eval 來對算術表達式求值，JavaScript 會自動的對算術表達式來求值。

-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的函數", "Core_JavaScript_1.5_教學:預先定義的函數:isFinite_函數") }}

-

{{ languages( {"en": "en/Core_JavaScript_1.5_Guide/Predefined_Functions/eval_Function", "fr": "fr/Guide_JavaScript_1.5/Fonctions_pr\u00e9d\u00e9finies/La_fonction_eval", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Functions/eval_Function", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Funkcje_predefiniowane/Funkcja_eval" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/index.html" deleted file mode 100644 index b44b292eb8..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/index.html" +++ /dev/null @@ -1,15 +0,0 @@ ---- -title: 預先定義的函數 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數 -translation_of: Web/JavaScript/Guide/Functions -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions ---- -

 

-
-

預先定義的函數

-

JavaScript 有一些最頂層的已預先定義的函數︰

- -
-

{{ PreviousNext("Core_JavaScript_1.5_教學:arguments_物件的使用", "Core_JavaScript_1.5_教學:預先定義的函數:eval_函數") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Predefined_Functions", "fr": "fr/Guide_JavaScript_1.5/Fonctions_pr\u00e9d\u00e9finies", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Functions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Funkcje_predefiniowane" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/isfinite_\345\207\275\346\225\270/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/isfinite_\345\207\275\346\225\270/index.html" deleted file mode 100644 index db213a465e..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/isfinite_\345\207\275\346\225\270/index.html" +++ /dev/null @@ -1,24 +0,0 @@ ---- -title: isFinite 函數 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isFinite_函數 -translation_of: Web/JavaScript/Guide/Functions -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions/isFinite_Function ---- -

 

-
-

isFinite 函數

-

isFinite 函數會對參數求值，來判斷是否是有限的數字。isFinite 的語法如下︰

-
isFinite(number)
-
-

此處的 number 就是要求值的數字。

-

如果參數是 NaN、正無限大、負無限大，這個方法就會返回 false，否則就會返回 true。

-

以下的代碼會檢查客戶端的輸入，來判斷是否是有限的數字。

-
if(isFinite(ClientInput))
-{
-   /* 適當的處理 */
-}
-
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的函數:eval_函數", "Core_JavaScript_1.5_教學:預先定義的函數:isNaN_函數") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Predefined_Functions/isFinite_Function", "fr": "fr/Guide_JavaScript_1.5/Fonctions_pr\u00e9d\u00e9finies/La_fonction_isFinite", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isFinite_Function", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Funkcje_predefiniowane/Funkcja_isFinite" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/isnan_\345\207\275\346\225\270/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/isnan_\345\207\275\346\225\270/index.html" deleted file mode 100644 index d2ea7c4a46..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/isnan_\345\207\275\346\225\270/index.html" +++ /dev/null @@ -1,26 +0,0 @@ ---- -title: isNaN 函數 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isNaN_函數 -translation_of: Web/JavaScript/Guide/Functions -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions/isNaN_Function ---- -

 

-
-

isNaN 函數

-

isNaN 函數對參數求值，來判斷是不是〝NaN〞（不是數字，not a number）。isNaN 的語句如下︰

-
isNaN(testValue)
-
-

此處的 testValue 就是你想要求值的值。

-

parseFloat 和 parseInt 函數會在求出來的值不是數字的時候返回〝NaN〞。如果傳入的是〝NaN〞，isNaN 返回 true，否則為 false。

-

以下的代碼會對 floatValue 求值，來判斷這是不是數字，然後呼叫相應的程序︰

-
floatValue=parseFloat(toFloat)
-
-if (isNaN(floatValue)) {
-   notFloat()
-} else {
-   isFloat()
-}
-
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的函數:isFinite_函數", "Core_JavaScript_1.5_教學:預先定義的函數:parseInt_和_parseFloat_函數") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Predefined_Functions/isNaN_Function", "fr": "fr/Guide_JavaScript_1.5/Fonctions_pr\u00e9d\u00e9finies/La_fonction_isNaN", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isNaN_Function", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Funkcje_predefiniowane/Funkcja_isNaN" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/number_\345\222\214_string_\345\207\275\346\225\270/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/number_\345\222\214_string_\345\207\275\346\225\270/index.html" deleted file mode 100644 index 0b44186a97..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/number_\345\222\214_string_\345\207\275\346\225\270/index.html" +++ /dev/null @@ -1,36 +0,0 @@ ---- -title: Number 和 String 函數 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/Number_和_String_函數 -translation_of: Web/JavaScript/Guide/Functions -translation_of_original: >- - Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions/parseInt_and_parseFloat_Functions ---- -

Number 和 String 函數

-
-

Number 和 String 函數讓你把物件轉換為數字或字串。這些函數的語句是︰

-
var objRef=Number(objRef);
-var objRef=String(objRef);
-
-

此處的 objRef 就是物件的參考。

-

以下的範例把 Date 物件轉換為可讀的字串。

-
var D = new Date (430054663215);
-// 返回以下字串
-// "Thu Aug 18 04:37:43 GMT-0700 (Pacific Daylight Time) 1983"
-var x = String(D);
-
-
-

 

-

以下範例把 String 物件轉換為 Number 物件。

-
var str="12";
-var num=Number(str);
-
-

你可以使用 DOM 的方法 write() 和 JavaScript 的 typeof 運算子來檢驗。

-
var str="12";
-document.write(typeof str);
-document.write("<br/>");
-var num=Number(str);
-document.write(typeof num);
-
-

 {{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的函數:parseInt_和_parseFloat_函數", "Core_JavaScript_1.5_教學:預先定義的函數:escape_和_unescape_函數") }}

-

{{ languages( {"en": "en/Core_JavaScript_1.5_Guide/Predefined_Functions/Number_and_String_Functions", "es": "es/Gu\u00eda_JavaScript_1.5/Funciones_predefinidas/Funciones_Number_y_String", "fr": "fr/Guide_JavaScript_1.5/Fonctions_pr\u00e9d\u00e9finies/Les_fonctions_Number_et_String", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Functions/Number_and_String_Functions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Funkcje_predefiniowane/Funkcje_Number_i_String" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/parseint_\345\222\214_parsefloat_\345\207\275\346\225\270/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/parseint_\345\222\214_parsefloat_\345\207\275\346\225\270/index.html" deleted file mode 100644 index 65d1287175..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/parseint_\345\222\214_parsefloat_\345\207\275\346\225\270/index.html" +++ /dev/null @@ -1,21 +0,0 @@ ---- -title: parseInt 和 parseFloat 函數 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數 ---- -

 

-
-

parseInt 和 parseFloat 函數

-

這兩個〝分析〞函數，parseInt 和 parseFloat，會在給與字串作為參數時返回數值。

-

parseFloat 的語句如下

-
parseFloat(str)
-
-

此處的 parseFloat 會分析他自己的參數，字串 str，並試著返回浮點數。如果遇到正負符號 (+ 或 -)、數字 (0-9)、小數點、指數以外的字元，他就會返回在此之前的數值，並忽略那些字元。如果連第一個字元也不可以轉換為數字，就會返回〝NaN〞（不是數字）。

-

parseInt 的語句如下

-
parseInt(str [, radix])
-
-

parseInt 會分析他自己的參數，字串 str，並試著返回由第二個參數所指定的 radix （基數）的整數。radix 為選用性參數。舉例來說，以 10 為底的基數表示要轉換為十進制數，8 是八進制，16 是十六進制，依此類推。對於 10 以上的基數，就會使用字母來表示大於九的數字。例如，十六進制數（基數 16），就會用到 A 到 F 的字母。

-

如果 parseInt 遇到不是在指定基數之內的字元，就會直接忽略這個字元及其隨後字元，並返回在此之前已經分析出來的整數值。如果連第一個字元也不可以轉換為指定基數之內的字元，就會返回〝NaN〞。parseInt 函數會切除字串以取得整數值。

-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的函數:isNaN_函數", "Core_JavaScript_1.5_教學:預先定義的函數:Number_和_String_函數") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Predefined_Functions/parseInt_and_parseFloat_Functions", "es": "es/Gu\u00eda_JavaScript_1.5/Funciones_predefinidas/Funciones_parseInt_y_parseFloat", "fr": "fr/Guide_JavaScript_1.5/Fonctions_pr\u00e9d\u00e9finies/Les_fonctions_parseInt_et_parseFloat", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Functions/parseInt_and_parseFloat_Functions", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Funkcje_predefiniowane/Funkcje_parseInt_i_parseFloat" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/array_\347\211\251\344\273\266/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/array_\347\211\251\344\273\266/index.html" deleted file mode 100644 index a806c4dfac..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/array_\347\211\251\344\273\266/index.html" +++ /dev/null @@ -1,151 +0,0 @@ ---- -title: Array 物件 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件 ---- -

 

-

Array 物件

-

JavaScript 並沒有明確的陣列資料類型。不過你可以在你的應用程式中，使用預先定義的 Array 物件和他的方法來運用陣列。Array 物件有各種陣列的操作方法，如合併、反轉、排序。他還有用來確定陣列的長度的屬性，還有和正規表達式一起使用的屬性。

-

陣列是值的有序集合，你可以使用名稱或索引來參考這些值。例如，你有一個稱作 emp 的陣列，其中內含職員的名字，並按照職員的編號來索引。於是 emp{{ mediawiki.external(1) }} 就代表編號 1 的職員，emp{{ mediawiki.external(2) }} 就代表編號 2 的職員，依此類推。

-

 

-

陣列的建立

-

Array 物件的建立如下︰

-
1. arrayObjectName = new Array(element0, element1, ..., elementN)
-2. arrayObjectName = new Array(arrayLength)
-
-

arrayObjectName 就是新物件的名稱、或者是既存物件的屬性。當使用 Array 的屬性和方法的時候，arrayObjectName 就是既存的 Array 物件的名稱、或者是既存物件的屬性。

-

element0, element1, ..., elementN 就是陣列元素的值的列表。如果指定了這個形式的話，陣列就會以指定的值作為元素來初始化，且陣列的 length 屬性會被設為參數的數目。

-

arrayLength 就是陣列的初期長度。下面的代碼建立帶有五個元素的陣列︰

-
billingMethod = new Array(5)
-
-

陣列的字面表達同時也是 Array 物件；舉例來說，下面的字面表達就是 Array 物件。參閱 陣列的字面表達 以取得陣列的字面表達的細節。

-
coffees = ["French Roast", "Columbian", "Kona"]
-
-

陣列的存放

-

你可以藉由把值代入給陣列自己的元素的方式來存放到陣列裡。例如，

-
emp[1] = "Casey Jones"
-emp[2] = "Phil Lesh"
-emp[3] = "August West"
-
-

你也可以在建立陣列的同時來作存放︰

-
myArray = new Array("Hello", myVar, 3.14159)
-
-

陣列元素的參考

-

你可以使用元素的序號來參考陣列的元素。例如，假設你定義了如下的陣列︰

-
myArray = new Array("Wind","Rain","Fire")
-
-

然後你可以使用 myArray{{ mediawiki.external(0) }} 來參考第一個元素，使用 myArray{{ mediawiki.external(1) }} 來參考第二個元素。

-

元素的索引是從零 (0) 開始的，不過陣列的長度（例如，myArray.length）反映的是陣列中的元素的數目。

-

Array 的方法

-

Array 物件有以下的方法︰

- -

 

-
   myArray = new Array("1","2","3")
-   myArray = myArray.concat("a", "b", "c"); // myArray 現在是 ["1", "2", "3", "a", "b", "c"]
-
-

 

- -

 

-
   myArray = new Array("Wind","Rain","Fire")
-   list = myArray.join(" - "); // list 的內容是 "Wind - Rain - Fire"
-
-

 

- -

 

-
   myArray = new Array("1", "2", "3");
-   last=myArray.pop(); // MyArray 現在是 ["1", "2"], last = "3"
-
-

 

- -

 

-
   myArray = new Array("1", "2");
-   myArray.push("3"); // MyArray 現在是 ["1", "2", "3"]
-
-

 

- -

 

-
   myArray = new Array ("1", "2", "3");
-   myArray.reverse(); // 調換陣列的結果是 myArray = [ "3", "2", "1" ]
-
-

 

- -

 

-
   myArray = new Array ("1", "2", "3");
-   first=myArray.shift(); // MyArray 現在是 ["2", "3"]，first 是 "1"
-
-

 

- -

 

-
   myArray = new Array ("a", "b", "c", "d", "e");
-   myArray = myArray.slice(1,4); // 從索引 1 為起點抽出所有的元素，直到索引 4 為止，返回 [ "b", "c", "d" ]
-
-

 

- -

 

-
   myArray = new Array ("1", "2", "3", "4", "5");
-   myArray.splice(1,3,"a","b","c", "d"); // MyArray 現在是 ["1", "a", "b", "c", "d", "5"]
-   // 這個代碼從索引 1（也就是 "2"）開始，把那裡的 3 個元素移除掉，
-   // 然後把所有的連續元素插入到那個位置。
-
-

 

- -

 

-
   myArray = new Array("Wind","Rain","Fire")
-   myArray.sort(); // 排序陣列的結果是 myArrray = [ "Fire", "Rain", "Wind" ]
-
-

 

-

sort 也接受 Callback 函數以確定該如何排序陣列的內容。這個函數會對兩個值作比較，並返回三個值的其中一者︰

- -

舉例來說，下面的代碼將以陣列最後面的字母來排序︰

-

 

-
   var sortFn = function(a,b){
-       if (a[a.length - 1] < b[b.length - 1]) return -1;
-       if (a[a.length - 1] > b[b.length - 1]) return 1;
-       if (a[a.length - 1] == b[b.length - 1]) return 0;
-       }
-   myArray.sort(sortFn); // 排序陣列的結果是 myArray = ["Wind","Fire","Rain"]
-
-

 

- -

二維陣列

-

下面的代碼建立二維陣列。

-
a = new Array(4)
-for (i=0; i < 4; i++) {
-   a[i] = new Array(4)
-   for (j=0; j < 4; j++) {
-      a[i][j] = "["+i+","+j+"]"
-   }
-}
-
-

本例以如下的行來建立陣列︰

-
行 0:[0,0][0,1][0,2][0,3]
-行 1:[1,0][1,1][1,2][1,3]
-行 2:[2,0][2,1][2,2][2,3]
-行 3:[3,0][3,1][3,2][3,3]
-
-

陣列和正規表達式

-

如果有一個陣列是正規表達式和字串之間比對的結果，這個陣列會返回有關比對的資訊的屬性和元素。陣列可以是 RegExp.exec、String.match、String.split 的返回值。若需要與正規表達式一同使用陣列的資訊，詳見第四章，正規表達式。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件", "Core_JavaScript_1.5_教學:預先定義的核心物件:Boolean_物件") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/boolean_\347\211\251\344\273\266/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/boolean_\347\211\251\344\273\266/index.html" deleted file mode 100644 index 02648f7073..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/boolean_\347\211\251\344\273\266/index.html" +++ /dev/null @@ -1,12 +0,0 @@ ---- -title: Boolean 物件 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件 ---- -

 

-

Boolean 物件

-

Boolean 物件是原始的 Boolean 資料類型包裝而成。使用下面的語法來建立 Boolean 物件︰

-
booleanObjectName = new Boolean(value)
-
-

別把原始的布林值的 true 和 false 與 Boolean 物件的 true 和 false 值給混淆了。任何物件的值只要不是 undefined、null、0、NaN、空字串，即使是值為 false 的 Boolean 物件，當傳入到條件語句裡的時候，其求值結果仍為 true。參閱 if...else 語法 取得更進一步資訊。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件:Array_物件", "Core_JavaScript_1.5_教學:預先定義的核心物件:Date_物件") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/date_\347\211\251\344\273\266/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/date_\347\211\251\344\273\266/index.html" deleted file mode 100644 index ca94741f14..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/date_\347\211\251\344\273\266/index.html" +++ /dev/null @@ -1,82 +0,0 @@ ---- -title: Date 物件 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件 ---- -

 

-

Date 物件

-

JavaScript 並沒有日期的資料類型。不過你可以在你的應用程式中使用 Date 物件及其方法來使用日期和時間。Date 物件有非常大量的方法可用來設定、取得、操作日期。不過沒有任何的屬性。

-

JavaScript 處理日期的方式很類似 Java。這兩個語言有很多同樣的日期方法，而且這兩個語言都是以 1970 年 1 月 1 日 00:00:00 開始的毫秒數來儲存日期。

-

Date 物件的範圍是以 1970 年 1 月 1 日 (UTC) 為基準，從 -100,000,000 日一直到 100,000,000 日。

-

如下建立 Date 物件︰

-
dateObjectName = new Date([parameters])
-
-

此處的 dateObjectName 就是將要建立的 Date 物件的名稱；他可以是新的物件或是既存物件的屬性。

-

前敘語法中的 parameters 可以是下列的任何一種形式︰

- -

JavaScript 1.2 及早期版本
- Date 物件的行為如下︰

- -

Date 物件的方法

-

用於處理日期和時間的 Date 物件的方法主要可分為這幾類︰

- -

使用 "get" 和 "set" 方法，你可以分別取得或設定秒、分、時、日、星期、月、年。還有 getDay 方法可返回星期，但沒有相對應的 setDay 方法，因為星期會自動設定。這些方法使用整數來表示如下的這些值︰

- -

舉例來說，假設你定義了如下日期︰

-
Xmas95 = new Date("December 25, 1995")
-
-

Xmas95.getMonth() 返回 11，而 Xmas95.getFullYear() 返回 1995。

-

getTime 和 setTime 方法對於日期的比較來說很有用。getTime 方法返回自 1970 年 1 月 1 日 00:00:00 以來的毫秒數。

-

例如，下面的代碼顯示今年的剩餘天數︰

-
today = new Date()
-endYear = new Date(1995,11,31,23,59,59,999) // 設定日和月
-endYear.setFullYear(today.getFullYear()) // 設定為今年
-msPerDay = 24 * 60 * 60 * 1000 // 一天的毫秒數
-daysLeft = (endYear.getTime() - today.getTime()) / msPerDay
-daysLeft = Math.round(daysLeft) // 返回今年的剩餘天數
-
-

本範例建立了名為 today 的 Date 物件，其中內含有今天的日期。然後，使用一天的毫秒數，計算今天和 endYear 之間的天數，使用 getTime 並捨入為天數。

-

The parse 方法對於把值從日期字串代入到既存的 Date 物件來說很有用。例如，下面的代碼使用 parse 和 setTime 把日期的值代入到 IPOdate 物件︰

-
IPOdate = new Date()
-IPOdate.setTime(Date.parse("Aug 9, 1995"))
-
-

Date 物件的使用︰範例

-

在下面的範例中，函數 JSClock() 返回以數位時鐘為格式的時間。

-
function JSClock() {
-   var time = new Date()
-   var hour = time.getHours()
-   var minute = time.getMinutes()
-   var second = time.getSeconds()
-   var temp = "" + ((hour > 12) ? hour - 12 : hour)
-   if (hour == 0)
-      temp = "12";
-   temp += ((minute < 10) ? ":0" : ":") + minute
-   temp += ((second < 10) ? ":0" : ":") + second
-   temp += (hour >= 12) ? " P.M." : " A.M."
-   return temp
-}
-
-

JSClock 函數首先建立稱為 time 的新 Date 物件；因為沒有提供參數，time 會以今天的日期和時間來建立。然後呼叫 getHours、getMinutes、getSeconds 方法把時、分、秒的值代入到 hour、minute、second。

-

以下的四個語句會以 time 為基準建立字串。第一個語句建立變數 temp，使用條件表達式把值代入；如果 hour 大於 12，就會是 (hour - 12)，否則會是單純的 hour，除非 hour 為 0，這時就會是 12。

-

下一個語句把 minute 的值附加到 temp 裡。如果 minute 的值小於 10，條件表達式就會加上前置為零的字串；否則加上分隔用分號的字串。接下來的語句把秒的值以同樣方式附加到 temp。

-

最後，如果 hour 大於 12，條件表達式就把 "PM" 附加到 temp；否則就把 "AM" 附加到 temp。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件:Boolean_物件", "Core_JavaScript_1.5_教學:預先定義的核心物件:Function_物件") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/function_\347\211\251\344\273\266/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/function_\347\211\251\344\273\266/index.html" deleted file mode 100644 index 4acf1e73ca..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/function_\347\211\251\344\273\266/index.html" +++ /dev/null @@ -1,45 +0,0 @@ ---- -title: Function 物件 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件 ---- -

 

-

Function 物件

-

預先定義的 Function 物件會把指定的 JavaScript 字串的代碼編譯成函數。

-

建立 Function 物件如下︰

-
functionObjectName = new Function ([arg1, arg2, ... argn], functionBody)
-
-

functionObjectName 就是變數的名稱或既存物件的屬性。他也可以是後跟小寫的事件處理器名稱的物件，如 window.onerror。

-

arg1, arg2, ... argn 就是要被函數用作形式參數的名稱的參數。其中每一個都必須是字串，並合於有效的 JavaScript 識別子。例如 "x" 或 "theForm"。

-

functionBody 就是指定的 JavaScript 代碼的字串，將會編譯成函數本體。

-

Function 物件會在每一次被用到時求值。這比宣告函數並在你的代碼中呼叫還要沒效率，因為宣告過的函數已經編譯過了。

-

除了此處所描述的函數的定義方式以外，你也可以使用 function 語句和函數的表達式。參閱 Core JavaScript 1.5 參考 取得更進一步資訊。

-

下面的代碼把函數代入到變數 setBGColor。這個函數會設定目前文件的背景色。

-
var setBGColor = new Function("document.bgColor='antiquewhite'")
-
-

若要呼叫這個 Function 物件，你可以把指定的變數名稱如同函數一般來使用。下面的代碼執行了由 setBGColor 變數所指定的函數︰

-
var colorChoice="antiquewhite"
-if (colorChoice=="antiquewhite") {setBGColor()}
-
-

你可以使用下列任一方式把函數代入給事件處理器︰

-
1. document.form1.colorButton.onclick=setBGColor
-2. <INPUT NAME="colorButton" TYPE="button"
-      VALUE="Change background color"
-      onClick="setBGColor()">
-
-

上面所建立的變數 setBGColor 類似於宣告下面的函數︰

-
function setBGColor() {
-   document.bgColor='antiquewhite'
-}
-
-

把函數代入給變數類似於宣告函數，但有幾點不同︰

- -

你可以在函數的內部嵌入函數。內嵌的（內部）函數對於包含這個函數的（外部）函數而言是私有的︰

- -

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件:Date_物件", "Core_JavaScript_1.5_教學:預先定義的核心物件:Math_物件") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/index.html" deleted file mode 100644 index 181d55974e..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/index.html" +++ /dev/null @@ -1,13 +0,0 @@ ---- -title: 預先定義的核心物件 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件 -translation_of: Web/JavaScript/Guide -translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Core_Objects ---- -

 

-

預先定義的核心物件

-

本節解說在核心 JavaScript 裡預先定義的物件︰

- -

{{ PreviousNext("Core_JavaScript_1.5_教學:新物件的建立:屬性的刪除", "Core_JavaScript_1.5_教學:預先定義的核心物件:Array_物件") }}

-

{{ languages( { "en": "en/Core_JavaScript_1.5_Guide/Predefined_Core_Objects", "es": "es/Gu\u00eda_JavaScript_1.5/Objetos_base_predefinidos", "fr": "fr/Guide_JavaScript_1.5/Objets_pr\u00e9d\u00e9finis", "ja": "ja/Core_JavaScript_1.5_Guide/Predefined_Core_Objects", "ko": "ko/Core_JavaScript_1.5_Guide/Predefined_Core_Objects", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Obiekty_predefiniowane" } ) }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/math_\347\211\251\344\273\266/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/math_\347\211\251\344\273\266/index.html" deleted file mode 100644 index 8aa6bb0223..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/math_\347\211\251\344\273\266/index.html" +++ /dev/null @@ -1,69 +0,0 @@ ---- -title: Math 物件 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件 ---- -

 

-

Math 物件

-

預先定義的 Math 物件具有針對數學常數和函數的屬性和方法。例如，Math 物件的 PI 屬性有圓周率的值 (3.141...)，你可以在應用程式中如下使用。

-
Math.PI
-
-

同樣的，Math 的方法就是標準的數學函數。其中包括三角函數、對數函數、指數函數、以及其他函數。例如，如果你想要使用三角函數 sine，你可以如下編寫。

-
Math.sin(1.56)
-
-

注意，Math 所有的三角函數的方法只接受以弧度為單位的參數。

-

下表列出了 Math 物件的方法。

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
方法說明
abs絕對值。
sin, cos, tan標準三角函數；參數以弧度為單位。
acos, asin, atan, atan2反三角函數；返回值以弧度為單位。
exp, log指數函數和以 e 為底的自然對數。
ceil返回大於等於參數的最小整數。
floor返回小於等於參數的最大整數。
min, max返回兩個參數中最大的或最小的。
pow指數函數；第一個參數為底數，第二個為指數。
random返回介於 0 和 1 之間的隨機數。
round把參數捨入至最接近的整數。
sqrt平方根。
-

表 7.1: Math 的方法

-

有別於其他的物件，你永遠不需要自行建立 Math 物件。你永遠可以使用預先定義的 Math 物件。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件:Function_物件", "Core_JavaScript_1.5_教學:預先定義的核心物件:Number_物件") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/number_\347\211\251\344\273\266/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/number_\347\211\251\344\273\266/index.html" deleted file mode 100644 index 01ff1ca26f..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/number_\347\211\251\344\273\266/index.html" +++ /dev/null @@ -1,80 +0,0 @@ ---- -title: Number 物件 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件 ---- -

 

-

Number 物件

-

The Number 物件具有用於數值常數的屬性，如最大值、非數字、無限大。你不能改變這些屬性的值，你可以如下使用這些屬性︰

-
biggestNum = Number.MAX_VALUE
-smallestNum = Number.MIN_VALUE
-infiniteNum = Number.POSITIVE_INFINITY
-negInfiniteNum = Number.NEGATIVE_INFINITY
-notANum = Number.NaN
-
-

你永遠可以如上方式參照預先定義的 Number 物件的屬性，而不是參照你自己建立的 Number 物件的屬性。

-

下表列出 Number 物件的屬性。

- - - - - - - - - - - - - - - - - - - - - - - - - - - -
屬性說明
MAX_VALUE所能表示的最大的數字
MIN_VALUE所能表示的最小的數字
NaN特殊的 "not a number"（非數字）值
NEGATIVE_INFINITY特殊的負無限大的值；溢出時返回
POSITIVE_INFINITY特殊的正無限大的值；溢出時返回
-

表 7.2: Number 的屬性

-

Number 的原型提供從 Number 物件取得各種格式的資訊的方法。下表列出 Number.prototype 的方法。

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
方法說明
toExponential返回以指數符號表示的數字的字串。
toFixed返回以固定小數點表示的數字的字串。
toPrecision返回以指定精度的固定小數點表示的數字的字串。
toSource返回表示指定的 Number 物件的字面表達。你可以使用這個值來建立新的物件。覆蓋 Object.toSource 方法。
toString返回表示指定物件的字串。覆蓋 Object.toString 方法。
valueOf返回指定物件的原始值。覆蓋 Object.valueOf 方法。
-

表 7.3: Number.prototype 的方法

-

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件:Math_物件", "Core_JavaScript_1.5_教學:預先定義的核心物件:RegExp_物件") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/regexp_\347\211\251\344\273\266/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/regexp_\347\211\251\344\273\266/index.html" deleted file mode 100644 index 6d26e86067..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/regexp_\347\211\251\344\273\266/index.html" +++ /dev/null @@ -1,9 +0,0 @@ ---- -title: RegExp 物件 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件 ---- -

 

-

RegExp 物件

-

RegExp 物件可讓你運用正規表達式。已在第 4 章中解說過，正規表達式。

-

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件:Number_物件", "Core_JavaScript_1.5_教學:預先定義的核心物件:String_物件") }}

diff --git "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/string_\347\211\251\344\273\266/index.html" "b/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/string_\347\211\251\344\273\266/index.html" deleted file mode 100644 index 9e18d6ca98..0000000000 --- "a/files/zh-tw/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/string_\347\211\251\344\273\266/index.html" +++ /dev/null @@ -1,88 +0,0 @@ ---- -title: String 物件 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件 ---- -

 

-

String 物件

-

String 物件只有一個屬性，length，用來指明字串中的字元數目。例如，下面的代碼把 13 的值代入給 x，因為 "Hello, World!" 有 13 個字元︰

-
mystring = "Hello, World!"
-x = mystring.length
-
-

String 物件有兩種類型的方法︰一種是返回對字串本身的修改，如 substring 和 toUpperCase，另一種是返回字串的 HTML 格式版本，如 bold 和 link。

-

舉例來說，延用前面的例子，mystring.toUpperCase() 和 "hello, world!".toUpperCase() 都會返回字串 "HELLO, WORLD!"。

-

substring 方法接受兩個參數，並返回介於兩個參數之間的字串的子集。延用前面的例子，mystring.substring(4, 9) 返回字串 "o, Wo"。參閱 Core JavaScript 參考 中的 String 物件的 substring 方法，以取得更進一步資訊。

-

String 物件也有大量的針對自動的 HTML 格式化的方法，如 bold 建立粗體文字，link 建立超連結。例如，你可以使用 link 方法建立連結到某個 URL 的超連結，如下︰

-
mystring.link("http://www.helloworld.com")
-
-

下表列出 String 物件的方法。

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
方法說明
anchor建立已命名的 HTML 錨點。
big, blink, bold, fixed, italics, small, strike, sub, sup建立 HTML 格式的字串。
charAt, charCodeAt返回字串中指定位置的字元或者字元內碼。
indexOf, lastIndexOf返回字串中指定子字串的位置，或指定子字串的最後的位置。
link建立 HTML 超連結。
concat合併兩個字串的文字，並返回新的字串。
fromCharCode從指定的 Unicode 值的序列建構字串。這是 String 類別的方法，而不是 String 實體的。
split藉由把字串分成子字串的方式，把 String 物件分割成字串的陣列。
slice抽出字串的片斷，並返回新的字串。
substring, substr以指定的起始或終止索引、或起始索引和長度，返回指定字串的子集。
match, replace, search與正則表達式配合使用。
toLowerCase, toUpperCase返回全是大寫或全是小寫的字串。
-

表 7.4: String 實體的方法

-

字串的字面表達並不是 String 物件

-

String 物件只是字串的原始資料類型的包裝而已。別把字串的字面表達和 String 物件相混淆了。例如，下面的代碼建立字串的字面表達 s1 和 String 物件 s2︰

-
s1 = "foo" // 建立字串的字面表達值
-s2 = new String("foo") // 建立 String 物件
-
-

你可以在字串的字面表達值上呼叫所有的 String 物件的方法—JavaScript 會自動把字串的字面表達轉換成臨時的 String 物件，呼叫其方法，然後丟棄臨時的 String 物件。你也可以在字面表達上使用 String.length 屬性。

-

你應該使用字串的字面表達，除非你確定需要使用 String 物件，因為 String 物件會有反直覺的行為。例如︰

-
s1 = "2 + 2" // 建立字串的字面表達值
-s2 = new String("2 + 2") //建立 String 物件
-eval(s1) // 返回數字 4
-eval(s2) // 返回字串 "2 + 2"
-
-

{{ PreviousNext("Core_JavaScript_1.5_教學:預先定義的核心物件:RegExp_物件", "Core_JavaScript_1.5_教學:繼承") }}

diff --git a/files/zh-tw/web/javascript/reference/global_objects/arraybuffer/prototype/index.html b/files/zh-tw/web/javascript/reference/global_objects/arraybuffer/prototype/index.html deleted file mode 100644 index 263726d7e0..0000000000 --- a/files/zh-tw/web/javascript/reference/global_objects/arraybuffer/prototype/index.html +++ /dev/null @@ -1,111 +0,0 @@ ---- -title: ArrayBuffer.prototype -slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype -translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer -translation_of_original: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype ---- -
{{JSRef}}
- -

The ArrayBuffer.prototype property represents the prototype for the {{jsxref("ArrayBuffer")}} object.

- -
{{js_property_attributes(0,0,0)}}
- -

描述

- -

ArrayBuffer instances inherit from ArrayBuffer.prototype. As with all constructors, you can change the constructor's prototype object to make changes to all ArrayBuffer instances.

- -

屬性

- -
-
ArrayBuffer.prototype.constructor
-
Specifies the function that creates an object's prototype. The initial value is the standard built-in ArrayBuffer constructor.
-
{{jsxref("ArrayBuffer.prototype.byteLength")}} {{readonlyInline}}
-
陣列大小，以位元組（byte）計算。此屬性在陣列建立之後就不可能改變了。唯讀。
-
- -

方法

- -
-
{{jsxref("ArrayBuffer.prototype.slice()")}}
-
Returns a new ArrayBuffer whose contents are a copy of this ArrayBuffer's bytes from begin, inclusive, up to end, exclusive. If either begin or end is negative, it refers to an index from the end of the array, as opposed to from the beginning.
-
- -

規範

- - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('ES6', '#sec-arraybuffer.prototype', 'ArrayBuffer.prototype')}}{{Spec2('ES6')}}Initial definition.
{{SpecName('ESDraft', '#sec-arraybuffer.prototype', 'ArrayBuffer.prototype')}}{{Spec2('ESDraft')}} 
- -

瀏覽器相容性

- -

{{CompatibilityTable}}

- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support7.0{{ CompatGeckoDesktop("2")}}1011.65.1
-
- -
- - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support4.0{{CompatVersionUnknown}}{{CompatGeckoMobile("2")}}1011.64.2
-
- -

參見

- - diff --git a/files/zh-tw/web/javascript/reference/global_objects/date/prototype/index.html b/files/zh-tw/web/javascript/reference/global_objects/date/prototype/index.html deleted file mode 100644 index 5490743ec0..0000000000 --- a/files/zh-tw/web/javascript/reference/global_objects/date/prototype/index.html +++ /dev/null @@ -1,246 +0,0 @@ ---- -title: Date.prototype -slug: Web/JavaScript/Reference/Global_Objects/Date/prototype -tags: - - Date - - JavaScript - - 原型 - - 參考資料 - - 屬性 -translation_of: Web/JavaScript/Reference/Global_Objects/Date -translation_of_original: Web/JavaScript/Reference/Global_Objects/Date/prototype ---- -
{{JSRef}}
- -

Date.prototype 屬性表示 {{jsxref("Date")}} 建構子的原型。

- -
{{js_property_attributes(0, 0, 1)}}
- -

描述

- -

JavaScript {{jsxref("Date")}} 實體繼承自 Date.prototype。你可以藉由改變建構子的原型物件，來影響所有繼承自 JavaScript {{jsxref("Date")}} 的實體。

- -

為了千年年份（換個說法，考慮現在已到了 2000 年）的相容性，設定上你應該採用完整的年份。舉例來說，使用 1998 而不是 98 。為了讓你能取得完整的年份資料， Javascript 包含了 {{jsxref("Date.prototype.getFullYear()", "getFullYear()")}} ， {{jsxref("Date.prototype.setFullYear()", "setFullYear()")}} ， {{jsxref("Date.prototype.getUTCFullYear()", "getUTCFullYear()")}} 以及 {{jsxref("Date.prototype.setUTCFullYear()", "setUTCFullYear()")}} 方法。

- -

自 ECMAScript 6 開始， Date.prototype 物件只是個一般物件，而不是一個 {{jsxref("Date")}} 實體。

- -

屬性

- -
-
Date.prototype.constructor
-
回傳一個能建立實體的函數，這是 {{jsxref("Date")}} 預設的建構子。
-
- -

方法

- -

Getter

- -
-
{{jsxref("Date.prototype.getDate()")}}
-
回傳本地時間月份中的日期（1-31）。
-
{{jsxref("Date.prototype.getDay()")}}
-
回傳本地時間星期中的日子（0-6）。
-
{{jsxref("Date.prototype.getFullYear()")}}
-
回傳本地時間的年份（ 以 4 位數表現）。
-
{{jsxref("Date.prototype.getHours()")}}
-
回傳本地時間的小時（0-23）。
-
{{jsxref("Date.prototype.getMilliseconds()")}}
-
回傳本地時間的毫秒數（0-999）。
-
{{jsxref("Date.prototype.getMinutes()")}}
-
回傳本地時間的分鐘數（0-59）。
-
{{jsxref("Date.prototype.getMonth()")}}
-
回傳本地時間的月份（0-11）。
-
{{jsxref("Date.prototype.getSeconds()")}}
-
回傳本地時間的秒數（0-59)。
-
{{jsxref("Date.prototype.getTime()")}}
-
回傳由 1970-01-01 00:00:00 UTC 開始，到代表時間經過的毫秒數（以負值表示 1970 年之前的時間）。
-
{{jsxref("Date.prototype.getTimezoneOffset()")}}
-
回傳本地時差為多少分鐘。
-
{{jsxref("Date.prototype.getUTCDate()")}}
-
回傳標準時間的在月份中的日期（1-31）。
-
{{jsxref("Date.prototype.getUTCDay()")}}
-
回傳標準時間在星期中的日子（0-6）。
-
{{jsxref("Date.prototype.getUTCFullYear()")}}
-
回傳標準時間的年份（ 以 4 位數表現）。
-
{{jsxref("Date.prototype.getUTCHours()")}}
-
回傳標準時間的小時數（0-23）。
-
{{jsxref("Date.prototype.getUTCMilliseconds()")}}
-
回傳標準時間裡的毫秒數（0-999）。
-
{{jsxref("Date.prototype.getUTCMinutes()")}}
-
回傳標準時間的分鐘數（0-59）。
-
{{jsxref("Date.prototype.getUTCMonth()")}}
-
回傳標準時間的月份數（0-11）。
-
{{jsxref("Date.prototype.getUTCSeconds()")}}
-
回傳標準時間的秒數（0-59）。
-
{{jsxref("Date.prototype.getYear()")}} {{deprecated_inline}}
-
回本地時間的年份（通常 2-3 位數）。用 {{jsxref("Date.prototype.getFullYear()", "getFullYear()")}} 取代。
-
- -

Setter

- -
-
{{jsxref("Date.prototype.setDate()")}}
-
設定本地時間月份中的日期。
-
{{jsxref("Date.prototype.setFullYear()")}}
-
設定本地時間的完整年份（以 4 位數表達 4 位數年份）。
-
{{jsxref("Date.prototype.setHours()")}}
-
設定本地時間的小時數。
-
{{jsxref("Date.prototype.setMilliseconds()")}}
-
設定本地時間的毫秒數。
-
{{jsxref("Date.prototype.setMinutes()")}}
-
設定本地時間的分鐘數。
-
{{jsxref("Date.prototype.setMonth()")}}
-
設定本地時間的月份。
-
{{jsxref("Date.prototype.setSeconds()")}}
-
設定本地時間的秒數。
-
{{jsxref("Date.prototype.setTime()")}}
-
設定這個 {{jsxref("Date")}} 物件距 1970-01-01 00:00:00 UTC 的毫秒數，允許使用負值表示之前的時間。
-
{{jsxref("Date.prototype.setUTCDate()")}}
-
設定標準時間月份中的日期。
-
{{jsxref("Date.prototype.setUTCFullYear()")}}
-
設定標準時間的完整年份（以 4 位數表示 4 位數年分）。
-
{{jsxref("Date.prototype.setUTCHours()")}}
-
設定標準時間的小時數。
-
{{jsxref("Date.prototype.setUTCMilliseconds()")}}
-
設定標準時間的毫秒數。
-
{{jsxref("Date.prototype.setUTCMinutes()")}}
-
設定標準時間的分鐘數。
-
{{jsxref("Date.prototype.setUTCMonth()")}}
-
設定標準時間的月份數。
-
{{jsxref("Date.prototype.setUTCSeconds()")}}
-
設定標準時間的秒數。
-
{{jsxref("Date.prototype.setYear()")}} {{deprecated_inline}}
-
設定本地時間的年份（使用 2-3 位數）。使用 {{jsxref("Date.prototype.setFullYear()", "setFullYear()")}} 取代。
-
- -

Conversion getter

- -
-
{{jsxref("Date.prototype.toDateString()")}}
-
以可閱讀的字串型式，回傳 {{jsxref("Date")}} 的部分資訊。
-
{{jsxref("Date.prototype.toISOString()")}}
-
將日期時間轉換成 ISO 8601 格式的字串回傳。
-
{{jsxref("Date.prototype.toJSON()")}}
-
回傳等義於 {{jsxref("Date")}} 物件使用 {{jsxref("Date.prototype.toISOString()", "toISOString()")}} 方法的結果。特別使用 {{jsxref("JSON.stringify()")}} 處理。
-
{{jsxref("Date.prototype.toGMTString()")}} {{deprecated_inline}}
-
回傳 {{jsxref("Date")}} 以 GMT (UT) 時區基準代表的時間字串。使用 {{jsxref("Date.prototype.toUTCString()", "toUTCString()")}} 方法來取代。
-
{{jsxref("Date.prototype.toLocaleDateString()")}}
-
依照系統的時間地區設定，回傳日期字串。
-
{{jsxref("Date.prototype.toLocaleFormat()")}} {{non-standard_inline}}
-
傳入格式化字串參數，將日期時間轉換成指定格式的字串。
-
{{jsxref("Date.prototype.toLocaleString()")}}
-
回傳依系統的地區設定導出的日期時間字串。覆寫自 {{jsxref("Object.prototype.toLocaleString()")}} 方法。
-
{{jsxref("Date.prototype.toLocaleTimeString()")}}
-
回傳依系統的地區設定導出的時間字串。
-
{{jsxref("Date.prototype.toSource()")}} {{non-standard_inline}}
-
回傳一個建立相同 {{jsxref("Date")}} 物件的程式碼字串；你可以拿這個結果來建立新物件。覆寫自 {{jsxref("Object.prototype.toSource()")}} 方法。
-
{{jsxref("Date.prototype.toString()")}}
-
回傳代表此 {{jsxref("Date")}} 物件的字串。覆寫自 {{jsxref("Object.prototype.toString()")}} 方法。
-
{{jsxref("Date.prototype.toTimeString()")}}
-
以人類可讀的格式，回傳時間部分的字串。
-
{{jsxref("Date.prototype.toUTCString()")}}
-
依 UTC 時區，轉換出時間日期字串。
-
{{jsxref("Date.prototype.valueOf()")}}
-
回傳 {{jsxref("Date")}} 物件的原始數值。覆寫自 {{jsxref("Object.prototype.valueOf()")}} 方法。
-
- -

規範

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
規範狀態註
{{SpecName('ES1')}}{{Spec2('ES1')}}初步定義。實作在 JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.9.5', 'Date.prototype')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-properties-of-the-date-prototype-object', 'Date.prototype')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-properties-of-the-date-prototype-object', 'Date.prototype')}}{{Spec2('ESDraft')}} 
- -

瀏覽器相容性

- -
{{CompatibilityTable}}
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - -
平台ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本支援{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
一般物件{{CompatUnknown}}{{CompatGeckoDesktop("41")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
平台AndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本支援{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
一般物件{{CompatUnknown}}{{CompatUnknown}}{{CompatGeckoMobile("41")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
-
diff --git a/files/zh-tw/web/javascript/reference/global_objects/function/prototype/index.html b/files/zh-tw/web/javascript/reference/global_objects/function/prototype/index.html deleted file mode 100644 index 718454721b..0000000000 --- a/files/zh-tw/web/javascript/reference/global_objects/function/prototype/index.html +++ /dev/null @@ -1,139 +0,0 @@ ---- -title: Function.prototype -slug: Web/JavaScript/Reference/Global_Objects/Function/prototype -translation_of: Web/JavaScript/Reference/Global_Objects/Function -translation_of_original: Web/JavaScript/Reference/Global_Objects/Function/prototype ---- -
{{JSRef}}
- -

Function.prototype 屬性表示 {{jsxref("Function")}} 的原型物件。

- -

描述

- -

{{jsxref("Function")}} objects inherit from Function.prototype.  Function.prototype cannot be modified.

- -

屬性

- -
-
{{jsxref("Function.arguments")}} {{deprecated_inline}}
-
An array corresponding to the arguments passed to a function. This is deprecated as property of {{jsxref("Function")}}, use the {{jsxref("Functions/arguments", "arguments")}} object available within the function instead.
-
{{jsxref("Function.arity")}} {{obsolete_inline}}
-
Used to specifiy the number of arguments expected by the function, but has been removed. Use the {{jsxref("Function.length", "length")}} property instead.
-
{{jsxref("Function.caller")}} {{non-standard_inline}}
-
Specifies the function that invoked the currently executing function.
-
{{jsxref("Function.length")}}
-
Specifies the number of arguments expected by the function.
-
{{jsxref("Function.name")}}
-
The name of the function.
-
{{jsxref("Function.displayName")}} {{non-standard_inline}}
-
The display name of the function.
-
Function.prototype.constructor
-
Specifies the function that creates an object's prototype. See {{jsxref("Object.prototype.constructor")}} for more details.
-
- -

方法

- -
-
{{jsxref("Function.prototype.apply()")}}
-
Calls a function and sets its this to the provided value, arguments can be passed as an {{jsxref("Array")}} object.
-
{{jsxref("Function.prototype.bind()")}}
-
Creates a new function which, when called, has its this set to the provided value, with a given sequence of arguments preceding any provided when the new function was called.
-
{{jsxref("Function.prototype.call()")}}
-
Calls (executes) a function and sets its this to the provided value, arguments can be passed as they are.
-
{{jsxref("Function.prototype.isGenerator()")}} {{non-standard_inline}}
-
Returns true if the function is a generator; otherwise returns false.
-
{{jsxref("Function.prototype.toSource()")}} {{non-standard_inline}}
-
Returns a string representing the source code of the function. Overrides the {{jsxref("Object.prototype.toSource")}} method.
-
{{jsxref("Function.prototype.toString()")}}
-
Returns a string representing the source code of the function. Overrides the {{jsxref("Object.prototype.toString")}} method.
-
- -

規範

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition. Implemented in JavaScript 1.1
{{SpecName('ES5.1', '#sec-15.3.5.2', 'Function.prototype')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-function-instances-prototype', 'Function.prototype')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-function-instances-prototype', 'Function.prototype')}}{{Spec2('ESDraft')}} 
- -

瀏覽器相容性

- -
{{CompatibilityTable}}
- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -

參見

- - diff --git a/files/zh-tw/web/javascript/reference/global_objects/number/prototype/index.html b/files/zh-tw/web/javascript/reference/global_objects/number/prototype/index.html deleted file mode 100644 index bfd57f3d21..0000000000 --- a/files/zh-tw/web/javascript/reference/global_objects/number/prototype/index.html +++ /dev/null @@ -1,85 +0,0 @@ ---- -title: Number.prototype -slug: Web/JavaScript/Reference/Global_Objects/Number/prototype -translation_of: Web/JavaScript/Reference/Global_Objects/Number -translation_of_original: Web/JavaScript/Reference/Global_Objects/Number/prototype ---- -
{{JSRef}}
- -

Number.prototype 屬性用來表示 {{jsxref("Number")}} 建構式的原型。

- -
{{js_property_attributes(0, 0, 0)}}
- -

說明

- -

所有 {{jsxref("Number")}} 實體都繼承自 Number.prototype 。{{jsxref("Number")}} 建構式的原型物件可以被修改並作用在所有 {{jsxref("Number")}} 實體。

- -

屬性

- -
-
Number.prototype.constructor
-
回傳建立這個物件實體的建構式。預設為 {{jsxref("Number")}} 物件。
-
- -

方法

- -
-
{{jsxref("Number.prototype.toExponential()")}}
-
回傳以「科學記數法」表示的數值字串。
-
{{jsxref("Number.prototype.toFixed()")}}
-
回傳以定點表示的數值字串。
-
{{jsxref("Number.prototype.toLocaleString()")}}
-
回傳以當地語言為主的數值字串。這覆寫 {{jsxref("Object.prototype.toLocaleString()")}} 的方法。
-
{{jsxref("Number.prototype.toPrecision()")}}
-
回傳以定點或科學記數表示的數值字串。
-
{{jsxref("Number.prototype.toSource()")}} {{non-standard_inline}}
-
Returns an object literal representing the specified {{jsxref("Number")}} object; you can use this value to create a new object. Overrides the {{jsxref("Object.prototype.toSource()")}} method.
-
{{jsxref("Number.prototype.toString()")}}
-
回傳以特定基數表示的數值字串。這覆寫 {{jsxref("Object.prototype.toString()")}} 的方法 。
-
{{jsxref("Number.prototype.valueOf()")}}
-
回傳這個物件的原始型別，即原始數值。這覆寫 {{jsxref("Object.prototype.valueOf()")}} 。
-
- -

規範

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
規範狀態註記
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition. Implemented in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.7.4', 'Number')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-properties-of-the-number-prototype-object', 'Number')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-properties-of-the-number-prototype-object', 'Number')}}{{Spec2('ESDraft')}} 
- -

瀏覽器相容性

- - - -

{{Compat("javascript.builtins.Number.prototype")}}

- -

參見

- - diff --git a/files/zh-tw/web/javascript/reference/global_objects/object/prototype/index.html b/files/zh-tw/web/javascript/reference/global_objects/object/prototype/index.html deleted file mode 100644 index 4365b10c61..0000000000 --- a/files/zh-tw/web/javascript/reference/global_objects/object/prototype/index.html +++ /dev/null @@ -1,219 +0,0 @@ ---- -title: Object.prototype -slug: Web/JavaScript/Reference/Global_Objects/Object/prototype -tags: - - JavaScript - - Object - - 待翻譯 -translation_of: Web/JavaScript/Reference/Global_Objects/Object -translation_of_original: Web/JavaScript/Reference/Global_Objects/Object/prototype ---- -
{{JSRef}}
- -

Object.prototype 代表 {{jsxref("Object")}} 的原型物件。

- -
{{js_property_attributes(0, 0, 0)}}
- -

描述

- -

All objects in JavaScript are descended from {{jsxref("Object")}}; all objects inherit methods and properties from Object.prototype, although they may be overridden (except an Object with a null prototype, i.e. Object.create(null)). For example, other constructors' prototypes override the constructor property and provide their own {{jsxref("Object.prototype.toString()", "toString()")}} methods. Changes to the Object prototype object are propagated to all objects unless the properties and methods subject to those changes are overridden further along the prototype chain.

- -

屬性

- -
-
{{jsxref("Object.prototype.constructor")}}
-
Specifies the function that creates an object's prototype.
-
{{jsxref("Object.prototype.__proto__")}} {{non-standard_inline}}
-
Points to the object which was used as prototype when the object was instantiated.
-
{{jsxref("Object.prototype.__noSuchMethod__")}} {{non-standard_inline}}
-
Allows a function to be defined that will be executed when an undefined object member is called as a method.
-
{{jsxref("Object.prototype.__count__")}} {{obsolete_inline}}
-
Used to return the number of enumerable properties directly on a user-defined object, but has been removed.
-
{{jsxref("Object.prototype.__parent__")}} {{obsolete_inline}}
-
Used to point to an object's context, but has been removed.
-
- -

方法

- -
-
{{jsxref("Object.prototype.__defineGetter__()")}} {{non-standard_inline}} {{deprecated_inline}}
-
Associates a function with a property that, when accessed, executes that function and returns its return value.
-
{{jsxref("Object.prototype.__defineSetter__()")}} {{non-standard_inline}} {{deprecated_inline}}
-
Associates a function with a property that, when set, executes that function which modifies the property.
-
{{jsxref("Object.prototype.__lookupGetter__()")}} {{non-standard_inline}} {{deprecated_inline}}
-
Returns the function associated with the specified property by the {{jsxref("Object.defineGetter", "__defineGetter__")}} method.
-
{{jsxref("Object.prototype.__lookupSetter__()")}} {{non-standard_inline}} {{deprecated_inline}}
-
Returns the function associated with the specified property by the {{jsxref("Object.defineSetter", "__defineSetter__")}} method.
-
{{jsxref("Object.prototype.hasOwnProperty()")}}
-
Returns a boolean indicating whether an object contains the specified property as a direct property of that object and not inherited through the prototype chain.
-
{{jsxref("Object.prototype.isPrototypeOf()")}}
-
Returns a boolean indication whether the specified object is in the prototype chain of the object this method is called upon.
-
{{jsxref("Object.prototype.propertyIsEnumerable()")}}
-
Returns a boolean indicating if the internal ECMAScript DontEnum attribute is set.
-
{{jsxref("Object.prototype.toSource()")}} {{non-standard_inline}}
-
Returns string containing the source of an object literal representing the object that this method is called upon; you can use this value to create a new object.
-
{{jsxref("Object.prototype.toLocaleString()")}}
-
Calls {{jsxref("Object.toString", "toString()")}}.
-
{{jsxref("Object.prototype.toString()")}}
-
Returns a string representation of the object.
-
{{jsxref("Object.prototype.unwatch()")}} {{non-standard_inline}}
-
Removes a watchpoint from a property of the object.
-
{{jsxref("Object.prototype.valueOf()")}}
-
Returns the primitive value of the specified object.
-
{{jsxref("Object.prototype.watch()")}} {{non-standard_inline}}
-
Adds a watchpoint to a property of the object.
-
{{jsxref("Object.prototype.eval()")}} {{obsolete_inline}}
-
Used to evaluate a string of JavaScript code in the context of the specified object, but has been removed.
-
- -

範例

- -

因為 JavaScript 並沒有子類別的物件，所以原型是個很有用的解決辦法, 使某些函數作為物件的基本類別物件。例如：

- -
var Person = function() {
-  this.canTalk = true;
-};
-
-Person.prototype.greet = function() {
-  if (this.canTalk) {
-    console.log('Hi, I am ' + this.name);
-  }
-};
-
-var Employee = function(name, title) {
-  Person.call(this);
-  this.name = name;
-  this.title = title;
-};
-
-Employee.prototype = Object.create(Person.prototype);
-Employee.prototype.constructor = Employee;
-
-Employee.prototype.greet = function() {
-  if (this.canTalk) {
-    console.log('Hi, I am ' + this.name + ', the ' + this.title);
-  }
-};
-
-var Customer = function(name) {
-  Person.call(this);
-  this.name = name;
-};
-
-Customer.prototype = Object.create(Person.prototype);
-Customer.prototype.constructor = Customer;
-
-var Mime = function(name) {
-  Person.call(this);
-  this.name = name;
-  this.canTalk = false;
-};
-
-Mime.prototype = Object.create(Person.prototype);
-Mime.prototype.constructor = Mime;
-
-var bob = new Employee('Bob', 'Builder');
-var joe = new Customer('Joe');
-var rg = new Employee('Red Green', 'Handyman');
-var mike = new Customer('Mike');
-var mime = new Mime('Mime');
-
-bob.greet();
-// Hi, I am Bob, the Builder
-
-joe.greet();
-// Hi, I am Joe
-
-rg.greet();
-// Hi, I am Red Green, the Handyman
-
-mike.greet();
-// Hi, I am Mike
-
-mime.greet();
-
- -

規範

- - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition. Implemented in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.2.3.1', 'Object.prototype')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-object.prototype', 'Object.prototype')}}{{Spec2('ES6')}} 
- -

瀏覽器相容性

- -
{{CompatibilityTable}}
- -
- - - - - - - - - - - - - - - - - - - -
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -
- - - - - - - - - - - - - - - - - - - - - -
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -

參見

- - diff --git a/files/zh-tw/web/javascript/reference/global_objects/promise/prototype/index.html b/files/zh-tw/web/javascript/reference/global_objects/promise/prototype/index.html deleted file mode 100644 index f93572bea3..0000000000 --- a/files/zh-tw/web/javascript/reference/global_objects/promise/prototype/index.html +++ /dev/null @@ -1,65 +0,0 @@ ---- -title: Promise.prototype -slug: Web/JavaScript/Reference/Global_Objects/Promise/prototype -translation_of: Web/JavaScript/Reference/Global_Objects/Promise -translation_of_original: Web/JavaScript/Reference/Global_Objects/Promise/prototype ---- -
{{JSRef}}
- -

Promise.prototype 屬性代表了 {{jsxref("Promise")}} 建構式的原型物件。

- -
{{js_property_attributes(0,0,0)}}
- -

描述

- -

所有 {{jsxref("Promise")}} 實例都繼承自 {{jsxref("Promise.prototype")}}。您可以使用建構式的原型物件來增加屬性或方法到所有的 Promise 實例。

- -

屬性

- -
-
Promise.prototype.constructor
-
回傳一個建立實例原型（instance's prototype）的函式。預設為 {{jsxref("Promise")}} 函數。
-
- -

方法

- -
-
{{jsxref("Promise.catch", "Promise.prototype.catch(onRejected)")}}
-
繫結一個拒絕回呼函式（rejection handler callback）到 promise，當它被呼叫時回傳一個以回傳值作解析的新 promise，或者當 promise 被實現時以原值作解析。
-
{{jsxref("Promise.then", "Promise.prototype.then(onFulfilled, onRejected)")}}
-
繫結實現或拒絕回呼函式到 promise，回傳一個以 handler 之回傳值作解析的新 promise，或者當 promise 未處理（not handled）時以原值作解析。(i.e. 比如相關聯的 onFulfilled 或 onRejected 不是函式。)
-
- -

規範

- - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('ES6', '#sec-promise.prototype', 'Promise.prototype')}}{{Spec2('ES6')}}Initial definition.
{{SpecName('ESDraft', '#sec-promise.prototype', 'Promise.prototype')}}{{Spec2('ESDraft')}} 
- -

瀏覽器相容性

- - - -

{{Compat("javascript/promise","Promise.prototype")}}

- -

參見

- - diff --git a/files/zh-tw/web/javascript/reference/global_objects/string/prototype/index.html b/files/zh-tw/web/javascript/reference/global_objects/string/prototype/index.html deleted file mode 100644 index 011c61418e..0000000000 --- a/files/zh-tw/web/javascript/reference/global_objects/string/prototype/index.html +++ /dev/null @@ -1,177 +0,0 @@ ---- -title: String.prototype -slug: Web/JavaScript/Reference/Global_Objects/String/prototype -translation_of: Web/JavaScript/Reference/Global_Objects/String -translation_of_original: Web/JavaScript/Reference/Global_Objects/String/prototype ---- -
{{JSRef}}
- -

The String.prototype property represents the {{jsxref("String")}} prototype object.

- -
{{js_property_attributes(0, 0, 0)}}
- -

Description

- -

All {{jsxref("String")}} instances inherit from String.prototype. Changes to the String prototype object are propagated to all {{jsxref("String")}} instances.

- -

Properties

- -
-
String.prototype.constructor
-
Specifies the function that creates an object's prototype.
-
{{jsxref("String.prototype.length")}}
-
Reflects the length of the string.
-
N
-
Used to access the character in the Nth position where N is a positive integer between 0 and one less than the value of {{jsxref("String.length", "length")}}. These properties are read-only.
-
- -

Methods

- -

Methods unrelated to HTML

- -
-
{{jsxref("String.prototype.charAt()")}}
-
Returns the character (exactly one UTF-16 code unit) at the specified index.
-
{{jsxref("String.prototype.charCodeAt()")}}
-
Returns a number that is the UTF-16 code unit value at the given index.
-
{{jsxref("String.prototype.codePointAt()")}}
-
Returns a nonnegative integer Number that is the code point value of the UTF-16 encoded code point starting at the specified index.
-
{{jsxref("String.prototype.concat()")}}
-
Combines the text of two strings and returns a new string.
-
{{jsxref("String.prototype.includes()")}}
-
Determines whether one string may be found within another string.
-
{{jsxref("String.prototype.endsWith()")}}
-
Determines whether a string ends with the characters of another string.
-
{{jsxref("String.prototype.indexOf()")}}
-
Returns the index within the calling {{jsxref("String")}} object of the first occurrence of the specified value, or -1 if not found.
-
{{jsxref("String.prototype.lastIndexOf()")}}
-
Returns the index within the calling {{jsxref("String")}} object of the last occurrence of the specified value, or -1 if not found.
-
{{jsxref("String.prototype.localeCompare()")}}
-
Returns a number indicating whether a reference string comes before or after or is the same as the given string in sort order.
-
{{jsxref("String.prototype.match()")}}
-
Used to match a regular expression against a string.
-
{{jsxref("String.prototype.normalize()")}}
-
Returns the Unicode Normalization Form of the calling string value.
-
{{jsxref("String.prototype.padEnd()")}}
-
Pads the current string from the end with a given string to create a new string from a given length.
-
{{jsxref("String.prototype.padStart()")}}
-
Pads the current string from the start with a given string to create a new string from a given length.
-
{{jsxref("String.prototype.quote()")}} {{obsolete_inline}}
-
Wraps the string in double quotes (""").
-
{{jsxref("String.prototype.repeat()")}}
-
Returns a string consisting of the elements of the object repeated the given times.
-
{{jsxref("String.prototype.replace()")}}
-
Used to find a match between a regular expression and a string, and to replace the matched substring with a new substring.
-
{{jsxref("String.prototype.search()")}}
-
Executes the search for a match between a regular expression and a specified string.
-
{{jsxref("String.prototype.slice()")}}
-
Extracts a section of a string and returns a new string.
-
{{jsxref("String.prototype.split()")}}
-
Splits a {{jsxref("Global_Objects/String", "String")}} object into an array of strings by separating the string into substrings.
-
{{jsxref("String.prototype.startsWith()")}}
-
Determines whether a string begins with the characters of another string.
-
{{jsxref("String.prototype.substr()")}}
-
Returns the characters in a string beginning at the specified location through the specified number of characters.
-
{{jsxref("String.prototype.substring()")}}
-
Returns the characters in a string between two indexes into the string.
-
{{jsxref("String.prototype.toLocaleLowerCase()")}}
-
The characters within a string are converted to lower case while respecting the current locale. For most languages, this will return the same as {{jsxref("String.prototype.toLowerCase()", "toLowerCase()")}}.
-
{{jsxref("String.prototype.toLocaleUpperCase()")}}
-
The characters within a string are converted to upper case while respecting the current locale. For most languages, this will return the same as {{jsxref("String.prototype.toUpperCase()", "toUpperCase()")}}.
-
{{jsxref("String.prototype.toLowerCase()")}}
-
Returns the calling string value converted to lower case.
-
{{jsxref("String.prototype.toSource()")}} {{non-standard_inline}}
-
Returns an object literal representing the specified object; you can use this value to create a new object. Overrides the {{jsxref("Object.prototype.toSource()")}} method.
-
{{jsxref("String.prototype.toString()")}}
-
Returns a string representing the specified object. Overrides the {{jsxref("Object.prototype.toString()")}} method.
-
{{jsxref("String.prototype.toUpperCase()")}}
-
Returns the calling string value converted to uppercase.
-
{{jsxref("String.prototype.trim()")}}
-
Trims whitespace from the beginning and end of the string. Part of the ECMAScript 5 standard.
-
{{jsxref("String.prototype.trimLeft()")}} {{non-standard_inline}}
-
Trims whitespace from the left side of the string.
-
{{jsxref("String.prototype.trimRight()")}} {{non-standard_inline}}
-
Trims whitespace from the right side of the string.
-
{{jsxref("String.prototype.valueOf()")}}
-
Returns the primitive value of the specified object. Overrides the {{jsxref("Object.prototype.valueOf()")}} method.
-
{{jsxref("String.prototype.@@iterator()", "String.prototype[@@iterator]()")}}
-
Returns a new Iterator object that iterates over the code points of a String value, returning each code point as a String value.
-
- -

HTML wrapper methods

- -

These methods are of limited use, as they provide only a subset of the available HTML tags and attributes.

- -
-
{{jsxref("String.prototype.anchor()")}}
-
{{htmlattrxref("name", "a", "<a name=\"name\">")}} (hypertext target)
-
{{jsxref("String.prototype.big()")}} {{deprecated_inline}}
-
{{HTMLElement("big")}}
-
{{jsxref("String.prototype.blink()")}} {{deprecated_inline}}
-
{{HTMLElement("blink")}}
-
{{jsxref("String.prototype.bold()")}} {{deprecated_inline}}
-
{{HTMLElement("b")}}
-
{{jsxref("String.prototype.fixed()")}} {{deprecated_inline}}
-
{{HTMLElement("tt")}}
-
{{jsxref("String.prototype.fontcolor()")}} {{deprecated_inline}}
-
{{htmlattrxref("color", "font", "<font color=\"color\">")}}
-
{{jsxref("String.prototype.fontsize()")}} {{deprecated_inline}}
-
{{htmlattrxref("size", "font", "<font size=\"size\">")}}
-
{{jsxref("String.prototype.italics()")}} {{deprecated_inline}}
-
{{HTMLElement("i")}}
-
{{jsxref("String.prototype.link()")}}
-
{{htmlattrxref("href", "a", "<a href=\"url\">")}} (link to URL)
-
{{jsxref("String.prototype.small()")}} {{deprecated_inline}}
-
{{HTMLElement("small")}}
-
{{jsxref("String.prototype.strike()")}} {{deprecated_inline}}
-
{{HTMLElement("strike")}}
-
{{jsxref("String.prototype.sub()")}} {{deprecated_inline}}
-
{{HTMLElement("sub")}}
-
{{jsxref("String.prototype.sup()")}} {{deprecated_inline}}
-
{{HTMLElement("sup")}}
-
- -

Specifications

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition.
{{SpecName('ES5.1', '#sec-15.5.3.1', 'String.prototype')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-string.prototype', 'String.prototype')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-string.prototype', 'String.prototype')}}{{Spec2('ESDraft')}} 
- -

Browser compatibility

- - - -

{{Compat("javascript.builtins.String.prototype")}}

- -

See also

- - diff --git a/files/zh-tw/web/javascript/reference/operators/arithmetic_operators/index.html b/files/zh-tw/web/javascript/reference/operators/arithmetic_operators/index.html deleted file mode 100644 index 050c362008..0000000000 --- a/files/zh-tw/web/javascript/reference/operators/arithmetic_operators/index.html +++ /dev/null @@ -1,309 +0,0 @@ ---- -title: 算術運算子 -slug: Web/JavaScript/Reference/Operators/Arithmetic_Operators -translation_of: Web/JavaScript/Reference/Operators -translation_of_original: Web/JavaScript/Reference/Operators/Arithmetic_Operators ---- -
{{jsSidebar("Operators")}}
- -

算術運算子接受數值（資料型態為字串或變數都可）作為其運算子並回傳單個數值。 標準算術運算符號有加號（+），減號（ - ），乘（*）和除（/）。

- -
{{EmbedInteractiveExample("pages/js/expressions-arithmetic.html")}}
- - - -

Addition (+)

- -

加法運算子生成數字(運算元)的總和或字串串接。

- -

Syntax

- -
Operator: x + y
-
- -

Examples

- -
// Number + Number -> addition
-1 + 2 // 3
-
-// Boolean + Number -> addition
-true + 1 // 2
-
-// Boolean + Boolean -> addition
-false + false // 0
-
-// Number + String -> concatenation
-5 + 'foo' // "5foo"
-
-// String + Boolean -> concatenation
-'foo' + false // "foofalse"
-
-// String + String -> concatenation
-'foo' + 'bar' // "foobar"
-
- -

Subtraction (-)

- -

減法運算子能算出兩個運算元間的差異。

- -

Syntax

- -
Operator: x - y
-
- -

Examples

- -
5 - 3 // 2
-3 - 5 // -2
-'foo' - 3 // NaN
- -

Division (/)

- -

The division operator produces the quotient of its operands where the left operand is the dividend and the right operand is the divisor.

- -

Syntax

- -
Operator: x / y
-
- -

Examples

- -
1 / 2      // returns 0.5 in JavaScript
-1 / 2      // returns 0 in Java
-// (neither number is explicitly a floating point number)
-
-1.0 / 2.0  // returns 0.5 in both JavaScript and Java
-
-2.0 / 0    // returns Infinity in JavaScript
-2.0 / 0.0  // returns Infinity too
-2.0 / -0.0 // returns -Infinity in JavaScript
- -

Multiplication (*)

- -

The multiplication operator produces the product of the operands.

- -

Syntax

- -
Operator: x * y
-
- -

Examples

- -
2 * 2 // 4
--2 * 2 // -4
-Infinity * 0 // NaN
-Infinity * Infinity // Infinity
-'foo' * 2 // NaN
-
- -

Remainder (%)

- -

The remainder operator returns the remainder left over when one operand is divided by a second operand. It always takes the sign of the dividend.

- -

Syntax

- -
Operator: var1 % var2
-
- -

Examples

- -
12 % 5 // 2
--1 % 2 // -1
-1 % -2 // 1
-NaN % 2 // NaN
-1 % 2 // 1
-2 % 3 // 2
--4 % 2 // -0
-5.5 % 2 // 1.5
-
- -

Exponentiation (**)

- -

The exponentiation operator returns the result of raising first operand to the power second operand. that is, var1var2, in the preceding statement, where var1 and var2 are variables. Exponentiation operator is right associative. a ** b ** c is equal to a ** (b ** c).

- -

Syntax

- -
Operator: var1 ** var2
-
- -

Notes

- -

In most languages like PHP and Python and others that have an exponentiation operator (**), the exponentiation operator is defined to have a higher precedence than unary operators such as unary + and unary -, but there are a few exceptions. For example, in Bash the ** operator is defined to have a lower precedence than unary operators. In JavaScript, it is impossible to write an ambiguous exponentiation expression, i.e. you cannot put a unary operator (+/-/~/!/delete/void/typeof) immediately before the base number.

- -
-2 ** 2;
-// 4 in Bash, -4 in other languages.
-// This is invalid in JavaScript, as the operation is ambiguous.
-
-
--(2 ** 2);
-// -4 in JavaScript and the author's intention is unambiguous.
-
- -

Examples

- -
2 ** 3 // 8
-3 ** 2 // 9
-3 ** 2.5 // 15.588457268119896
-10 ** -1 // 0.1
-NaN ** 2 // NaN
-
-2 ** 3 ** 2 // 512
-2 ** (3 ** 2) // 512
-(2 ** 3) ** 2 // 64
-
- -

To invert the sign of the result of an exponentiation expression:

- -
-(2 ** 2) // -4
-
- -

To force the base of an exponentiation expression to be a negative number:

- -
(-2) ** 2 // 4
-
- -
-

Note: JavaScript also has a bitwise operator ^ (logical XOR). ** and ^ are different (for example : 2 ** 3 === 8 when 2 ^ 3 === 1.)

-
- -

Increment (++)

- -

The increment operator increments (adds one to) its operand and returns a value.

- - - -

Syntax

- -
Operator: x++ or ++x
-
- -

Examples

- -
// Postfix
-var x = 3;
-y = x++; // y = 3, x = 4
-
-// Prefix
-var a = 2;
-b = ++a; // a = 3, b = 3
-
- -

Decrement (--)

- -

The decrement operator decrements (subtracts one from) its operand and returns a value.

- - - -

Syntax

- -
Operator: x-- or --x
-
- -

Examples

- -
// Postfix
-var x = 3;
-y = x--; // y = 3, x = 2
-
-// Prefix
-var a = 2;
-b = --a; // a = 1, b = 1
-
- -

Unary negation (-)

- -

The unary negation operator precedes its operand and negates it.

- -

Syntax

- -
Operator: -x
-
- -

Examples

- -
var x = 3;
-y = -x; // y = -3, x = 3
-
-// Unary negation operator can convert non-numbers into a number
-var x = "4";
-y = -x; // y = -4
-
- -

Unary plus (+)

- -

The unary plus operator precedes its operand and evaluates to its operand but attempts to convert it into a number, if it isn't already. Although unary negation (-) also can convert non-numbers, unary plus is the fastest and preferred way of converting something into a number, because it does not perform any other operations on the number. It can convert string representations of integers and floats, as well as the non-string values true, false, and null. Integers in both decimal and hexadecimal ("0x"-prefixed) formats are supported. Negative numbers are supported (though not for hex). If it cannot parse a particular value, it will evaluate to {{jsxref("NaN")}}.

- -

Syntax

- -
Operator: +x
-
- -

Examples

- -
+3     // 3
-+'3'   // 3
-+true  // 1
-+false // 0
-+null  // 0
-+function(val){ return val } // NaN
-
- -

Specifications

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition.
{{SpecName('ES5.1', '#sec-11.3')}}{{Spec2('ES5.1')}}Defined in several sections of the specification: Additive operators, Multiplicative operators, Postfix expressions, Unary operators.
{{SpecName('ES2015', '#sec-postfix-expressions')}}{{Spec2('ES2015')}}Defined in several sections of the specification: Additive operators, Multiplicative operators, Postfix expressions, Unary operators.
{{SpecName('ES2016', '#sec-postfix-expressions')}}{{Spec2('ES2016')}}Added Exponentiation operator.
{{SpecName('ES2017', '#sec-postfix-expressions')}}{{Spec2('ES2017')}} 
{{SpecName('ESDraft', '#sec-additive-operators')}}{{Spec2('ESDraft')}} 
- -

Browser compatibility

- - - -

{{Compat("javascript.operators.arithmetic")}}

- -

See also

- - diff --git a/files/zh-tw/web/javascript/reference/operators/bitwise_operators/index.html b/files/zh-tw/web/javascript/reference/operators/bitwise_operators/index.html deleted file mode 100644 index 86f78270b5..0000000000 --- a/files/zh-tw/web/javascript/reference/operators/bitwise_operators/index.html +++ /dev/null @@ -1,555 +0,0 @@ ---- -title: 位元運算子 -slug: Web/JavaScript/Reference/Operators/Bitwise_Operators -translation_of: Web/JavaScript/Reference/Operators -translation_of_original: Web/JavaScript/Reference/Operators/Bitwise_Operators ---- -
{{jsSidebar("Operators")}}
- -

位元運算子將運算元視為一段 32 位元長的 0 和 1 序列，而不是十進位、十六進位或八進位的 Numbers。 舉例來說，十進位的 9 可以用二進位表示為 1001。位元運算子對這樣的二進位表示法進行運算，然後回傳標準 JavaScript 數值。

- -
{{EmbedInteractiveExample("pages/js/expressions-bitwiseoperators.html")}}
- - - -

下表總結了 JavaScript 的位元運算子：

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
OperatorUsageDescription
位元 ANDa & b當兩運算元的該位置皆為 1 時，回傳值的該位置為 1。
位元 ORa | b當兩運算元的該位置有一者為 1 時，回傳值的該位置為 1。
位元 XORa ^ b當兩運算元的該位置恰好一者為 1 時，回傳值的該位置為 1。
位元 NOT~ a將運算元的所有位元反轉。
左移a << b將 a 的二進位表示法左移 b (< 32) 位元，右側補 0。
保持符號右移a >> b將 a 的二進位表示法右移 b (< 32) 位元，拋棄被移出的位元。
填零右移a >>> b  將 a 的二進位表示法右移 b (< 32) 位元，拋棄被移出的位元，並於右側補 0。
- -

帶號的 32位元整數

- -

所有位元運算子的運算元皆會被轉換成二補數系統下的帶號32位元整數。二補數系統意味著一個整數的加法反元素(例如 5和 -5)是該整數的所有位元反轉(位元 NOT，也就是該數的一補數) 再加一。舉例來說，下面的序列代表著整數 314：

- -
00000000000000000000000100111010
-
- -

下面的序列代表 ~314，也就是 314 的一補數：

- -
11111111111111111111111011000101
-
- -

接著，下面代表著 -314，也就是 314 的二補數：

- -
11111111111111111111111011000110
-
- -

二補數系統確保了正值時最左邊的位元為 0，反之則為 1。因此，最左邊的位元被稱作符號位。

- -

整數 0 全由位元 0組成。

- -
0 (base 10) = 00000000000000000000000000000000 (base 2)
-
- -

整數 -1 全由位元 1組成。

- -
-1 (base 10) = 11111111111111111111111111111111 (base 2)
-
- -

整數 -2147483648 (十六進位： -0x80000000) 除了第一位為 1，其餘皆由位元 0組成。

- -
-2147483648 (base 10) = 10000000000000000000000000000000 (base 2)
-
- -

整數 -2147483648 (十六進位： -0x7fffffff) 除了第一位為 0，其餘皆由位元 1組成。

- -
2147483647 (base 10) = 01111111111111111111111111111111 (base 2)
-
- -

整數 -2147483648 和 2147483647 分別為帶號32位元整數所能表示的最小值和最大值。

- -

位元邏輯運算子

- -

大致上，位元邏輯運算子的運作如下︰

- - - -

& (位元 AND)

- -

對每一組位元執行 AND 運算。a AND b 只在 a 和 b 同時為 1 時得到 1。AND運算的真值表如下：

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
aba AND b
000
010
100
111
- -
.    9 (base 10) = 00000000000000000000000000001001 (base 2)
-    14 (base 10) = 00000000000000000000000000001110 (base 2)
-                   --------------------------------
-14 & 9 (base 10) = 00000000000000000000000000001000 (base 2) = 8 (base 10)
-
- -

將任何數 x 和 0 做位元 AND 皆會得到 0。將任何數 x 和 -1 做位元 AND 皆會得到 x。

- -

| (位元 OR)

- -

對每一組位元執行 OR 運算。a OR b 在 a 和 b 有一者為 1 時得到 1。OR運算的真值表如下：

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
aba OR b
000
011
101
111
- -
.    9 (base 10) = 00000000000000000000000000001001 (base 2)
-    14 (base 10) = 00000000000000000000000000001110 (base 2)
-                   --------------------------------
-14 | 9 (base 10) = 00000000000000000000000000001111 (base 2) = 15 (base 10)
-
- -

將任何數 x 和 0 做位元 OR 皆會得到 x。將任何數 x 和 -1 做位元 OR 皆會得到 -1。

- -

^ (位元 XOR)

- -

對每一組位元執行 XOR 運算。a XOR b 只在 a 和 b 恰一者為 1 時得到 1。XOR運算的真值表如下：

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
aba XOR b
000
011
101
110
- -
.    9 (base 10) = 00000000000000000000000000001001 (base 2)
-    14 (base 10) = 00000000000000000000000000001110 (base 2)
-                   --------------------------------
-14 ^ 9 (base 10) = 00000000000000000000000000000111 (base 2) = 7 (base 10)
-
- -

將任何數 x 和 0 做位元 AND 皆會得到 x。將任何數 x 和 -1 做位元 AND 皆會得到 ~x。

- -

~ (位元 NOT)

- -

對每一個位元執行 NOT 運算。NOT a 會得到 a 的反轉值(也就是一補數)。NOT運算的真值表如下：

- - - - - - - - - - - - - - - - -
aNOT a
01
10
- -
 9 (base 10) = 00000000000000000000000000001001 (base 2)
-               --------------------------------
-~9 (base 10) = 11111111111111111111111111110110 (base 2) = -10 (base 10)
-
- -

將任何數 x 做位元 NOT 皆會得到 -(x + 1)。舉例來說，~-5 會得到 4。

- -

值得注意的是，因為使用 32位元表示法表示數值 ~-1 和 ~4294967295 (232-1) 皆會得到 0。

- -

位元位移運算子

- -

位移運算子需要兩個運算元：第一個是要被位移的值，第二個是位元位移量。位移的方向取決於使用的運算子。

- -

位移運算子將運算元轉換成 32位元的大端序整數並回傳一個與左運算元相同類別的值。右運算元應不大於32，如果超過的話，將只會使用後 5個位元。

- -

<< (左移)

- -

將第一個運算元向左位移指定的量。被移出的位元會被拋棄，並從右側補零。

- -

例如，9 << 2 會得到 36：

- -
.    9 (base 10): 00000000000000000000000000001001 (base 2)
-                  --------------------------------
-9 << 2 (base 10): 00000000000000000000000000100100 (base 2) = 36 (base 10)
-
- -

將任意值 x 左移 y 位元會得到 x * 2 ** y。

- -

>> (保持符號右移)

- -

將第一個運算元向右位移指定的量。被移出的位元會被拋棄，並從左側補進和原本最左端相同的位元值。因為新的最左端位元和原本的最左端位元是一樣的，符號位(最左端位元)並不會改變。「保持符號」之名便是因此。

- -

例如，9 >> 2 會得到 2：

- -
.    9 (base 10): 00000000000000000000000000001001 (base 2)
-                  --------------------------------
-9 >> 2 (base 10): 00000000000000000000000000000010 (base 2) = 2 (base 10)
-
- -

同樣地，-9 >> 2 會得到 -3，因為符號會保持不變。

- -
.    -9 (base 10): 11111111111111111111111111110111 (base 2)
-                   --------------------------------
--9 >> 2 (base 10): 11111111111111111111111111111101 (base 2) = -3 (base 10)
-
- -

>>> (填零右移)

- -

將第一個運算元向右位移指定的量。被移出的位元會被拋棄，並從左側補零。因為符號位變成 0，所以結果永遠都是正值。

- -

對非負的數來說，填零右移會得到和保持符號右移一樣的結果。例如，9 >>> 2 和 9 >> 2 一樣，皆會得到 2：

- -
.     9 (base 10): 00000000000000000000000000001001 (base 2)
-                   --------------------------------
-9 >>> 2 (base 10): 00000000000000000000000000000010 (base 2) = 2 (base 10)
-
- -

然而對負值來說並不是這麼一回事。例如，-9 >>> 2 會得到 1073741821，跟 -9 >> 2 (得到 -3)的結果是不一樣的：

- -
.     -9 (base 10): 11111111111111111111111111110111 (base 2)
-                    --------------------------------
--9 >>> 2 (base 10): 00111111111111111111111111111101 (base 2) = 1073741821 (base 10)
-
- -

範例

- -

旗標(flags) 和遮罩 (bitmasks)

- -

位元運算子常被用於生成、修改、和讀取旗標序列，就像是二進制的變數一般。雖然也可以使用普通變數，但使用二進制的旗標序列大大的減少了所需空間 (32 倍)。

- -

假設有 4個旗標：

- - - -

這些旗標倍表達成一個位元序列：DCBA。當一個旗標被立起 (set)時，其值為1。當一個旗標被放下 (clear)，其值為0。假設有一變數 flags 的二進位值為 0101：

- -
var flags = 5;   // 二進位 0101
-
- -

這個值表示：

- - - -

因為位元運算子進行的是 32位元操作，0101 實際上是 00000000000000000000000000000101，但前導的 0可被忽略因為他們沒有實際上的意義。

- -

位元遮罩則為一個可以修改且(或)讀取旗標序列的位元序列。通常為每個單獨旗標為真的「初始」值：

- -
var FLAG_A = 1; // 0001
-var FLAG_B = 2; // 0010
-var FLAG_C = 4; // 0100
-var FLAG_D = 8; // 1000
-
- -

新的位元遮罩可以透過對初始遮罩進行位元運算獲得。例如，遮罩 1011 可以透過對 FLAG_A、FLAG_B、和 FLAG_D進行 OR運算獲得：

- -
var mask = FLAG_A | FLAG_B | FLAG_D; // 0001 | 0010 | 1000 => 1011
-
- -

Individual flag values can be extracted by ANDing them with a bitmask, where each bit with the value of one will "extract" the corresponding flag. The bitmask masks out the non-relevant flags by ANDing with zeroes (hence the term "bitmask"). For example, the bitmask 0100 can be used to see if flag C is set:

- -
// if we own a cat
-if (flags & FLAG_C) { // 0101 & 0100 => 0100 => true
-   // do stuff
-}
-
- -

A bitmask with multiple set flags acts like an "either/or". For example, the following two are equivalent:

- -
// if we own a bat or we own a cat
-// (0101 & 0010) || (0101 & 0100) => 0000 || 0100 => true
-if ((flags & FLAG_B) || (flags & FLAG_C)) {
-   // do stuff
-}
-
- -
// if we own a bat or cat
-var mask = FLAG_B | FLAG_C; // 0010 | 0100 => 0110
-if (flags & mask) { // 0101 & 0110 => 0100 => true
-   // do stuff
-}
-
- -

Flags can be set by ORing them with a bitmask, where each bit with the value one will set the corresponding flag, if that flag isn't already set. For example, the bitmask 1100 can be used to set flags C and D:

- -
// yes, we own a cat and a duck
-var mask = FLAG_C | FLAG_D; // 0100 | 1000 => 1100
-flags |= mask;   // 0101 | 1100 => 1101
-
- -

Flags can be cleared by ANDing them with a bitmask, where each bit with the value zero will clear the corresponding flag, if it isn't already cleared. This bitmask can be created by NOTing primitive bitmasks. For example, the bitmask 1010 can be used to clear flags A and C:

- -
// no, we don't have an ant problem or own a cat
-var mask = ~(FLAG_A | FLAG_C); // ~0101 => 1010
-flags &= mask;   // 1101 & 1010 => 1000
-
- -

The mask could also have been created with ~FLAG_A & ~FLAG_C (De Morgan's law):

- -
// no, we don't have an ant problem, and we don't own a cat
-var mask = ~FLAG_A & ~FLAG_C;
-flags &= mask;   // 1101 & 1010 => 1000
-
- -

Flags can be toggled by XORing them with a bitmask, where each bit with the value one will toggle the corresponding flag. For example, the bitmask 0110 can be used to toggle flags B and C:

- -
// if we didn't have a bat, we have one now,
-// and if we did have one, bye-bye bat
-// same thing for cats
-var mask = FLAG_B | FLAG_C;
-flags = flags ^ mask;   // 1100 ^ 0110 => 1010
-
- -

Finally, the flags can all be flipped with the NOT operator:

- -
// entering parallel universe...
-flags = ~flags;    // ~1010 => 0101
-
- -

Conversion snippets

- -

Convert a binary String to a decimal Number:

- -
var sBinString = '1011';
-var nMyNumber = parseInt(sBinString, 2);
-alert(nMyNumber); // prints 11, i.e. 1011
-
- -

Convert a decimal Number to a binary String:

- -
var nMyNumber = 11;
-var sBinString = nMyNumber.toString(2);
-alert(sBinString); // prints 1011, i.e. 11
-
- -

Automate Mask Creation

- -

You can create multiple masks from a set of Boolean values, like this:

- -
function createMask() {
-  var nMask = 0, nFlag = 0, nLen = arguments.length > 32 ? 32 : arguments.length;
-  for (nFlag; nFlag < nLen; nMask |= arguments[nFlag] << nFlag++);
-  return nMask;
-}
-var mask1 = createMask(true, true, false, true); // 11, i.e.: 1011
-var mask2 = createMask(false, false, true); // 4, i.e.: 0100
-var mask3 = createMask(true); // 1, i.e.: 0001
-// etc.
-
-alert(mask1); // prints 11, i.e.: 1011
-
- -

Reverse algorithm: an array of booleans from a mask

- -

If you want to create an Array of Booleans from a mask you can use this code:

- -
function arrayFromMask(nMask) {
-  // nMask must be between -2147483648 and 2147483647
-  if (nMask > 0x7fffffff || nMask < -0x80000000) {
-    throw new TypeError('arrayFromMask - out of range');
-  }
-  for (var nShifted = nMask, aFromMask = []; nShifted;
-       aFromMask.push(Boolean(nShifted & 1)), nShifted >>>= 1);
-  return aFromMask;
-}
-
-var array1 = arrayFromMask(11);
-var array2 = arrayFromMask(4);
-var array3 = arrayFromMask(1);
-
-alert('[' + array1.join(', ') + ']');
-// prints "[true, true, false, true]", i.e.: 11, i.e.: 1011
-
- -

You can test both algorithms at the same time…

- -
var nTest = 19; // our custom mask
-var nResult = createMask.apply(this, arrayFromMask(nTest));
-
-alert(nResult); // 19
-
- -

For the didactic purpose only (since there is the Number.toString(2) method), we show how it is possible to modify the arrayFromMask algorithm in order to create a String containing the binary representation of a Number, rather than an Array of Booleans:

- -
function createBinaryString(nMask) {
-  // nMask must be between -2147483648 and 2147483647
-  for (var nFlag = 0, nShifted = nMask, sMask = ''; nFlag < 32;
-       nFlag++, sMask += String(nShifted >>> 31), nShifted <<= 1);
-  return sMask;
-}
-
-var string1 = createBinaryString(11);
-var string2 = createBinaryString(4);
-var string3 = createBinaryString(1);
-
-alert(string1);
-// prints 00000000000000000000000000001011, i.e. 11
-
- -

規範

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition.
{{SpecName('ES5.1', '#sec-11.7')}}{{Spec2('ES5.1')}}Defined in several sections of the specification: Bitwise NOT operator, Bitwise shift operators, Binary bitwise operators
{{SpecName('ES6', '#sec-bitwise-shift-operators')}}{{Spec2('ES6')}}Defined in several sections of the specification: Bitwise NOT operator, Bitwise shift operators, Binary bitwise operators
{{SpecName('ESDraft', '#sec-bitwise-shift-operators')}}{{Spec2('ESDraft')}}Defined in several sections of the specification: Bitwise NOT operator, Bitwise shift operators, Binary bitwise operators
- -

瀏覽器相容性

- - - -

{{Compat("javascript.operators.bitwise")}}

- -

另見

- - diff --git a/files/zh-tw/web/javascript/reference/operators/comparison_operators/index.html b/files/zh-tw/web/javascript/reference/operators/comparison_operators/index.html deleted file mode 100644 index f0b3e39c6e..0000000000 --- a/files/zh-tw/web/javascript/reference/operators/comparison_operators/index.html +++ /dev/null @@ -1,284 +0,0 @@ ---- -title: 比較運算子 -slug: Web/JavaScript/Reference/Operators/Comparison_Operators -translation_of: Web/JavaScript/Reference/Operators -translation_of_original: Web/JavaScript/Reference/Operators/Comparison_Operators ---- -
{{jsSidebar("Operators")}}
- -

JavaScript has both strict and type–converting comparisons. A strict comparison (e.g., ===) is only true if the operands are of the same type and the contents match. The more commonly-used abstract comparison (e.g. ==) converts the operands to the same type before making the comparison. For relational abstract comparisons (e.g., <=), the operands are first converted to primitives, then to the same type, before comparison.

- -

Strings are compared based on standard lexicographical ordering, using Unicode values.

- -

Features of comparisons:

- - - -

Equality operators

- -

Equality (==)

- -

The equality operator converts the operands if they are not of the same type, then applies strict comparison. If both operands are objects, then JavaScript compares internal references which are equal when operands refer to the same object in memory.

- -

Syntax

- -
x == y
-
- -

Examples

- -
  1   ==  1        // true
- "1"  ==  1        // true
-  1   == '1'       // true
-  0   == false     // true
-  0   == null      // false
-var object1 = {"value":"key"}, object2={"value":"key"};
-object1 == object2 //false
-
-  0   == undefined // false
-null  == undefined // true
-
- -

Inequality (!=)

- -

The inequality operator returns true if the operands are not equal. If the two operands are not of the same type, JavaScript attempts to convert the operands to an appropriate type for the comparison. If both operands are objects, then JavaScript compares internal references which are not equal when operands refer to different objects in memory.

- -

Syntax

- -
x != y
- -

Examples

- -
1 !=   2     // true
-1 !=  "1"    // false
-1 !=  '1'    // false
-1 !=  true   // false
-0 !=  false  // false
-
- -

Identity / strict equality (===)

- -

The identity operator returns true if the operands are strictly equal (see above) with no type conversion. 

- -

Syntax

- -
x === y
- -

Examples

- -
3 === 3   // true
-3 === '3' // false
-var object1 = {"value":"key"}, object2={"value":"key"};
-object1 === object2 //false
- -

 

- -

Non-identity / strict inequality (!==)

- -

The non-identity operator returns true if the operands are not equal and/or not of the same type.

- -

Syntax

- -
x !== y
- -

Examples

- -
3 !== '3' // true
-4 !== 3   // true
-
- -

Relational operators

- -

Each of these operators will call the valueOf() function on each operand before a comparison is made.

- -

Greater than operator (>)

- -

The greater than operator returns true if the left operand is greater than the right operand.

- -

Syntax

- -
x > y
- -

Examples

- -
4 > 3 // true
-
- -

Greater than or equal operator (>=)

- -

The greater than or equal operator returns true if the left operand is greater than or equal to the right operand.

- -

Syntax

- -
 x >= y
- -

Examples

- -
4 >= 3 // true
-3 >= 3 // true
-
- -

Less than operator (<)

- -

The less than operator returns true if the left operand is less than the right operand.

- -

Syntax

- -
 x < y
- -

Examples

- -
3 < 4 // true
-
- -

Less than or equal operator (<=)

- -

The less than or equal operator returns true if the left operand is less than or equal to the right operand.

- -

Syntax

- -
 x <= y
- -

Examples

- -
3 <= 4 // true
-
- -

Using the Equality Operators

- -

The standard equality operators (== and !=) use the Abstract Equality Comparison Algorithm to compare two operands. If the operands are of different types, it will attempt to convert them to the same type before making the comparison, e.g., in the expression 5 == '5', the string on the right is converted to {{jsxref("Number")}} before the comparison is made.

- -

The strict equality operators (=== and !==) use the Strict Equality Comparison Algorithm and are intended for performing equality comparisons on operands of the same type. If the operands are of different types, the result is always false so 5 !== '5'.

- -

Use strict equality operators if the operands must be of a specific type as well as value or if the exact type of the operands is important. Otherwise, use the standard equality operators, which allow you to compare the identity of two operands even if they are not of the same type.

- -

When type conversion is involved in the comparison (i.e., non–strict comparison), JavaScript converts the types {{jsxref("String")}}, {{jsxref("Number")}}, {{jsxref("Boolean")}}, or {{jsxref("Object")}} operands as follows:

- - - -
Note: String objects are Type Object, not String! String objects are rarely used, so the following results might be surprising:
- -
// true as both operands are type String (i.e. string primitives):
-'foo' === 'foo'
-
-var a = new String('foo');
-var b = new String('foo');
-
-// false as a and b are type Object and reference different objects
-a == b
-
-// false as a and b are type Object and reference different objects
-a === b
-
-// true as a and 'foo' are of different type and, the Object (a)
-// is converted to String 'foo' before comparison
-a == 'foo'
- -

規範

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition. Implemented in JavaScript 1.0
{{SpecName('ES3')}}{{Spec2('ES3')}}Adds === and !== operators. Implemented in JavaScript 1.3
{{SpecName('ES5.1', '#sec-11.8')}}{{Spec2('ES5.1')}}Defined in several sections of the specification: Relational Operators, Equality Operators
{{SpecName('ES6', '#sec-relational-operators')}}{{Spec2('ES6')}}Defined in several sections of the specification: Relational Operators, Equality Operators
{{SpecName('ESDraft', '#sec-relational-operators')}}{{Spec2('ESDraft')}}Defined in several sections of the specification: Relational Operators, Equality Operators
- -

瀏覽器相容性

- -

{{CompatibilityTable}}

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

參見

- - diff --git a/files/zh-tw/web/javascript/reference/operators/logical_operators/index.html b/files/zh-tw/web/javascript/reference/operators/logical_operators/index.html deleted file mode 100644 index 2fb07f891e..0000000000 --- a/files/zh-tw/web/javascript/reference/operators/logical_operators/index.html +++ /dev/null @@ -1,244 +0,0 @@ ---- -title: Logical operators -slug: Web/JavaScript/Reference/Operators/Logical_Operators -translation_of: Web/JavaScript/Reference/Operators -translation_of_original: Web/JavaScript/Reference/Operators/Logical_Operators ---- -
{{jsSidebar("Operators")}}
- -

邏輯運算子通常會搭配 {{jsxref("Boolean")}} (logical) 值。若是，則回傳布林值。然而， && 和 ||  運算子通常回傳其中一運算元的值, 因此若這些運算子搭配非布林值使用，他們會回傳非布林值。

- -
{{EmbedInteractiveExample("pages/js/expressions-logicaloperator.html")}}
- - - -

說明

- -

邏輯運算子的使用方式如下(expr 可能會是 type，不只是布林值)：

- - - - - - - - - - - - - - - - - - - - - - - - -
OperatorSyntaxDescription
邏輯 AND (&&)expr1 && expr2若 expr1 可被轉換成 true, 回傳 expr2; 否則 回傳 expr1.
邏輯 OR (||)expr1 || expr2若 expr1 可被轉換成 true, 回傳 expr1; 否則 回傳 expr2.
邏輯 NOT (!)!expr回傳 false 若它的單一運算元可被轉換成 true; 否則回傳 true.
- -

If a value can be converted to true, the value is so-called {{Glossary("truthy")}}. If a value can be converted to false, the value is so-called {{Glossary("falsy")}}.

- -

Examples of expressions that can be converted to false are:

- - - -

Even though the && and || operators can be used with operands that are not Boolean values, they can still be considered boolean operators since their return values can always be converted to boolean primitives. To explicitly convert their return value (or any expression in general) to the corresponding boolean value, use a double NOT operator or the Boolean constructor.

- -

Short-circuit evaluation

- -

As logical expressions are evaluated left to right, they are tested for possible "short-circuit" evaluation using the following rules:

- - - -

Short circuit means that the expr parts above are not evaluated, hence any side effects of doing so do not take effect (e.g., if expr is a function call, the calling never takes place). This happens because the value of the operator is already determined after the evaluation of the first operand. See example:

- -
function A(){ console.log('called A'); return false; }
-function B(){ console.log('called B'); return true; }
-
-console.log( A() && B() );
-// logs "called A" due to the function call,
-// then logs false (which is the resulting value of the operator)
-
-console.log( B() || A() );
-// logs "called B" due to the function call,
-// then logs true (which is the resulting value of the operator)
-
- -

Operator precedence

- -

The following expressions might seem equivalent, but they are not, because the && operator is executed before the || operator (see operator precedence).

- -
true || false && false      // returns true, because && is executed first
-(true || false) && false    // returns false, because operator precedence cannot apply
- -

Logical AND (&&)

- -

The following code shows examples of the && (logical AND) operator.

- -
a1 = true  && true       // t && t returns true
-a2 = true  && false      // t && f returns false
-a3 = false && true       // f && t returns false
-a4 = false && (3 == 4)   // f && f returns false
-a5 = 'Cat' && 'Dog'      // t && t returns "Dog"
-a6 = false && 'Cat'      // f && t returns false
-a7 = 'Cat' && false      // t && f returns false
-a8 = ''    && false      // f && f returns ""
-a9 = false && ''         // f && f returns false
-
- -

Logical OR (||)

- -

The following code shows examples of the || (logical OR) operator.

- -
o1 = true  || true       // t || t returns true
-o2 = false || true       // f || t returns true
-o3 = true  || false      // t || f returns true
-o4 = false || (3 == 4)   // f || f returns false
-o5 = 'Cat' || 'Dog'      // t || t returns "Cat"
-o6 = false || 'Cat'      // f || t returns "Cat"
-o7 = 'Cat' || false      // t || f returns "Cat"
-o8 = ''    || false      // f || f returns false
-o9 = false || ''         // f || f returns ""
-o10 = false || varObject // f || object returns varObject
-
- -

Logical NOT (!)

- -

The following code shows examples of the ! (logical NOT) operator.

- -
n1 = !true               // !t returns false
-n2 = !false              // !f returns true
-n3 = !''                 // !f returns true
-n4 = !'Cat'              // !t returns false
-
- -

Double NOT (!!)

- -

It is possible to use a couple of NOT operators in series to explicitly force the conversion of any value to the corresponding boolean primitive. The conversion is based on the "truthyness" or "falsyness" of the value (see {{Glossary("truthy")}} and {{Glossary("falsy")}}).

- -

The same conversion can be done through the {{jsxref("Boolean")}} function.

- -
n1 = !!true                   // !!truthy returns true
-n2 = !!{}                     // !!truthy returns true: any object is truthy...
-n3 = !!(new Boolean(false))   // ...even Boolean objects with a false .valueOf()!
-n4 = !!false                  // !!falsy returns false
-n5 = !!""                     // !!falsy returns false
-n6 = !!Boolean(false)         // !!falsy returns false
-
- -

Conversion rules for booleans

- -

Converting AND to OR

- -

The following operation involving booleans:

- -
bCondition1 && bCondition2
- -

is always equal to:

- -
!(!bCondition1 || !bCondition2)
- -

Converting OR to AND

- -

The following operation involving booleans:

- -
bCondition1 || bCondition2
- -

is always equal to:

- -
!(!bCondition1 && !bCondition2)
- -

Converting between NOTs

- -

The following operation involving booleans:

- -
!!bCondition
- -

is always equal to:

- -
bCondition
- -

Removing nested parentheses

- -

As logical expressions are evaluated left to right, it is always possible to remove parentheses from a complex expression following some rules.

- -

Removing nested AND

- -

The following composite operation involving booleans:

- -
bCondition1 || (bCondition2 && bCondition3)
- -

is always equal to:

- -
bCondition1 || bCondition2 && bCondition3
- -

Removing nested OR

- -

The following composite operation involving booleans:

- -
bCondition1 && (bCondition2 || bCondition3)
- -

is always equal to:

- -
!(!bCondition1 || !bCondition2 && !bCondition3)
- -

Specifications

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition.
{{SpecName('ES5.1', '#sec-11.11')}}{{Spec2('ES5.1')}}Defined in several sections of the specification: Logical NOT Operator, Binary Logical Operators
{{SpecName('ES6', '#sec-binary-logical-operators')}}{{Spec2('ES6')}}Defined in several sections of the specification: Logical NOT Operator, Binary Logical Operators
{{SpecName('ESDraft', '#sec-binary-logical-operators')}}{{Spec2('ESDraft')}}Defined in several sections of the specification: Logical NOT Operator, Binary Logical Operators
- -

Browser compatibility

- - - -

{{Compat("javascript.operators.logical")}}

- -

See also

- - diff --git a/files/zh-tw/web/performance/index.html b/files/zh-tw/web/performance/index.html new file mode 100644 index 0000000000..9c868ed393 --- /dev/null +++ b/files/zh-tw/web/performance/index.html @@ -0,0 +1,481 @@ +--- +title: 網路性能 +slug: Web/性能 +tags: + - API + - HTML + - Mobile Performance + - Performance +translation_of: Web/Performance +--- +

Web性能是負載時間和運行時的客觀度量和用戶體驗。Web性能是指站點加載、交互和回應所需的時間，以及用戶交互過程中內容的流暢程度——滾動是否流暢?按鈕可點擊嗎?彈出窗口加載和顯示的速度是否很快?它們的動畫是否流暢?Web性能包括加載時間、每秒幀數和交互時間等客觀度量，以及加載內容所需時間的主觀體驗。

+ +

一個站點的回應時間越長，就會有越多的用戶放棄這個站點。重要的是最小化加載和回應時間，並添加額外的特性來隱藏延遲，使體驗盡可能快地可用並具有交互性，同時非同步地加載體驗的較長尾部分。

+ + + + + + + +

有一些工具、api和最佳實踐可以幫助我們度量和改進web性能。我們將在本節介紹它們:

+ +

在這一節中

+ +

{{LandingPageListSubpages}}

+ +
+
+

選定的教程

+ +

MDN網路性能學習領域包含現代的、最新的教程，涵蓋性能要點:

+ + + + + + + +

什麼是網路性能

+ + + +

本文首先介紹了性能實際上是什麼—包括在考慮性能時需要考慮的工具、指標、api、網路和人員組，以及如何將性能作為web開發工作流的一部分。

+ + + +

網路性能基本知識

+ + + +

除了HTML、CSS、JavaScript和媒體檔的前端組件外，還有一些特性可以使應用程式變慢，也有一些特性可以使應用程式主觀上和客觀上變得更快。與web性能相關的api、開發工具、最佳實踐和不良實踐有很多。在這裏，我們將介紹許多基本級別的特性，並提供到更深層次的鏈接，以提高每個主題的性能。

+ + + +

用戶如何看待性能?

+ + + +

比你的網站在幾毫秒內有多快更重要的是你的用戶認為你的網站有多快。頁面加載時間、空閒時間、對用戶交互的回應以及滾動和其他動畫的流暢性都會影響這些感知。在本文中，我們將討論各種加載指標、動畫和回應性指標，以及改進用戶感知的最佳實踐(如果不是實際計時本身)。

+ + + + + + + +

多媒體:圖像和視頻

+ + + +

通常，媒體優化是web性能的最低掛果。根據每個用戶代理的功能、大小和像素密度提供不同的媒體檔是可能的。額外的技巧，比如從背景圖像中刪除音軌，可以進一步提高性能。在本文中，我們將討論視頻、音頻和圖像內容對性能的影響，以及確保影響盡可能小的方法。

+ + + +

CSS性能特性

+ + + +

對於改進性能，CSS可能不是很重要的優化重點，但是有一些CSS特性對性能的影響更大。在本文中，我們將介紹一些影響性能的CSS屬性，並介紹一些處理樣式的方法，以確保不會對性能造成負面影響。

+ +
+
+
+ +
+

使用性能api

+ +
+
+

性能的API

+ + + +

本指南描述了如何使用高解析度時間標準中定義的性能介面。

+ + + +

資源時機API

+ + + +

資源加載和這些資源的加載計時，包括管理資源緩衝區和處理CORS

+ + + +

表演時間

+ + + +

性能時間軸標準定義了對性能介面的擴展，以支持應用程式中的客戶端延遲測量。這些介面可以一起用來幫助確定應用程式的性能瓶頸。

+ + + +

用戶時間API

+ + + +

使用用戶計時API的“標記”和“度量”條目類型來創建特定於應用程式的時間戳——這是流覽器性能時間表的一部分。

+ + + +

幀定時API

+ + + +

PerformanceFrameTiming介面提供有關流覽器事件迴圈的幀計時數據。

+ + + +

燈塔API

+ + + +

信標介面將非同步和非阻塞請求調度到web伺服器。

+ + + +

十字路口觀察者API

+ + + +

學習使用交集觀察者API對元素的可見性進行計時，並在感興趣的元素變得可見時得到非同步通知。

+
+
+ +

其他文檔

+ +
+
+

開發工具性能特性

+ + + +

本節提供有關如何使用和理解開發人員工具(包括瀑布圖、調用樹圖和火焰圖)中的性能特性的資訊。

+ + + +

理解延遲

+ + + +

延遲是指從流覽器請求資源到流覽器返回請求的資源的第一個位元組之間所花費的時間。本文將解釋延遲是什麼、它如何影響性能、如何度量延遲以及如何減少延遲。

+
+
+
+
+ +

術語表

+ +
+ +
+ +

檔有待書寫

+ +
+
+

JavaScript性能最佳實踐

+ + + +

如果使用得當，JavaScript可以提供互動式的、沉浸式的web體驗……或者它會嚴重影響下載時間、渲染時間、應用程式性能、電池壽命和用戶體驗。本文概述了一些JavaScript最佳實踐，這些實踐可以確保即使是複雜內容的性能也是最高的。

+ + + +

手機的性能

+ + + +

隨著移動設備上的web訪問變得如此流行，所有的移動平臺都有成熟的web流覽器，但是帶寬、CPU和電池壽命可能有限，因此考慮在這些平臺上web內容的性能非常重要。本文還討論了特定於移動設備的性能注意事項。

+
+
+

性能瓶頸

+ + + + + + + +

理解帶寬

+ + + +

帶寬是每秒可以發送的以兆(Mb)或千比特(Kb)為單位的數據量。本文解釋了帶寬在富媒體internet應用程式中的作用，如何度量它，以及如何優化應用程式以最大限度地利用可用帶寬。

+ + + +

HTTP / 2和你

+ + + +

傳輸層(即HTTP)對web的功能至關重要，直到最近才以HTTP/2的形式出現重大更新。與它的前輩相比，HTTP/2提供了許多開箱即用的性能改進和優勢，但它也改變了環境。在本文中，您將瞭解HTTP/2為您做了什麼，以及如何對應用程式進行調優，使其更進一步。

+ + + + + + + +

TLS在性能中的作用

+ + + +

在創建安全的用戶體驗時，tlls(我們傾向於稱之為HTTPS)是至關重要的。雖然硬體已經減少了TLS對伺服器性能的負面影響，但它仍然占了我們等待流覽器連接到伺服器所用時間的很大一部分。本文解釋了TLS握手過程，並提供了一些減少這種時間的技巧，如OCSP裝訂、HSTS預加載頭，以及資源提示在掩蓋第三方TLS延遲方面的潛在作用。

+ + + + + + + +

讀性能圖表

+ + + +

開發人員工具提供有關性能、記憶體和網路請求的資訊。瞭解如何在流覽器開發人員工具中讀取瀑布圖、調用樹、跟蹤、火焰圖和分配，將有助於您在其他性能工具中理解瀑布圖和火焰圖。

+ + + +

分析JavaScript包

+ + + +

毫無疑問，JavaScript是現代web開發的重要組成部分。雖然您應該始終努力減少應用程式中使用的JavaScript的數量，但是很難知道從哪里開始。在本指南中，我們將向您展示如何分析應用程式的腳本包，以便您瞭解自己在使用什麼，以及如何檢測應用程式是否包含包之間的重複腳本。

+ + + +

延遲加載

+ + + +

在初始頁面加載時加載所有web應用程式資產並不總是必要的。延遲加載是將頁面上的資產(如腳本、圖像等)的加載延遲到以後的某個時間點。當這些資產確實需要的時候。

+
+
+

使用import()延遲加載JavaScript

+ + + +

術語“延遲加載”通常指加載時不需要的資產的延遲加載技術，例如僅在圖像滾動到視圖中時才加載折疊下麵的圖像。現在有了加載JavaScript的本地特性!在本指南中，我們將討論dynamic import()語句，這是一個較新的流覽器特性，可以根據需要加載JavaScript模組。

+ + + +

使用資源提示控制資源交付

+ + + +

當涉及到資源優先順序和交付時，流覽器通常比我們更清楚，但是他們離clairyovant還很遠。本地流覽器特性使我們能夠在流覽器連接到另一個伺服器時提示它，或者在流覽器知道它需要資源之前預加載資源。如果使用得當，這可以讓快速體驗看起來更快。在本文中，我們將介紹一些本地流覽器特性，如rel=preconnect、rel=dn -prefetch、rel=prefetch和rel=preload，以及如何充分利用它們。

+ + + +

績效預算

+ + + +

市場行銷、設計和銷售需求，以及開發人員的經驗，通常是廣告膨脹、第三方腳本和其他會降低web性能的特性。為了幫助設置優先順序，最好設置一個性能預算:一組在開發階段不能超過的限制。在本文中，我們將討論如何創建和堅持性能預算。

+ + + +

網路性能檢查表

+ + + +

在開發帶有如何實現每個特性的教程鏈接的應用程式時，需要考慮的特性性能檢查表，包括服務人員、診斷性能問題、字體加載最佳實踐、客戶端提示、創建性能動畫等。

+ + + +

手機性能檢查表

+ + + +

影響移動網路用戶在手持電池操作設備上的性能考慮的簡明清單。

+
+
+ +

應用程式的性能

+ +
+
+

性能的基礎

+ + + +

對Web應用程式性能的廣泛概述，它是什麼，流覽器如何幫助改進它，以及您可以使用什麼工具和流程來測試和進一步改進它。

+ + + +

優化啟動性能

+ + + +

在編寫新應用程式和將應用程式從其他平臺移植到Web上時，幫助您提高啟動性能的技巧和建議。

+ + + +

使用內置的剖析器進行剖析

+ + + +

瞭解如何使用Firefox的內置分析器分析應用程式性能。

+ + + +

CSS和JavaScript動畫性能

+ + + +

動畫是一個愉快的用戶體驗的關鍵。本文討論了CSS和基於javascript的動畫之間的性能差異

+
+
. 
+
+ +

View all articles about performance...

+ +

See also

+ +

HTML

+ + + +

CSS

+ + + +

JavaScript

+ + + +

APIs

+ + + +

Headers

+ + + +

Tools

+ + + +

Additional Metrics

+ + + +

Best Practices

+ + diff --git a/files/zh-tw/web/svg/tutorial/basic_shapes/index.html b/files/zh-tw/web/svg/tutorial/basic_shapes/index.html new file mode 100644 index 0000000000..579f39bbe9 --- /dev/null +++ b/files/zh-tw/web/svg/tutorial/basic_shapes/index.html @@ -0,0 +1,150 @@ +--- +title: 基本形状 +slug: SVG/Tutorial/Basic_Shapes +translation_of: Web/SVG/Tutorial/Basic_Shapes +--- +
+ {{ PreviousNext("SVG/Tutorial/Positions", "SVG/Tutorial/Paths") }}
+

下面将介绍一些SVG绘图常用的形状命令，通过它们名字，你可以很轻易的看出它们可以画出什么。这里也会给出一些定义位置和尺寸的属性，但不会介绍如何将元素定义得更准确更完善。在这里我们只介绍必须的基本功能，因为它们会被广泛应用在SVG文件里。

+

基本形状

+

你需要在文档里创建一个元素，来新增相应的形状。不同的元素用来定义不同的形状，并采用不同的属性定义尺寸和位置。其中一些是可以被其他形状命令替代的，所以显得有点多余，但是它们的存在是有意义的，它们可以让你用起来更方便，并且保证你的SVG文档尽可能简洁易懂。所有的基本形状都在右边的图例里展示出来了，生成它们的代码如下：

+

+
+ 
<?xml version="1.0" standalone="no"?>
+<svg width="200" height="250" version="1.1" xmlns="http://www.w3.org/2000/svg">
+
+  <rect x="10" y="10" width="30" height="30" stroke="black" fill="transparent" stroke-width="5"/>
+  <rect x="60" y="10" rx="10" ry="10" width="30" height="30" stroke="black" fill="transparent" stroke-width="5"/>
+
+  <circle cx="25" cy="75" r="20" stroke="red" fill="transparent" stroke-width="5"/>
+  <ellipse cx="75" cy="75" rx="20" ry="5" stroke="red" fill="transparent" stroke-width="5"/>
+
+  <line x1="10" x2="50" y1="110" y2="150" stroke="orange" fill="transparent" stroke-width="5"/>
+  <polyline points="60 110 65 120 70 115 75 130 80 125 85 140 90 135 95 150 100 145"
+      stroke="orange" fill="transparent" stroke-width="5"/>
+
+  <polygon points="50 160 55 180 70 180 60 190 65 205 50 195 35 205 40 190 30 180 45 180"
+      stroke="green" fill="transparent" stroke-width="5"/>
+
+  <path d="M20,230 Q40,205 50,230 T90,230" fill="none" stroke="blue" stroke-width="5"/>
+</svg>
+
+
+注意： stroke, stroke-width 和 fill 等属性会在后面的章节里介绍。
+

矩形 rect

+

rect元素用来创建矩形，它有6个基本属性，用于设定它的位置以及样式。上面的图例里，最开始的两个图形都是矩形，右边的矩形设定了rx和ry属性，从而增加了圆角，如果不给它们赋值，其默认值为0，也就没有圆角。

+
<rect x="10" y="10" width="30" height="30"/>
+<rect x="60" y="10" rx="10" ry="10" width="30" height="30"/>
+
+
+ x
+
+ 矩形左上角的x轴坐标
+
+ y
+
+ 矩形左上角的y轴坐标
+
+ width
+
+ 矩形的宽
+
+ height
+
+ 矩形的高
+
+ rx
+
+ 圆角的x轴半径
+
+ ry
+
+ 圆角的y轴半径
+
+

圆形 circle

+

circle 元素用来创建圆形，这里给出了3个属性：

+
<circle cx="25" cy="75" r="20"/>
+
+
+ r
+
+ 半径
+
+ cx
+
+ 圆心的x轴坐标
+
+ cy
+
+ 圆心的y轴坐标
+
+

椭圆 ellipse

+

椭圆ellipse其实就是一种特殊的圆形，这里可以改变x和y轴的半径来区分它们（数学上称为长轴半径和短轴半径）。

+
<ellipse cx="75" cy="75" rx="20" ry="5"/>
+
+
+ rx
+
+ x轴半径
+
+ ry
+
+ y轴半径
+
+ cx
+
+ 圆心的x轴坐标
+
+ cy
+
+ 圆心的y轴坐标
+
+

线 line

+

line画的是线段，通过在属性中定义起点和终点的坐标，构成两点之间的线段。

+
<line x1="10" x2="50" y1="110" y2="150"/>
+
+
+ x1
+
+ 第一个点的x轴坐标
+
+ y1
+
+ 第一个点的y轴坐标
+
+ x2
+
+ 第二个点的x轴坐标
+
+ y2
+
+ 第二个点的y轴坐标
+
+

折线 polyline

+

折线polyline是一组连接起来的线段，折线上所有的点都放在一个属性里:

+
<polyline points="60 110, 65 120, 70 115, 75 130, 80 125, 85 140, 90 135, 95 150, 100 145"/>
+
+
+ points属性
+
+points属性是点的列表，每个数字用空格、逗号、换行或回车分隔开。每个点包括两个数字，一个x轴坐标一个y轴坐标，所以，(0,0)、(1,1)、(2,2)这三个点的列表应该写成“0 0, 1 1, 2 2”。
+
+

多边形 polygon

+

多边形polygon和折线很像，它们都是定义一组点，然后将点用线段连接起来，从而形成一个图形。不同的是，多边形的起点和终点会连起来，形成一个闭合的形状。需要注意的是，矩形也是一种多边形，如果需要的话，你也可以用多边形来创建一个矩形。

+
<polygon points="50 160, 55 180, 70 180, 60 190, 65 205, 50 195, 35 205, 40 190, 30 180, 45 180"/>
+
+
+ points属性
+
多边形的points属性也是点的列表，每个数字用空格、逗号、换行或回车分隔开。每个点包括两个数字，一个x轴坐标一个y轴坐标，所以，(0,0)、(1,1)、(2,2)这三个点的列表应该写成“0 0, 1 1, 2 2”。这些都和折线的points属性一样。不同的是，这里的最后一个点和第一个点会自动连接起来，形成闭合路径。
+
+

路径 path

+

路径path可能是SVG中最通用的一种形状，通过path元素，我们可以创建矩形（有没有圆角都行）、圆形、椭圆形、折线、多边形，以及其他一些形状，比如二次贝塞尔曲线、三次贝塞尔曲线，等等。因为path很强大也很复杂，所以会在下一章进行详细介绍。这里只介绍一个定义路径形状的属性。

+
<path d="M 20 230 Q 40 205, 50 230 T 90230"/>
+
+
+ d属性
+
+ d属性的值是由一些点的坐标，以及控制这些坐标的命令组成的，它们一起描述了路径的形状。具体内容在path章节里介绍。
+
+
+ {{ PreviousNext("SVG/Tutorial/Positions", "SVG/Tutorial/Paths") }}
diff --git a/files/zh-tw/web/svg/tutorial/paths/index.html b/files/zh-tw/web/svg/tutorial/paths/index.html new file mode 100644 index 0000000000..e0a107f49a --- /dev/null +++ b/files/zh-tw/web/svg/tutorial/paths/index.html @@ -0,0 +1,239 @@ +--- +title: 路徑 +slug: Web/SVG/Tutorial/路径 +tags: + - SVG +translation_of: Web/SVG/Tutorial/Paths +--- +

{{ PreviousNext("Web/SVG/Tutorial/Basic_Shapes", "Web/SVG/Tutorial/Fills_and_Strokes") }}

+ +

<path> 元件可說是SVG程式庫中最強大的基本形狀了，你可以用它來產生線條、曲線、圓弧等形狀。

+ +

路徑(paths) 藉由結合多個直線或曲線來產生複雜形狀。路徑和折線雖然可以產生相似外觀的形狀，例如：可由折線組成由單純的直線組成的複雜形狀 。但折線需要產生許多小段的直線去模擬曲線的外觀，如果遇到需要放大的情形，會較難 scale。好好瞭解路徑對於繪製 SVG 是重要的。雖然不建議使用XML編輯器或文字編輯器建立複雜路徑，但了解它們的工作原理，將與助於發現和修復 SVG 的顯示問題。

+ +

path 元素，由一個屬性定義：{{ SVGAttr("d") }}（可參考基本形狀 ）。 "d" 屬性包含了一系列的指令(command)，以及這些指令各自使用的參數。

+ +

 

+ +

Each of the commands is instantiated (for example, creating a class, naming and locating it) by a specific letter. For instance, let's move to the x and y coordinates (10, 10). The "Move to" command is called with the letter M. When the parser runs into this letter, it knows you want to move to a point. So, to move to (10,10) you would use the command "M 10 10". After that, the parser begins reading for the next command.

+ +

All of the commands also come in two variants. An uppercase letter specifies absolute coordinates on the page, and a lowercase letter specifies relative coordinates (e.g. move from the last point 10px up and 7px to the left).

+ +

Coordinates in the "d" attribute are always unitless and hence in the user coordinate system. Later, we will learn how paths can be transformed to suit other needs.

+ +

Line commands

+ +

There are five line commands for <path> nodes. The first command is the "Move To" or M, which was described above. It takes two parameters, a coordinate  ' x ' and coordinate ' y ' to move to. If your cursor already was somewhere on the page, no line is drawn to connect the two places. The "Move To" command appears at the beginning of paths to specify where the drawing should start. e.g. :

+ +
M x y
+
+ +

or

+ +
m dx dy
+ +

In the following example we only have a point at (10,10). Note, though, that it wouldn't show up if you were just drawing the path normally. For example:

+ +

+ +
<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
+
+  <path d="M10 10"/>
+
+  <!-- Points -->
+  <circle cx="10" cy="10" r="2" fill="red"/>
+
+</svg>
+ +

There are three commands that draw lines. The most generic is the "Line To" command, called with L. L takes two parameters—x and y coordinates—and draws a line from the current position to a new position.

+ +
 L x y (or l dx dy)
+
+ +

There are two abbreviated forms for drawing horizontal and vertical lines. H draws a horizontal line, and V draws a vertical line. Both commands only take one argument since they only move in one direction.

+ +
 H x (or h dx)
+ V y (or v dy)
+
+ +

An easy place to start is by drawing a shape. We will start with a rectangle (the same type that could be more easily made with a <rect> element). It's composed of horizontal and vertical lines only:

+ +

+ +
<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg">
+
+  <path d="M10 10 H 90 V 90 H 10 L 10 10"/>
+
+  <!-- Points -->
+  <circle cx="10" cy="10" r="2" fill="red"/>
+  <circle cx="90" cy="90" r="2" fill="red"/>
+  <circle cx="90" cy="10" r="2" fill="red"/>
+  <circle cx="10" cy="90" r="2" fill="red"/>
+
+</svg>
+ +

We can shorten the above path declaration a little bit by using the "Close Path" command, called with Z. This command draws a straight line from the current position back to the first point of the path. It is often placed at the end of a path node, although not always. There is no difference between the uppercase and lowercase command.

+ +
 Z (or z)
+
+ +

So our path above could be shortened to:

+ +
 <path d="M10 10 H 90 V 90 H 10 Z" fill="transparent" stroke="black"/>
+
+ +

You can also use the relative form of these commands to draw the same picture. Relative commands are called by using lowercase letters, and rather than moving the cursor to an exact coordinate, they move it relative to its last position. For instance, since our box is 80 x 80, the path element could have been written:

+ +
 <path d="M10 10 h 80 v 80 h -80 Z" fill="transparent" stroke="black"/>
+
+ +

The path will move to point (10,10) and then move horizontally 80 points to the right, then 80 points down, then 80 points to the left, and then back to the start.

+ +

In these examples, it would probably be simpler to use the <polygon> or <polyline> elements. However, paths are used so often in drawing SVG that developers may be more comfortable using them instead. There is no real performance penalty or bonus for using one or the other.

+ +

Curve commands

+ +

There are three different commands that you can use to create smooth curves. Two of those curves are Bezier curves, and the third is an "arc" or part of a circle. You might have already gained practical experience with Bezier curves using path tools in Inkscape, Illustrator or Photoshop. For a complete description of the math behind Bezier curves, go to a reference like the one on Wikipedia. There are an infinite number of Bezier curves, but only two simple ones are available in path elements: a cubic one, called with C, and a quadratic one, called with Q.

+ +

Bezier Curves

+ +

The cubic curve, C, is the slightly more complex curve. Cubic Beziers take in two control points for each point. Therefore, to create a cubic Bezier, you need to specify three sets of coordinates.

+ +
 C x1 y1, x2 y2, x y (or c dx1 dy1, dx2 dy2, dx dy)
+
+ +

The last set of coordinates here (x,y) are where you want the line to end. The other two are control points. (x1,y1) is the control point for the start of your curve, and (x2,y2) is the control point for the end. The control points essentially describe the slope of your line starting at each point. The Bezier function then creates a smooth curve that transfers you from the slope you established at the beginning of your line, to the slope at the other end.

+ +

Cubic Bézier Curves with grid

+ +
<svg width="190" height="160" xmlns="http://www.w3.org/2000/svg">
+
+  <path d="M10 10 C 20 20, 40 20, 50 10" stroke="black" fill="transparent"/>
+  <path d="M70 10 C 70 20, 120 20, 120 10" stroke="black" fill="transparent"/>
+  <path d="M130 10 C 120 20, 180 20, 170 10" stroke="black" fill="transparent"/>
+  <path d="M10 60 C 20 80, 40 80, 50 60" stroke="black" fill="transparent"/>
+  <path d="M70 60 C 70 80, 110 80, 110 60" stroke="black" fill="transparent"/>
+  <path d="M130 60 C 120 80, 180 80, 170 60" stroke="black" fill="transparent"/>
+  <path d="M10 110 C 20 140, 40 140, 50 110" stroke="black" fill="transparent"/>
+  <path d="M70 110 C 70 140, 110 140, 110 110" stroke="black" fill="transparent"/>
+  <path d="M130 110 C 120 140, 180 140, 170 110" stroke="black" fill="transparent"/>
+
+</svg>
+
+ +

The example above creates nine Cubic Bezier curves. As the curves move toward the right, the control points become spread out horizontally. As the curves move downward, they become further separated from the end points. The thing to note here is that the curve starts in the direction of the first control point, and then bends so that it arrives along the direction of the second control point.

+ +

You can string together several Bezier curves to create extended, smooth shapes. Often, the control point on one side of a point will be a reflection of the control point used on the other side to keep the slope constant. In this case, you can use a shortcut version of the cubic Bezier, designated by the command S (or s).

+ +
 S x2 y2, x y (or s dx2 dy2, dx dy)
+
+ +

S produces the same type of curve as earlier, but if it follows another S command or a C command, the first control point is assumed to be a reflection of the one used previously. If the S command doesn't follow another S or C command, then the current position of the cursor is used as the first control point. In this case the result is the same as what the Q command would have produced with the same parameters. An example of this syntax is shown below, and in the figure to the left the specified control points are shown in red, and the inferred control point in blue.

+ +

ShortCut_Cubic_Bezier_with_grid.png

+ +
<svg width="190" height="160" xmlns="http://www.w3.org/2000/svg">
+  <path d="M10 80 C 40 10, 65 10, 95 80 S 150 150, 180 80" stroke="black" fill="transparent"/>
+</svg>
+ +

The other type of Bezier curve, the quadratic curve called with Q, is actually a simpler curve than the cubic one. It requires one control point which determines the slope of the curve at both the start point and the end point. It takes two arguments: the control point and the end point of the curve. Note that the co-ordinate deltas for q are both relative to the previous point (that is, dx and dy are not relative to dx1 and dy1).

+ +
 Q x1 y1, x y (or q dx1 dy1, dx dy)
+
+ +

Quadratic Bézier with grid

+ +
<svg width="190" height="160" xmlns="http://www.w3.org/2000/svg">
+  <path d="M10 80 Q 95 10 180 80" stroke="black" fill="transparent"/>
+</svg>
+ +

As with the cubic Bezier curve, there is a shortcut for stringing together multiple quadratic Beziers, called with T.

+ +
 T x y (or t dx dy)
+
+ +

This shortcut looks at the previous control point you used and infers a new one from it. This means that after your first control point, you can make fairly complex shapes by specifying only end points.

+ +
+

This only works if the previous command was a Q or a T command. If it is not, then the control point is assumed to be the same as the previous point, and you'll only draw lines.

+
+ +

Shortcut_Quadratic_Bezier_with_grid.png

+ +
<svg width="190" height="160" xmlns="http://www.w3.org/2000/svg">
+  <path d="M10 80 Q 52.5 10, 95 80 T 180 80" stroke="black" fill="transparent"/>
+</svg>
+ +

Both curves produce similar results, although the cubic allows you greater freedom in exactly what your curve looks like. Deciding which curve to use is situational and depends on the amount of symmetry your line has.

+ +

Arcs

+ +

The other type of curved line you can create using SVG is the arc, called with A. Arcs are sections of circles or ellipses. For a given x-radius and y-radius, there are two ellipses that can connect any two points (as long as they're within the radius of the circle). Along either of those circles there are two possible paths that you can take to connect the points, so in any situation there are four possible arcs available. Because of that, arcs have to take in quite a few arguments:

+ +
 A rx ry x-axis-rotation large-arc-flag sweep-flag x y
+ a rx ry x-axis-rotation large-arc-flag sweep-flag dx dy
+
+ +

At its start, the arc element takes in two arguments for the x-radius and y-radius. If you need to, look up ellipses to see how they behave. The final two arguments designate the x and y coordinates to end the stroke. Together, these four values define the basic structure of the arc.

+ +

The third parameter describes the rotation of the arc. This is best explained with an example:

+ +

SVGArcs_XAxisRotation_with_grid

+ +
<svg width="320" height="320" xmlns="http://www.w3.org/2000/svg">
+  <path d="M10 315
+           L 110 215
+           A 30 50 0 0 1 162.55 162.45
+           L 172.55 152.45
+           A 30 50 -45 0 1 215.1 109.9
+           L 315 10" stroke="black" fill="green" stroke-width="2" fill-opacity="0.5"/>
+</svg>
+ +

The example shows a path element that goes diagonally across the page. At its center, two elliptical arcs have been cut out (x radius = 30, y radius = 50). In the first one, the x-axis-rotation has been left at 0, so the ellipse that the arc travels around (shown in gray) is oriented straight up and down. For the second arc, though, the x-axis-rotation is set to -45 degrees. This rotates the ellipse so that it is aligned with its minor axis along the path direction, as shown by the second ellipse in the example image.

+ +

For the unrotated ellipse in the image above, there are only two different arcs and not four to choose from because the line drawn from the start and end of the arc goes through the center of the ellipse. In a slightly modified example you can see the two ellipses that form the four different arcs:

+ +

Show the 4 arcs on the Ellipse example

+ +
<svg xmlns="http://www.w3.org/2000/svg" width="320" height="320">
+  <path d="M10 315
+           L 110 215
+           A 36 60 0 0 1 150.71 170.29
+           L 172.55 152.45
+           A 30 50 -45 0 1 215.1 109.9
+           L 315 10" stroke="black" fill="green" stroke-width="2" fill-opacity="0.5"/>
+  <circle cx="150.71" cy="170.29" r="2" fill="red"/>
+  <circle cx="110" cy="215" r="2" fill="red"/>
+  <ellipse cx="144.931" cy="229.512" rx="36" ry="60" fill="transparent" stroke="blue"/>
+  <ellipse cx="115.779" cy="155.778" rx="36" ry="60" fill="transparent" stroke="blue"/>
+</svg>
+
+ +

Notice that each of the blue ellipses are formed by two arcs, depending if you travel clockwise or counter-clockwise. Each ellipse has one short arc and one long arc. The two ellipses are just mirror images of each other. They are flipped along the line formed from the start->end points.

+ +

If the start->end points are farther than the ellipse's x and y radius can reach, the ellipse's radii will be minimally expanded so it could reach the start->end points. The interactive codepen at the bottom of this page demonstrates this well. To determine if your ellipse's radii is large enough to require expanding, you would need to solve a system of equations such as this on wolfram alpha. This computation is for the non-rotated ellipse with start->end (110, 215)->(150.71, 170.29). The solution, (x, y), is the center of the ellipse(s). The solution will be imaginary if your ellipse radii is too small. This second computation is for the non-rotated ellipse with start->end (110, 215)->(162.55, 162.45). The solution has a small imaginary component because the ellipse was just barely expanded.

+ +

The four different paths mentioned above are determined by the next two argument flags. As mentioned earlier, there are still two possible ellipses for the path to travel around and two different possible paths on both ellipses, giving four possible paths. The first argument is the large-arc-flag. It simply determines if the arc should be greater than or less than 180 degrees; in the end, this flag determines which direction the arc will travel around a given circle. The second argument is the sweep-flag. It determines if the arc should begin moving at positive angles or negative ones, which essentially picks which of the two circles you will travel around. The example below shows all four possible combinations, along with the two circles for each case.

+ +

+ +
<svg width="325" height="325" xmlns="http://www.w3.org/2000/svg">
+  <path d="M80 80
+           A 45 45, 0, 0, 0, 125 125
+           L 125 80 Z" fill="green"/>
+  <path d="M230 80
+           A 45 45, 0, 1, 0, 275 125
+           L 275 80 Z" fill="red"/>
+  <path d="M80 230
+           A 45 45, 0, 0, 1, 125 275
+           L 125 230 Z" fill="purple"/>
+  <path d="M230 230
+           A 45 45, 0, 1, 1, 275 275
+           L 275 230 Z" fill="blue"/>
+</svg>
+ +

Arcs are an easy way to create pieces of circles or ellipses in your drawings. For instance, a pie chart would require a different arc for each piece.

+ +

If you're transitioning to SVG from Canvas, arcs can be the hardest thing to learn, but are also much more powerful. Complete circles and ellipses are actually the only shapes that SVG arcs have trouble drawing. Because the start and end points for any path going around a circle are the same point, there are an infinite number of circles that could be chosen, and the actual path is undefined. It's possible to approximate them by making the start and end points of your path slightly askew, and then connecting them with another path segment. For example, you can make a circle with an arc for each semicircle. At that point, it's often easier to use a real circle or ellipse node instead. This interactive demo might help you understand the concepts behind SVG arcs: http://codepen.io/lingtalfi/pen/yaLWJG (tested in chrome and firefox only, might not work in your browser)

+ +

{{ PreviousNext("Web/SVG/Tutorial/Basic_Shapes", "Web/SVG/Tutorial/Fills_and_Strokes") }}

diff --git "a/files/zh-tw/web/svg/tutorial/\350\267\257\345\276\204/index.html" "b/files/zh-tw/web/svg/tutorial/\350\267\257\345\276\204/index.html" deleted file mode 100644 index e0a107f49a..0000000000 --- "a/files/zh-tw/web/svg/tutorial/\350\267\257\345\276\204/index.html" +++ /dev/null @@ -1,239 +0,0 @@ ---- -title: 路徑 -slug: Web/SVG/Tutorial/路径 -tags: - - SVG -translation_of: Web/SVG/Tutorial/Paths ---- -

{{ PreviousNext("Web/SVG/Tutorial/Basic_Shapes", "Web/SVG/Tutorial/Fills_and_Strokes") }}

- -

<path> 元件可說是SVG程式庫中最強大的基本形狀了，你可以用它來產生線條、曲線、圓弧等形狀。

- -

路徑(paths) 藉由結合多個直線或曲線來產生複雜形狀。路徑和折線雖然可以產生相似外觀的形狀，例如：可由折線組成由單純的直線組成的複雜形狀 。但折線需要產生許多小段的直線去模擬曲線的外觀，如果遇到需要放大的情形，會較難 scale。好好瞭解路徑對於繪製 SVG 是重要的。雖然不建議使用XML編輯器或文字編輯器建立複雜路徑，但了解它們的工作原理，將與助於發現和修復 SVG 的顯示問題。

- -

path 元素，由一個屬性定義：{{ SVGAttr("d") }}（可參考基本形狀 ）。 "d" 屬性包含了一系列的指令(command)，以及這些指令各自使用的參數。

- -

 

- -

Each of the commands is instantiated (for example, creating a class, naming and locating it) by a specific letter. For instance, let's move to the x and y coordinates (10, 10). The "Move to" command is called with the letter M. When the parser runs into this letter, it knows you want to move to a point. So, to move to (10,10) you would use the command "M 10 10". After that, the parser begins reading for the next command.

- -

All of the commands also come in two variants. An uppercase letter specifies absolute coordinates on the page, and a lowercase letter specifies relative coordinates (e.g. move from the last point 10px up and 7px to the left).

- -

Coordinates in the "d" attribute are always unitless and hence in the user coordinate system. Later, we will learn how paths can be transformed to suit other needs.

- -

Line commands

- -

There are five line commands for <path> nodes. The first command is the "Move To" or M, which was described above. It takes two parameters, a coordinate  ' x ' and coordinate ' y ' to move to. If your cursor already was somewhere on the page, no line is drawn to connect the two places. The "Move To" command appears at the beginning of paths to specify where the drawing should start. e.g. :

- -
M x y
-
- -

or

- -
m dx dy
- -

In the following example we only have a point at (10,10). Note, though, that it wouldn't show up if you were just drawing the path normally. For example:

- -

- -
<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
-
-  <path d="M10 10"/>
-
-  <!-- Points -->
-  <circle cx="10" cy="10" r="2" fill="red"/>
-
-</svg>
- -

There are three commands that draw lines. The most generic is the "Line To" command, called with L. L takes two parameters—x and y coordinates—and draws a line from the current position to a new position.

- -
 L x y (or l dx dy)
-
- -

There are two abbreviated forms for drawing horizontal and vertical lines. H draws a horizontal line, and V draws a vertical line. Both commands only take one argument since they only move in one direction.

- -
 H x (or h dx)
- V y (or v dy)
-
- -

An easy place to start is by drawing a shape. We will start with a rectangle (the same type that could be more easily made with a <rect> element). It's composed of horizontal and vertical lines only:

- -

- -
<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg">
-
-  <path d="M10 10 H 90 V 90 H 10 L 10 10"/>
-
-  <!-- Points -->
-  <circle cx="10" cy="10" r="2" fill="red"/>
-  <circle cx="90" cy="90" r="2" fill="red"/>
-  <circle cx="90" cy="10" r="2" fill="red"/>
-  <circle cx="10" cy="90" r="2" fill="red"/>
-
-</svg>
- -

We can shorten the above path declaration a little bit by using the "Close Path" command, called with Z. This command draws a straight line from the current position back to the first point of the path. It is often placed at the end of a path node, although not always. There is no difference between the uppercase and lowercase command.

- -
 Z (or z)
-
- -

So our path above could be shortened to:

- -
 <path d="M10 10 H 90 V 90 H 10 Z" fill="transparent" stroke="black"/>
-
- -

You can also use the relative form of these commands to draw the same picture. Relative commands are called by using lowercase letters, and rather than moving the cursor to an exact coordinate, they move it relative to its last position. For instance, since our box is 80 x 80, the path element could have been written:

- -
 <path d="M10 10 h 80 v 80 h -80 Z" fill="transparent" stroke="black"/>
-
- -

The path will move to point (10,10) and then move horizontally 80 points to the right, then 80 points down, then 80 points to the left, and then back to the start.

- -

In these examples, it would probably be simpler to use the <polygon> or <polyline> elements. However, paths are used so often in drawing SVG that developers may be more comfortable using them instead. There is no real performance penalty or bonus for using one or the other.

- -

Curve commands

- -

There are three different commands that you can use to create smooth curves. Two of those curves are Bezier curves, and the third is an "arc" or part of a circle. You might have already gained practical experience with Bezier curves using path tools in Inkscape, Illustrator or Photoshop. For a complete description of the math behind Bezier curves, go to a reference like the one on Wikipedia. There are an infinite number of Bezier curves, but only two simple ones are available in path elements: a cubic one, called with C, and a quadratic one, called with Q.

- -

Bezier Curves

- -

The cubic curve, C, is the slightly more complex curve. Cubic Beziers take in two control points for each point. Therefore, to create a cubic Bezier, you need to specify three sets of coordinates.

- -
 C x1 y1, x2 y2, x y (or c dx1 dy1, dx2 dy2, dx dy)
-
- -

The last set of coordinates here (x,y) are where you want the line to end. The other two are control points. (x1,y1) is the control point for the start of your curve, and (x2,y2) is the control point for the end. The control points essentially describe the slope of your line starting at each point. The Bezier function then creates a smooth curve that transfers you from the slope you established at the beginning of your line, to the slope at the other end.

- -

Cubic Bézier Curves with grid

- -
<svg width="190" height="160" xmlns="http://www.w3.org/2000/svg">
-
-  <path d="M10 10 C 20 20, 40 20, 50 10" stroke="black" fill="transparent"/>
-  <path d="M70 10 C 70 20, 120 20, 120 10" stroke="black" fill="transparent"/>
-  <path d="M130 10 C 120 20, 180 20, 170 10" stroke="black" fill="transparent"/>
-  <path d="M10 60 C 20 80, 40 80, 50 60" stroke="black" fill="transparent"/>
-  <path d="M70 60 C 70 80, 110 80, 110 60" stroke="black" fill="transparent"/>
-  <path d="M130 60 C 120 80, 180 80, 170 60" stroke="black" fill="transparent"/>
-  <path d="M10 110 C 20 140, 40 140, 50 110" stroke="black" fill="transparent"/>
-  <path d="M70 110 C 70 140, 110 140, 110 110" stroke="black" fill="transparent"/>
-  <path d="M130 110 C 120 140, 180 140, 170 110" stroke="black" fill="transparent"/>
-
-</svg>
-
- -

The example above creates nine Cubic Bezier curves. As the curves move toward the right, the control points become spread out horizontally. As the curves move downward, they become further separated from the end points. The thing to note here is that the curve starts in the direction of the first control point, and then bends so that it arrives along the direction of the second control point.

- -

You can string together several Bezier curves to create extended, smooth shapes. Often, the control point on one side of a point will be a reflection of the control point used on the other side to keep the slope constant. In this case, you can use a shortcut version of the cubic Bezier, designated by the command S (or s).

- -
 S x2 y2, x y (or s dx2 dy2, dx dy)
-
- -

S produces the same type of curve as earlier, but if it follows another S command or a C command, the first control point is assumed to be a reflection of the one used previously. If the S command doesn't follow another S or C command, then the current position of the cursor is used as the first control point. In this case the result is the same as what the Q command would have produced with the same parameters. An example of this syntax is shown below, and in the figure to the left the specified control points are shown in red, and the inferred control point in blue.

- -

ShortCut_Cubic_Bezier_with_grid.png

- -
<svg width="190" height="160" xmlns="http://www.w3.org/2000/svg">
-  <path d="M10 80 C 40 10, 65 10, 95 80 S 150 150, 180 80" stroke="black" fill="transparent"/>
-</svg>
- -

The other type of Bezier curve, the quadratic curve called with Q, is actually a simpler curve than the cubic one. It requires one control point which determines the slope of the curve at both the start point and the end point. It takes two arguments: the control point and the end point of the curve. Note that the co-ordinate deltas for q are both relative to the previous point (that is, dx and dy are not relative to dx1 and dy1).

- -
 Q x1 y1, x y (or q dx1 dy1, dx dy)
-
- -

Quadratic Bézier with grid

- -
<svg width="190" height="160" xmlns="http://www.w3.org/2000/svg">
-  <path d="M10 80 Q 95 10 180 80" stroke="black" fill="transparent"/>
-</svg>
- -

As with the cubic Bezier curve, there is a shortcut for stringing together multiple quadratic Beziers, called with T.

- -
 T x y (or t dx dy)
-
- -

This shortcut looks at the previous control point you used and infers a new one from it. This means that after your first control point, you can make fairly complex shapes by specifying only end points.

- -
-

This only works if the previous command was a Q or a T command. If it is not, then the control point is assumed to be the same as the previous point, and you'll only draw lines.

-
- -

Shortcut_Quadratic_Bezier_with_grid.png

- -
<svg width="190" height="160" xmlns="http://www.w3.org/2000/svg">
-  <path d="M10 80 Q 52.5 10, 95 80 T 180 80" stroke="black" fill="transparent"/>
-</svg>
- -

Both curves produce similar results, although the cubic allows you greater freedom in exactly what your curve looks like. Deciding which curve to use is situational and depends on the amount of symmetry your line has.

- -

Arcs

- -

The other type of curved line you can create using SVG is the arc, called with A. Arcs are sections of circles or ellipses. For a given x-radius and y-radius, there are two ellipses that can connect any two points (as long as they're within the radius of the circle). Along either of those circles there are two possible paths that you can take to connect the points, so in any situation there are four possible arcs available. Because of that, arcs have to take in quite a few arguments:

- -
 A rx ry x-axis-rotation large-arc-flag sweep-flag x y
- a rx ry x-axis-rotation large-arc-flag sweep-flag dx dy
-
- -

At its start, the arc element takes in two arguments for the x-radius and y-radius. If you need to, look up ellipses to see how they behave. The final two arguments designate the x and y coordinates to end the stroke. Together, these four values define the basic structure of the arc.

- -

The third parameter describes the rotation of the arc. This is best explained with an example:

- -

SVGArcs_XAxisRotation_with_grid

- -
<svg width="320" height="320" xmlns="http://www.w3.org/2000/svg">
-  <path d="M10 315
-           L 110 215
-           A 30 50 0 0 1 162.55 162.45
-           L 172.55 152.45
-           A 30 50 -45 0 1 215.1 109.9
-           L 315 10" stroke="black" fill="green" stroke-width="2" fill-opacity="0.5"/>
-</svg>
- -

The example shows a path element that goes diagonally across the page. At its center, two elliptical arcs have been cut out (x radius = 30, y radius = 50). In the first one, the x-axis-rotation has been left at 0, so the ellipse that the arc travels around (shown in gray) is oriented straight up and down. For the second arc, though, the x-axis-rotation is set to -45 degrees. This rotates the ellipse so that it is aligned with its minor axis along the path direction, as shown by the second ellipse in the example image.

- -

For the unrotated ellipse in the image above, there are only two different arcs and not four to choose from because the line drawn from the start and end of the arc goes through the center of the ellipse. In a slightly modified example you can see the two ellipses that form the four different arcs:

- -

Show the 4 arcs on the Ellipse example

- -
<svg xmlns="http://www.w3.org/2000/svg" width="320" height="320">
-  <path d="M10 315
-           L 110 215
-           A 36 60 0 0 1 150.71 170.29
-           L 172.55 152.45
-           A 30 50 -45 0 1 215.1 109.9
-           L 315 10" stroke="black" fill="green" stroke-width="2" fill-opacity="0.5"/>
-  <circle cx="150.71" cy="170.29" r="2" fill="red"/>
-  <circle cx="110" cy="215" r="2" fill="red"/>
-  <ellipse cx="144.931" cy="229.512" rx="36" ry="60" fill="transparent" stroke="blue"/>
-  <ellipse cx="115.779" cy="155.778" rx="36" ry="60" fill="transparent" stroke="blue"/>
-</svg>
-
- -

Notice that each of the blue ellipses are formed by two arcs, depending if you travel clockwise or counter-clockwise. Each ellipse has one short arc and one long arc. The two ellipses are just mirror images of each other. They are flipped along the line formed from the start->end points.

- -

If the start->end points are farther than the ellipse's x and y radius can reach, the ellipse's radii will be minimally expanded so it could reach the start->end points. The interactive codepen at the bottom of this page demonstrates this well. To determine if your ellipse's radii is large enough to require expanding, you would need to solve a system of equations such as this on wolfram alpha. This computation is for the non-rotated ellipse with start->end (110, 215)->(150.71, 170.29). The solution, (x, y), is the center of the ellipse(s). The solution will be imaginary if your ellipse radii is too small. This second computation is for the non-rotated ellipse with start->end (110, 215)->(162.55, 162.45). The solution has a small imaginary component because the ellipse was just barely expanded.

- -

The four different paths mentioned above are determined by the next two argument flags. As mentioned earlier, there are still two possible ellipses for the path to travel around and two different possible paths on both ellipses, giving four possible paths. The first argument is the large-arc-flag. It simply determines if the arc should be greater than or less than 180 degrees; in the end, this flag determines which direction the arc will travel around a given circle. The second argument is the sweep-flag. It determines if the arc should begin moving at positive angles or negative ones, which essentially picks which of the two circles you will travel around. The example below shows all four possible combinations, along with the two circles for each case.

- -

- -
<svg width="325" height="325" xmlns="http://www.w3.org/2000/svg">
-  <path d="M80 80
-           A 45 45, 0, 0, 0, 125 125
-           L 125 80 Z" fill="green"/>
-  <path d="M230 80
-           A 45 45, 0, 1, 0, 275 125
-           L 275 80 Z" fill="red"/>
-  <path d="M80 230
-           A 45 45, 0, 0, 1, 125 275
-           L 125 230 Z" fill="purple"/>
-  <path d="M230 230
-           A 45 45, 0, 1, 1, 275 275
-           L 275 230 Z" fill="blue"/>
-</svg>
- -

Arcs are an easy way to create pieces of circles or ellipses in your drawings. For instance, a pie chart would require a different arc for each piece.

- -

If you're transitioning to SVG from Canvas, arcs can be the hardest thing to learn, but are also much more powerful. Complete circles and ellipses are actually the only shapes that SVG arcs have trouble drawing. Because the start and end points for any path going around a circle are the same point, there are an infinite number of circles that could be chosen, and the actual path is undefined. It's possible to approximate them by making the start and end points of your path slightly askew, and then connecting them with another path segment. For example, you can make a circle with an arc for each semicircle. At that point, it's often easier to use a real circle or ellipse node instead. This interactive demo might help you understand the concepts behind SVG arcs: http://codepen.io/lingtalfi/pen/yaLWJG (tested in chrome and firefox only, might not work in your browser)

- -

{{ PreviousNext("Web/SVG/Tutorial/Basic_Shapes", "Web/SVG/Tutorial/Fills_and_Strokes") }}

diff --git "a/files/zh-tw/web/svg/\346\225\231\345\255\270/index.html" "b/files/zh-tw/web/svg/\346\225\231\345\255\270/index.html" deleted file mode 100644 index 5521386506..0000000000 --- "a/files/zh-tw/web/svg/\346\225\231\345\255\270/index.html" +++ /dev/null @@ -1,13 +0,0 @@ ---- -title: 教學 -slug: Web/SVG/教學 ---- -

 

-


-本教學解說 SVG（Scalable Vector Graphics）的 1.1 版本，是一種 W3C XML 的衍伸語言，且已部分實裝於 Firefox 1.5、Opera 8.5 還有其他的瀏覽器。

-

本教學仍處於非常早期的階段。如果可能的話，請幫忙彙整並寫成一、兩個段落。為本教學增添內容！

-
簡介
- - -

{{ languages( { "en": "en/SVG/Tutorial", "fr": "fr/SVG/Tutoriel", "ja": "ja/SVG/Tutorial", "pl": "pl/SVG/Przewodnik" } ) }}

diff --git "a/files/zh-tw/web/\346\200\247\350\203\275/index.html" "b/files/zh-tw/web/\346\200\247\350\203\275/index.html" deleted file mode 100644 index 9c868ed393..0000000000 --- "a/files/zh-tw/web/\346\200\247\350\203\275/index.html" +++ /dev/null @@ -1,481 +0,0 @@ ---- -title: 網路性能 -slug: Web/性能 -tags: - - API - - HTML - - Mobile Performance - - Performance -translation_of: Web/Performance ---- -

Web性能是負載時間和運行時的客觀度量和用戶體驗。Web性能是指站點加載、交互和回應所需的時間，以及用戶交互過程中內容的流暢程度——滾動是否流暢?按鈕可點擊嗎?彈出窗口加載和顯示的速度是否很快?它們的動畫是否流暢?Web性能包括加載時間、每秒幀數和交互時間等客觀度量，以及加載內容所需時間的主觀體驗。

- -

一個站點的回應時間越長，就會有越多的用戶放棄這個站點。重要的是最小化加載和回應時間，並添加額外的特性來隱藏延遲，使體驗盡可能快地可用並具有交互性，同時非同步地加載體驗的較長尾部分。

- - - - - - - -

有一些工具、api和最佳實踐可以幫助我們度量和改進web性能。我們將在本節介紹它們:

- -

在這一節中

- -

{{LandingPageListSubpages}}

- -
-
-

選定的教程

- -

MDN網路性能學習領域包含現代的、最新的教程，涵蓋性能要點:

- - - - - - - -

什麼是網路性能

- - - -

本文首先介紹了性能實際上是什麼—包括在考慮性能時需要考慮的工具、指標、api、網路和人員組，以及如何將性能作為web開發工作流的一部分。

- - - -

網路性能基本知識

- - - -

除了HTML、CSS、JavaScript和媒體檔的前端組件外，還有一些特性可以使應用程式變慢，也有一些特性可以使應用程式主觀上和客觀上變得更快。與web性能相關的api、開發工具、最佳實踐和不良實踐有很多。在這裏，我們將介紹許多基本級別的特性，並提供到更深層次的鏈接，以提高每個主題的性能。

- - - -

用戶如何看待性能?

- - - -

比你的網站在幾毫秒內有多快更重要的是你的用戶認為你的網站有多快。頁面加載時間、空閒時間、對用戶交互的回應以及滾動和其他動畫的流暢性都會影響這些感知。在本文中，我們將討論各種加載指標、動畫和回應性指標，以及改進用戶感知的最佳實踐(如果不是實際計時本身)。

- - - - - - - -

多媒體:圖像和視頻

- - - -

通常，媒體優化是web性能的最低掛果。根據每個用戶代理的功能、大小和像素密度提供不同的媒體檔是可能的。額外的技巧，比如從背景圖像中刪除音軌，可以進一步提高性能。在本文中，我們將討論視頻、音頻和圖像內容對性能的影響，以及確保影響盡可能小的方法。

- - - -

CSS性能特性

- - - -

對於改進性能，CSS可能不是很重要的優化重點，但是有一些CSS特性對性能的影響更大。在本文中，我們將介紹一些影響性能的CSS屬性，並介紹一些處理樣式的方法，以確保不會對性能造成負面影響。

- -
-
-
- -
-

使用性能api

- -
-
-

性能的API

- - - -

本指南描述了如何使用高解析度時間標準中定義的性能介面。

- - - -

資源時機API

- - - -

資源加載和這些資源的加載計時，包括管理資源緩衝區和處理CORS

- - - -

表演時間

- - - -

性能時間軸標準定義了對性能介面的擴展，以支持應用程式中的客戶端延遲測量。這些介面可以一起用來幫助確定應用程式的性能瓶頸。

- - - -

用戶時間API

- - - -

使用用戶計時API的“標記”和“度量”條目類型來創建特定於應用程式的時間戳——這是流覽器性能時間表的一部分。

- - - -

幀定時API

- - - -

PerformanceFrameTiming介面提供有關流覽器事件迴圈的幀計時數據。

- - - -

燈塔API

- - - -

信標介面將非同步和非阻塞請求調度到web伺服器。

- - - -

十字路口觀察者API

- - - -

學習使用交集觀察者API對元素的可見性進行計時，並在感興趣的元素變得可見時得到非同步通知。

-
-
- -

其他文檔

- -
-
-

開發工具性能特性

- - - -

本節提供有關如何使用和理解開發人員工具(包括瀑布圖、調用樹圖和火焰圖)中的性能特性的資訊。

- - - -

理解延遲

- - - -

延遲是指從流覽器請求資源到流覽器返回請求的資源的第一個位元組之間所花費的時間。本文將解釋延遲是什麼、它如何影響性能、如何度量延遲以及如何減少延遲。

-
-
-
-
- -

術語表

- -
- -
- -

檔有待書寫

- -
-
-

JavaScript性能最佳實踐

- - - -

如果使用得當，JavaScript可以提供互動式的、沉浸式的web體驗……或者它會嚴重影響下載時間、渲染時間、應用程式性能、電池壽命和用戶體驗。本文概述了一些JavaScript最佳實踐，這些實踐可以確保即使是複雜內容的性能也是最高的。

- - - -

手機的性能

- - - -

隨著移動設備上的web訪問變得如此流行，所有的移動平臺都有成熟的web流覽器，但是帶寬、CPU和電池壽命可能有限，因此考慮在這些平臺上web內容的性能非常重要。本文還討論了特定於移動設備的性能注意事項。

-
-
-

性能瓶頸

- - - - - - - -

理解帶寬

- - - -

帶寬是每秒可以發送的以兆(Mb)或千比特(Kb)為單位的數據量。本文解釋了帶寬在富媒體internet應用程式中的作用，如何度量它，以及如何優化應用程式以最大限度地利用可用帶寬。

- - - -

HTTP / 2和你

- - - -

傳輸層(即HTTP)對web的功能至關重要，直到最近才以HTTP/2的形式出現重大更新。與它的前輩相比，HTTP/2提供了許多開箱即用的性能改進和優勢，但它也改變了環境。在本文中，您將瞭解HTTP/2為您做了什麼，以及如何對應用程式進行調優，使其更進一步。

- - - - - - - -

TLS在性能中的作用

- - - -

在創建安全的用戶體驗時，tlls(我們傾向於稱之為HTTPS)是至關重要的。雖然硬體已經減少了TLS對伺服器性能的負面影響，但它仍然占了我們等待流覽器連接到伺服器所用時間的很大一部分。本文解釋了TLS握手過程，並提供了一些減少這種時間的技巧，如OCSP裝訂、HSTS預加載頭，以及資源提示在掩蓋第三方TLS延遲方面的潛在作用。

- - - - - - - -

讀性能圖表

- - - -

開發人員工具提供有關性能、記憶體和網路請求的資訊。瞭解如何在流覽器開發人員工具中讀取瀑布圖、調用樹、跟蹤、火焰圖和分配，將有助於您在其他性能工具中理解瀑布圖和火焰圖。

- - - -

分析JavaScript包

- - - -

毫無疑問，JavaScript是現代web開發的重要組成部分。雖然您應該始終努力減少應用程式中使用的JavaScript的數量，但是很難知道從哪里開始。在本指南中，我們將向您展示如何分析應用程式的腳本包，以便您瞭解自己在使用什麼，以及如何檢測應用程式是否包含包之間的重複腳本。

- - - -

延遲加載

- - - -

在初始頁面加載時加載所有web應用程式資產並不總是必要的。延遲加載是將頁面上的資產(如腳本、圖像等)的加載延遲到以後的某個時間點。當這些資產確實需要的時候。

-
-
-

使用import()延遲加載JavaScript

- - - -

術語“延遲加載”通常指加載時不需要的資產的延遲加載技術，例如僅在圖像滾動到視圖中時才加載折疊下麵的圖像。現在有了加載JavaScript的本地特性!在本指南中，我們將討論dynamic import()語句，這是一個較新的流覽器特性，可以根據需要加載JavaScript模組。

- - - -

使用資源提示控制資源交付

- - - -

當涉及到資源優先順序和交付時，流覽器通常比我們更清楚，但是他們離clairyovant還很遠。本地流覽器特性使我們能夠在流覽器連接到另一個伺服器時提示它，或者在流覽器知道它需要資源之前預加載資源。如果使用得當，這可以讓快速體驗看起來更快。在本文中，我們將介紹一些本地流覽器特性，如rel=preconnect、rel=dn -prefetch、rel=prefetch和rel=preload，以及如何充分利用它們。

- - - -

績效預算

- - - -

市場行銷、設計和銷售需求，以及開發人員的經驗，通常是廣告膨脹、第三方腳本和其他會降低web性能的特性。為了幫助設置優先順序，最好設置一個性能預算:一組在開發階段不能超過的限制。在本文中，我們將討論如何創建和堅持性能預算。

- - - -

網路性能檢查表

- - - -

在開發帶有如何實現每個特性的教程鏈接的應用程式時，需要考慮的特性性能檢查表，包括服務人員、診斷性能問題、字體加載最佳實踐、客戶端提示、創建性能動畫等。

- - - -

手機性能檢查表

- - - -

影響移動網路用戶在手持電池操作設備上的性能考慮的簡明清單。

-
-
- -

應用程式的性能

- -
-
-

性能的基礎

- - - -

對Web應用程式性能的廣泛概述，它是什麼，流覽器如何幫助改進它，以及您可以使用什麼工具和流程來測試和進一步改進它。

- - - -

優化啟動性能

- - - -

在編寫新應用程式和將應用程式從其他平臺移植到Web上時，幫助您提高啟動性能的技巧和建議。

- - - -

使用內置的剖析器進行剖析

- - - -

瞭解如何使用Firefox的內置分析器分析應用程式性能。

- - - -

CSS和JavaScript動畫性能

- - - -

動畫是一個愉快的用戶體驗的關鍵。本文討論了CSS和基於javascript的動畫之間的性能差異

-
-
. 
-
- -

View all articles about performance...

- -

See also

- -

HTML

- - - -

CSS

- - - -

JavaScript

- - - -

APIs

- - - -

Headers

- - - -

Tools

- - - -

Additional Metrics

- - - -

Best Practices

- - diff --git a/files/zh-tw/web_development/index.html b/files/zh-tw/web_development/index.html deleted file mode 100644 index 2644dd50c6..0000000000 --- a/files/zh-tw/web_development/index.html +++ /dev/null @@ -1,5 +0,0 @@ ---- -title: Web development -slug: Web_development ---- -This page was auto-generated because a user created a sub-page to this page. diff --git "a/files/zh-tw/web_\351\226\213\347\231\274/historical_artifacts_to_avoid/index.html" "b/files/zh-tw/web_\351\226\213\347\231\274/historical_artifacts_to_avoid/index.html" deleted file mode 100644 index 29c2532f6f..0000000000 --- "a/files/zh-tw/web_\351\226\213\347\231\274/historical_artifacts_to_avoid/index.html" +++ /dev/null @@ -1,90 +0,0 @@ ---- -title: 應該避免的過時語法 -slug: Web_開發/Historical_artifacts_to_avoid -translation_of: Learn/HTML/Introduction_to_HTML -translation_of_original: Web/Guide/HTML/Obsolete_things_to_avoid ---- -

介紹

- -

許多人藉由觀看原始碼，然後複製貼上來學習 HTML、CSS 及 JavaScript。然而他們並沒有考慮到原本的網站，是否正確實做過。這意味著他們延續了一些過去必要，但現在不需要的程式慣例。這篇文章就是要列出那些隨著時間，變得不必要、或糟糕的程式語法。

- -

Doctype

- -

大約有十來種 (X)HTML文件類型描述（doctype），他們之間的差異非常細微（甚至沒差別），我們建議你使用以下 HTML5 的文件類型宣告：

- -
<!DOCTYPE html>
- -

如此會觸發所有瀏覽器使用標準模式（甚至包含 Internet Explorer 6）。

- -

<meta> 元素與 charset 屬性

- -

如同以下的原始碼寫法並不少見：

- -
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
- -

然而，就算你把它縮減成這樣，所有的瀏覽器還是會做出相同判定（甚至包括Internet Explorer 6）：

- -
<meta charset="UTF-8" />
-
- -

這些知識已經透過逆向工程（reverse engineering）與實用主義（pragmatism）證實。用就對了。

- -

不存在的 <meta> 元素

- -

許多被棄用或不標準的值，常常因為從某個頁面被複製到另個頁面，而延續了它們的利用。儘管這些元件被廣為利用，它們其實不符合規範、也不會有效用。特別是，不要去使用：

- - - -

HTML 腳本的註解

- -

曾經有一段時間有些瀏覽器了解 {{ HTMLElement("script") }} 標籤，但有些則否。這有時導致瀏覽器把應該作為腳本的文字，解讀成純文字。有個自然的想法，使得腳本成為 HTML 的註解。這方法，可以讓能執行腳本的瀏覽器做動、而不了解的瀏覽器忽略。

- -

從這時起，我們繼承了：

- -
<script>
-<!--
-var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
-document.write(unescape("%3Cscript src='" + gaJsHost + "bla.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
-//-->
-</script>
-
- -

或是：

- -
<script type="text/javascript">
-<!--//--><![CDATA[//><!--
-Blabla.extend(MyFramework.settings, { "basePath": "/" });
-//--><!]]>
-</script>
-
- -

如今，這只會在 strict XML 驗證下，因為註解避開不帶引號標記的誤報，而有所幫助。除此之外，是完全無用的。甚至不執行腳本的瀏覽器，也只會忽略 {{ HTMLElement("script") }} 標籤。簡單起見，只要把你的腳本寫在 {{ HTMLElement("script") }} 的開頭與結尾之間就行。更理想的話，把你的腳本變成獨立的檔案，並透過 {{ htmlattrxref("src", "script") }} 屬性連結。如果你在寫腳本，考慮使用 HTML5 {{ htmlattrxref("async", "script") }} 與 {{ htmlattrxref("defer", "script") }} 屬性。

- -

不應再使用的元素

- -

font, basefont

- -

這些元素不應再使用。針對元素排版外觀，應當優先考慮 CSS，並藉由元素、ID、或 class 屬性控制目標。

- -

b, i, u

- -

這些往往比較有爭議，但是當有相應的話，盡量去使用個別的 {{ HTMLElement("strong") }}、{{ HTMLElement("em") }} 或是 {{ HTMLElement("span") }} 和 CSS (text-decoration:underline)。

- -

斟酌考慮使用哪個元素。有些以發展為導向的頁面，建議以簡單的 {{ HTMLElement("strong") }} 取代 {{ HTMLElement("b") }}、還有 {{ HTMLElement("em") }} 取代 {{ HTMLElement("i") }}。遵從這個建議不是好主意。{{ HTMLElement("strong") }} 是用作強調陳述，而 {{ HTMLElement("em") }} 只是加粗文字。例如，使用 {{ HTMLElement("em") }} 去簡單完成斜體不是好主意。非強調的斜體文字可以透過你頁面 CSS 的 font-style:italic 完成。類似的，書的標題和藝術作品傳統上都被轉成斜體，但針對這些東西使用 {{ HTMLElement("cite") }} 元素可以給出比 {{ HTMLElement("em") }} 或 {{ HTMLElement("i") }} 更語意的標記。

- -

acronym

- -

acronym 元素不應該再使用。要表示縮寫應當用 {{ HTMLElement("abbr") }}。

- -

tt, xmp

- -

不要使用這些元素。要表現出電腦程式碼的片段，使用 {{ HTMLElement("code") }}。要表現出預格式化的文字，使用 {{ HTMLElement("pre") }}。如果只是想要 monospace 字型，在 CSS 使用 font-family: monospace。

- -

applet

- -

這個元素不應再使用。更通用的 {{ HTMLElement("object") }} 才是首選。

diff --git "a/files/zh-tw/web_\351\226\213\347\231\274/index.html" "b/files/zh-tw/web_\351\226\213\347\231\274/index.html" deleted file mode 100644 index 45d12b6e0f..0000000000 --- "a/files/zh-tw/web_\351\226\213\347\231\274/index.html" +++ /dev/null @@ -1,16 +0,0 @@ ---- -title: Web 開發 -slug: Web_開發 -translation_of: Web/Guide -translation_of_original: Web_Development ---- -

Web 開發包括開發 Web 網站或 Web 應用程式的各方面。

-

學習如何建立從簡單到複雜、互動性高的 Web 網站，閱讀此處的文章，採用最新 Web 技術。

-
- -

文件主題
Web 開發入門
如何開發 Web 的學習指南。
HTML
超文字標記語言是建立 Web 頁面和顯示在瀏覽器中的各種文件的基礎語言。
JavaScript
JavaScript 是開發 Web 應用程式中最常使用的 Script 語言。也可用於開發以 Mozilla 為基礎的軟體。
CSS
層疊樣式表使你能在 Web 上安排布局和頁面設計。
AJAX
非同步 JavaScript 和 XML 不是一項技術，而是各種技術的結合。使用 JavaScript 配合各種現代 Web 技術，建立動態 Web 應用程式。
Web 標準
學習如何藉由開放式 Web 和相容性，使你的 Web 網站或應用程式延伸至最大數量的使用者。
DOM
文件物件模型是用於 HTML 和 XML 的 API，提供文件的結構化表達方式，以改變文件的呈現。
XHTML
可擴展超文字標記語言是一種以 XML 為基礎、類似 HTML 的語言，提供比 HTML 還嚴格的語法。
SVG
可縮放向量圖形是一種 XML 標記語言，用於描述 2D 向量圖形。
Mozilla Web 開發者 FAQ
來自 Web 開發者的問答集。附有解答！

檢視全部...

社群

工具
-
-

Categories

-

Interwiki Language Links

-

 

-

{{ languages( { "en": "en/Web_Development", "de": "de/Webentwicklung", "es": "es/Desarrollo_Web", "fr": "fr/D\u00e9veloppement_Web", "it": "it/Sviluppo_Web", "ja": "ja/Web_Development", "pl": "pl/Programowanie_WWW","zh-cn": "cn/Web_Development" } ) }}

diff --git a/files/zh-tw/webapi/index.html b/files/zh-tw/webapi/index.html deleted file mode 100644 index c606a94846..0000000000 --- a/files/zh-tw/webapi/index.html +++ /dev/null @@ -1,127 +0,0 @@ ---- -title: WebAPI -slug: WebAPI -translation_of: Web/API -translation_of_original: WebAPI ---- -

WebAPI 是指一系列的存取與裝置相容性 API，讓 Web App 及其內容能夠存取裝置的硬體 (例如電池狀態或裝置的振動硬體)，亦可存取裝置所儲存的資料 (例如行事曆或聯絡人清單)。在添加這些 API 之後，我們希望 Web 能跳脫目前的功能，並打破專利平台的限制。

- -
-

注意：我們實際撰寫的內容，其實比本頁所列出的 API 還多，而且仍有許多連結尚未補齊。我們將持續補完相關內容，以提供更完整的資訊。可參閱 WebAPI 文件狀態頁面，隨時追蹤目前的 WebAPI 說明文件。

-
- -
-

注意：若要了解小標圖的意義，可先參閱《封裝式 (Packaged) App》一文。

-
- -
-
-

通訊 API

- -
-
Network Information API
-
提供目前網路連線的基本資訊，如連線速度。
-
Bluetooth
-
The WebBluetooth API provides low-level access to the device's Bluetooth hardware.
-
Mobile Connection API {{NonStandardBadge}}
-
Exposes information about the device's cellular connectivity, such as signal strength, operator information, and so forth.
-
Network Stats API {{NonStandardBadge}}
-
監控資料使用情形，並將此資料提供給 Privileged App。
-
TCP Socket API {{NonStandardBadge}}
-
提供初階的 Socket 與 SSL 支援功能。
-
Telephony {{NonStandardBadge}}
-
讓 App 可撥/接電話，並使用內建電話的使用者介面。
-
WebSMS {{NonStandardBadge}}
-
讓 App 能收/發 SMS 文字簡訊，並能存取/管理裝置所儲存的訊息。
-
WiFi Information API {{NonStandardBadge}}
-
A privileged API which provides information about signal strength, the name of the current network, available WiFi networks, and so forth.
-
- -

硬體存取 API

- -
-
Ambient Light Sensor API
-
可存取環境光線感測器，讓 App 可偵測裝置四周的環境光線強度。
-
Battery Status API
-
不論是否插電進行充電，均將提供電池充電容量的相關資訊。
-
Geolocation API
-
提供裝置實際位置的相關資訊。
-
Pointer Lock API
-
讓 App 能鎖定存取滑鼠，並取得「隨著時間推移的滑鼠位移 (即 deltas)」，而不只是絕對座標而已。特別適用遊戲類 App。
-
Proximity API
-
測得裝置與物體 (如使用者的臉部) 之間的距離。
-
Device Orientation API
-
當裝置的方向改變時，送出通知。
-
Screen Orientation API
-
在畫面方向改變時發出通知。另透過此 API，可讓 App 呈現其所偏好的方向。
-
Vibration API
-
可讓 App 控制裝置上的振動硬體，用於如遊戲中的觸控回饋。此 API 並非用於如「通知」的振動事件。若需要通知的振動事件，請參閱 Alarm API。
-
Camera API {{NonStandardBadge}}
-
讓 App 透過裝置內建的相機，即可拍照或錄製影片。
-
Power Management API {{NonStandardBadge}}
-
讓 App 能開/關 CPU、螢幕、裝置電力，與類似資源。另可進一步監聽或檢視資源鎖定事件。
-
- -

View All...

-
- -
-

資料管理 API

- -
-
FileHandle API
-
支援可寫入的檔案，並搭配鎖存功能。
-
IndexedDB
-
於用戶端儲存結構性的資料，並支援高效率的搜尋功能。
-
Settings API {{NonStandardBadge}}
-
App 可檢查並更改系統的相關設定；而這些設定選項均屬於永久儲存性質。
-
- -

其他 API

- -
-
Alarm API
-
App 可排定通知，亦可於特定時間自行啟動 App。
-
Simple Push API
-
讓平台傳送通知訊息至特定 App。
-
Web Notifications
-
讓 App 傳送通知並於系統層級顯示。
-
Apps API {{NonStandardBadge}}
-
Open WebApps API 可安裝並管理 Web App。此外，亦可讓 App 決定付款資訊。
-
Web Activities {{NonStandardBadge}}
-
讓 App 可委派某個 Activity 給其他 App。舉例來說，XX App 可能要求 YY App 選擇並回傳相片。使用者一般均可設定 Activity 所應搭配使用的  App。
-
Browser API {{NonStandardBadge}}
-
完全透過 Web 技術，支援建構 Web 瀏覽器 (可說是瀏覽器中再建構出瀏覽器)。
-
- -
-
Idle API
-
使用者並未使用裝置時，讓 App 接收通知。
-
Permissions API {{NonStandardBadge}}
-
集中管理 App 的權限 (Permission)。由設定類 (Settings) 的 App 所使用。
-
Time/Clock API {{NonStandardBadge}}
-
可設定目前時間。另透過 Settings API 設定時區。
-
- -

WebAPI 社群

- -

如果需要這些 API 的相關協助，則有許多方法可諮詢其他開發人員。

- -
    -
  • 在 WebAPI 討論區中提出問題： {{DiscussionList("dev-webapi", "mozilla.dev.webapi")}}
    • -
  • 到 WebAPI IRC channel 逛逛：#webapi
    • -
- -

Don't forget about the netiquette...

- - - - -
-
- -

 

diff --git a/files/zh-tw/webapi/permissions/index.html b/files/zh-tw/webapi/permissions/index.html deleted file mode 100644 index d58d8466be..0000000000 --- a/files/zh-tw/webapi/permissions/index.html +++ /dev/null @@ -1,85 +0,0 @@ ---- -title: 權限 (Permissions) -slug: WebAPI/Permissions -translation_of: Web/API/Permissions_API ---- -

{{ draft() }}

-

{{ non-standard_header }}

-

{{ B2GOnlyHeader2('certified') }}

-

摘要

-

Permissions API 可顯示 Apps 所要求的所有權限，以利使用者管理。Apps 可透過此 API 而讀取其他 Apps 的權限並進一步變更。

-

透過 PermissionSettings 介面的 navigator.mozPermissionSettings 屬性，即可存取 Permission Manager。

-

已安裝 Apps 的權限

-

所有 Apps 均需透過自己的 manifest 檔案而要求權限。Apps 每次所使用的 API，均以「請求顯性權限 (Explicit Permission)」的 API 為主，並提示使用者是否通過權限。如果使用者選擇「不要再提示」，大概也就不太可能改變決定了。API 則能提供介面，以利使用者管理已發出的權限。

-

透過 PermissionSettings.get()、set()、isExplicit() 函式即可達到上述作業。

-

讀取權限

-

若要知道已發出權限的目前狀態，可使用 PermissionSettings.get() 函式。此函式可回傳字串，以顯示特定 Apps 權限的目前狀態。可能的數值有：

-
-
- allow
-
- 已通過該權限，且不需使用者的進一步互動。
-
- denied
-
- 已否決該權限；可能是系統或使用者所否決。
-
- prompt
-
- 代表該權限將以明顯的提示方法，詢問使用者是否給予權限。
-
- unknown
-
- 代表該 Apps 並未詢問此權限，也不會提示使用者是否給予權限。
-
-
// Let's check all installed apps
-var apps = navigator.mozApps.mgmt.getAll();
-
-apps.onsuccess = function () {
-  var permission = navigator.mozPermissionSettings;
-
-  // Let's check the permission of each app
-  apps.result.forEach(function (app) {
-    var request, appName = app.manifest.name;
-
-    for (request in app.manifest.permission) {
-      // Let's get the current permission for each permission request by the application
-      var p = permission.get(request, app.manifestUrl, app.origine, false);
-
-      console.log(appName + ' asked for "' + request + '" permission, which is "' + p + '"')
-    }
-  });
-}
-
-
-

設定權限

-

只要使用 PermissionSettings.set() 函式即可設定權限。可能的數值均與 get 函式所存取的相同。

-
-

注意：根據 Apps 權限的不同，某些可能為隱性 (Implicit) 權限。若因為某種理由，Apps 嘗試將權限變更為隱性權限，就會產生錯誤。為了避免這種錯誤，可透過 PermissionSettings.isExplicit() 函式而檢查是否為顯性權限。

-
-
// Let's check all installed apps
-var apps = navigator.mozApps.mgmt.getAll();
-
-apps.onsuccess = function () {
-  var permission = navigator.mozPermissionSettings;
-
-  // Let's grant the permission of each app
-  apps.result.forEach(function (app) {
-    var request, appName = app.manifest.name;
-
-    for (request in app.manifest.permission) {
-      // If the permission is not explicit
-      if (!permission.isExplicit(request, app.manifestUrl, app.origine, false) {
-        // Let's ask the user for all permissions requested by the application
-        permission.set(request, app.manifestUrl, app.origine, false);
-      }
-    }
-  });
-}
-

規格

-

不屬於任何規格。

-

另可參閱

- diff --git a/files/zh-tw/websockets/index.html b/files/zh-tw/websockets/index.html deleted file mode 100644 index 3cbb630f41..0000000000 --- a/files/zh-tw/websockets/index.html +++ /dev/null @@ -1,155 +0,0 @@ ---- -title: WebSockets -slug: WebSockets -tags: - - WebSockets -translation_of: Web/API/WebSockets_API ---- -

{{ SeeCompatTable() }}

-

WebSocket 是一種讓瀏覽器與伺服器進行一段互動通訊的技術。這個 API 在不必輪詢（poll）伺服器下，讓使用者傳送訊息至伺服器並接受事件驅動回應。

- - - - - - - -
-

文件

-
-
- 製作 WebSocket 客戶端應用程式
-
- 指導如何製作在瀏覽器上跑 WebSocket 客戶端的教程。
-
- WebSockets 參考手冊
-
- 客戶端的 WebSocket API 參考手冊。
-
- The WebSocket protocol
-
- WebSocket 協定參考。
-
- Writing WebSocket servers
-
- 處理 WebSocket 協定的伺服器端代碼書寫指引。
-
-

所有文件...

- 		-

工具

- -

 

- -
-
- AJAX、JavaScript
-
-
-

參見

- -

瀏覽器兼容

-

{{ CompatibilityTable() }}

-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
功能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
版本 -76 {{ obsolete_inline() }}6{{ CompatGeckoDesktop("2.0") }}{{ CompatNo() }}11.00 (禁用)5.0.1
協定版本 7{{ CompatNo() }} -

{{ CompatGeckoDesktop("6.0") }}

-
- 請用 MozWebSocket。
- 		{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
協定版本 1014 -

{{ CompatGeckoDesktop("7.0") }}

-
- 請用 MozWebSocket。
- 		HTML5 Labs{{ CompatUnknown() }}{{ CompatUnknown() }}
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
功能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
版本 -76 {{ obsolete_inline() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
協定版本 7{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
協定版本 8 (IETF 草案 10){{ CompatUnknown() }}{{ CompatGeckoMobile("7.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
-
-

Gecko 附註

-

Firefox 的 WebSockets 支援正在持續追蹤發展中的 WebSocket 規範。Firefox 6 實作底層協定版號 7，Firefox 7 實作協定版號 8（IETF 草案 10 的內容）。Firefox mobile 在 7.0 版支援 WebSocket。

-
-

{{ gecko_callout_heading("6.0") }}

-

Gecko 6.0 {{ geckoRelease("6.0") }} 之前，不該存在的 WebSocket 物件使得某些開發者認為 WebSocket 服務沒有前輟，此物件已被更名為 MozWebSocket。

-
-
-

{{ gecko_callout_heading("7.0") }}

-

自從 Gecko 7.0 {{ geckoRelease("7.0") }}，偏好設定 network.websocket.max-connections 可以用來設定 WebSocket 連線同時開啟的最大個數。預設值為 200。

-
-
- 警告：雖然不是唯一的理由，但是目前 WebSockets 被 Firefox 4 與 5 禁用的關鍵原因是一個協定設計上的安全問題，因此不建議在生產環境下使用這些 Firefox 版本的 WebSockets。若仍想測試 WebSockets，你可以開啟 about:config 並設定 network.websocket.enabled 的取值至 true，並需要同時設定 network.websocket.override-security-block 的取值至 true 才能允許 WebSocket 連線的初始化。
-

{{ HTML5ArticleTOC() }}

-

{{ languages ( {"en": "en/WebSockets", "es": "es/WebSockets"} ) }}

diff --git a/files/zh-tw/websockets/websockets_reference/closeevent/index.html b/files/zh-tw/websockets/websockets_reference/closeevent/index.html deleted file mode 100644 index 0a6d0977ff..0000000000 --- a/files/zh-tw/websockets/websockets_reference/closeevent/index.html +++ /dev/null @@ -1,145 +0,0 @@ ---- -title: CloseEvent -slug: WebSockets/WebSockets_reference/CloseEvent -tags: - - WebSockets -translation_of: Web/API/CloseEvent ---- -

{{ draft() }}

-

當 WebSocket 連線關閉時，客戶端會收到一個 CloseEvent，由 WebSocket 物件 onclose 屬性表示的監聽器接收。

-

屬性

- - - - - - - - - - - - - - - - - - - - - - - -
屬性形態描述
codeunsigned longWebSocket 伺服器給予的連線關閉代碼。「狀態代碼」列有所有可能值。
reason{{ domxref("DOMString") }}表示伺服器關閉連線的原因，這因不同的伺服器與子協定而定。
wasCleanboolean表示連線關閉情況是否乾淨。
-

狀態代碼

-

以下列有所有合法的狀態代碼。

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
狀態代碼描述
0-999尚未使用的保留值。
1000正常關閉，連線成功地達到建立時的目標。
1001端點去離，伺服器故障或是瀏覽器從開啟連線的頁面離去的情形。
1002因協定錯誤造成連線被端點消滅。
1003因端點接收不能處理的資料形態（舉例來說，文字端點收到二進制資料）而消滅連線。
1004端點收到過大的資料幀而消滅連線。
1005保留值。表示意外地未給予狀態代碼的情形。
1006保留值。用以表示在預期收到狀態代碼的情形下不正常（即未送關閉幀）的連線關閉。
1007-1999保留以作為未來的 WebSocket 標準之用。
2000-2999保留以作為 WebSocket 擴展之用。
3000-3999程式庫與框架使用的值，應用程式可不使用。
4000-4999應用程式使用的值。
-

參見

- -

瀏覽器兼容

-

{{ CompatibilityTable() }}

-
- - - - - - - - - - - - - - - - - - - -
功能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本支援{{ CompatUnknown() }}{{ CompatNo() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
-
-
- - - - - - - - - - - - - - - - - - - -
功能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本支援{{ CompatUnknown() }}{{ CompatNo() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
-
-

Gecko 備註

-

此時此刻，Gecko 送至監聽器的 "close" 事件僅是簡單事件。

-

{{ languages ( {"en": "en/WebSockets/WebSockets_reference/CloseEvent"} ) }}

diff --git a/files/zh-tw/websockets/websockets_reference/index.html b/files/zh-tw/websockets/websockets_reference/index.html deleted file mode 100644 index 8ba3337205..0000000000 --- a/files/zh-tw/websockets/websockets_reference/index.html +++ /dev/null @@ -1,26 +0,0 @@ ---- -title: WebSockets 參考 -slug: WebSockets/WebSockets_reference -tags: - - WebSockets -translation_of: Web/API/WebSockets_API -translation_of_original: Web/API/WebSockets_API/WebSockets_reference ---- -

{{ draft() }}

-

下述文章是 WebSocket API 各介面的說明文件，本頁面為暫時的佔位文件。

-
-
- WebSocket
-
- 與 WebSocket 伺服器連接，傳送、接收資料的主介面。.
-
- CloseEvent
-
- 當連線關閉時 WebSocket 物件送出的事件。
-
- MessageEvent
-
- 當伺服器傳來資料時 WebSocket 物送送出的事件。
-
-

 

-

{{ languages ( {"en": "en/WebSockets/WebSockets_reference"} ) }}

diff --git a/files/zh-tw/websockets/websockets_reference/messageevent/index.html b/files/zh-tw/websockets/websockets_reference/messageevent/index.html deleted file mode 100644 index f5c0212f78..0000000000 --- a/files/zh-tw/websockets/websockets_reference/messageevent/index.html +++ /dev/null @@ -1,80 +0,0 @@ ---- -title: MessageEvent -slug: WebSockets/WebSockets_reference/MessageEvent -tags: - - WebSockets -translation_of: Web/API/MessageEvent ---- -

{{ draft() }}

-

當伺服器傳來資料時，客戶端會收到一個 MessageEvent，由 WebSocket 物件 onmessage 表示的監聽器接收。

-

屬性

- - - - - - - - - - - - - -
屬性形態描述
data{{ domxref("DOMString") }} | {{ domxref("Blob") }} | ArrayBuffer伺服器傳來的資料。
-

參見

- -

瀏覽器兼容

-

{{ CompatibilityTable() }}

-
- - - - - - - - - - - - - - - - - - - -
功能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本支援{{ CompatUnknown() }}{{ CompatGeckoDesktop("2.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
-
-
- - - - - - - - - - - - - - - - - - - -
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本支援{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
-
-

Gecko 備註

-
-

{{ gecko_callout_heading("6.0") }}

-

此時此刻，Gecko 不支援 ArrayBuffer 或 {{ domxref("Blob") }} 作為 data。

-
-

{{ languages ( {"en": "en/WebSockets/WebSockets_reference/MessageEvent"} ) }}

diff --git a/files/zh-tw/websockets/websockets_reference/websocket/index.html b/files/zh-tw/websockets/websockets_reference/websocket/index.html deleted file mode 100644 index 8acd8d03d5..0000000000 --- a/files/zh-tw/websockets/websockets_reference/websocket/index.html +++ /dev/null @@ -1,276 +0,0 @@ ---- -title: WebSocket -slug: WebSockets/WebSockets_reference/WebSocket -tags: - - WebSockets -translation_of: Web/API/WebSocket ---- -

{{ SeeCompatTable() }}

- -

{{ draft() }}

- -

WebSocket 物件提供了建立、管理 WebSocket 伺服器連線的 API，它也有在連線中傳送、接收資料的能力。

- -

方法一覽

- - - - - - - - - - -
void close(in optional unsigned long code, in optional DOMString reason);
void send(in DOMString data);
- -

屬性

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
屬性形態描述
binaryType{{ DOMXref("DOMString") }}表示連線傳輸的二進制資料形態的字串，若使用 {{ domxref("Blob") }} 物件則為 "blob"，使用 ArrayBuffer 物件則為 "arraybuffer"。
bufferedAmountunsigned long呼叫 {{ manch("send") }} 隊列但尚未傳輸至網路上資料的位元數。連線關閉時此值不會重設為零。連續呼叫 {{ manch("send") }} 會讓此值不斷上升。唯讀
extensions{{ DOMXref("DOMString") }}伺服器選擇的擴展。目前僅有空字串或表示資料經過壓縮的 "deflate-stream"。唯讀
onclose{{ domxref("EventListener") }}當 WebSocket 連線的 readyState 切換至 CLOSED 時呼叫的事件監聽器。監聽器接收命名為 "close" 的 CloseEvent。
onerror{{ domxref("EventListener") }}當錯誤發生時呼叫的事件監聽器。事件為命名 "error" 的簡單事件。
onmessage{{ domxref("EventListener") }}當瀏覽器接收伺服器的訊息時呼叫的事件監聽器。監聽器接收命名為 "message" 的 MessageEvent。
onopen{{ domxref("EventListener") }}當 WebSocket 連線的 readyState 切換至 OPEN 時呼叫的事件監聽器，表示連線已準備傳送、接收資料。事件為命名 "open" 的簡單事件。
protocol{{ DOMXref("DOMString") }}伺服器選擇的子協定，這是建立 WebSocket 物件時 protocols 參數裡的其中一個字串。
readyStateunsigned short連線的目前狀態，是就緒狀態常數的其中一個。唯讀
url{{ DOMXref("DOMString") }}建構方法解析出來的 URL，總是絕對 URL。唯讀
- -

常數

- -

就緒狀態常數

- -

readyState 屬性使用以下常數描述 WebSocket 的連線狀態。

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
常數值描述
CONNECTING0連線尚未打開。
OPEN1連線已打開，可以進行通訊。
CLOSING2連線正在進行關閉程序。
CLOSED3連線已關閉／連線不能打開。
- -

方法

- -

close()

- -

關閉 WebSocket 連線／連線嘗試，若連線已為 CLOSED，此方法沒有作用。

- -
void close(
-  in optional unsigned short code,
-  in optional DOMString reason
-);
-
- -
參數
- -
-
code {{ optional_inline() }}
-
表示狀態代碼，狀態代碼用以解釋連線關閉的原因。若未指定參數，預設值為 1000（表示正常的「事務完結（transaction complete）」關閉）。請參考 CloseEvent 頁面的狀態代碼列表，有所有的合法值。
-
reason {{ optional_inline() }}
-
解釋連線關閉原因的人類可讀字串，字串必不可大於 123 個 UTF-8 字符。
-
- -
可丟例外
- -
-
INVALID_ACCESS_ERR
-
指定不合法的 code。
-
SYNTAX_ERR
-
reason 字串太長或是含有未配對的代理對。
-
- -

send()

- -

透過 WebSocket 連線傳輸資料至伺服器。

- -
void send(
-  in DOMString data
-);
-
-void send(
-  in ArrayBuffer data
-);
-
-void send(
-  in Blob data
-);
-
- -
參數
- -
-
data
-
要傳送至伺服器的字串。
-
- -
可丟例外
- -
-
INVALID_STATE_ERR
-
目前連線不為 OPEN。
-
SYNTAX_ERR
-
資料為帶有未配對代理對的字串。
-
- -
註釋
- -
-

{{ gecko_callout_heading("6.0") }}

- -

Gecko send() 方法的實作與 Gecko 6.0 的規範有差別。Gecko 回傳一個 boolean 以表示連線是否仍處於開啟狀態（且資料成功隊列／傳輸）。另外，此時此刻，Gecko 不支援 ArrayBuffer 或 {{ domxref("Blob") }} 作為資料形態。

-
- -

參見

- - - -

瀏覽器兼容

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - -
功能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本支援{{ CompatUnknown() }}{{ CompatGeckoDesktop("2.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
子協定支援{{ CompatUnknown() }}{{ CompatGeckoDesktop("6.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - -
功能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本支援{{ CompatUnknown() }}{{ CompatGeckoMobile("7.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
子協定支援{{ CompatUnknown() }}{{ CompatGeckoMobile("7.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
-
- -

Gecko 備註

- -

自從 Gecko 6.0，建構方法有前輟，須使用 MozWebSocket()：

- -
var mySocket = new MozWebSocket("http://www.example.com/socketserver");
-
- -

{{ languages ( {"en": "en/WebSockets/WebSockets_reference/WebSocket"} ) }}

diff --git a/files/zh-tw/websockets/writing_websocket_client_applications/index.html b/files/zh-tw/websockets/writing_websocket_client_applications/index.html deleted file mode 100644 index 8f1299379f..0000000000 --- a/files/zh-tw/websockets/writing_websocket_client_applications/index.html +++ /dev/null @@ -1,179 +0,0 @@ ---- -title: 製作 WebSocket 客戶端應用程式 -slug: WebSockets/Writing_WebSocket_client_applications -tags: - - WebSockets -translation_of: Web/API/WebSockets_API/Writing_WebSocket_client_applications ---- -

{{ draft() }}

- -

WebSocket 是一種讓瀏覽器與伺服器進行一段互動通訊的技術。使用這項技術的 Webapp 可以直接進行即時通訊而不需要不斷對資料更改進行輪詢（polling）。

- -
注：當我們的系統架構可以寄存 WebSocket 範例之後，我們會提供聊天／伺服器系統實例的幾個範例。
- -

哪裡有 WebSocket

- -

若 JavaScript 代碼的範疇是 {{ domxref("Window") }} 物件或是實作 {{ domxref("WorkerUtils") }} 的物件，則可使用 WebSocket API。也就是可以從 Web Workers 使用 WebSocket。

- -
注：WebSockets API（與底層協定）的開發還在進展中，且目前不同瀏覽器（甚至瀏覽器的不同版本）有很多兼容問題。
- -

建立一個 WebSocket 物件

- -

你必須建立一個 WebSocket 物件才能讓瀏覽器／伺服器得以以 WebSocket 協定進行通訊，此物件在被建立之後會自動與伺服器連線。

- -
注：別忘記在 Firefox 6.0 中 WebSocket 物件仍有前輟，所以在這裡須改成 MozWebSocket。
- -

WebSocket 的建構方法有一個必要參數與一個選擇參數：

- -
WebSocket WebSocket(
-  in DOMString url,
-  in optional DOMString protocols
-);
-
-WebSocket WebSocket(
-  in DOMString url,
-  in optional DOMString[] protocols
-);
-
- -
-
url
-
連線用的 URL，WebSocket 伺服器會回應這個 URL。
-
- 根據網際網路工程任務小組（Internet Engineering Task Force，IETF）定義之規範， URL 的協議類型必須是 ws:// （非加密連線）或是 wss:// （加密連線）
-
protocols {{ optional_inline() }}
-
一個表示協定的字串或者是一個表示協定的字串構成的陣列。這些字串可以用來指定子協定，因此一個伺服器可以實作多個 WebSocket 子協定（舉例來說，你可以讓一個伺服器處理不同種類的互動情形，各情形以 protocol 分別）。若不指定協定字串則預設值為空字串。
-
- -

此建構方法可能拋出以下例外：

- -
-
SECURITY_ERR
-
連線使用的埠被阻擋。
-
- -

範例

- -

此簡單範例建立了一個新的 WebSocket，連到位於 http://www.example.com/socketserver 的伺服器。指定的子協定是 "my-custom-protocol"。

- -
var mySocket = new WebSocket("ws://www.example.com/socketserver", "my-custom-protocol");
-
- -

回傳之後，mySocket 的 readyState 會變成 CONNECTING。當連線已可以傳輸資料時 readyState 會變成 OPEN。

- -

要建立一個連線但不指定單一個特定協定，可以指定一個協定構成的陣列：

- -
var mySocket = new WebSocket("ws://www.example.com/socketserver", ["protocol1", "protocol2"]);
-
- -

當連線建立的時候（也就是 readyState 變成而 OPEN 的時候），protocol 屬性會回傳伺服器選擇的協定。

- -

傳資料給伺服器

- -

連線開啟之後即可開始傳資料給伺服器。呼叫 WebSocket 的 send() 來發送訊息：

- -
mySocket.send("這是伺服器正迫切需要的文字！");
-
- -

可以被傳送的內容包括字串、Blob 或是 ArrayBuffer。

- -
注：Firefox 目前只支援字串傳送。
- -

用 JSON 傳輸物件

- -

有一個很方便的方法是用 JSON 傳送複雜的資料給伺服器，舉例來說，聊天程式可以設計一種協定，這個協定傳送以 JSON 封裝的資料封包：

- -
// 透過伺服器傳送文字給所有使用者
-
-function sendText() {
-  var msg = {
-    type: "message",
-    text: document.getElementById("text").value,
-    id: clientID,
-    date: Date.now()
-  };
-
-  mySocket.send(JSON.stringify(msg));
-  document.getElementById("text").value = "";
-}
-
- -

這份代碼先建立一個物件：msg，它包含伺服器處理訊息所需的種種資訊，然後呼叫 JSON.stringify() 使該物件轉換成 JSON 格式並呼叫 WebSocket 的 send() 方法來傳輸資料至伺服器。

- -

從伺服器接收訊息

- -

WebSockets 是一個事件驅動 API，當瀏覽器收到訊息時，一個「message」事件被傳入 onmessage 函數。使用以下方法開始傾聽傳入資料：

- -
mySocket.onmessage = function(e) {
-  console.log(e.data);
-}
-
- -

接收並解讀 JSON 物件

- -

考慮先前在「用 JSON 傳輸物件」談起的聊天應用程式。客戶端可能收到的資料封包有幾種：

- - - -

用來解讀傳入訊息的代碼可能像是：

- -
connection.onmessage = function(evt) {
-  var f = document.getElementById("chatbox").contentDocument;
-  var text = "";
-  var msg = JSON.parse(evt.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>使用者 <em>" + msg.name + "</em> 登入於 " + timeStr + "</b><br>";
-      break;
-    case "message":
-      text = "(" + timeStr + ") <b>" + msg.name + "</b>: " + msg.text + "<br>";
-      break;
-    case "rejectusername":
-      text = "<b>由於你選取的名字已被人使用，你的使用者名稱已被設置為 <em>" + msg.name + "</em>。";
-      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);
-  }
-};
-
- -

這裡我們使用 JSON.parse() 使 JSON 物件轉換成原來的物件，檢驗並根據內容採取行動。

- -

關閉連線

- -

當你想結束 WebSocket 連線的時候，呼叫 WebSocket 的 close() 方法：

- -
mySocket.close();
-
- -

參考資料

- -

IETF: The WebSocket protocol draft-abarth-thewebsocketprotocol-01

- -

 

- -

{{ languages ( {"en": "en/WebSockets/Writing_WebSocket_client_applications"} ) }}

- -
-
diff --git a/files/zh-tw/xhtml/index.html b/files/zh-tw/xhtml/index.html deleted file mode 100644 index d147c26fee..0000000000 --- a/files/zh-tw/xhtml/index.html +++ /dev/null @@ -1,29 +0,0 @@ ---- -title: XHTML -slug: XHTML -translation_of: Glossary/XHTML ---- -

 

-

XHTML 對 XML 而言是什麼，就如同 HTML 對 SGML 而言是什麼。也就是說，XHTML 是一種類似於 HTML 的標記語言，但是有更嚴格的語法。W3C 已完成兩種 XHTML 版本︰

- -

第三個版本，XHTML 2，對於元素詞彙有非常重大的改變，目前仍在開發中。

-

關於 XHTML 的更多資訊，請見︰

- -

工具

- -

參閱

- -

檢視全部...

-

{{ languages( { "en": "en/XHTML", "fr": "fr/XHTML", "es": "es/XHTML", "it": "it/XHTML", "ja": "ja/XHTML", "pt": "pt/XHTML", "pl": "pl/XHTML" } ) }}

diff --git a/files/zh-tw/xpcnativewrapper/index.html b/files/zh-tw/xpcnativewrapper/index.html deleted file mode 100644 index dfd2d74d9d..0000000000 --- a/files/zh-tw/xpcnativewrapper/index.html +++ /dev/null @@ -1,237 +0,0 @@ ---- -title: XPCNativeWrapper -slug: XPCNativeWrapper ---- -

XPCNativeWrapper是一種包裝物件讓他可以安全的存取特權程式的方法。It can be used in all Firefox versions, though the behavior changed somewhat starting with Firefox 1.5 (Gecko 1.8)。請看XPCNativeWrapper at the Mozilla knowledgeBase有更多在Firefox 1.5之前的版本的XPCNativeWrapper的行為。這個文件是對Firefox 版本1.5以上的。

- - - -

XPCNativeWrapper做了什麼？

-

一個XPCNativeWrapper限制他偽裝之屬性的存取以及物件的方法。惟一經由XPCNativeWrapper存取的屬性與方法是那些定義在IDL中，或是由DOM level 0所定義的(雖然有些DOM level 0的屬性跟方法不能在XPCNativeWrapper中作用)。實務上，經由Javascript所增加的屬性不會被XPCNativeWrapper顯露，and nor are getters and setters defined with __defineGetter__ and __defineSetter__。這個目的是要允許對物件的IDL定義方法安全的存取。

- - -

請確定閱讀know bugs章節，特別是當寫的程式是針對1.5.0.x的firefox版本。

- - -

Types of XPCNativeWrapper

- -

這裡有三種不同類型的XPCNativeWrapper在Firefox 1.5。三種類型都包裝一個可能不安全(possibly-unsafe)的物件以及提供對他的屬性及方法的安全存取。

- -

三種不同類型的XPCNativeWrapper的行為的差異是由兩個XPCNativeWrpper偽裝器所擁有的特色來決定。一個XPCNativeWrapper可以是明示的Explicit(或是相反的，暗示的Implicit)，並且可以是徹底的deep(反之，表面的shallow)。偽裝器創造的類型是由他們被創造的方式所決定，如下：

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

創造

- 		-

明示/暗示

- 		-

徹底/表面

-
-

被保護的script存取未信任的物件

- 		-

暗示

- 		-

徹底

-
-

由字串參數呼叫的建構元

- 		-

明示

- 		-

表面

-
-

由非字串參數所呼叫的建構元

- 		-

明示

- 		-

徹底

-
- - - -

Explicit vs. Implicit

-

介於explicit與Implicit的XPCNativeWrapper行為的不同是，由非保護的script對Implicit XPCNativeWrapper屬性的存取是不安全的。屬性的存取將經由XPCNativeWrapper的wrappedJSObject被轉交。

- - - -

這意味著非保護的script不需要擔心關於bug出現因為其他的code會把他們當作是Implicit來處理。換句話說，這些scripts確實需要注意不安全的物件存取。

- - - -

對explicit的XPCNativeWrapper的屬性存取不論是否由被保護的呼叫者呼叫，都是安全的。

- - -

Deep vs. Shallow

- - -

Deep和Shallow的XPCNativeWrapper行為的差異是在於一個deep wrapper的屬性被存取或是函式被呼叫時，傳回值也將會被以他自己的XPCNativeWrapper來包裝。新的XPCNativeWrapper也會是deep並且也會是explicit，若且為若屬性被存取的XPCNativeWrapper是explicit。反之，當被存取的屬性或是函式是用shallow wrapper來呼叫，回傳直也許會是不安全的物件。

- - -

舉例來說，我們給3個XPCNativeWrapper的實例給同樣的window物件。讓我們叫他們做deepExplicitwindow，deepImplicitwindow和shallowwindow。那我們有：

- -
var doc1 = deepExplicitwindow.document; // doc1現在是document物件的一個deep explicit XPCNativeWrapper //存取doc1.open()是安全的  var doc2 = deepImplicitwindow.document; //假如呼叫者有設定.XPCNativeWrappers=yes, 那doc2現在是document object的deep implicit XPCNativeWrapper //否則doc2現在是不安全的document object, 因為屬性存取是簡單的從不安全的window object被傳送  var doc3 = shallowwindow.document; //doc3現在是不安全的document object  創造XPCNativeWrapper物件 有三種創造XPCNativeWrapper的方式;每種方法對應一種類型的XPCNativeWrapper  被保護的script存取未信任的物件 任何時候一個保護的script存取存取一個未信任的物件將會得到一個implicit deep XPCNativeWrapper。從被保護的script存取這個XPCNativeWrapper的屬性是安全的。  一但物件被包裝，一個用這種方式建立的包裝將會逗留(stick around)，另外在一行內存取物件兩次也會拿到相同的XPCNativeWrapper  什麼是被保護的script? 在firefox版本1.5到1.5.0.5, 一個script是被保護的或是不被保護是單獨基於他的URI。一個script是被保護的只有當他的URI由已知被保護的前綴開頭；不是由UR被讀取的script(e.g. 由javascript實作的元件)不是被保護的。在Firefox 1.5內被保護的前綴由Chrome Registry決定。  預設所有的content package是被保護的，這意味著所有的URI開頭是"chrome:// <package name>/content/"(對任何package)是被保護的。單獨的package用flag覆寫在他們的chrome manifest檔案。  從firefox 1.5.0.6開始，Javascript實作的元件是被保護的script。所以一個script不論是由被URI開頭是保護的前綴所讀取或者是Javascript實作的元件都是被保護的。  什麼是未信任的物件? 所有的物件都是信任或是未信任的。一個物件是被信任的假如有以下任何一項： 1.他的parent(Javascript中的_parent_屬性)是一個信任的物件。 2.他是Javascript元件的根範圍(root scope)物件。 3.他是信任的視窗的window物件。
- - - -

因為所有的DOM物件有window物件在他的_parent_串裡面，所以他們是被信任的若且唯若他的window是被信任的。

-

什麼是被信任的window?

-

一個window物見是否被信任是依據他的容器。一個window是被信任的假如有以下任何一項：

-

1.他是頂層window(e.g.<xul:window>, <xul:dialog>, 或是某些用命令列flag -chrome被傳送的URI)

-

2.他的parent是被信任的，且符合以下三種之一：

-

1.他不是在<xul:iframe>或是<xul:browser>中被讀取

-

2.<xul:iframe>或<xul:browser>沒有用type屬性讀取他

-

3.<xul:iframe>或<xul:browser>讀取他的type屬性執不是'content'且沒有用'content-'開頭

-

注意一個視窗是否是被信任的不依據在window被讀取的URI。所以舉例來說，當在window已經是信任的document內，以下將會件創造信任的視窗

-

<xul:browser>

-

<xul:browser type=”chrome”>

-

<xul:browser type=”rabid_dog”>

-

<xul:iframe type=”foofy”>

-

<html:iframe>

-

<html:iframe type=”content”>

-

以下不會建立信任的windows：

-

<xul:browser type=”content”>

-

<html:iframe type=”content_primary”>

-

進一步注意任何未信任的window的child window自動是未信任的。

-

當script存取物件時什麼會發生?

-

下面這個表描述當一個script存取物件時會發生什麼，以及偽裝器是如何的參與。

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

Script

- 		-

Object

- 		-

Effects

-
-

保護的

- 		-

信任的

- 		-

沒有偽裝器被創造，所以script可以完全存取Object

-
-

保護的

- 		-

未信任的

- 		-

Implicit deep XPCNativeWrapper被建立

-
-

未保護的

- 		-

信任的

- 		-

沒有偽裝器被建立，就像protected/trusted的狀況

-
-

未保護的

- 		-

未信任的

- 		-

沒有偽裝器被建立，就像protected/trusted的狀況

-
-

使用XPCNativeWrapper建構元

-

以上描述，預設在新的Firefox版本XPCNativeWrapper被自動建立。你不需要使用XPCNativeWrapper建構元，除非你打算讓你的code用在舊版本的瀏覽器或者你關閉了XPCNativeWrapper。

-

用字串參數呼叫XPCNativeWrapper建構元

-

舉例來說:

-

var contentWinWrapper = new XPCNativeWrapper(content, 'document');

-

這會創造出一個explicit shallow XPCNativeWrapper。這語法被保留為了Firefox 1.5之前的相容性。當contentWinWrapper所有的屬性可以被安全的存取，這些屬性的回傳值不是安全的去存取(就像在版本小於Firefox 1.5裡)，因為XPCNativeWrapper是shallow。所以去比較內容文件標題到現在的內容區段，必須要：

-

var winWrapper = new XPCNativeWrapper(content, 'document', 'getSelection()');

-

var docWrapper = new XPCNativeWrapper(winWrapper.document, 'title');

-

return docWrapper.title == winWrapper.getSelection();

-

沒有字串參數呼叫XPCNativeWrapper建構元

-

舉例來說:

-

var contentWinWrapper = new XPCNativeWrapper(content);

-

這創造了explicit deep XPCNativeWrapper。XPCNativeWrapper存取屬性是安全的，並且回傳值也將會是用explicit deep XPCNativeWrapper包裝的物件。

-

(譯注: 可參閱http://kb.mozillazine.org/XPCNativeWrapper)

-

XPCNativeWrapper生命週期

-

Explicit XPCNativeWrapper物件存在當他們被參考到。建立一個新的explicit XPCNativeWrapper給一樣的可能不安全的物件將會建立一個新的偽裝器物件；當設定'expando'參數時，有時要注意。

-

Implicit XPCNativeWrapper物件跟他包裝的物件有相同的生命週期。

-

設定XPCNativeWrapper的expando屬性

-

為XPCNativeWrapper物件設定expando屬性是可能的。假如這樣做了，那chrome將可以看到他們expando屬性，但內容不行。沒有安全的方式從chrome去設定expando屬性並且讓他從content可讀取。

-

存取不安全的屬性

-

假如為了某些理由，不安全的屬性存取是必要的，這可以經由偽裝器的wrappedJSObject屬性去來完成。舉例，假如docWrapper是一個doc的偽裝器，那

-

docWrapper.wrappedJSObject.prop

-

等同於

-

doc.prop

-

就像這節的名稱，這樣做是不安全的。你不因該使用wrappedJSObject去傳遞XPCNativeWrapper在產品的code裡面。

-

在firefox3，wrappedJSObject回傳另外一個包覆JS Object的偽裝器(XPCSafeJSObjectWrapper)，這允許你安全的觀察內容物件。請見XPCSafeJSObjectWrapper。

-

請見Interaction between privileged and non-priviledged pages有另外更好的。

-

已知Bugs

-

在1.5.0.x版本有兩個已知的bug在XPCNativeWrapper

-

1.Firefox versions 1.5 through 1.5.0.4 have bug 337095, which causes wrappers to not be created for protected scripts in some cases. Specifically, if a protected script makes a property access or function call that returns an untrusted object, a wrapper will be created. However, if a function in a protected script is called from C++ and an untrusted object is passed as an argument to this function, a wrapper will not be created. Functions that expect to be called in this way need to do their own wrapping. This bug is fixed in Firefox 1.5.0.5 and later.

-

2.Firefox versions 1.5 through 1.5.0.5 have bug 345991, which causes components written in JavaScript to not be protected scripts. This bug is fixed in Firefox 1.5.0.6 and later.

-

XPCNativeWrapper的限制

-

這裡有一些不能被用在XPCNativeWrapper的一般使用的屬性跟程式風格。

-

1.對一個DOM node或是window物件的XPCNativeWrapper給予或是讀取一個on*屬性將會丟出Exception。(使用addEventListener取代，並且用event.preventDefault();在你的處理器內假如你之前用了return false;)

-

2.不能夠在XPCNativeWrapper內用window名稱存取iframe(e.g. window.framename)。

-

3.document.all 在XPCNativeWrapper內不能用。

-

4.在XPCNativeWrapper內不行對HTML文件用name存取命名的東西。舉例，假如你有<form name=”foo”>並且docWrapper是一個對HTML文件doc的偽裝器，那當docWrapper為定義時，doc.foo是一個HTMLFormElement。希望這樣做的程式能夠使用docWrapper.forms.namedItem('foo')取代。

-

5.對HTML文件，在XPCNativeWrapper內用id存取node是不行的。因該用getElementById()取代。

-

6.對HTML form，在XPCNativeWrapper內用name存取input是不行的。想這樣做的程式必須使用form.elements.namedItem('foo')取代。

-

7.對HTMLCollection，在XPCNativeWrapper內用name存取元素是步行的。想這樣做的程式碼必須使用namedItem()方法。注意這個namedItem只回傳第一個有name的input元素，即使有很多個有相同名稱的元素(e.g. Radio buttons)。

-

8.同樣的，對plugin、pluginArray、或是MimeTypeArray，在XPCNativeWrapper內用name存取items是不行的。你必須使用namedItem()取代。

-

9.不能經由XPCNativeWrapper呼叫由NPAPI plugin實作的方法。

-

10.不能夠經由XPCNativeWrapper取得(getting)或是設定(setting)由NPAPI plugin實作的屬性。

-

11.不能夠經由XPCNativeWrapper呼叫經由XBL binding附加到node上的方法。

-

12.不能夠經由XPCNativeWrapper取得(getting)或是設定(setting)經由XBL binding附加到node上的屬性。

-

13.經由'for(var p in wrapper)'列舉XPCNativeWrapper的屬性不會列舉IDL定義的屬性。

-

14.Object.prototype不在XPCNativeWrapper的原型鍊裡面。As a result，變異的Object.prototype被定義在XPCNativeWrapper(更準確一點，這裡有__proto__，__parent__，__count__，toSource，toLocalString，valueOf，watch，unwatch，hasOwnProperty，isPrototypeOf，propertyIsEnumerable，__defineGetter__，__defineSetter__，__lookupGetter__，and__lookupSetter__)。

-

15.沒有實作舊的XPCNativeWrapper有的importXPCNative，

-

16.不能經由XPCNativeWrapper存取標準類別(例如Function)。要對特定的window的parent建立function和物件，使用window的eval() function。

-

17.對'expando'的屬性使用刪除操作元在XPCNativeWrapper會丟出安全性Exceprion。

diff --git a/files/zh-tw/zh-tw/index.html b/files/zh-tw/zh-tw/index.html deleted file mode 100644 index 87489b35a7..0000000000 --- a/files/zh-tw/zh-tw/index.html +++ /dev/null @@ -1,5 +0,0 @@ ---- -title: zh-tw -slug: zh-tw ---- -This page was auto-generated because a user created a sub-page to this page. diff --git "a/files/zh-tw/\345\217\203\350\210\207_mozilla_\345\260\210\346\241\210/index.html" "b/files/zh-tw/\345\217\203\350\210\207_mozilla_\345\260\210\346\241\210/index.html" deleted file mode 100644 index ebd327fa1d..0000000000 --- "a/files/zh-tw/\345\217\203\350\210\207_mozilla_\345\260\210\346\241\210/index.html" +++ /dev/null @@ -1,10 +0,0 @@ ---- -title: 參與 Mozilla 專案 -slug: 參與_Mozilla_專案 ---- -

如果你對幫忙修正錯誤有興趣，並以各種方式致力於 Mozilla 平台的代碼的話，這裡可以找到很多文件，並指引你往正確的方向走。

- -

一般性主題

-
Mozilla 開發者教學
提供給奉獻於 Mozilla 基礎代碼的開發提示和教學。
Mozilla 原始碼
關於如何取得 Mozilla 代碼，不論是下載或透過版本控制，以及如何把你的代碼引入這棵樹的資訊。
建置文件
關於如何建置 Mozilla 專案的資訊，包括 Firefox 和 Thunderbird。本頁需要整理。
Mozilla 平台
關於 Mozilla 平台的資訊，包含所有的 API 和技術，以及如何在你的專案中使用這些。
Mozilla 的文件化
為了 Mozilla，也為了開放式 Web，幫助我們建立並改善我們的文件。
除錯
在對 Mozilla 代碼進行除錯時的有用提示和方針。
品質保證
關於測試和錯誤追蹤的資訊。
本地化
關於翻譯 Mozilla 專案、文件至各種語言的資訊。
-

專案頁面

Thunderbird
Mozilla 的電子郵件客戶端
Sunbird
Mozilla 的月曆專案

工具

Bugzilla
為 Mozilla 專案追蹤問題的 Bugzilla 資料庫。
MXR
在 Web 上瀏覽並搜尋 Mozilla 原始碼資料處。
Bonsai
Bonsai 工具讓你在資料處找出是誰修改了這些檔案，以及他們做了什麼。
Tinderbox
Tinderbox 顯示這棵樹的狀態（不論目前是否可以建置）。在登記和登出之前先檢查這裡，以確保你是和作業樹一起協作。
崩潰追蹤
關於 Socorro 和 Talkback 崩潰回報系統的資訊。
效能追蹤
檢視 Mozilla 專案的效能資訊。
開發者論壇
有各種特定主題的討論列表的論壇，此處你可以交流有關 Mozilla 開發上的問題。
-

  {{ languages( { "en": "en/Participating_in_the_Mozilla_project", "zh-cn": "cn/Participating_in_the_Mozilla_project", "ja": "ja/Participating_in_the_Mozilla_project"} ) }}

diff --git "a/files/zh-tw/\345\273\272\347\253\213\346\223\264\345\205\205\345\245\227\344\273\266/index.html" "b/files/zh-tw/\345\273\272\347\253\213\346\223\264\345\205\205\345\245\227\344\273\266/index.html" deleted file mode 100644 index 4d6c1c5acf..0000000000 --- "a/files/zh-tw/\345\273\272\347\253\213\346\223\264\345\205\205\345\245\227\344\273\266/index.html" +++ /dev/null @@ -1,6 +0,0 @@ ---- -title: 建立擴充套件 -slug: 建立擴充套件 ---- -

建立擴充套件 -

-- cgit v1.2.3-54-g00ecf From 4704bf920fb5a9e983bfb5b80c5dcac6ca347dc2 Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 13:12:21 +0100 Subject: unslug zh-tw: modify --- files/zh-tw/_redirects.txt | 814 +++-- files/zh-tw/_wikihistory.json | 3686 ++++++++++---------- .../learn/html/introduction_to_html/index.html | 3 +- .../learn/javascript/objects/index.html | 3 +- .../learn/server-side/django/index.html | 3 +- .../web/api/canvas_api/tutorial/index.html | 3 +- .../web/api/document_object_model/index.html | 3 +- .../web/api/html_drag_and_drop_api/index.html | 3 +- files/zh-tw/conflicting/web/api/index.html | 3 +- .../conflicting/web/api/websockets_api/index.html | 3 +- .../web/api/windoworworkerglobalscope/index.html | 3 +- .../index.html | 3 +- .../zh-tw/conflicting/web/css/@viewport/index.html | 3 +- files/zh-tw/conflicting/web/guide/index.html | 3 +- .../index.html | 3 +- files/zh-tw/conflicting/web/http/cors/index.html | 3 +- .../control_flow_and_error_handling/index.html | 3 +- .../index.html | 4 +- .../index.html | 4 +- .../index.html | 4 +- .../guide/details_of_the_object_model/index.html | 5 +- .../index.html | 4 +- .../index.html | 4 +- .../index.html | 4 +- .../index.html | 4 +- .../index.html | 4 +- .../index.html | 4 +- .../guide/expressions_and_operators/index.html | 3 +- .../index.html | 4 +- .../index.html | 4 +- .../index.html | 4 +- .../index.html | 4 +- .../index.html | 4 +- .../index.html | 4 +- .../index.html | 4 +- .../web/javascript/guide/functions/index.html | 3 +- .../index.html | 5 +- .../index.html | 3 +- .../index.html | 3 +- .../index.html | 5 +- .../index.html | 5 +- .../index.html | 3 +- .../javascript/guide/grammar_and_types/index.html | 3 +- .../index.html | 4 +- .../index.html | 4 +- .../index.html | 4 +- .../index.html | 4 +- .../conflicting/web/javascript/guide/index.html | 3 +- .../guide/regular_expressions/index.html | 3 +- .../index.html | 4 +- .../index.html | 4 +- .../guide/working_with_objects/index.html | 3 +- .../index.html | 3 +- .../global_objects/arraybuffer/index.html | 3 +- .../reference/global_objects/date/index.html | 3 +- .../reference/global_objects/function/index.html | 3 +- .../reference/global_objects/number/index.html | 3 +- .../reference/global_objects/object/index.html | 3 +- .../reference/global_objects/promise/index.html | 3 +- .../reference/global_objects/string/index.html | 3 +- .../web/javascript/reference/operators/index.html | 3 +- .../index.html | 4 +- .../index.html | 4 +- .../index.html | 4 +- .../zh-tw/conflicting/web/media/formats/index.html | 3 +- files/zh-tw/conflicting/web/opensearch/index.html | 3 +- files/zh-tw/glossary/xhtml/index.html | 3 +- files/zh-tw/learn/css/howto/css_faq/index.html | 3 +- .../forms/how_to_structure_a_web_form/index.html | 3 +- files/zh-tw/learn/forms/index.html | 3 +- .../images_in_html/index.html | 3 +- .../other_embedding_technologies/index.html | 3 +- files/zh-tw/learn/html/tables/basics/index.html | 3 +- .../javascript/building_blocks/events/index.html | 3 +- .../zh-tw/learn/performance/multimedia/index.html | 3 +- .../first_steps/introduction/index.html | 3 +- files/zh-tw/mdn/at_ten/index.html | 3 +- files/zh-tw/mdn/yari/index.html | 3 +- .../index.html" | 3 +- .../orphaned/cross-site_xmlhttprequest/index.html | 3 +- .../index.html" | 3 +- .../index.html" | 3 +- .../index.html" | 3 +- .../html5_cross_browser_polyfills/index.html | 3 +- .../orphaned/learn/how_to_contribute/index.html | 3 +- .../learn/html/forms/html5_updates/index.html | 3 +- .../mdn/community/conversations/index.html | 3 +- files/zh-tw/orphaned/mdn/community/index.html | 3 +- .../howto/create_an_mdn_account/index.html | 3 +- .../howto/do_a_technical_review/index.html | 3 +- .../howto/do_an_editorial_review/index.html | 3 +- .../howto/set_the_summary_for_a_page/index.html | 3 +- files/zh-tw/orphaned/mdn/editor/basics/index.html | 3 +- files/zh-tw/orphaned/mdn/editor/index.html | 3 +- .../mdn/editor/keyboard_shortcuts/index.html | 3 +- .../index.html" | 3 +- .../web/css/border-image/border-image/index.html | 3 +- .../index.html" | 4 +- .../index.html" | 4 +- .../index.html" | 3 +- .../throw_\350\252\236\346\263\225/index.html" | 4 +- .../index.html" | 2 + .../index.html" | 3 +- .../index.html" | 3 +- .../break_\350\252\236\346\263\225/index.html" | 4 +- .../continue_\350\252\236\346\263\225/index.html" | 4 +- .../index.html" | 4 +- .../for_\350\252\236\346\263\225/index.html" | 4 +- .../label_\350\252\236\346\263\225/index.html" | 4 +- .../while_\350\252\236\346\263\225/index.html" | 4 +- .../index.html" | 2 + .../index.html" | 3 +- .../index.html" | 2 + .../index.html" | 4 +- .../index.html" | 4 +- .../index.html" | 4 +- .../index.html" | 4 +- .../index.html" | 4 +- .../index.html" | 4 +- .../index.html" | 4 +- .../index.html" | 3 +- .../index.html" | 4 +- .../index.html" | 3 +- .../\347\271\274\346\211\277/index.html" | 3 +- .../index.html" | 3 +- .../index.html" | 4 +- .../index.html" | 4 +- .../index.html" | 4 +- .../index.html" | 4 +- .../index.html" | 3 +- .../index.html" | 3 +- .../index.html" | 3 +- .../\351\227\234\346\226\274/index.html" | 3 +- .../index.html" | 2 + .../array_\347\211\251\344\273\266/index.html" | 4 +- .../boolean_\347\211\251\344\273\266/index.html" | 2 + .../date_\347\211\251\344\273\266/index.html" | 4 +- .../function_\347\211\251\344\273\266/index.html" | 2 + .../math_\347\211\251\344\273\266/index.html" | 4 +- .../number_\347\211\251\344\273\266/index.html" | 2 + .../regexp_\347\211\251\344\273\266/index.html" | 2 + .../string_\347\211\251\344\273\266/index.html" | 2 + .../web/svg/\346\225\231\345\255\270/index.html" | 3 +- files/zh-tw/orphaned/xpcnativewrapper/index.html | 3 +- files/zh-tw/orphaned/zh-tw/index.html | 3 +- .../index.html" | 3 +- .../index.html" | 3 +- files/zh-tw/tools/web_console/ui_tour/index.html | 3 +- files/zh-tw/web/api/closeevent/index.html | 3 +- .../zh-tw/web/api/document/createevent/index.html | 3 +- .../web/api/document/createtreewalker/index.html | 3 +- .../api/document_object_model/events/index.html | 3 +- .../web/api/elementcssinlinestyle/style/index.html | 3 +- files/zh-tw/web/api/geolocation_api/index.html | 3 +- .../zh-tw/web/api/htmlelement/innertext/index.html | 3 +- .../api/htmlmediaelement/abort_event/index.html | 3 +- .../api/htmlorforeignelement/dataset/index.html | 3 +- files/zh-tw/web/api/messageevent/index.html | 3 +- files/zh-tw/web/api/performance/timing/index.html | 3 +- files/zh-tw/web/api/permissions_api/index.html | 3 +- files/zh-tw/web/api/websocket/index.html | 3 +- files/zh-tw/web/api/websockets_api/index.html | 3 +- .../index.html | 3 +- files/zh-tw/web/api/webvtt_api/index.html | 3 +- .../api/window/domcontentloaded_event/index.html | 3 +- files/zh-tw/web/api/window/history/index.html | 3 +- files/zh-tw/web/api/window/load_event/index.html | 3 +- .../api/window/requestanimationframe/index.html | 3 +- .../api/windoweventhandlers/onpopstate/index.html | 3 +- .../web/css/css_backgrounds_and_borders/index.html | 3 +- .../using_multiple_backgrounds/index.html | 3 +- files/zh-tw/web/css/css_color/index.html | 3 +- .../basic_concepts_of_flexbox/index.html | 3 +- .../web/http/basics_of_http/data_uris/index.html | 3 +- files/zh-tw/web/http/status/418/index.html | 3 +- files/zh-tw/web/performance/index.html | 3 +- .../zh-tw/web/svg/tutorial/basic_shapes/index.html | 3 +- files/zh-tw/web/svg/tutorial/paths/index.html | 3 +- 178 files changed, 2743 insertions(+), 2333 deletions(-) diff --git a/files/zh-tw/_redirects.txt b/files/zh-tw/_redirects.txt index 17c6d50861..9cb96f5f03 100644 --- a/files/zh-tw/_redirects.txt +++ b/files/zh-tw/_redirects.txt @@ -4,21 +4,21 @@ /zh-TW/docs/AJAX/上手篇 /zh-TW/docs/Web/Guide/AJAX/Getting_Started /zh-TW/docs/AJAX:上手篇 /zh-TW/docs/Web/Guide/AJAX/Getting_Started /zh-TW/docs/CSS /zh-TW/docs/Web/CSS -/zh-TW/docs/CSS/-moz-border-image /zh-TW/docs/Web/CSS/border-image/border-image +/zh-TW/docs/CSS/-moz-border-image /zh-TW/docs/orphaned/Web/CSS/border-image/border-image /zh-TW/docs/CSS/@font-face /zh-TW/docs/Web/CSS/@font-face /zh-TW/docs/CSS/border-image /zh-TW/docs/Web/CSS/border-image -/zh-TW/docs/CSS/border-image/border-image /zh-TW/docs/Web/CSS/border-image/border-image +/zh-TW/docs/CSS/border-image/border-image /zh-TW/docs/orphaned/Web/CSS/border-image/border-image /zh-TW/docs/CSS/ime-mode /zh-TW/docs/Web/CSS/ime-mode /zh-TW/docs/CSS:ime-mode /zh-TW/docs/Web/CSS/ime-mode -/zh-TW/docs/CSS_一般問題 /zh-TW/docs/Web/CSS/Common_CSS_Questions +/zh-TW/docs/CSS_一般問題 /zh-TW/docs/Learn/CSS/Howto/CSS_FAQ /zh-TW/docs/CSS_動畫 /zh-TW/docs/Web/CSS/CSS_Animations/Using_CSS_animations /zh-TW/docs/CSS_轉場 /zh-TW/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions /zh-TW/docs/CSS_過渡 /zh-TW/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions /zh-TW/docs/Canvas_tutorial /en-US/docs/Web/API/Canvas_API/Tutorial /zh-TW/docs/Consistent_List_Indentation /zh-TW/docs/Web/CSS/CSS_Lists_and_Counters/Consistent_list_indentation /zh-TW/docs/Core_JavaScript_1.5_教學 /zh-TW/docs/Web/JavaScript/Guide -/zh-TW/docs/Core_JavaScript_1.5_教學/JavaScript_概要 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要 -/zh-TW/docs/Core_JavaScript_1.5_教學/LiveConnect_概要 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要 +/zh-TW/docs/Core_JavaScript_1.5_教學/JavaScript_概要 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要 +/zh-TW/docs/Core_JavaScript_1.5_教學/LiveConnect_概要 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要 /zh-TW/docs/Core_JavaScript_1.5_教學/LiveConnect_概要/JavaScript_向_Java_的通訊 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/JavaScript_向_Java_的通訊 /zh-TW/docs/Core_JavaScript_1.5_教學/LiveConnect_概要/Java_向_JavaScript_的通訊 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/Java_向_JavaScript_的通訊 /zh-TW/docs/Core_JavaScript_1.5_教學/LiveConnect_概要/Java_向_JavaScript_的通訊/LiveConnect_類別的使用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/Java_向_JavaScript_的通訊/LiveConnect_類別的使用 @@ -26,98 +26,100 @@ /zh-TW/docs/Core_JavaScript_1.5_教學/LiveConnect_概要/資料類型的轉換 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/資料類型的轉換 /zh-TW/docs/Core_JavaScript_1.5_教學/LiveConnect_概要/資料類型的轉換/從_JavaScript_到_Java_的轉換 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/資料類型的轉換/從_JavaScript_到_Java_的轉換 /zh-TW/docs/Core_JavaScript_1.5_教學/LiveConnect_概要/資料類型的轉換/從_Java_到_JavaScript_的轉換 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/資料類型的轉換/從_Java_到_JavaScript_的轉換 -/zh-TW/docs/Core_JavaScript_1.5_教學/Unicode /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/Unicode +/zh-TW/docs/Core_JavaScript_1.5_教學/Unicode /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types /zh-TW/docs/Core_JavaScript_1.5_教學/arguments_物件的使用 /zh-TW/docs/Web/JavaScript/Reference/Functions/arguments -/zh-TW/docs/Core_JavaScript_1.5_教學/以類別為基礎的語言_vs._以原型為基礎的語言 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/以類別為基礎的語言_vs._以原型為基礎的語言 -/zh-TW/docs/Core_JavaScript_1.5_教學/例外處理語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法 -/zh-TW/docs/Core_JavaScript_1.5_教學/例外處理語法/throw_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法 -/zh-TW/docs/Core_JavaScript_1.5_教學/例外處理語法/try...catch_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法 -/zh-TW/docs/Core_JavaScript_1.5_教學/值 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/值 -/zh-TW/docs/Core_JavaScript_1.5_教學/再談屬性的繼承 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承 -/zh-TW/docs/Core_JavaScript_1.5_教學/再談屬性的繼承/實體關係的確定 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/實體關係的確定 -/zh-TW/docs/Core_JavaScript_1.5_教學/再談屬性的繼承/局域值和繼承值 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/局域值和繼承值 -/zh-TW/docs/Core_JavaScript_1.5_教學/再談屬性的繼承/建構子中的全域資訊 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/建構子中的全域資訊 -/zh-TW/docs/Core_JavaScript_1.5_教學/再談屬性的繼承/沒有多重繼承 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/沒有多重繼承 -/zh-TW/docs/Core_JavaScript_1.5_教學/函數的呼叫 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的呼叫 -/zh-TW/docs/Core_JavaScript_1.5_教學/函數的定義 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義 -/zh-TW/docs/Core_JavaScript_1.5_教學/區塊文法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊語法 -/zh-TW/docs/Core_JavaScript_1.5_教學/區塊語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊語法 -/zh-TW/docs/Core_JavaScript_1.5_教學/字面表達 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/字面表達 -/zh-TW/docs/Core_JavaScript_1.5_教學/常數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/常數 -/zh-TW/docs/Core_JavaScript_1.5_教學/建立新的物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件 -/zh-TW/docs/Core_JavaScript_1.5_教學/建立新的物件/物件初始化子的使用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 -/zh-TW/docs/Core_JavaScript_1.5_教學/循環語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法 -/zh-TW/docs/Core_JavaScript_1.5_教學/循環語法/break_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法 -/zh-TW/docs/Core_JavaScript_1.5_教學/循環語法/continue_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法 -/zh-TW/docs/Core_JavaScript_1.5_教學/循環語法/do...while_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法 -/zh-TW/docs/Core_JavaScript_1.5_教學/循環語法/for_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法 -/zh-TW/docs/Core_JavaScript_1.5_教學/循環語法/label_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法 -/zh-TW/docs/Core_JavaScript_1.5_教學/循環語法/while_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法 -/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立 -/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/Getter_和_Setter_的定義 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義 -/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/使用_this_取得物件的參考 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考 -/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/屬性的刪除 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除 -/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/建構子函數的使用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用 -/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/方法的定義 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義 -/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/物件初始化子的使用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 -/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/物件屬性的索引 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引 -/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/針對物件的類型定義屬性 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性 -/zh-TW/docs/Core_JavaScript_1.5_教學/條件文法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件語法 -/zh-TW/docs/Core_JavaScript_1.5_教學/條件語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件語法 -/zh-TW/docs/Core_JavaScript_1.5_教學/正則表達式模式的編寫 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 -/zh-TW/docs/Core_JavaScript_1.5_教學/正則表達式的建立 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 -/zh-TW/docs/Core_JavaScript_1.5_教學/正則表達式的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用 -/zh-TW/docs/Core_JavaScript_1.5_教學/正則表達式的運用/使用標誌的進階搜尋 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 -/zh-TW/docs/Core_JavaScript_1.5_教學/正則表達式的運用/括弧子字串的比對結果的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 -/zh-TW/docs/Core_JavaScript_1.5_教學/正則表達式的運用/正則表達式的範例 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 -/zh-TW/docs/Core_JavaScript_1.5_教學/正規表達式模式的編寫 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 -/zh-TW/docs/Core_JavaScript_1.5_教學/正規表達式的建立 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 -/zh-TW/docs/Core_JavaScript_1.5_教學/正規表達式的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用 -/zh-TW/docs/Core_JavaScript_1.5_教學/正規表達式的運用/使用標誌的進階搜尋 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 -/zh-TW/docs/Core_JavaScript_1.5_教學/正規表達式的運用/括弧子字串的比對結果的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 -/zh-TW/docs/Core_JavaScript_1.5_教學/正規表達式的運用/正則表達式的範例 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 -/zh-TW/docs/Core_JavaScript_1.5_教學/正規表達式的運用/正規表達式的範例 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 -/zh-TW/docs/Core_JavaScript_1.5_教學/物件和屬性 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件和屬性 -/zh-TW/docs/Core_JavaScript_1.5_教學/物件的操作語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法 -/zh-TW/docs/Core_JavaScript_1.5_教學/繼承 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承 -/zh-TW/docs/Core_JavaScript_1.5_教學/職員的例子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子 -/zh-TW/docs/Core_JavaScript_1.5_教學/職員的例子/更靈活的建構子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/更靈活的建構子 -/zh-TW/docs/Core_JavaScript_1.5_教學/職員的例子/物件的屬性 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性 -/zh-TW/docs/Core_JavaScript_1.5_教學/職員的例子/物件的屬性/屬性的加入 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入 -/zh-TW/docs/Core_JavaScript_1.5_教學/職員的例子/物件的屬性/屬性的繼承 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承 -/zh-TW/docs/Core_JavaScript_1.5_教學/職員的例子/階層的建立 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立 -/zh-TW/docs/Core_JavaScript_1.5_教學/表達式 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/表達式 -/zh-TW/docs/Core_JavaScript_1.5_教學/註解 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/註解 -/zh-TW/docs/Core_JavaScript_1.5_教學/變數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/變數 -/zh-TW/docs/Core_JavaScript_1.5_教學/迭代器和產生器 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器 -/zh-TW/docs/Core_JavaScript_1.5_教學/運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子 -/zh-TW/docs/Core_JavaScript_1.5_教學/運算子/代入運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/代入運算子 -/zh-TW/docs/Core_JavaScript_1.5_教學/運算子/位元運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/位元運算子 -/zh-TW/docs/Core_JavaScript_1.5_教學/運算子/字串運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/字串運算子 -/zh-TW/docs/Core_JavaScript_1.5_教學/運算子/比較運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子 -/zh-TW/docs/Core_JavaScript_1.5_教學/運算子/特殊運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/特殊運算子 -/zh-TW/docs/Core_JavaScript_1.5_教學/運算子/算術運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/算術運算子 -/zh-TW/docs/Core_JavaScript_1.5_教學/運算子/邏輯運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/邏輯運算子 -/zh-TW/docs/Core_JavaScript_1.5_教學/閉包的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用 -/zh-TW/docs/Core_JavaScript_1.5_教學/關於 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於 -/zh-TW/docs/Core_JavaScript_1.5_教學/陣列的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/陣列的運用 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的函數/Number_和_String_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/Number_和_String_函數 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的函數/escape_和_unescape_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/escape_和_unescape_函數 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的函數/eval_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/eval_函數 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的函數/isFinite_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isFinite_函數 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的函數/isNaN_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isNaN_函數 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的函數/parseInt_和_parseFloat_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/Array_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/Boolean_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/Date_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/Function_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/Math_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/Number_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/RegExp_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件 -/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/String_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件 -/zh-TW/docs/Core_JavaScript_1.5_正規表達式的建立/正規表達式的建立 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 +/zh-TW/docs/Core_JavaScript_1.5_教學/以類別為基礎的語言_vs._以原型為基礎的語言 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model +/zh-TW/docs/Core_JavaScript_1.5_教學/例外處理語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法 +/zh-TW/docs/Core_JavaScript_1.5_教學/例外處理語法/throw_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法 +/zh-TW/docs/Core_JavaScript_1.5_教學/例外處理語法/try...catch_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法 +/zh-TW/docs/Core_JavaScript_1.5_教學/值 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_5c6f30ff8e011c45a011b9c8f3b5bcea +/zh-TW/docs/Core_JavaScript_1.5_教學/再談屬性的繼承 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_937645e235e25783cc4e9b0d7a1f6d76 +/zh-TW/docs/Core_JavaScript_1.5_教學/再談屬性的繼承/實體關係的確定 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_3193ca1e5a7bdb78e9d9418a947916aa +/zh-TW/docs/Core_JavaScript_1.5_教學/再談屬性的繼承/局域值和繼承值 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_483bbc3a620ead7b721647d1a2cb216f +/zh-TW/docs/Core_JavaScript_1.5_教學/再談屬性的繼承/建構子中的全域資訊 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_8898a6dd437cc51f48b4e8cade0385ac +/zh-TW/docs/Core_JavaScript_1.5_教學/再談屬性的繼承/沒有多重繼承 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_60d6c39d4282c67c117db9fdaf83be08 +/zh-TW/docs/Core_JavaScript_1.5_教學/函數的呼叫 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions +/zh-TW/docs/Core_JavaScript_1.5_教學/函數的定義 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義 +/zh-TW/docs/Core_JavaScript_1.5_教學/區塊文法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling +/zh-TW/docs/Core_JavaScript_1.5_教學/區塊語法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling +/zh-TW/docs/Core_JavaScript_1.5_教學/字面表達 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_d57082c2207b466127d8dc34a980addf +/zh-TW/docs/Core_JavaScript_1.5_教學/常數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_e5a53691c318855e3342ad91feb78f2e +/zh-TW/docs/Core_JavaScript_1.5_教學/建立新的物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件 +/zh-TW/docs/Core_JavaScript_1.5_教學/建立新的物件/物件初始化子的使用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 +/zh-TW/docs/Core_JavaScript_1.5_教學/循環語法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_a2d11ceeaeb3cb8c43292be7771f9b23 +/zh-TW/docs/Core_JavaScript_1.5_教學/循環語法/break_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法 +/zh-TW/docs/Core_JavaScript_1.5_教學/循環語法/continue_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法 +/zh-TW/docs/Core_JavaScript_1.5_教學/循環語法/do...while_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法 +/zh-TW/docs/Core_JavaScript_1.5_教學/循環語法/for_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法 +/zh-TW/docs/Core_JavaScript_1.5_教學/循環語法/label_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法 +/zh-TW/docs/Core_JavaScript_1.5_教學/循環語法/while_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法 +/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立 +/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/Getter_和_Setter_的定義 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義 +/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/使用_this_取得物件的參考 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考 +/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/屬性的刪除 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除 +/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/建構子函數的使用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用 +/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/方法的定義 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義 +/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/物件初始化子的使用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 +/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/物件屬性的索引 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引 +/zh-TW/docs/Core_JavaScript_1.5_教學/新物件的建立/針對物件的類型定義屬性 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性 +/zh-TW/docs/Core_JavaScript_1.5_教學/條件文法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5 +/zh-TW/docs/Core_JavaScript_1.5_教學/條件語法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5 +/zh-TW/docs/Core_JavaScript_1.5_教學/正則表達式模式的編寫 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 +/zh-TW/docs/Core_JavaScript_1.5_教學/正則表達式的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 +/zh-TW/docs/Core_JavaScript_1.5_教學/正則表達式的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions +/zh-TW/docs/Core_JavaScript_1.5_教學/正則表達式的運用/使用標誌的進階搜尋 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_38b32725e0e3217a5542b1b4ee122407 +/zh-TW/docs/Core_JavaScript_1.5_教學/正則表達式的運用/括弧子字串的比對結果的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_24eb6498b86da57e7fb5337fd8fa04a6 +/zh-TW/docs/Core_JavaScript_1.5_教學/正則表達式的運用/正則表達式的範例 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 +/zh-TW/docs/Core_JavaScript_1.5_教學/正規表達式模式的編寫 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 +/zh-TW/docs/Core_JavaScript_1.5_教學/正規表達式的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 +/zh-TW/docs/Core_JavaScript_1.5_教學/正規表達式的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions +/zh-TW/docs/Core_JavaScript_1.5_教學/正規表達式的運用/使用標誌的進階搜尋 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_38b32725e0e3217a5542b1b4ee122407 +/zh-TW/docs/Core_JavaScript_1.5_教學/正規表達式的運用/括弧子字串的比對結果的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_24eb6498b86da57e7fb5337fd8fa04a6 +/zh-TW/docs/Core_JavaScript_1.5_教學/正規表達式的運用/正則表達式的範例 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 +/zh-TW/docs/Core_JavaScript_1.5_教學/正規表達式的運用/正規表達式的範例 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 +/zh-TW/docs/Core_JavaScript_1.5_教學/物件和屬性 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Working_with_Objects +/zh-TW/docs/Core_JavaScript_1.5_教學/物件的操作語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法 +/zh-TW/docs/Core_JavaScript_1.5_教學/繼承 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承 +/zh-TW/docs/Core_JavaScript_1.5_教學/職員的例子 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子 +/zh-TW/docs/Core_JavaScript_1.5_教學/職員的例子/更靈活的建構子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_b021bd32308e4c421518cdd7104ac7bc +/zh-TW/docs/Core_JavaScript_1.5_教學/職員的例子/物件的屬性 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性 +/zh-TW/docs/Core_JavaScript_1.5_教學/職員的例子/物件的屬性/屬性的加入 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入 +/zh-TW/docs/Core_JavaScript_1.5_教學/職員的例子/物件的屬性/屬性的繼承 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承 +/zh-TW/docs/Core_JavaScript_1.5_教學/職員的例子/階層的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立 +/zh-TW/docs/Core_JavaScript_1.5_教學/表達式 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators +/zh-TW/docs/Core_JavaScript_1.5_教學/註解 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_74154e098f4b1e7026df3945ceb0fa4a +/zh-TW/docs/Core_JavaScript_1.5_教學/變數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_ef6fc79abc28f5eadd6c126341df5e49 +/zh-TW/docs/Core_JavaScript_1.5_教學/迭代器和產生器 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器 +/zh-TW/docs/Core_JavaScript_1.5_教學/運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_e6fc14473511cf01e7062dfb7751f49d +/zh-TW/docs/Core_JavaScript_1.5_教學/運算子/代入運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_e70c1f2655520c542321ddbdb2c4f28d +/zh-TW/docs/Core_JavaScript_1.5_教學/運算子/位元運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_11969cb29fead65c26360f554426c217 +/zh-TW/docs/Core_JavaScript_1.5_教學/運算子/字串運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_eb65eb8f4e6b3c16f08b95149183cfb8 +/zh-TW/docs/Core_JavaScript_1.5_教學/運算子/比較運算子 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子 +/zh-TW/docs/Core_JavaScript_1.5_教學/運算子/特殊運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_952d66f1fe521bc0574c89750f5b406e +/zh-TW/docs/Core_JavaScript_1.5_教學/運算子/算術運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_05717c12b1ecaebc9d68cf43524d31b1 +/zh-TW/docs/Core_JavaScript_1.5_教學/運算子/邏輯運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_351a6d9e4d31b32eff9762ef5deead93 +/zh-TW/docs/Core_JavaScript_1.5_教學/閉包的運用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用 +/zh-TW/docs/Core_JavaScript_1.5_教學/關於 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於 +/zh-TW/docs/Core_JavaScript_1.5_教學/陣列的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_587eb671a310bac0771e73a91b0abe6d +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的函數/Number_和_String_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_536f6bf46bbdf38cc1a0b28ca1bc41b9 +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的函數/escape_和_unescape_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_ceaa4b2a55bb67388c2728af1ff890f5 +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的函數/eval_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_effb9b1bcc102a5f6df7f1785ce89033 +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的函數/isFinite_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_b2cd05cbfe188215dc2e3f972d293ed6 +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的函數/isNaN_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_925b2d10050621507a9c990cb803dcca +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的函數/parseInt_和_parseFloat_函數 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數 +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件 /zh-TW/docs/conflicting/Web/JavaScript/Guide_dc05b578fe0c2f7d9a89ed82daab4e65 +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/Array_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件 +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/Boolean_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件 +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/Date_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件 +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/Function_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件 +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/Math_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件 +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/Number_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件 +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/RegExp_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件 +/zh-TW/docs/Core_JavaScript_1.5_教學/預先定義的核心物件/String_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件 +/zh-TW/docs/Core_JavaScript_1.5_正規表達式的建立 /zh-TW/docs/orphaned/Core_JavaScript_1.5_正規表達式的建立 +/zh-TW/docs/Core_JavaScript_1.5_正規表達式的建立/正規表達式的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 +/zh-TW/docs/Cross-site_XMLHttpRequest /zh-TW/docs/orphaned/Cross-site_XMLHttpRequest /zh-TW/docs/DOM /en-US/docs/Web/API/Document_Object_Model /zh-TW/docs/DOM/XMLHttpRequest /zh-TW/docs/Web/API/XMLHttpRequest /zh-TW/docs/DOM/XMLHttpRequest/FormData /zh-TW/docs/Web/API/FormData @@ -125,27 +127,31 @@ /zh-TW/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest /zh-TW/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest /zh-TW/docs/DOM/window.location /zh-TW/docs/Web/API/Window/location /zh-TW/docs/DOM_中的空白字元 /zh-TW/docs/Web/API/Document_Object_Model/Whitespace +/zh-TW/docs/DOM_觀察器 /zh-TW/docs/orphaned/DOM_觀察器 /zh-TW/docs/Developer_Guide /zh-TW/docs/Mozilla/Developer_guide /zh-TW/docs/Developer_Guide/原始碼 /zh-TW/docs/Mozilla/Developer_guide/Source_Code /zh-TW/docs/Developer_guide_temp /zh-TW/docs/Mozilla/Developer_guide /zh-TW/docs/Developer_guide_temp/原始碼 /zh-TW/docs/Mozilla/Developer_guide/Source_Code +/zh-TW/docs/DragDrop /zh-TW/docs/conflicting/Web/API/HTML_Drag_and_Drop_API /zh-TW/docs/DragDrop/Drag_and_Drop /zh-TW/docs/Web/API/HTML_Drag_and_Drop_API /zh-TW/docs/Drawing_text_using_a_canvas /zh-TW/docs/Web/API/Canvas_API/Tutorial/Drawing_text /zh-TW/docs/Firefox_2 /zh-TW/docs/Mozilla/Firefox/Releases/2 /zh-TW/docs/Firefox_2_技術文件 /zh-TW/docs/Mozilla/Firefox/Releases/2 /zh-TW/docs/Firefox_2_的安全功能 /zh-TW/docs/Mozilla/Firefox/Releases/2/Security_changes -/zh-TW/docs/Firefox_3.1_技術文件 /zh-TW/docs/Firefox_3.5_技術文件 +/zh-TW/docs/Firefox_3.1_技術文件 /zh-TW/docs/orphaned/Firefox_3.5_技術文件 +/zh-TW/docs/Firefox_3.5_技術文件 /zh-TW/docs/orphaned/Firefox_3.5_技術文件 /zh-TW/docs/Firefox_3_CSS_Improvement /zh-TW/docs/Mozilla/Firefox/Releases/3/Firefox_3_CSS_Improvement /zh-TW/docs/Firefox_3_Dom_Improvements /zh-TW/docs/Mozilla/Firefox/Releases/3/DOM_improvements /zh-TW/docs/Firefox_3_Online_and_Offline_Events /zh-TW/docs/Web/API/NavigatorOnLine/Online_and_offline_events /zh-TW/docs/Firefox_3_Web-based_protocol_handler /zh-TW/docs/Web/API/Navigator/registerProtocolHandler/Web-based_protocol_handlers /zh-TW/docs/Firefox_3_for_developers /zh-TW/docs/Mozilla/Firefox/Releases/3 -/zh-TW/docs/Firefox_3_supports_Cross-site_XMLHttpRequest /zh-TW/docs/Cross-site_XMLHttpRequest +/zh-TW/docs/Firefox_3_supports_Cross-site_XMLHttpRequest /zh-TW/docs/orphaned/Cross-site_XMLHttpRequest /zh-TW/docs/Firefox_3_技術文件 /zh-TW/docs/Mozilla/Firefox/Releases/3 /zh-TW/docs/Firefox_4_for_developers /zh-TW/docs/Mozilla/Firefox/Releases/4 -/zh-TW/docs/Firefox_4_for_developers/Firefox_4_開發者新功能概覽 /zh-TW/docs/Mozilla/Firefox/Releases/4/Firefox_4_開發者新功能概覽 -/zh-TW/docs/Firefox_4_開發者新功能概覽 /zh-TW/docs/Mozilla/Firefox/Releases/4/Firefox_4_開發者新功能概覽 +/zh-TW/docs/Firefox_4_for_developers/Firefox_4_開發者新功能概覽 /zh-TW/docs/orphaned/Mozilla/Firefox/Releases/4/Firefox_4_開發者新功能概覽 +/zh-TW/docs/Firefox_4_開發者新功能概覽 /zh-TW/docs/orphaned/Mozilla/Firefox/Releases/4/Firefox_4_開發者新功能概覽 /zh-TW/docs/Firefox_7_for_developers /zh-TW/docs/Mozilla/Firefox/Releases/7 +/zh-TW/docs/Firefox_中的離線資源 /zh-TW/docs/orphaned/Firefox_中的離線資源 /zh-TW/docs/Games/Workflows /zh-TW/docs/Games/Tutorials /zh-TW/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript /zh-TW/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript /zh-TW/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls /zh-TW/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls @@ -166,15 +172,16 @@ /zh-TW/docs/HTML/Element/HTML_元素 /zh-TW/docs/Web/HTML/Element /zh-TW/docs/HTML/Element/a /zh-TW/docs/Web/HTML/Element/a /zh-TW/docs/HTML/HTML5 /zh-TW/docs/Web/Guide/HTML/HTML5 -/zh-TW/docs/HTML/HTML5_表單 /zh-TW/docs/Learn/HTML/Forms +/zh-TW/docs/HTML/HTML5_表單 /zh-TW/docs/Learn/Forms /zh-TW/docs/HTML/Introduction /zh-CN/docs/learn/HTML/Introduction_to_HTML +/zh-TW/docs/HTML5_Cross_Browser_Polyfills /zh-TW/docs/orphaned/HTML5_Cross_Browser_Polyfills /zh-TW/docs/HTTP /zh-TW/docs/Web/HTTP /zh-TW/docs/HTTP/Access_control_CORS /zh-TW/docs/Web/HTTP/CORS /zh-TW/docs/HTTP/Browser_detection_using_the_user_agent /zh-TW/docs/Web/HTTP/Browser_detection_using_the_user_agent /zh-TW/docs/HTTP/Link_prefetching_FAQ /zh-TW/docs/Web/HTTP/Link_prefetching_FAQ /zh-TW/docs/HTTP/Response_codes /zh-TW/docs/Web/HTTP/Status /zh-TW/docs/HTTP/X-Frame-Options /zh-TW/docs/Web/HTTP/Headers/X-Frame-Options -/zh-TW/docs/HTTP/data_URIs /zh-TW/docs/Web/HTTP/data_URIs +/zh-TW/docs/HTTP/data_URIs /zh-TW/docs/Web/HTTP/Basics_of_HTTP/Data_URIs /zh-TW/docs/IndexedDB /zh-TW/docs/Web/API/IndexedDB_API /zh-TW/docs/IndexedDB/Basic_Concepts_Behind_IndexedDB /zh-TW/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB /zh-TW/docs/IndexedDB/Using_IndexedDB /zh-TW/docs/Web/API/IndexedDB_API/Using_IndexedDB @@ -188,8 +195,8 @@ /zh-TW/docs/JavaScript/Guide/JavaScript_概觀 /zh-TW/docs/Web/JavaScript/Guide/Introduction /zh-TW/docs/JavaScript/Guide/JavaScript_概觀（JavaScript_Overview） /zh-TW/docs/Web/JavaScript/Guide/Introduction /zh-TW/docs/JavaScript/Guide/Obsolete_Pages /zh-TW/docs/Web/JavaScript/Guide -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/JavaScript_概要 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/LiveConnect_概要 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/JavaScript_概要 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/LiveConnect_概要 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要 /zh-TW/docs/JavaScript/Guide/Obsolete_Pages/LiveConnect_概要/JavaScript_向_Java_的通訊 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/JavaScript_向_Java_的通訊 /zh-TW/docs/JavaScript/Guide/Obsolete_Pages/LiveConnect_概要/Java_向_JavaScript_的通訊 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/Java_向_JavaScript_的通訊 /zh-TW/docs/JavaScript/Guide/Obsolete_Pages/LiveConnect_概要/Java_向_JavaScript_的通訊/LiveConnect_類別的使用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/Java_向_JavaScript_的通訊/LiveConnect_類別的使用 @@ -197,97 +204,97 @@ /zh-TW/docs/JavaScript/Guide/Obsolete_Pages/LiveConnect_概要/資料類型的轉換 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/資料類型的轉換 /zh-TW/docs/JavaScript/Guide/Obsolete_Pages/LiveConnect_概要/資料類型的轉換/從_JavaScript_到_Java_的轉換 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/資料類型的轉換/從_JavaScript_到_Java_的轉換 /zh-TW/docs/JavaScript/Guide/Obsolete_Pages/LiveConnect_概要/資料類型的轉換/從_Java_到_JavaScript_的轉換 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/資料類型的轉換/從_Java_到_JavaScript_的轉換 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/Unicode /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/Unicode +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/Unicode /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types /zh-TW/docs/JavaScript/Guide/Obsolete_Pages/arguments_物件的使用 /zh-TW/docs/Web/JavaScript/Reference/Functions/arguments -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/以類別為基礎的語言_vs._以原型為基礎的語言 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/以類別為基礎的語言_vs._以原型為基礎的語言 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/例外處理語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/例外處理語法/throw_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/例外處理語法/try...catch_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/值 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/值 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/再談屬性的繼承 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/再談屬性的繼承/實體關係的確定 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/實體關係的確定 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/再談屬性的繼承/局域值和繼承值 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/局域值和繼承值 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/再談屬性的繼承/建構子中的全域資訊 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/建構子中的全域資訊 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/再談屬性的繼承/沒有多重繼承 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/沒有多重繼承 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/函數的呼叫 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的呼叫 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/函數的定義 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/區塊文法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊語法 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/區塊語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊語法 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/字面表達 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/字面表達 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/常數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/常數 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/建立新的物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/建立新的物件/物件初始化子的使用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/循環語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/循環語法/break_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/循環語法/continue_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/循環語法/do...while_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/循環語法/for_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/循環語法/label_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/循環語法/while_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/屬性的刪除 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/建構子函數的使用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/方法的定義 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/物件初始化子的使用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/物件屬性的索引 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/條件文法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件語法 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/條件語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件語法 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正則表達式模式的編寫 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正則表達式的建立 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正則表達式的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正則表達式的運用/使用標誌的進階搜尋 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正則表達式的運用/括弧子字串的比對結果的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正則表達式的運用/正則表達式的範例 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正規表達式模式的編寫 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正規表達式的建立 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正規表達式的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正規表達式的運用/正則表達式的範例 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正規表達式的運用/正規表達式的範例 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/物件和屬性 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件和屬性 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/物件的操作語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/繼承 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/職員的例子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/職員的例子/更靈活的建構子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/更靈活的建構子 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/職員的例子/物件的屬性 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/職員的例子/階層的建立 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/表達式 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/表達式 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/註解 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/註解 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/變數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/變數 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/迭代器和產生器 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子/代入運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/代入運算子 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子/位元運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/位元運算子 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子/字串運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/字串運算子 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子/比較運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子/特殊運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/特殊運算子 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子/算術運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/算術運算子 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子/邏輯運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/邏輯運算子 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/閉包的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/關於 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/陣列的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/陣列的運用 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的函數/Number_和_String_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/Number_和_String_函數 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的函數/escape_和_unescape_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/escape_和_unescape_函數 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的函數/eval_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/eval_函數 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的函數/isFinite_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isFinite_函數 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的函數/isNaN_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isNaN_函數 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/Array_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/Boolean_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/Date_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/Function_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/Math_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/Number_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/RegExp_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件 -/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/String_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/以類別為基礎的語言_vs._以原型為基礎的語言 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/例外處理語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/例外處理語法/throw_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/例外處理語法/try...catch_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/值 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_5c6f30ff8e011c45a011b9c8f3b5bcea +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/再談屬性的繼承 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_937645e235e25783cc4e9b0d7a1f6d76 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/再談屬性的繼承/實體關係的確定 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_3193ca1e5a7bdb78e9d9418a947916aa +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/再談屬性的繼承/局域值和繼承值 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_483bbc3a620ead7b721647d1a2cb216f +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/再談屬性的繼承/建構子中的全域資訊 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_8898a6dd437cc51f48b4e8cade0385ac +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/再談屬性的繼承/沒有多重繼承 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_60d6c39d4282c67c117db9fdaf83be08 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/函數的呼叫 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/函數的定義 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/區塊文法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/區塊語法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/字面表達 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_d57082c2207b466127d8dc34a980addf +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/常數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_e5a53691c318855e3342ad91feb78f2e +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/建立新的物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/建立新的物件/物件初始化子的使用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/循環語法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_a2d11ceeaeb3cb8c43292be7771f9b23 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/循環語法/break_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/循環語法/continue_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/循環語法/do...while_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/循環語法/for_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/循環語法/label_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/循環語法/while_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/屬性的刪除 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/建構子函數的使用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/方法的定義 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/物件初始化子的使用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/物件屬性的索引 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/條件文法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/條件語法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正則表達式模式的編寫 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正則表達式的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正則表達式的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正則表達式的運用/使用標誌的進階搜尋 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_38b32725e0e3217a5542b1b4ee122407 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正則表達式的運用/括弧子字串的比對結果的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_24eb6498b86da57e7fb5337fd8fa04a6 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正則表達式的運用/正則表達式的範例 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正規表達式模式的編寫 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正規表達式的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正規表達式的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_38b32725e0e3217a5542b1b4ee122407 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_24eb6498b86da57e7fb5337fd8fa04a6 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正規表達式的運用/正則表達式的範例 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/正規表達式的運用/正規表達式的範例 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/物件和屬性 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Working_with_Objects +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/物件的操作語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/繼承 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/職員的例子 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/職員的例子/更靈活的建構子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_b021bd32308e4c421518cdd7104ac7bc +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/職員的例子/物件的屬性 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/職員的例子/階層的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/表達式 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/註解 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_74154e098f4b1e7026df3945ceb0fa4a +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/變數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_ef6fc79abc28f5eadd6c126341df5e49 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/迭代器和產生器 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_e6fc14473511cf01e7062dfb7751f49d +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子/代入運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_e70c1f2655520c542321ddbdb2c4f28d +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子/位元運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_11969cb29fead65c26360f554426c217 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子/字串運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_eb65eb8f4e6b3c16f08b95149183cfb8 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子/比較運算子 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子/特殊運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_952d66f1fe521bc0574c89750f5b406e +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子/算術運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_05717c12b1ecaebc9d68cf43524d31b1 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/運算子/邏輯運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_351a6d9e4d31b32eff9762ef5deead93 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/閉包的運用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/關於 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/陣列的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_587eb671a310bac0771e73a91b0abe6d +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的函數/Number_和_String_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_536f6bf46bbdf38cc1a0b28ca1bc41b9 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的函數/escape_和_unescape_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_ceaa4b2a55bb67388c2728af1ff890f5 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的函數/eval_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_effb9b1bcc102a5f6df7f1785ce89033 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的函數/isFinite_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_b2cd05cbfe188215dc2e3f972d293ed6 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的函數/isNaN_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_925b2d10050621507a9c990cb803dcca +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件 /zh-TW/docs/conflicting/Web/JavaScript/Guide_dc05b578fe0c2f7d9a89ed82daab4e65 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/Array_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/Boolean_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/Date_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/Function_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/Math_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/Number_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/RegExp_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件 +/zh-TW/docs/JavaScript/Guide/Obsolete_Pages/預先定義的核心物件/String_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件 /zh-TW/docs/JavaScript/Guide/Regular_Expressions /zh-TW/docs/Web/JavaScript/Guide/Regular_Expressions /zh-TW/docs/JavaScript/Guide/Values,_variables,_and_literals /zh-TW/docs/Web/JavaScript/Guide/Grammar_and_types /zh-TW/docs/JavaScript/Guide/Working_with_Objects /zh-TW/docs/Web/JavaScript/Guide/Working_with_Objects @@ -296,8 +303,8 @@ /zh-TW/docs/JavaScript/New_in_JavaScript/JavaScript_1.7_新鮮事 /zh-TW/docs/Web/JavaScript/New_in_JavaScript/1.7 /zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages /zh-TW/docs/Web/JavaScript/Guide /zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages /zh-TW/docs/Web/JavaScript/Guide -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要 /zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/JavaScript_向_Java_的通訊 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/JavaScript_向_Java_的通訊 /zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/Java_向_JavaScript_的通訊 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/Java_向_JavaScript_的通訊 /zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/Java_向_JavaScript_的通訊/LiveConnect_類別的使用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/Java_向_JavaScript_的通訊/LiveConnect_類別的使用 @@ -305,97 +312,97 @@ /zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/資料類型的轉換 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/資料類型的轉換 /zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/資料類型的轉換/從_JavaScript_到_Java_的轉換 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/資料類型的轉換/從_JavaScript_到_Java_的轉換 /zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/資料類型的轉換/從_Java_到_JavaScript_的轉換 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要/資料類型的轉換/從_Java_到_JavaScript_的轉換 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/Unicode /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/Unicode +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/Unicode /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types /zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/arguments_物件的使用 /zh-TW/docs/Web/JavaScript/Reference/Functions/arguments -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/以類別為基礎的語言_vs._以原型為基礎的語言 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/以類別為基礎的語言_vs._以原型為基礎的語言 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/值 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/值 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/實體關係的確定 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/實體關係的確定 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/局域值和繼承值 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/局域值和繼承值 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/建構子中的全域資訊 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/建構子中的全域資訊 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/沒有多重繼承 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/沒有多重繼承 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的呼叫 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的呼叫 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊文法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊語法 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊語法 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/字面表達 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/字面表達 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/常數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/常數 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件/物件初始化子的使用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件文法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件語法 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件語法 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式模式的編寫 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的建立 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用/使用標誌的進階搜尋 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用/括弧子字串的比對結果的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用/正則表達式的範例 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正則表達式的範例 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件和屬性 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件和屬性 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/更靈活的建構子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/更靈活的建構子 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/表達式 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/表達式 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/註解 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/註解 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/變數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/變數 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/代入運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/代入運算子 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/位元運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/位元運算子 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/字串運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/字串運算子 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/特殊運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/特殊運算子 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/算術運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/算術運算子 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/邏輯運算子 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/邏輯運算子 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/陣列的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/陣列的運用 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/Number_和_String_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/Number_和_String_函數 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/escape_和_unescape_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/escape_和_unescape_函數 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/eval_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/eval_函數 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isFinite_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isFinite_函數 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isNaN_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isNaN_函數 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件 -/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/以類別為基礎的語言_vs._以原型為基礎的語言 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/值 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_5c6f30ff8e011c45a011b9c8f3b5bcea +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_937645e235e25783cc4e9b0d7a1f6d76 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/實體關係的確定 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_3193ca1e5a7bdb78e9d9418a947916aa +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/局域值和繼承值 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_483bbc3a620ead7b721647d1a2cb216f +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/建構子中的全域資訊 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_8898a6dd437cc51f48b4e8cade0385ac +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/沒有多重繼承 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_60d6c39d4282c67c117db9fdaf83be08 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的呼叫 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊文法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊語法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/字面表達 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_d57082c2207b466127d8dc34a980addf +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/常數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_e5a53691c318855e3342ad91feb78f2e +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件/物件初始化子的使用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_a2d11ceeaeb3cb8c43292be7771f9b23 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件文法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件語法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式模式的編寫 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用/使用標誌的進階搜尋 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_38b32725e0e3217a5542b1b4ee122407 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用/括弧子字串的比對結果的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_24eb6498b86da57e7fb5337fd8fa04a6 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用/正則表達式的範例 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_38b32725e0e3217a5542b1b4ee122407 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_24eb6498b86da57e7fb5337fd8fa04a6 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正則表達式的範例 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件和屬性 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Working_with_Objects +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/更靈活的建構子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_b021bd32308e4c421518cdd7104ac7bc +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/表達式 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/註解 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_74154e098f4b1e7026df3945ceb0fa4a +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/變數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_ef6fc79abc28f5eadd6c126341df5e49 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_e6fc14473511cf01e7062dfb7751f49d +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/代入運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_e70c1f2655520c542321ddbdb2c4f28d +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/位元運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_11969cb29fead65c26360f554426c217 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/字串運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_eb65eb8f4e6b3c16f08b95149183cfb8 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/特殊運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_952d66f1fe521bc0574c89750f5b406e +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/算術運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_05717c12b1ecaebc9d68cf43524d31b1 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/邏輯運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_351a6d9e4d31b32eff9762ef5deead93 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/陣列的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_587eb671a310bac0771e73a91b0abe6d +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/Number_和_String_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_536f6bf46bbdf38cc1a0b28ca1bc41b9 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/escape_和_unescape_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_ceaa4b2a55bb67388c2728af1ff890f5 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/eval_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_effb9b1bcc102a5f6df7f1785ce89033 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isFinite_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_b2cd05cbfe188215dc2e3f972d293ed6 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isNaN_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_925b2d10050621507a9c990cb803dcca +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件 /zh-TW/docs/conflicting/Web/JavaScript/Guide_dc05b578fe0c2f7d9a89ed82daab4e65 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件 +/zh-TW/docs/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件 /zh-TW/docs/JavaScript/Reference /zh-TW/docs/Web/JavaScript/Reference /zh-TW/docs/JavaScript/Reference/Global_Objects /zh-TW/docs/Web/JavaScript/Reference/Global_Objects /zh-TW/docs/JavaScript/Reference/Global_Objects/Function /zh-TW/docs/Web/JavaScript/Reference/Global_Objects/Function @@ -420,7 +427,7 @@ /zh-TW/docs/JavaScript_typed_arrays/ArrayBuffer /zh-TW/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer /zh-TW/docs/JavaScript_技術簡介 /zh-TW/docs/Web/JavaScript/JavaScript_technologies_overview /zh-TW/docs/JavaScript_正規表達式 /zh-TW/docs/Web/JavaScript/Guide/Regular_Expressions -/zh-TW/docs/JavaScript_物件導向介紹 /zh-TW/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript +/zh-TW/docs/JavaScript_物件導向介紹 /zh-TW/docs/conflicting/Learn/JavaScript/Objects /zh-TW/docs/JavaScript_語言的資源 /zh-TW/docs/Web/JavaScript/Language_Resources /zh-TW/docs/Learn/CSS/CSS_轉場 /zh-TW/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions /zh-TW/docs/Learn/CSS/Consistent_List_Indentation /zh-TW/docs/Web/CSS/CSS_Lists_and_Counters/Consistent_list_indentation @@ -442,7 +449,13 @@ /zh-TW/docs/Learn/CSS/Using_the_:target_selector /zh-TW/docs/Web/CSS/CSS_Selectors/Using_the_:target_pseudo-class_in_selectors /zh-TW/docs/Learn/CSS/文字樣式 /zh-TW/docs/Learn/CSS/Styling_text /zh-TW/docs/Learn/CSS/樣式化容器 /en-US/docs/Learn/CSS/Building_blocks +/zh-TW/docs/Learn/HTML/Forms /zh-TW/docs/Learn/Forms +/zh-TW/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form /zh-TW/docs/Learn/Forms/How_to_structure_a_web_form /zh-TW/docs/Learn/HTML/HTML介紹 /zh-TW/docs/Learn/HTML/Introduction_to_HTML +/zh-TW/docs/Learn/HTML/Multimedia_and_embedding/HTML中的圖片 /zh-TW/docs/Learn/HTML/Multimedia_and_embedding/Images_in_HTML +/zh-TW/docs/Learn/HTML/Multimedia_and_embedding/其他_嵌入_技術 /zh-TW/docs/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies +/zh-TW/docs/Learn/HTML/Tables/基礎 /zh-TW/docs/Learn/HTML/Tables/Basics +/zh-TW/docs/Learn/How_to_contribute /zh-TW/docs/orphaned/Learn/How_to_contribute /zh-TW/docs/Learn/JavaScript/Building_blocks/函數 /zh-TW/docs/Learn/JavaScript/Building_blocks/Functions /zh-TW/docs/Learn/JavaScript/Building_blocks/回傳值 /zh-TW/docs/Learn/JavaScript/Building_blocks/Return_values /zh-TW/docs/Learn/JavaScript/Building_blocks/建立自己的功能函數 /zh-TW/docs/Learn/JavaScript/Building_blocks/Build_your_own_function @@ -457,21 +470,34 @@ /zh-TW/docs/Learn/JavaScript/First_steps/陣列 /zh-TW/docs/Learn/JavaScript/First_steps/Arrays /zh-TW/docs/Learn/JavaScript/如何運用 /zh-TW/docs/Learn/JavaScript/Howto /zh-TW/docs/Learn/JavaScript/第一步 /zh-TW/docs/Learn/JavaScript/First_steps +/zh-TW/docs/Learn/Performance/多媒體 /zh-TW/docs/Learn/Performance/Multimedia +/zh-TW/docs/Learn/Server-side/First_steps/介紹 /zh-TW/docs/Learn/Server-side/First_steps/Introduction +/zh-TW/docs/MDN/Community /zh-TW/docs/orphaned/MDN/Community +/zh-TW/docs/MDN/Community/論壇 /zh-TW/docs/orphaned/MDN/Community/Conversations /zh-TW/docs/MDN/Contribute/Content /zh-TW/docs/MDN/Guidelines /zh-TW/docs/MDN/Contribute/Content/Style_guide /zh-TW/docs/MDN/Guidelines/Writing_style_guide /zh-TW/docs/MDN/Contribute/Creating_and_editing_pages /zh-TW/docs/MDN/Contribute/Howto/Create_and_edit_pages -/zh-TW/docs/MDN/Contribute/Editor /zh-TW/docs/MDN/Editor -/zh-TW/docs/MDN/Contribute/Editor/Basics /zh-TW/docs/MDN/Editor/Basics -/zh-TW/docs/MDN/Contribute/Editor/Edit_box /zh-TW/docs/MDN/Editor/Edit_box +/zh-TW/docs/MDN/Contribute/Editor /zh-TW/docs/orphaned/MDN/Editor +/zh-TW/docs/MDN/Contribute/Editor/Basics /zh-TW/docs/orphaned/MDN/Editor/Basics +/zh-TW/docs/MDN/Contribute/Editor/Edit_box /zh-TW/docs/orphaned/MDN/Editor/Keyboard_shortcuts /zh-TW/docs/MDN/Contribute/Guidelines /zh-TW/docs/MDN/Guidelines /zh-TW/docs/MDN/Contribute/Guidelines/Style_guide /zh-TW/docs/MDN/Guidelines/Writing_style_guide /zh-TW/docs/MDN/Contribute/Guidelines/Writing_style_guide /zh-TW/docs/MDN/Guidelines/Writing_style_guide -/zh-TW/docs/MDN/Contribute/Howto/編輯審查 /zh-TW/docs/MDN/Contribute/Howto/Do_an_editorial_review +/zh-TW/docs/MDN/Contribute/Howto/Create_an_MDN_account /zh-TW/docs/orphaned/MDN/Contribute/Howto/Create_an_MDN_account +/zh-TW/docs/MDN/Contribute/Howto/Do_a_technical_review /zh-TW/docs/orphaned/MDN/Contribute/Howto/Do_a_technical_review +/zh-TW/docs/MDN/Contribute/Howto/Do_an_editorial_review /zh-TW/docs/orphaned/MDN/Contribute/Howto/Do_an_editorial_review +/zh-TW/docs/MDN/Contribute/Howto/Set_the_summary_for_a_page /zh-TW/docs/orphaned/MDN/Contribute/Howto/Set_the_summary_for_a_page +/zh-TW/docs/MDN/Contribute/Howto/編輯審查 /zh-TW/docs/orphaned/MDN/Contribute/Howto/Do_an_editorial_review /zh-TW/docs/MDN/Contribute/Tools /zh-TW/docs/MDN/Tools /zh-TW/docs/MDN/Contribute/Tools/KumaScript /zh-TW/docs/MDN/Tools/KumaScript /zh-TW/docs/MDN/Contribute/Tools/KumaScript/Troubleshooting /zh-TW/docs/MDN/Tools/KumaScript/Troubleshooting +/zh-TW/docs/MDN/Editor /zh-TW/docs/orphaned/MDN/Editor +/zh-TW/docs/MDN/Editor/Basics /zh-TW/docs/orphaned/MDN/Editor/Basics +/zh-TW/docs/MDN/Editor/Edit_box /zh-TW/docs/orphaned/MDN/Editor/Keyboard_shortcuts /zh-TW/docs/MDN/Getting_started /zh-TW/docs/MDN/Contribute/Getting_started +/zh-TW/docs/MDN/Kuma /zh-TW/docs/MDN/Yari /zh-TW/docs/MDN/Kuma/Troubleshooting_KumaScript_errors /zh-TW/docs/MDN/Tools/KumaScript/Troubleshooting +/zh-TW/docs/MDN_at_ten /zh-TW/docs/MDN/At_ten /zh-TW/docs/Mozilla/Add-ons/WebExtensions/Porting_from_Google_Chrome https://extensionworkshop.com/documentation/develop/porting-a-google-chrome-extension/ /zh-TW/docs/Mozilla/Add-ons/WebExtensions/manifest.json/applications /zh-TW/docs/Mozilla/Add-ons/WebExtensions/manifest.json/browser_specific_settings /zh-TW/docs/Mozilla/Add-ons/WebExtensions/manifest.json/作者 /zh-TW/docs/Mozilla/Add-ons/WebExtensions/manifest.json/author @@ -489,29 +515,34 @@ /zh-TW/docs/Mozilla/Firefox/Releases/2/Firefox_2_的安全功能 /zh-TW/docs/Mozilla/Firefox/Releases/2/Security_changes /zh-TW/docs/Mozilla/Firefox/Releases/2/新增消息來源閱讀工具 /zh-TW/docs/Mozilla/Firefox/Releases/2/Adding_feed_readers_to_Firefox /zh-TW/docs/Mozilla/Firefox/Releases/3/Firefox_3_Dom_Improvements /zh-TW/docs/Mozilla/Firefox/Releases/3/DOM_improvements +/zh-TW/docs/Mozilla/Firefox/Releases/4/Firefox_4_開發者新功能概覽 /zh-TW/docs/orphaned/Mozilla/Firefox/Releases/4/Firefox_4_開發者新功能概覽 /zh-TW/docs/Mozilla_event_reference /zh-TW/docs/Web/Events -/zh-TW/docs/Mozilla_event_reference/DOMContentLoaded_(event) /zh-TW/docs/Web/Events/DOMContentLoaded +/zh-TW/docs/Mozilla_event_reference/DOMContentLoaded_(event) /zh-TW/docs/Web/API/Window/DOMContentLoaded_event /zh-TW/docs/Offline_resources_on_Firefox /zh-TW/docs/Web/HTML/Using_the_application_cache /zh-TW/docs/Prism:主視窗 /zh-TW/docs/Prism/主視窗 /zh-TW/docs/Prism:安裝程式 /zh-TW/docs/Prism/安裝程式 +/zh-TW/docs/Python /zh-TW/docs/conflicting/Learn/Server-side/Django /zh-TW/docs/Quirks_Mode_and_Standards_Mode /zh-TW/docs/Web/HTML/Quirks_Mode_and_Standards_Mode /zh-TW/docs/SVG /zh-TW/docs/Web/SVG /zh-TW/docs/SVG/Tutorial /zh-TW/docs/Web/SVG/Tutorial +/zh-TW/docs/SVG/Tutorial/Basic_Shapes /zh-TW/docs/Web/SVG/Tutorial/Basic_Shapes /zh-TW/docs/SVG/Tutorial/Introduction /zh-TW/docs/Web/SVG/Tutorial/Introduction /zh-TW/docs/SVG/Tutorial/Positions /zh-TW/docs/Web/SVG/Tutorial/Positions /zh-TW/docs/SVG/Tutorial/入门 /zh-TW/docs/Web/SVG/Tutorial/Getting_Started /zh-TW/docs/SVG/Tutorial/图案 /zh-TW/docs/Web/SVG/Tutorial/Patterns -/zh-TW/docs/SVG/Tutorial/基本形状 /zh-TW/docs/SVG/Tutorial/Basic_Shapes +/zh-TW/docs/SVG/Tutorial/基本形状 /zh-TW/docs/Web/SVG/Tutorial/Basic_Shapes /zh-TW/docs/SVG/Tutorial/填充与边框 /zh-TW/docs/Web/SVG/Tutorial/Fills_and_Strokes /zh-TW/docs/SVG/Tutorial/渐变 /zh-TW/docs/Web/SVG/Tutorial/Gradients -/zh-TW/docs/SVG/Tutorial/路径 /zh-TW/docs/Web/SVG/Tutorial/路径 -/zh-TW/docs/SVG/教學 /zh-TW/docs/Web/SVG/教學 +/zh-TW/docs/SVG/Tutorial/路径 /zh-TW/docs/Web/SVG/Tutorial/Paths +/zh-TW/docs/SVG/教學 /zh-TW/docs/orphaned/Web/SVG/教學 /zh-TW/docs/Security/MixedContent /zh-TW/docs/Web/Security/Mixed_content /zh-TW/docs/Security/MixedContent/How_to_fix_website_with_mixed_content /zh-TW/docs/Web/Security/Mixed_content/How_to_fix_website_with_mixed_content /zh-TW/docs/Security/弱簽章演算法 /zh-TW/docs/Web/Security/Weak_Signature_Algorithm /zh-TW/docs/Security/缺少安全性的密碼 /zh-TW/docs/Web/Security/Insecure_passwords +/zh-TW/docs/Tools/Web_Console/Opening_the_Web_Console /zh-TW/docs/Tools/Web_Console/UI_Tour /zh-TW/docs/Using_files_from_web_applications /zh-TW/docs/Web/API/File/Using_files_from_web_applications -/zh-TW/docs/Using_geolocation /zh-TW/docs/Web/API/Geolocation/Using_geolocation +/zh-TW/docs/Using_geolocation /zh-TW/docs/Web/API/Geolocation_API +/zh-TW/docs/Web/API/Canvas_API/Drawing_graphics_with_canvas /zh-TW/docs/conflicting/Web/API/Canvas_API/Tutorial /zh-TW/docs/Web/API/Canvas_API/Tutorial/基礎動畫 /zh-TW/docs/Web/API/Canvas_API/Tutorial/Basic_animations /zh-TW/docs/Web/API/Canvas_API/Tutorial/最佳化_canvas /zh-TW/docs/Web/API/Canvas_API/Tutorial/Optimizing_canvas /zh-TW/docs/Web/API/Coordinates /zh-TW/docs/Web/API/GeolocationCoordinates @@ -534,6 +565,13 @@ /zh-TW/docs/Web/API/DocumentTemp/readyState /zh-TW/docs/Web/API/Document/readyState /zh-TW/docs/Web/API/DocumentTemp/width /zh-TW/docs/Web/API/Document/width /zh-TW/docs/Web/API/Document_Object_Model/Whitespace_in_the_DOM /zh-TW/docs/Web/API/Document_Object_Model/Whitespace +/zh-TW/docs/Web/API/Document_Object_Model/事件 /zh-TW/docs/Web/API/Document_Object_Model/Events +/zh-TW/docs/Web/API/Event/createEvent /zh-TW/docs/Web/API/Document/createEvent +/zh-TW/docs/Web/API/Geolocation/Using_geolocation /zh-TW/docs/Web/API/Geolocation_API +/zh-TW/docs/Web/API/HTMLElement/dataset /zh-TW/docs/Web/API/HTMLOrForeignElement/dataset +/zh-TW/docs/Web/API/HTMLElement/style /zh-TW/docs/Web/API/ElementCSSInlineStyle/style +/zh-TW/docs/Web/API/Node/innerText /zh-TW/docs/Web/API/HTMLElement/innerText +/zh-TW/docs/Web/API/Performance.timing /zh-TW/docs/Web/API/Performance/timing /zh-TW/docs/Web/API/Position /zh-TW/docs/Web/API/GeolocationPosition /zh-TW/docs/Web/API/Position/coords /zh-TW/docs/Web/API/GeolocationPosition/coords /zh-TW/docs/Web/API/Position/timestamp /zh-TW/docs/Web/API/GeolocationPosition/timestamp @@ -541,23 +579,41 @@ /zh-TW/docs/Web/API/PositionError/code /zh-TW/docs/Web/API/GeolocationPositionError/code /zh-TW/docs/Web/API/PositionError/message /zh-TW/docs/Web/API/GeolocationPositionError/message /zh-TW/docs/Web/API/WebGL_API/Tutorial/WebGL入門 /zh-TW/docs/Web/API/WebGL_API/Tutorial/Getting_started_with_WebGL +/zh-TW/docs/Web/API/Web_Video_Text_Tracks_Format /zh-TW/docs/Web/API/WebVTT_API +/zh-TW/docs/Web/API/Window.history /zh-TW/docs/Web/API/Window/history +/zh-TW/docs/Web/API/Window.onpopstate /zh-TW/docs/Web/API/WindowEventHandlers/onpopstate +/zh-TW/docs/Web/API/Window.requestAnimationFrame /zh-TW/docs/Web/API/window/requestAnimationFrame +/zh-TW/docs/Web/API/Window/sidebar/Adding_search_engines_from_Web_pages /zh-TW/docs/conflicting/Web/OpenSearch +/zh-TW/docs/Web/API/WindowBase64 /zh-TW/docs/conflicting/Web/API/WindowOrWorkerGlobalScope +/zh-TW/docs/Web/API/WindowTimers /zh-TW/docs/conflicting/Web/API/WindowOrWorkerGlobalScope_e2691f7ad05781a30c5fc5bb3b3f633a /zh-TW/docs/Web/API/XMLHttpRequest/FormData /zh-TW/docs/Web/API/FormData +/zh-TW/docs/Web/API/document.createTreeWalker /zh-TW/docs/Web/API/Document/createTreeWalker /zh-TW/docs/Web/API/document.querySelector /zh-TW/docs/Web/API/Document/querySelector /zh-TW/docs/Web/Apps/Progressive /zh-TW/docs/Web/Progressive_web_apps -/zh-TW/docs/Web/CSS/-moz-border-image /zh-TW/docs/Web/CSS/border-image/border-image +/zh-TW/docs/Web/CSS/-moz-border-image /zh-TW/docs/orphaned/Web/CSS/border-image/border-image +/zh-TW/docs/Web/CSS/@viewport/height /zh-TW/docs/conflicting/Web/CSS/@viewport +/zh-TW/docs/Web/CSS/CSS_Background_and_Borders /zh-TW/docs/Web/CSS/CSS_Backgrounds_and_Borders +/zh-TW/docs/Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds /zh-TW/docs/Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds /zh-TW/docs/Web/CSS/CSS_Box_Model/理解邊界重疊的原因 /zh-TW/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing -/zh-TW/docs/Web/CSS/CSS_一般問題 /zh-TW/docs/Web/CSS/Common_CSS_Questions +/zh-TW/docs/Web/CSS/CSS_Colors /zh-TW/docs/Web/CSS/CSS_Color +/zh-TW/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes /zh-TW/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox +/zh-TW/docs/Web/CSS/CSS_一般問題 /zh-TW/docs/Learn/CSS/Howto/CSS_FAQ /zh-TW/docs/Web/CSS/CSS_網格_布局 /zh-TW/docs/Web/CSS/CSS_Grid_Layout +/zh-TW/docs/Web/CSS/Common_CSS_Questions /zh-TW/docs/Learn/CSS/Howto/CSS_FAQ /zh-TW/docs/Web/CSS/Descendant_selectors /zh-TW/docs/Web/CSS/Descendant_combinator /zh-TW/docs/Web/CSS/attr /zh-TW/docs/Web/CSS/attr() +/zh-TW/docs/Web/CSS/border-image/border-image /zh-TW/docs/orphaned/Web/CSS/border-image/border-image /zh-TW/docs/Web/CSS/radial-gradient /zh-TW/docs/Web/CSS/radial-gradient() /zh-TW/docs/Web/CSS/transform-function/translate3d /zh-TW/docs/Web/CSS/transform-function/translate3d() /zh-TW/docs/Web/CSS/參考 /zh-TW/docs/Web/CSS/Reference /zh-TW/docs/Web/CSS/彈頭 /zh-TW/docs/Web/CSS/box-sizing /zh-TW/docs/Web/CSS/繼承 /zh-TW/docs/Web/CSS/inheritance /zh-TW/docs/Web/CSS/語法 /zh-TW/docs/Web/CSS/Syntax +/zh-TW/docs/Web/Events/DOMContentLoaded /zh-TW/docs/Web/API/Window/DOMContentLoaded_event +/zh-TW/docs/Web/Events/abort /zh-TW/docs/Web/API/HTMLMediaElement/abort_event /zh-TW/docs/Web/Events/click /zh-TW/docs/Web/API/Element/click_event /zh-TW/docs/Web/Events/keyup /zh-TW/docs/Web/API/Document/keyup_event +/zh-TW/docs/Web/Events/load /zh-TW/docs/Web/API/Window/load_event /zh-TW/docs/Web/Events/orientationchange /zh-TW/docs/Web/API/Window/orientationchange_event /zh-TW/docs/Web/Events/ratechange /zh-TW/docs/Web/API/HTMLMediaElement/ratechange_event /zh-TW/docs/Web/Events/scroll /zh-TW/docs/Web/API/Document/scroll_event @@ -577,7 +633,8 @@ /zh-TW/docs/Web/Guide/CSS/Understanding_z_index /zh-TW/docs/Web/CSS/CSS_Positioning/Understanding_z_index /zh-TW/docs/Web/Guide/CSS/Understanding_z_index/Stacking_context_example_1 /zh-TW/docs/Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_1 /zh-TW/docs/Web/Guide/CSS/Using_the_:target_selector /zh-TW/docs/Web/CSS/CSS_Selectors/Using_the_:target_pseudo-class_in_selectors -/zh-TW/docs/Web/Guide/CSS/使用_多重_背景 /zh-TW/docs/Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds +/zh-TW/docs/Web/Guide/CSS/使用_多重_背景 /zh-TW/docs/Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds +/zh-TW/docs/Web/Guide/DOM /zh-TW/docs/conflicting/Web/API/Document_Object_Model /zh-TW/docs/Web/Guide/DOM/Manipulating_the_browser_history /zh-TW/docs/Web/API/History_API /zh-TW/docs/Web/Guide/DOM/Using_full_screen_mode /zh-TW/docs/Web/API/Fullscreen_API /zh-TW/docs/Web/Guide/HTML /zh-TW/docs/Learn/HTML @@ -592,23 +649,29 @@ /zh-TW/docs/Web/Guide/HTML/Canvas_tutorial/最佳化_canvas /zh-TW/docs/Web/API/Canvas_API/Tutorial/Optimizing_canvas /zh-TW/docs/Web/Guide/HTML/Drag_and_drop /zh-TW/docs/Web/API/HTML_Drag_and_Drop_API /zh-TW/docs/Web/Guide/HTML/Drag_operations /zh-TW/docs/Web/API/HTML_Drag_and_Drop_API/Drag_operations -/zh-TW/docs/Web/Guide/HTML/Forms /zh-TW/docs/Learn/HTML/Forms -/zh-TW/docs/Web/Guide/HTML/Forms/How_to_structure_an_HTML_form /zh-TW/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form +/zh-TW/docs/Web/Guide/HTML/Event_attributes /zh-TW/docs/Learn/JavaScript/Building_blocks/Events +/zh-TW/docs/Web/Guide/HTML/Forms /zh-TW/docs/Learn/Forms +/zh-TW/docs/Web/Guide/HTML/Forms/How_to_structure_an_HTML_form /zh-TW/docs/Learn/Forms/How_to_structure_a_web_form /zh-TW/docs/Web/Guide/Performance/Using_web_workers /zh-TW/docs/Web/API/Web_Workers_API/Using_web_workers /zh-TW/docs/Web/Guide/圖像 /zh-TW/docs/Web/Guide/Graphics /zh-TW/docs/Web/HTML/Canvas /zh-TW/docs/Web/API/Canvas_API -/zh-TW/docs/Web/HTML/Canvas/Drawing_graphics_with_canvas /zh-TW/docs/Web/API/Canvas_API/Drawing_graphics_with_canvas +/zh-TW/docs/Web/HTML/Canvas/Drawing_graphics_with_canvas /zh-TW/docs/conflicting/Web/API/Canvas_API/Tutorial /zh-TW/docs/Web/HTML/Element/HTML_元素 /zh-TW/docs/Web/HTML/Element /zh-TW/docs/Web/HTML/Element/導航欄 /zh-TW/docs/Web/HTML/Element/nav +/zh-TW/docs/Web/HTML/Forms_in_HTML /zh-TW/docs/orphaned/Learn/HTML/Forms/HTML5_updates /zh-TW/docs/Web/HTML/HTML5 /zh-TW/docs/Web/Guide/HTML/HTML5 /zh-TW/docs/Web/HTML/HTML5/Introduction_to_HTML5 /zh-TW/docs/Web/Guide/HTML/HTML5/Introduction_to_HTML5 -/zh-TW/docs/Web/HTML/HTML5_表單 /zh-TW/docs/Learn/HTML/Forms +/zh-TW/docs/Web/HTML/HTML5_表單 /zh-TW/docs/Learn/Forms /zh-TW/docs/Web/HTML/Introduction /zh-CN/docs/learn/HTML/Introduction_to_HTML /zh-TW/docs/Web/HTML/Offline_resources_on_Firefox /zh-TW/docs/Web/HTML/Using_the_application_cache +/zh-TW/docs/Web/HTML/Supported_media_formats /zh-TW/docs/conflicting/Web/Media/Formats /zh-TW/docs/Web/HTML/區塊級元素 /zh-TW/docs/Web/HTML/Block-level_elements /zh-TW/docs/Web/HTTP/Access_control_CORS /zh-TW/docs/Web/HTTP/CORS /zh-TW/docs/Web/HTTP/Response_codes /zh-TW/docs/Web/HTTP/Status +/zh-TW/docs/Web/HTTP/Server-Side_Access_Control /zh-TW/docs/conflicting/Web/HTTP/CORS +/zh-TW/docs/Web/HTTP/Status/418_I_m_a_teapot /zh-TW/docs/Web/HTTP/Status/418 /zh-TW/docs/Web/HTTP/X-Frame-Options /zh-TW/docs/Web/HTTP/Headers/X-Frame-Options +/zh-TW/docs/Web/HTTP/data_URIs /zh-TW/docs/Web/HTTP/Basics_of_HTTP/Data_URIs /zh-TW/docs/Web/JavaScript/Guide/JavaScript_Overview /zh-TW/docs/Web/JavaScript/Guide/Introduction /zh-TW/docs/Web/JavaScript/Guide/JavaScript_概觀 /zh-TW/docs/Web/JavaScript/Guide/Introduction /zh-TW/docs/Web/JavaScript/Guide/JavaScript_概觀（JavaScript_Overview） /zh-TW/docs/Web/JavaScript/Guide/Introduction @@ -624,9 +687,10 @@ /zh-TW/docs/Web/JavaScript/Guide_old/Keyed_collections /zh-TW/docs/Web/JavaScript/Guide/Keyed_collections /zh-TW/docs/Web/JavaScript/Guide_old/Regular_Expressions /zh-TW/docs/Web/JavaScript/Guide/Regular_Expressions /zh-TW/docs/Web/JavaScript/Guide_old/Working_with_Objects /zh-TW/docs/Web/JavaScript/Guide/Working_with_Objects +/zh-TW/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript /zh-TW/docs/conflicting/Learn/JavaScript/Objects /zh-TW/docs/Web/JavaScript/JavaScript_typed_arrays /zh-TW/docs/Web/JavaScript/Typed_arrays /zh-TW/docs/Web/JavaScript/JavaScript_typed_arrays/ArrayBuffer /zh-TW/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer -/zh-TW/docs/Web/JavaScript/JavaScript_typed_arrays/ArrayBuffer/prototype /zh-TW/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype +/zh-TW/docs/Web/JavaScript/JavaScript_typed_arrays/ArrayBuffer/prototype /zh-TW/docs/conflicting/Web/JavaScript/Reference/Global_Objects/ArrayBuffer /zh-TW/docs/Web/JavaScript/New_in_JavaScript/JavaScript_1.6_新鮮事 /zh-TW/docs/Web/JavaScript/New_in_JavaScript/1.6 /zh-TW/docs/Web/JavaScript/New_in_JavaScript/JavaScript_1.7_新鮮事 /zh-TW/docs/Web/JavaScript/New_in_JavaScript/1.7 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Control_flow_and_error_handling /zh-TW/docs/Web/JavaScript/Guide/Control_flow_and_error_handling @@ -635,52 +699,164 @@ /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Loops_and_iteration /zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages /zh-TW/docs/Web/JavaScript/Guide /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages /zh-TW/docs/Web/JavaScript/Guide +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/Unicode /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/arguments_物件的使用 /zh-TW/docs/Web/JavaScript/Reference/Functions/arguments -/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊文法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊語法 -/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件/物件初始化子的使用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 -/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件文法 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件語法 -/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式模式的編寫 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 -/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的建立 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 -/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用 -/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用/使用標誌的進階搜尋 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 -/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用/括弧子字串的比對結果的運用 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 -/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用/正則表達式的範例 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 -/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正則表達式的範例 /zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/以類別為基礎的語言_vs._以原型為基礎的語言 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/值 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_5c6f30ff8e011c45a011b9c8f3b5bcea +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_937645e235e25783cc4e9b0d7a1f6d76 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/實體關係的確定 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_3193ca1e5a7bdb78e9d9418a947916aa +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/局域值和繼承值 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_483bbc3a620ead7b721647d1a2cb216f +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/建構子中的全域資訊 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_8898a6dd437cc51f48b4e8cade0385ac +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/沒有多重繼承 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_60d6c39d4282c67c117db9fdaf83be08 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的呼叫 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊文法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊語法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/字面表達 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_d57082c2207b466127d8dc34a980addf +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/常數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_e5a53691c318855e3342ad91feb78f2e +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件/物件初始化子的使用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_a2d11ceeaeb3cb8c43292be7771f9b23 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件文法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件語法 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式模式的編寫 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用/使用標誌的進階搜尋 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_38b32725e0e3217a5542b1b4ee122407 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用/括弧子字串的比對結果的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_24eb6498b86da57e7fb5337fd8fa04a6 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正則表達式的運用/正則表達式的範例 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_38b32725e0e3217a5542b1b4ee122407 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Regular_Expressions_24eb6498b86da57e7fb5337fd8fa04a6 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正則表達式的範例 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件和屬性 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Working_with_Objects +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/更靈活的建構子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_b021bd32308e4c421518cdd7104ac7bc +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/表達式 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/註解 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_74154e098f4b1e7026df3945ceb0fa4a +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/變數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Grammar_and_types_ef6fc79abc28f5eadd6c126341df5e49 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_e6fc14473511cf01e7062dfb7751f49d +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/代入運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_e70c1f2655520c542321ddbdb2c4f28d +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/位元運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_11969cb29fead65c26360f554426c217 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/字串運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_eb65eb8f4e6b3c16f08b95149183cfb8 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/特殊運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_952d66f1fe521bc0574c89750f5b406e +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/算術運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_05717c12b1ecaebc9d68cf43524d31b1 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/邏輯運算子 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Expressions_and_Operators_351a6d9e4d31b32eff9762ef5deead93 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/陣列的運用 /zh-TW/docs/conflicting/Web/JavaScript/Guide +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_587eb671a310bac0771e73a91b0abe6d +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/Number_和_String_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_536f6bf46bbdf38cc1a0b28ca1bc41b9 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/escape_和_unescape_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_ceaa4b2a55bb67388c2728af1ff890f5 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/eval_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_effb9b1bcc102a5f6df7f1785ce89033 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isFinite_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_b2cd05cbfe188215dc2e3f972d293ed6 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isNaN_函數 /zh-TW/docs/conflicting/Web/JavaScript/Guide/Functions_925b2d10050621507a9c990cb803dcca +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件 /zh-TW/docs/conflicting/Web/JavaScript/Guide_dc05b578fe0c2f7d9a89ed82daab4e65 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件 +/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件 /zh-TW/docs/orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件 +/zh-TW/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype /zh-TW/docs/conflicting/Web/JavaScript/Reference/Global_Objects/ArrayBuffer +/zh-TW/docs/Web/JavaScript/Reference/Global_Objects/Date/prototype /zh-TW/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Date +/zh-TW/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype /zh-TW/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Function +/zh-TW/docs/Web/JavaScript/Reference/Global_Objects/Number/prototype /zh-TW/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Number +/zh-TW/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype /zh-TW/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Object +/zh-TW/docs/Web/JavaScript/Reference/Global_Objects/Promise/prototype /zh-TW/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Promise +/zh-TW/docs/Web/JavaScript/Reference/Global_Objects/String/prototype /zh-TW/docs/conflicting/Web/JavaScript/Reference/Global_Objects/String +/zh-TW/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators /zh-TW/docs/conflicting/Web/JavaScript/Reference/Operators +/zh-TW/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators /zh-TW/docs/conflicting/Web/JavaScript/Reference/Operators_7c8eb9475d97a4a734c5991857698560 +/zh-TW/docs/Web/JavaScript/Reference/Operators/Comparison_Operators /zh-TW/docs/conflicting/Web/JavaScript/Reference/Operators_310dc67549939233c3d18a8fa2cdbb23 +/zh-TW/docs/Web/JavaScript/Reference/Operators/Logical_Operators /zh-TW/docs/conflicting/Web/JavaScript/Reference/Operators_f71733c8e7001a29c3ec40d8522a4aca /zh-TW/docs/Web/JavaScript/Same_origin_policy_for_JavaScript /zh-TW/docs/Web/Security/Same-origin_policy /zh-TW/docs/Web/JavaScript/Typed_arrays/ArrayBuffer /zh-TW/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer -/zh-TW/docs/Web/JavaScript/Typed_arrays/ArrayBuffer/prototype /zh-TW/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype +/zh-TW/docs/Web/JavaScript/Typed_arrays/ArrayBuffer/prototype /zh-TW/docs/conflicting/Web/JavaScript/Reference/Global_Objects/ArrayBuffer /zh-TW/docs/Web/JavaScript/資料結構 /zh-TW/docs/Web/JavaScript/Data_structures /zh-TW/docs/Web/JavaScript/重新介紹_JavaScript /zh-TW/docs/Web/JavaScript/A_re-introduction_to_JavaScript /zh-TW/docs/Web/Reference/Events /zh-TW/docs/Web/Events -/zh-TW/docs/Web/Reference/Events/DOMContentLoaded /zh-TW/docs/Web/Events/DOMContentLoaded -/zh-TW/docs/Web/Reference/Events/DOMContentLoaded_(event) /zh-TW/docs/Web/Events/DOMContentLoaded +/zh-TW/docs/Web/Reference/Events/DOMContentLoaded /zh-TW/docs/Web/API/Window/DOMContentLoaded_event +/zh-TW/docs/Web/Reference/Events/DOMContentLoaded_(event) /zh-TW/docs/Web/API/Window/DOMContentLoaded_event /zh-TW/docs/Web/Reference/Events/click /zh-TW/docs/Web/API/Element/click_event /zh-TW/docs/Web/Reference/Events/submit /zh-TW/docs/Web/API/HTMLFormElement/submit_event /zh-TW/docs/Web/Reference/Events/touchcancel /zh-TW/docs/Web/API/Element/touchcancel_event /zh-TW/docs/Web/SVG/Tutorial/入门 /zh-TW/docs/Web/SVG/Tutorial/Getting_Started /zh-TW/docs/Web/SVG/Tutorial/图案 /zh-TW/docs/Web/SVG/Tutorial/Patterns -/zh-TW/docs/Web/SVG/Tutorial/基本形状 /zh-TW/docs/SVG/Tutorial/Basic_Shapes +/zh-TW/docs/Web/SVG/Tutorial/基本形状 /zh-TW/docs/Web/SVG/Tutorial/Basic_Shapes /zh-TW/docs/Web/SVG/Tutorial/填充与边框 /zh-TW/docs/Web/SVG/Tutorial/Fills_and_Strokes /zh-TW/docs/Web/SVG/Tutorial/渐变 /zh-TW/docs/Web/SVG/Tutorial/Gradients +/zh-TW/docs/Web/SVG/Tutorial/路径 /zh-TW/docs/Web/SVG/Tutorial/Paths +/zh-TW/docs/Web/SVG/教學 /zh-TW/docs/orphaned/Web/SVG/教學 /zh-TW/docs/Web/WebGL /zh-TW/docs/Web/API/WebGL_API +/zh-TW/docs/Web/性能 /zh-TW/docs/Web/Performance +/zh-TW/docs/WebAPI /zh-TW/docs/conflicting/Web/API /zh-TW/docs/WebAPI/Battery_Status /zh-TW/docs/Web/API/Battery_Status_API /zh-TW/docs/WebAPI/Detecting_device_orientation /zh-TW/docs/Web/API/Detecting_device_orientation /zh-TW/docs/WebAPI/FileHandle /zh-TW/docs/Web/API/File_Handle_API /zh-TW/docs/WebAPI/Managing_screen_orientation /zh-TW/docs/Web/API/CSS_Object_Model/Managing_screen_orientation /zh-TW/docs/WebAPI/Network_Information /zh-TW/docs/Web/API/Network_Information_API +/zh-TW/docs/WebAPI/Permissions /zh-TW/docs/Web/API/Permissions_API /zh-TW/docs/WebAPI/Pointer_Lock /zh-TW/docs/Web/API/Pointer_Lock_API /zh-TW/docs/WebAPI/Proximity /zh-TW/docs/Web/API/Proximity_Events /zh-TW/docs/WebAPI/Using_Light_Events /zh-TW/docs/Web/API/Ambient_Light_Events /zh-TW/docs/WebAPI/Using_Web_Notifications /zh-TW/docs/Web/API/Notifications_API/Using_the_Notifications_API /zh-TW/docs/WebAPI/Vibration /zh-TW/docs/Web/API/Vibration_API +/zh-TW/docs/WebSockets /zh-TW/docs/Web/API/WebSockets_API +/zh-TW/docs/WebSockets/WebSockets_reference /zh-TW/docs/conflicting/Web/API/WebSockets_API +/zh-TW/docs/WebSockets/WebSockets_reference/CloseEvent /zh-TW/docs/Web/API/CloseEvent +/zh-TW/docs/WebSockets/WebSockets_reference/MessageEvent /zh-TW/docs/Web/API/MessageEvent +/zh-TW/docs/WebSockets/WebSockets_reference/WebSocket /zh-TW/docs/Web/API/WebSocket +/zh-TW/docs/WebSockets/Writing_WebSocket_client_applications /zh-TW/docs/Web/API/WebSockets_API/Writing_WebSocket_client_applications /zh-TW/docs/Web_Audio_API /zh-TW/docs/Web/API/Web_Audio_API +/zh-TW/docs/Web_development /zh-TW/docs/conflicting/Web/Guide /zh-TW/docs/Web_development/Writing_forward-compatible_websites /zh-TW/docs/Web/Guide/Writing_forward-compatible_websites +/zh-TW/docs/Web_開發 /zh-TW/docs/conflicting/Web/Guide_6b4b72e1fc91461bde34734ce07b1c08 +/zh-TW/docs/Web_開發/Historical_artifacts_to_avoid /zh-TW/docs/conflicting/Learn/HTML/Introduction_to_HTML /zh-TW/docs/Web_開發/Web開發入門 /zh-TW/docs/Web/Guide/Introduction_to_Web_development +/zh-TW/docs/XHTML /zh-TW/docs/Glossary/XHTML +/zh-TW/docs/XPCNativeWrapper /zh-TW/docs/orphaned/XPCNativeWrapper /zh-TW/docs/en /en-US/ +/zh-TW/docs/zh-tw /zh-TW/docs/orphaned/zh-tw +/zh-TW/docs/參與_Mozilla_專案 /zh-TW/docs/orphaned/參與_Mozilla_專案 +/zh-TW/docs/建立擴充套件 /zh-TW/docs/orphaned/建立擴充套件 /zh-TW/docs/控制_HTML_表單中的拼字檢查功能 /zh-TW/docs/Web/HTML/Global_attributes/spellcheck /zh-TW/docs/新增消息來源閱讀工具 /zh-TW/docs/Mozilla/Firefox/Releases/2/Adding_feed_readers_to_Firefox /zh-TW/docs/本地化 /zh-TW/docs/Glossary/Localization -/zh-TW/docs/自網頁添加搜尋引擎 /zh-TW/docs/Web/API/Window/sidebar/Adding_search_engines_from_Web_pages +/zh-TW/docs/自網頁添加搜尋引擎 /zh-TW/docs/conflicting/Web/OpenSearch /zh-TW/docs/製作_Firefox_佈景主題:UUID /zh-TW/docs/製作_Firefox_佈景主題/UUID /zh-TW/docs/製作_Firefox_佈景主題:contents.rdf /zh-TW/docs/製作_Firefox_佈景主題/contents.rdf /zh-TW/docs/製作_Firefox_佈景主題:install.rdf /zh-TW/docs/製作_Firefox_佈景主題/install.rdf diff --git a/files/zh-tw/_wikihistory.json b/files/zh-tw/_wikihistory.json index 0443383fc4..181a6057cb 100644 --- a/files/zh-tw/_wikihistory.json +++ b/files/zh-tw/_wikihistory.json @@ -1,47 +1,4 @@ { - "Core_JavaScript_1.5_正規表達式的建立": { - "modified": "2019-03-24T00:00:58.216Z", - "contributors": [ - "wbamberg", - "happysadman" - ] - }, - "Cross-site_XMLHttpRequest": { - "modified": "2019-01-16T15:28:10.716Z", - "contributors": [ - "Mgjbot", - "BobChao", - "Coolcd" - ] - }, - "DOM_觀察器": { - "modified": "2019-01-16T13:41:41.852Z", - "contributors": [ - "273K" - ] - }, - "DragDrop": { - "modified": "2019-01-16T13:26:51.358Z", - "contributors": [ - "sailplaneTW" - ] - }, - "Firefox_3.5_技術文件": { - "modified": "2019-03-23T23:59:44.778Z", - "contributors": [ - "irvinfly", - "RJ_Hsiao", - "teoli", - "Littlebtc", - "BobChao" - ] - }, - "Firefox_中的離線資源": { - "modified": "2019-03-24T00:13:31.494Z", - "contributors": [ - "sailplaneTW" - ] - }, "Games": { "modified": "2019-09-09T15:35:53.246Z", "contributors": [ @@ -1087,12 +1044,6 @@ "iigmir" ] }, - "HTML5_Cross_Browser_Polyfills": { - "modified": "2019-01-16T13:58:45.342Z", - "contributors": [ - "Kennyluck" - ] - }, "Learn": { "modified": "2020-08-04T10:38:00.665Z", "contributors": [ @@ -1319,28 +1270,6 @@ "chrisdavidmills" ] }, - "Learn/HTML/Forms": { - "modified": "2020-07-16T22:21:03.096Z", - "contributors": [ - "nighet", - "chrisdavidmills", - "iigmir", - "Shiyou", - "saka6333", - "jcchang", - "sjmiles" - ] - }, - "Learn/HTML/Forms/How_to_structure_an_HTML_form": { - "modified": "2020-07-16T22:21:16.863Z", - "contributors": [ - "iigmir", - "anniesnoopymd", - "chrisdavidmills", - "Sheppy", - "kitty-5420" - ] - }, "Learn/HTML/Howto": { "modified": "2020-07-16T22:22:31.553Z", "contributors": [ @@ -1419,13 +1348,6 @@ "CATITANK" ] }, - "Learn/HTML/Multimedia_and_embedding/HTML中的圖片": { - "modified": "2020-07-20T05:13:25.235Z", - "contributors": [ - "zackjtl", - "LeonchanTW" - ] - }, "Learn/HTML/Multimedia_and_embedding/Video_and_audio_content": { "modified": "2020-09-27T07:40:33.292Z", "contributors": [ @@ -1438,33 +1360,12 @@ "CoderAmutu" ] }, - "Learn/HTML/Multimedia_and_embedding/其他_嵌入_技術": { - "modified": "2020-09-27T08:20:57.717Z", - "contributors": [ - "CoderAmutu" - ] - }, "Learn/HTML/Tables": { "modified": "2020-07-16T22:25:16.897Z", "contributors": [ "iigmir" ] }, - "Learn/HTML/Tables/基礎": { - "modified": "2020-11-25T04:21:37.312Z", - "contributors": [ - "123milkcat", - "allchangechallenge" - ] - }, - "Learn/How_to_contribute": { - "modified": "2020-07-16T22:33:48.192Z", - "contributors": [ - "SphinxKnight", - "willynpi", - "iigmir" - ] - }, "Learn/JavaScript": { "modified": "2020-07-30T05:29:53.810Z", "contributors": [ @@ -1751,12 +1652,6 @@ "estelle" ] }, - "Learn/Performance/多媒體": { - "modified": "2020-07-16T22:40:44.626Z", - "contributors": [ - "b84330808" - ] - }, "Learn/Server-side": { "modified": "2020-07-16T22:36:04.016Z", "contributors": [ @@ -2065,15 +1960,6 @@ "iigmir" ] }, - "Learn/Server-side/First_steps/介紹": { - "modified": "2020-10-29T10:39:42.677Z", - "contributors": [ - "JamesGoler", - "Kun-Neng", - "vivihenry", - "frank030310" - ] - }, "Learn/Tools_and_testing": { "modified": "2020-07-16T22:38:58.702Z", "contributors": [ @@ -2142,23 +2028,6 @@ "abs0986211642" ] }, - "MDN/Community": { - "modified": "2020-05-24T00:35:19.952Z", - "contributors": [ - "nighet", - "wbamberg", - "SecondSpirit", - "ALiangLiang", - "a0983891582", - "king_5266" - ] - }, - "MDN/Community/論壇": { - "modified": "2020-05-24T00:50:25.189Z", - "contributors": [ - "nighet" - ] - }, "MDN/Contribute": { "modified": "2019-01-16T19:25:51.462Z", "contributors": [ @@ -2197,14 +2066,6 @@ "klez" ] }, - "MDN/Contribute/Howto/Create_an_MDN_account": { - "modified": "2019-01-16T21:17:57.540Z", - "contributors": [ - "wbamberg", - "iigmir", - "f19857466" - ] - }, "MDN/Contribute/Howto/Create_and_edit_pages": { "modified": "2019-04-23T05:30:19.186Z", "contributors": [ @@ -2217,31 +2078,6 @@ "coby777" ] }, - "MDN/Contribute/Howto/Do_a_technical_review": { - "modified": "2019-03-23T22:32:06.855Z", - "contributors": [ - "wbamberg", - "iigmir", - "mgrn" - ] - }, - "MDN/Contribute/Howto/Do_an_editorial_review": { - "modified": "2019-08-12T14:08:44.950Z", - "contributors": [ - "ayugioh2003", - "wbamberg", - "jwhitlock", - "flyinglimao" - ] - }, - "MDN/Contribute/Howto/Set_the_summary_for_a_page": { - "modified": "2019-03-23T22:02:13.738Z", - "contributors": [ - "wbamberg", - "Astrid-GitHub", - "RSyehann" - ] - }, "MDN/Contribute/Howto/Tag": { "modified": "2019-03-23T22:54:12.092Z", "contributors": [ @@ -2249,33 +2085,6 @@ "yami" ] }, - "MDN/Editor": { - "modified": "2020-09-30T15:44:37.576Z", - "contributors": [ - "chrisdavidmills", - "wbamberg", - "EatPizza311", - "tpst1114", - "jswisher" - ] - }, - "MDN/Editor/Basics": { - "modified": "2020-09-30T15:44:37.917Z", - "contributors": [ - "chrisdavidmills", - "wbamberg", - "tpst1114" - ] - }, - "MDN/Editor/Edit_box": { - "modified": "2020-09-30T15:44:37.748Z", - "contributors": [ - "chrisdavidmills", - "wbamberg", - "jackblackevo", - "JoanneWu" - ] - }, "MDN/Guidelines": { "modified": "2020-09-30T15:33:00.096Z", "contributors": [ @@ -2301,17 +2110,6 @@ "wildsky" ] }, - "MDN/Kuma": { - "modified": "2019-09-06T03:30:44.825Z", - "contributors": [ - "SphinxKnight", - "wbamberg", - "iigmir", - "SecondSpirit", - "a8040282", - "Sheppy" - ] - }, "MDN/Tools": { "modified": "2020-09-30T16:55:39.074Z", "contributors": [ @@ -2338,12 +2136,6 @@ "alk03073135" ] }, - "MDN_at_ten": { - "modified": "2019-03-23T22:49:37.556Z", - "contributors": [ - "alk03073135" - ] - }, "Mozilla": { "modified": "2019-03-23T23:33:56.932Z", "contributors": [ @@ -2705,17 +2497,6 @@ "BobChao" ] }, - "Mozilla/Firefox/Releases/4/Firefox_4_開發者新功能概覽": { - "modified": "2019-04-23T03:28:52.095Z", - "contributors": [ - "jackblackevo", - "wbamberg", - "SphinxKnight", - "irvinfly", - "teoli", - "BobChao" - ] - }, "Mozilla/Firefox/Releases/5": { "modified": "2019-03-23T23:06:59.171Z", "contributors": [ @@ -2771,20 +2552,6 @@ "RJ_Hsiao" ] }, - "Python": { - "modified": "2019-03-23T23:33:19.493Z", - "contributors": [ - "garylai1990" - ] - }, - "SVG/Tutorial/Basic_Shapes": { - "modified": "2019-04-23T03:35:52.184Z", - "contributors": [ - "jackblackevo", - "ethertank", - "Dx.Yang" - ] - }, "Tools": { "modified": "2020-07-16T22:44:20.103Z", "contributors": [ @@ -2959,12 +2726,6 @@ "iigmir" ] }, - "Tools/Web_Console/Opening_the_Web_Console": { - "modified": "2020-07-16T22:34:17.831Z", - "contributors": [ - "iigmir" - ] - }, "Tools/Web_Console/Rich_output": { "modified": "2020-07-16T22:34:20.675Z", "contributors": [ @@ -3180,13 +2941,6 @@ "happysadman" ] }, - "Web/API/Canvas_API/Drawing_graphics_with_canvas": { - "modified": "2019-03-23T23:13:40.314Z", - "contributors": [ - "fscholz", - "sailplaneTW" - ] - }, "Web/API/Canvas_API/Tutorial": { "modified": "2019-03-18T20:36:19.502Z", "contributors": [ @@ -3565,12 +3319,6 @@ "BobChao" ] }, - "Web/API/Document_Object_Model/事件": { - "modified": "2019-03-23T22:27:33.501Z", - "contributors": [ - "H-W-Chang" - ] - }, "Web/API/DragEvent": { "modified": "2020-02-27T01:36:51.610Z", "contributors": [ @@ -3708,12 +3456,6 @@ "jackblackevo" ] }, - "Web/API/Event/createEvent": { - "modified": "2019-03-23T22:46:58.596Z", - "contributors": [ - "Shiyou" - ] - }, "Web/API/Event/currentTarget": { "modified": "2020-10-15T21:47:11.367Z", "contributors": [ @@ -3951,14 +3693,6 @@ "fscholz" ] }, - "Web/API/Geolocation/Using_geolocation": { - "modified": "2019-12-15T11:33:42.173Z", - "contributors": [ - "ayugioh2003", - "jackblackevo", - "MashKao" - ] - }, "Web/API/Geolocation/clearWatch": { "modified": "2019-03-23T22:36:15.036Z", "contributors": [ @@ -4146,24 +3880,12 @@ "jackblackevo" ] }, - "Web/API/HTMLElement/dataset": { - "modified": "2019-03-18T21:38:45.005Z", - "contributors": [ - "willynpi" - ] - }, "Web/API/HTMLElement/lang": { "modified": "2019-03-23T22:12:53.096Z", "contributors": [ "jackblackevo" ] }, - "Web/API/HTMLElement/style": { - "modified": "2019-03-23T22:20:07.015Z", - "contributors": [ - "jackblackevo" - ] - }, "Web/API/HTMLFormElement": { "modified": "2019-03-23T22:18:52.812Z", "contributors": [ @@ -4446,12 +4168,6 @@ "jackblackevo" ] }, - "Web/API/Node/innerText": { - "modified": "2019-03-23T22:12:44.697Z", - "contributors": [ - "jackblackevo" - ] - }, "Web/API/Node/insertBefore": { "modified": "2020-10-15T22:10:04.295Z", "contributors": [ @@ -4554,13 +4270,6 @@ "jasonslyvia" ] }, - "Web/API/Performance.timing": { - "modified": "2020-10-15T21:29:18.100Z", - "contributors": [ - "fscholz", - "BobChao" - ] - }, "Web/API/Pointer_Lock_API": { "modified": "2019-03-23T23:21:42.932Z", "contributors": [ @@ -4785,15 +4494,8 @@ "MashKao" ] }, - "Web/API/Web_Video_Text_Tracks_Format": { - "modified": "2019-03-23T23:11:00.411Z", - "contributors": [ - "wbamberg", - "BobChao" - ] - }, - "Web/API/Web_Workers_API": { - "modified": "2019-03-23T22:31:22.820Z", + "Web/API/Web_Workers_API": { + "modified": "2019-03-23T22:31:22.820Z", "contributors": [ "teoli" ] @@ -4820,31 +4522,6 @@ "jackblackevo" ] }, - "Web/API/Window.history": { - "modified": "2019-03-23T23:27:30.087Z", - "contributors": [ - "jackblackevo", - "jsx", - "ChiLiJung" - ] - }, - "Web/API/Window.onpopstate": { - "modified": "2019-03-23T23:27:28.070Z", - "contributors": [ - "irvinfly", - "khalid32", - "ChiLiJung" - ] - }, - "Web/API/Window.requestAnimationFrame": { - "modified": "2020-10-15T21:24:54.235Z", - "contributors": [ - "t7yang", - "Ekanan", - "North", - "foxbrush" - ] - }, "Web/API/Window/getComputedStyle": { "modified": "2019-03-23T22:10:08.484Z", "contributors": [ @@ -4913,20 +4590,6 @@ "IsaacSchemm" ] }, - "Web/API/Window/sidebar/Adding_search_engines_from_Web_pages": { - "modified": "2019-01-16T15:28:04.055Z", - "contributors": [ - "jackblackevo", - "Mgjbot", - "BobChao" - ] - }, - "Web/API/WindowBase64": { - "modified": "2019-03-23T22:30:45.308Z", - "contributors": [ - "jackblackevo" - ] - }, "Web/API/WindowEventHandlers": { "modified": "2019-03-23T22:30:52.273Z", "contributors": [ @@ -4957,12 +4620,6 @@ "chrischi0922s" ] }, - "Web/API/WindowTimers": { - "modified": "2019-03-18T21:16:54.761Z", - "contributors": [ - "jackblackevo" - ] - }, "Web/API/XMLHttpRequest": { "modified": "2020-10-15T21:21:13.079Z", "contributors": [ @@ -5042,13 +4699,6 @@ "iigmir" ] }, - "Web/API/document.createTreeWalker": { - "modified": "2019-03-23T23:14:12.386Z", - "contributors": [ - "jsx", - "shyangs" - ] - }, "Web/API/notification": { "modified": "2020-04-21T05:58:29.795Z", "contributors": [ @@ -5175,13 +4825,6 @@ "cvrebert" ] }, - "Web/CSS/@viewport/height": { - "modified": "2019-10-22T02:02:49.952Z", - "contributors": [ - "Zhang-Junzhi", - "yvonne6344" - ] - }, "Web/CSS/CSS_Animations": { "modified": "2019-03-23T22:43:48.571Z", "contributors": [ @@ -5197,21 +4840,6 @@ "sailplaneTW" ] }, - "Web/CSS/CSS_Background_and_Borders": { - "modified": "2019-03-23T22:44:17.591Z", - "contributors": [ - "teoli" - ] - }, - "Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds": { - "modified": "2019-03-23T22:48:53.708Z", - "contributors": [ - "sss63232", - "Shiyou", - "teoli", - "alk03073135" - ] - }, "Web/CSS/CSS_Box_Model": { "modified": "2019-03-23T22:24:07.076Z", "contributors": [ @@ -5227,13 +4855,6 @@ "MOSapeizer" ] }, - "Web/CSS/CSS_Colors": { - "modified": "2019-03-23T22:44:44.114Z", - "contributors": [ - "Sebastianz", - "teoli" - ] - }, "Web/CSS/CSS_Colors/Color_picker_tool": { "modified": "2019-03-23T22:44:42.147Z", "contributors": [ @@ -5250,14 +4871,6 @@ "WynnChen" ] }, - "Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes": { - "modified": "2020-05-11T23:59:37.780Z", - "contributors": [ - "wildsky", - "iigmir", - "1986slayer" - ] - }, "Web/CSS/CSS_Grid_Layout": { "modified": "2020-02-01T05:41:13.615Z", "contributors": [ @@ -5349,15 +4962,6 @@ "sailplaneTW" ] }, - "Web/CSS/Common_CSS_Questions": { - "modified": "2020-07-16T22:25:46.290Z", - "contributors": [ - "fscholz", - "teoli", - "Mgjbot", - "BobChao" - ] - }, "Web/CSS/Descendant_combinator": { "modified": "2019-03-23T22:47:36.182Z", "contributors": [ @@ -5467,14 +5071,6 @@ "Kennyluck" ] }, - "Web/CSS/border-image/border-image": { - "modified": "2019-03-24T00:08:11.061Z", - "contributors": [ - "mrstork", - "teoli", - "Kennyluck" - ] - }, "Web/CSS/box-shadow": { "modified": "2020-09-11T09:09:21.899Z", "contributors": [ @@ -5661,31 +5257,6 @@ "louisremi" ] }, - "Web/Events/DOMContentLoaded": { - "modified": "2019-04-30T13:56:21.954Z", - "contributors": [ - "wbamberg", - "fscholz", - "NoctisHsu", - "jackblackevo", - "ethertank", - "CarterTsai" - ] - }, - "Web/Events/abort": { - "modified": "2019-04-30T14:18:03.298Z", - "contributors": [ - "wbamberg", - "secminhr" - ] - }, - "Web/Events/load": { - "modified": "2019-03-23T22:18:11.736Z", - "contributors": [ - "fscholz", - "Snailpool" - ] - }, "Web/Guide": { "modified": "2019-03-23T23:29:55.855Z", "contributors": [ @@ -5731,12 +5302,6 @@ "shing0608" ] }, - "Web/Guide/DOM": { - "modified": "2019-03-23T23:29:56.158Z", - "contributors": [ - "Sheppy" - ] - }, "Web/Guide/Events": { "modified": "2019-03-23T22:48:03.662Z", "contributors": [ @@ -5771,13 +5336,6 @@ "iigmir" ] }, - "Web/Guide/HTML/Event_attributes": { - "modified": "2019-11-20T21:38:26.184Z", - "contributors": [ - "wbamberg", - "jackblackevo" - ] - }, "Web/Guide/HTML/HTML5": { "modified": "2019-03-24T00:15:00.017Z", "contributors": [ @@ -6064,12 +5622,6 @@ "Shiyou" ] }, - "Web/HTML/Forms_in_HTML": { - "modified": "2019-03-23T23:28:09.563Z", - "contributors": [ - "foxbrush" - ] - }, "Web/HTML/Global_attributes": { "modified": "2019-03-23T22:31:21.607Z", "contributors": [ @@ -6110,13 +5662,6 @@ "stingyong" ] }, - "Web/HTML/Supported_media_formats": { - "modified": "2019-03-23T23:14:51.174Z", - "contributors": [ - "young3578671", - "Keeseonglee" - ] - }, "Web/HTML/Using_the_application_cache": { "modified": "2019-03-24T00:10:44.785Z", "contributors": [ @@ -6310,12 +5855,6 @@ "nientsu" ] }, - "Web/HTTP/Server-Side_Access_Control": { - "modified": "2019-03-23T22:06:20.131Z", - "contributors": [ - "jackblackevo" - ] - }, "Web/HTTP/Status": { "modified": "2020-10-15T21:38:22.963Z", "contributors": [ @@ -6433,13 +5972,6 @@ "gamerslouis" ] }, - "Web/HTTP/Status/418_I_m_a_teapot": { - "modified": "2020-10-15T22:00:43.617Z", - "contributors": [ - "iigmir", - "dzamlo" - ] - }, "Web/HTTP/Status/451": { "modified": "2020-10-15T22:02:32.084Z", "contributors": [ @@ -6482,15 +6014,6 @@ "slivenred" ] }, - "Web/HTTP/data_URIs": { - "modified": "2020-06-09T11:41:01.440Z", - "contributors": [ - "jhihruei", - "jwhitlock", - "Shiyou", - "alk03073135" - ] - }, "Web/JavaScript": { "modified": "2020-05-24T01:05:47.129Z", "contributors": [ @@ -6785,18 +6308,6 @@ "Snailpool" ] }, - "Web/JavaScript/Introduction_to_Object-Oriented_JavaScript": { - "modified": "2020-08-05T00:50:19.955Z", - "contributors": [ - "nientsu", - "cwlin0416", - "fscholz", - "jackblackevo", - "nightsnow0918", - "irvinfly", - "sailplaneTW" - ] - }, "Web/JavaScript/JavaScript_technologies_overview": { "modified": "2020-03-12T19:35:23.439Z", "contributors": [ @@ -6823,2334 +6334,2823 @@ "mybaseball52" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要": { - "modified": "2019-01-16T14:44:37.660Z", + "Web/JavaScript/Reference": { + "modified": "2020-06-02T20:54:32.743Z", "contributors": [ + "laampui", + "cwlin0416", + "jackblackevo", "teoli", - "happysadman" + "irvinfly", + "tjjh89017", + "Zhen.Di-Lin", + "Norbert" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要": { - "modified": "2019-01-16T14:43:16.706Z", + "Web/JavaScript/Reference/Classes": { + "modified": "2020-03-12T19:42:37.772Z", "contributors": [ - "teoli", - "happysadman" + "hot50773", + "Aries0d0f", + "chloewlin", + "roycrxtw", + "akccakcctw", + "ywchiao", + "fbukevin" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/Unicode": { - "modified": "2019-01-16T14:44:25.337Z", + "Web/JavaScript/Reference/Classes/constructor": { + "modified": "2020-07-23T05:05:44.137Z", "contributors": [ - "teoli", - "happysadman" + "t7yang", + "iigmir" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/以類別為基礎的語言_vs._以原型為基礎的語言": { - "modified": "2019-01-16T14:43:47.289Z", + "Web/JavaScript/Reference/Classes/extends": { + "modified": "2020-10-15T22:06:07.272Z", "contributors": [ - "teoli", - "happysadman" + "Aries0d0f" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法": { - "modified": "2019-03-24T00:00:58.152Z", + "Web/JavaScript/Reference/Classes/static": { + "modified": "2020-03-12T19:43:06.328Z", "contributors": [ - "teoli", - "happysadman" + "alkalineW", + "jerrychen1013", + "Robert-Rino" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法": { - "modified": "2019-03-24T00:00:57.682Z", + "Web/JavaScript/Reference/Errors": { + "modified": "2020-03-12T19:44:53.537Z", "contributors": [ - "teoli", - "happysadman" + "iigmir" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法": { - "modified": "2020-08-31T05:59:42.160Z", + "Web/JavaScript/Reference/Errors/Bad_return_or_yield": { + "modified": "2020-03-12T19:44:54.646Z", "contributors": [ - "clifflu", - "teoli", - "happysadman" + "iigmir" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/值": { - "modified": "2019-01-16T14:44:19.901Z", + "Web/JavaScript/Reference/Errors/Invalid_array_length": { + "modified": "2020-03-12T19:49:01.235Z", "contributors": [ - "teoli", - "happysadman" + "gamerslouis" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承": { - "modified": "2019-01-16T14:43:20.597Z", + "Web/JavaScript/Reference/Errors/Missing_curly_after_property_list": { + "modified": "2020-03-12T19:47:08.262Z", "contributors": [ - "teoli", - "happysadman" + "PCLIN1103" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/實體關係的確定": { - "modified": "2019-01-16T14:43:13.719Z", + "Web/JavaScript/Reference/Errors/No_properties": { + "modified": "2020-03-12T19:47:20.608Z", "contributors": [ - "teoli", - "happysadman" + "iigmir" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/局域值和繼承值": { - "modified": "2019-01-16T14:43:16.085Z", + "Web/JavaScript/Reference/Errors/Not_a_function": { + "modified": "2020-03-12T19:45:02.118Z", "contributors": [ - "teoli", - "happysadman" + "iigmir" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/建構子中的全域資訊": { - "modified": "2019-01-16T14:43:20.683Z", - "contributors": [ - "teoli", - "happysadman" + "Web/JavaScript/Reference/Errors/Not_defined": { + "modified": "2020-03-12T19:44:53.089Z", + "contributors": [ + "iigmir" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/沒有多重繼承": { - "modified": "2019-01-16T14:43:21.630Z", + "Web/JavaScript/Reference/Errors/Redeclared_parameter": { + "modified": "2020-03-12T19:47:17.103Z", "contributors": [ - "teoli", - "happysadman" + "iigmir" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的呼叫": { - "modified": "2019-03-24T00:00:58.959Z", + "Web/JavaScript/Reference/Errors/Too_much_recursion": { + "modified": "2020-03-12T19:44:57.763Z", "contributors": [ - "teoli", - "happysadman" + "iigmir" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義": { - "modified": "2019-01-16T14:44:26.521Z", + "Web/JavaScript/Reference/Errors/Unexpected_type": { + "modified": "2019-03-23T22:20:43.997Z", "contributors": [ - "teoli", - "Sheppy", - "Jaric", - "happysadman" + "andytwmvp", + "iigmir", + "kimi1111" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊語法": { - "modified": "2019-01-16T13:06:24.647Z", + "Web/JavaScript/Reference/Functions": { + "modified": "2020-03-12T19:41:25.162Z", "contributors": [ - "teoli", - "Sheppy", - "Jaric", - "happysadman" + "lynn456", + "fscholz" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/字面表達": { - "modified": "2019-01-16T14:44:20.274Z", + "Web/JavaScript/Reference/Functions/Arrow_functions": { + "modified": "2020-10-15T21:36:09.562Z", "contributors": [ - "teoli", - "happysadman" + "iigmir", + "ShawnLin", + "Lazine", + "xuan0123", + "bagayollow", + "ctc53", + "kuolun", + "jackblackevo", + "freddy50806", + "Aisuzuka", + "Jaja", + "tonykuo", + "yungtah", + "Snailpool", + "wkliang", + "linjimmy168", + "foxbrush" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/常數": { - "modified": "2019-01-16T14:44:19.601Z", + "Web/JavaScript/Reference/Functions/Default_parameters": { + "modified": "2020-10-05T03:37:47.112Z", "contributors": [ - "teoli", - "happysadman" + "realspirit2017", + "Jackson45252", + "jsgao0", + "Snailpool" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件": { - "modified": "2019-03-24T00:01:06.649Z", + "Web/JavaScript/Reference/Functions/Method_definitions": { + "modified": "2020-10-15T21:55:16.559Z", "contributors": [ - "wbamberg", - "teoli", - "happysadman" + "iigmir", + "jackblackevo" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法": { - "modified": "2019-01-16T14:44:21.815Z", + "Web/JavaScript/Reference/Functions/arguments": { + "modified": "2020-10-15T21:14:39.550Z", "contributors": [ + "itsems", + "jackblackevo", + "akari0624", + "fscholz", + "irvinfly", "teoli", "happysadman" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法": { - "modified": "2019-03-24T00:00:58.023Z", + "Web/JavaScript/Reference/Functions/arguments/callee": { + "modified": "2020-03-12T19:45:29.084Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法": { - "modified": "2019-03-24T00:01:00.198Z", + "Web/JavaScript/Reference/Functions/get": { + "modified": "2020-10-15T22:17:05.787Z", "contributors": [ - "teoli", - "happysadman" + "iigmir" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法": { - "modified": "2019-03-24T00:00:59.356Z", + "Web/JavaScript/Reference/Functions/rest_parameters": { + "modified": "2020-10-15T21:56:42.865Z", "contributors": [ - "teoli", - "happysadman" + "Kevin_Chen", + "jackblackevo", + "jsgao0" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法": { - "modified": "2019-03-24T00:01:11.869Z", + "Web/JavaScript/Reference/Functions/set": { + "modified": "2020-10-15T22:17:33.994Z", "contributors": [ - "teoli", - "happysadman" + "iigmir" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法": { - "modified": "2019-03-24T00:01:01.557Z", + "Web/JavaScript/Reference/Global_Objects": { + "modified": "2020-03-12T19:38:39.590Z", "contributors": [ + "tony8382", + "chialin", + "jackblackevo", + "jsgao0", + "cwlin0416", "teoli", - "happysadman" + "Sheppy" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法": { - "modified": "2019-03-24T00:01:00.950Z", + "Web/JavaScript/Reference/Global_Objects/Array": { + "modified": "2020-10-15T21:31:26.717Z", "contributors": [ - "teoli", - "happysadman" + "hua-123", + "kyob1010", + "Aries0d0f", + "KevinHuang", + "k940545", + "jackblackevo", + "tswenja", + "kdex", + "petercpg", + "Kaiyeh", + "cwlin0416", + "oooooo", + "m80126colin", + "lizlux" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立": { - "modified": "2019-03-24T00:01:06.394Z", + "Web/JavaScript/Reference/Global_Objects/Array/@@iterator": { + "modified": "2020-10-15T22:02:20.291Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義": { - "modified": "2019-03-24T00:01:05.950Z", + "Web/JavaScript/Reference/Global_Objects/Array/Reduce": { + "modified": "2020-10-15T21:54:40.258Z", "contributors": [ - "fscholz", - "jigs12", - "teoli", - "happysadman" + "Ashe_Li", + "jackblackevo", + "iigmir", + "dwatow", + "yozian" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考": { - "modified": "2019-03-24T00:01:06.045Z", + "Web/JavaScript/Reference/Global_Objects/Array/concat": { + "modified": "2020-10-15T21:46:28.512Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo", + "tericky" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除": { - "modified": "2019-03-24T00:01:04.888Z", + "Web/JavaScript/Reference/Global_Objects/Array/copyWithin": { + "modified": "2020-10-15T22:01:15.329Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用": { - "modified": "2019-03-24T00:01:06.293Z", + "Web/JavaScript/Reference/Global_Objects/Array/entries": { + "modified": "2020-10-15T21:47:10.197Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo", + "tericky" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義": { - "modified": "2019-03-24T00:01:03.034Z", + "Web/JavaScript/Reference/Global_Objects/Array/every": { + "modified": "2020-10-15T21:56:41.781Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo", + "AkanishiChi", + "jsgao0" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用": { - "modified": "2019-03-24T00:01:06.480Z", + "Web/JavaScript/Reference/Global_Objects/Array/fill": { + "modified": "2020-10-15T21:56:41.165Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo", + "jsgao0" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引": { - "modified": "2019-03-24T00:01:04.238Z", + "Web/JavaScript/Reference/Global_Objects/Array/filter": { + "modified": "2020-10-15T21:38:35.707Z", "contributors": [ - "teoli", - "happysadman" + "Jenhaohsiao", + "jackblackevo", + "iigmir", + "jsgao0", + "alk03073135" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性": { - "modified": "2019-03-24T00:01:04.444Z", + "Web/JavaScript/Reference/Global_Objects/Array/find": { + "modified": "2020-10-15T21:42:27.701Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo", + "iigmir", + "ALiangLiang" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件語法": { - "modified": "2019-01-16T14:43:51.018Z", + "Web/JavaScript/Reference/Global_Objects/Array/findIndex": { + "modified": "2020-10-15T21:51:49.109Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo", + "tooto1985", + "auver", + "Snailpool" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫": { - "modified": "2019-03-24T00:00:58.884Z", + "Web/JavaScript/Reference/Global_Objects/Array/flat": { + "modified": "2020-10-15T22:11:38.333Z", "contributors": [ - "wildsky", - "teoli", - "happysadman" + "SageX", + "Euphokumiko" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立": { - "modified": "2019-03-24T00:01:00.293Z", + "Web/JavaScript/Reference/Global_Objects/Array/forEach": { + "modified": "2020-10-15T21:46:18.574Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo", + "iigmir", + "wangqimeng", + "nt46", + "akari0624" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用": { - "modified": "2019-01-16T14:44:21.287Z", + "Web/JavaScript/Reference/Global_Objects/Array/from": { + "modified": "2020-10-15T21:52:49.849Z", "contributors": [ - "teoli", - "happysadman" + "qwer5656", + "jackblackevo", + "petercpg", + "tericky" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋": { - "modified": "2019-01-16T14:44:23.103Z", + "Web/JavaScript/Reference/Global_Objects/Array/includes": { + "modified": "2020-10-15T22:02:19.463Z", "contributors": [ - "teoli", - "happysadman" + "SiderealArt", + "sonelin09", + "xuan311", + "vaynewang", + "jackblackevo" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用": { - "modified": "2019-01-16T14:44:25.974Z", + "Web/JavaScript/Reference/Global_Objects/Array/indexOf": { + "modified": "2020-10-15T21:56:48.783Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo", + "jsgao0" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例": { - "modified": "2019-03-24T00:00:59.567Z", + "Web/JavaScript/Reference/Global_Objects/Array/isArray": { + "modified": "2020-10-15T21:34:45.216Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo", + "tericky", + "m80126colin", + "JamesWen", + "onlinemad" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件和屬性": { - "modified": "2019-01-16T14:44:03.755Z", + "Web/JavaScript/Reference/Global_Objects/Array/join": { + "modified": "2020-10-15T21:47:08.883Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo", + "iigmir", + "JamesWen" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法": { - "modified": "2019-03-24T00:00:59.074Z", + "Web/JavaScript/Reference/Global_Objects/Array/keys": { + "modified": "2020-10-15T22:02:18.808Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承": { - "modified": "2019-03-24T00:01:09.212Z", + "Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf": { + "modified": "2020-10-15T22:02:16.799Z", "contributors": [ - "jsgao0", - "teoli", - "happysadman" + "jackblackevo" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子": { - "modified": "2019-03-24T00:01:18.422Z", + "Web/JavaScript/Reference/Global_Objects/Array/length": { + "modified": "2020-10-15T21:58:21.627Z", "contributors": [ - "teoli", - "happysadman" + "tericky", + "yenchenglai0618", + "mybaseball52" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/更靈活的建構子": { - "modified": "2019-01-16T14:43:17.913Z", + "Web/JavaScript/Reference/Global_Objects/Array/map": { + "modified": "2020-10-15T21:53:08.025Z", "contributors": [ - "teoli", - "happysadman" + "iigmir", + "jackblackevo", + "jWorker", + "akari0624" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性": { - "modified": "2019-03-24T00:01:21.807Z", + "Web/JavaScript/Reference/Global_Objects/Array/of": { + "modified": "2020-10-15T22:01:03.622Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入": { - "modified": "2019-03-24T00:01:15.806Z", + "Web/JavaScript/Reference/Global_Objects/Array/pop": { + "modified": "2020-10-15T21:56:21.800Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo", + "yvonne6344" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承": { - "modified": "2019-03-24T00:01:17.728Z", + "Web/JavaScript/Reference/Global_Objects/Array/push": { + "modified": "2020-10-15T21:42:28.441Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo", + "yvonne6344", + "iigmir", + "ALiangLiang" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立": { - "modified": "2019-03-24T00:01:17.848Z", + "Web/JavaScript/Reference/Global_Objects/Array/reverse": { + "modified": "2020-10-15T21:31:21.385Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo", + "CYBAI" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/表達式": { - "modified": "2019-01-16T14:44:25.015Z", + "Web/JavaScript/Reference/Global_Objects/Array/shift": { + "modified": "2020-10-15T21:50:12.873Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo", + "marktwtn" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/註解": { - "modified": "2019-01-16T14:44:18.898Z", + "Web/JavaScript/Reference/Global_Objects/Array/slice": { + "modified": "2020-10-15T22:00:48.969Z", "contributors": [ - "teoli", - "happysadman" + "rosa", + "pig3629", + "jackblackevo" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/變數": { - "modified": "2019-01-16T14:44:20.971Z", + "Web/JavaScript/Reference/Global_Objects/Array/some": { + "modified": "2020-10-15T22:02:17.128Z", "contributors": [ - "teoli", - "happysadman" + "iigmir", + "jackblackevo" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器": { - "modified": "2019-03-24T00:01:19.860Z", + "Web/JavaScript/Reference/Global_Objects/Array/sort": { + "modified": "2020-10-15T21:31:18.682Z", "contributors": [ - "wbamberg", - "teoli", - "Wladimir_Palant", - "happysadman" + "jackblackevo", + "CYBAI" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子": { - "modified": "2019-01-16T14:44:25.230Z", + "Web/JavaScript/Reference/Global_Objects/Array/splice": { + "modified": "2020-10-15T21:56:28.206Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo", + "jsgao0", + "Mars-Hung" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/代入運算子": { - "modified": "2019-03-24T00:01:01.353Z", + "Web/JavaScript/Reference/Global_Objects/Array/unshift": { + "modified": "2020-10-15T21:50:29.110Z", "contributors": [ - "teoli", - "happysadman" + "jsgao0", + "jackblackevo", + "roycrxtw", + "marktwtn" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/位元運算子": { - "modified": "2019-01-16T14:44:24.141Z", + "Web/JavaScript/Reference/Global_Objects/Array/values": { + "modified": "2020-10-15T22:02:17.406Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/字串運算子": { - "modified": "2019-01-16T14:44:19.884Z", + "Web/JavaScript/Reference/Global_Objects/ArrayBuffer": { + "modified": "2019-03-24T00:11:11.336Z", "contributors": [ + "jackblackevo", "teoli", - "happysadman" + "Kennyluck" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子": { - "modified": "2019-01-16T14:44:28.417Z", + "Web/JavaScript/Reference/Global_Objects/AsyncFunction": { + "modified": "2020-10-15T22:18:02.118Z", "contributors": [ - "teoli", - "happysadman" + "gamerslouis" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/特殊運算子": { - "modified": "2019-01-16T14:44:24.727Z", + "Web/JavaScript/Reference/Global_Objects/BigInt": { + "modified": "2020-10-15T22:17:57.888Z", "contributors": [ - "teoli", - "happysadman" + "hmysjiang" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/算術運算子": { - "modified": "2019-01-16T14:44:25.132Z", + "Web/JavaScript/Reference/Global_Objects/Boolean": { + "modified": "2019-03-23T22:06:45.293Z", "contributors": [ - "teoli", - "happysadman" + "jsgao0" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/邏輯運算子": { - "modified": "2019-01-16T14:44:21.016Z", + "Web/JavaScript/Reference/Global_Objects/DataView": { + "modified": "2019-03-23T22:31:20.723Z", "contributors": [ - "teoli", - "happysadman" + "edu1218", + "jackblackevo" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用": { - "modified": "2019-01-16T14:44:07.939Z", + "Web/JavaScript/Reference/Global_Objects/Date": { + "modified": "2019-03-23T22:26:48.329Z", "contributors": [ - "teoli", - "happysadman" + "NoobTW", + "ddtet" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於": { - "modified": "2019-01-16T14:44:22.263Z", + "Web/JavaScript/Reference/Global_Objects/Date/UTC": { + "modified": "2019-03-23T22:26:04.734Z", "contributors": [ - "teoli", - "happysadman" + "ddtet" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/陣列的運用": { - "modified": "2019-03-24T00:01:19.124Z", + "Web/JavaScript/Reference/Global_Objects/Date/getDay": { + "modified": "2020-10-15T22:34:16.631Z", "contributors": [ - "wbamberg", - "Jaja", - "teoli", - "happysadman" + "manny3" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數": { - "modified": "2019-01-16T14:44:03.697Z", + "Web/JavaScript/Reference/Global_Objects/Date/now": { + "modified": "2019-03-23T22:26:18.288Z", "contributors": [ - "teoli", - "happysadman" + "ddtet" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/Number_和_String_函數": { - "modified": "2019-03-24T00:01:05.054Z", + "Web/JavaScript/Reference/Global_Objects/Error": { + "modified": "2019-03-23T22:30:39.821Z", "contributors": [ - "teoli", - "happysadman" + "jsgao0", + "jackblackevo", + "josephmcasey" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/escape_和_unescape_函數": { - "modified": "2019-03-24T00:01:07.501Z", + "Web/JavaScript/Reference/Global_Objects/Error/columnNumber": { + "modified": "2019-03-23T22:30:40.645Z", "contributors": [ "teoli", - "happysadman" + "jerrychen1013" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/eval_函數": { - "modified": "2019-01-16T14:44:04.783Z", + "Web/JavaScript/Reference/Global_Objects/Function": { + "modified": "2019-03-23T23:25:10.636Z", "contributors": [ + "Calvin-Huang", + "jackblackevo", "teoli", - "happysadman" + "Bergi" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isFinite_函數": { - "modified": "2019-03-24T00:01:03.372Z", + "Web/JavaScript/Reference/Global_Objects/Function/apply": { + "modified": "2020-04-16T06:07:17.467Z", "contributors": [ - "teoli", - "happysadman" + "jacko1114", + "ayuha406645", + "Snailpool" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isNaN_函數": { - "modified": "2019-03-24T00:01:04.794Z", + "Web/JavaScript/Reference/Global_Objects/Function/bind": { + "modified": "2019-03-23T22:07:11.766Z", "contributors": [ - "teoli", - "happysadman" + "storyh66224", + "iigmir", + "nyngwang", + "aaaOOttOOaaa" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數": { - "modified": "2019-03-24T00:01:07.340Z", + "Web/JavaScript/Reference/Global_Objects/Function/call": { + "modified": "2019-03-23T23:25:00.404Z", "contributors": [ + "jackblackevo", "teoli", - "happysadman" + "Zhen.Di-Lin" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件": { - "modified": "2019-01-16T14:44:07.734Z", + "Web/JavaScript/Reference/Global_Objects/Function/length": { + "modified": "2019-03-23T22:39:23.276Z", "contributors": [ - "teoli", - "happysadman" + "CYBAI", + "lessmind" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件": { - "modified": "2019-03-24T00:01:13.553Z", + "Web/JavaScript/Reference/Global_Objects/Infinity": { + "modified": "2020-10-15T21:47:39.391Z", "contributors": [ - "teoli", - "happysadman" + "iigmir", + "tooto1985", + "jackblackevo" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件": { - "modified": "2019-03-24T00:01:13.158Z", - "contributors": [ - "teoli", - "happysadman" - ] - }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件": { - "modified": "2019-03-24T00:01:09.665Z", + "Web/JavaScript/Reference/Global_Objects/JSON": { + "modified": "2020-10-15T21:48:40.820Z", "contributors": [ - "teoli", - "happysadman" + "rolflo", + "iigmir", + "Ende93" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件": { - "modified": "2019-03-24T00:01:12.219Z", + "Web/JavaScript/Reference/Global_Objects/JSON/parse": { + "modified": "2020-04-17T04:18:46.439Z", "contributors": [ - "teoli", - "happysadman" + "jacko1114", + "bigbitesaint", + "matthung0807", + "iigmir", + "kuolun" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件": { - "modified": "2019-03-24T00:01:08.965Z", + "Web/JavaScript/Reference/Global_Objects/JSON/stringify": { + "modified": "2020-10-15T22:00:16.083Z", "contributors": [ - "teoli", - "happysadman" + "gyau97", + "SolomonKang" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件": { - "modified": "2019-03-24T00:01:11.242Z", + "Web/JavaScript/Reference/Global_Objects/Map": { + "modified": "2020-10-15T21:51:34.887Z", "contributors": [ - "teoli", - "happysadman" + "othree", + "tainenko", + "jackblackevo", + "jsgao0" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件": { - "modified": "2019-03-24T00:01:13.910Z", + "Web/JavaScript/Reference/Global_Objects/Math": { + "modified": "2020-10-15T21:38:29.906Z", "contributors": [ - "teoli", - "happysadman" + "hmysjiang", + "jackblackevo", + "fscholz" ] }, - "Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件": { - "modified": "2019-03-24T00:01:08.836Z", + "Web/JavaScript/Reference/Global_Objects/Math/abs": { + "modified": "2020-10-15T22:02:08.344Z", "contributors": [ - "teoli", - "happysadman" + "jackblackevo" ] }, - "Web/JavaScript/Reference": { - "modified": "2020-06-02T20:54:32.743Z", + "Web/JavaScript/Reference/Global_Objects/Math/ceil": { + "modified": "2020-10-15T22:02:07.035Z", "contributors": [ - "laampui", - "cwlin0416", - "jackblackevo", - "teoli", - "irvinfly", - "tjjh89017", - "Zhen.Di-Lin", - "Norbert" + "jackblackevo" ] }, - "Web/JavaScript/Reference/Classes": { - "modified": "2020-03-12T19:42:37.772Z", + "Web/JavaScript/Reference/Global_Objects/Math/floor": { + "modified": "2020-10-15T22:02:06.863Z", "contributors": [ - "hot50773", - "Aries0d0f", - "chloewlin", - "roycrxtw", - "akccakcctw", - "ywchiao", - "fbukevin" + "ted31013", + "chochinlu", + "Hagen", + "jackblackevo" ] }, - "Web/JavaScript/Reference/Classes/constructor": { - "modified": "2020-07-23T05:05:44.137Z", + "Web/JavaScript/Reference/Global_Objects/Math/max": { + "modified": "2020-10-15T22:03:35.771Z", "contributors": [ - "t7yang", - "iigmir" + "jackblackevo" ] }, - "Web/JavaScript/Reference/Classes/extends": { - "modified": "2020-10-15T22:06:07.272Z", + "Web/JavaScript/Reference/Global_Objects/Math/pow": { + "modified": "2020-10-21T10:01:06.689Z", "contributors": [ - "Aries0d0f" + "SvampK", + "iigmir" ] }, - "Web/JavaScript/Reference/Classes/static": { - "modified": "2020-03-12T19:43:06.328Z", + "Web/JavaScript/Reference/Global_Objects/Math/random": { + "modified": "2020-10-17T07:58:50.159Z", "contributors": [ - "alkalineW", - "jerrychen1013", - "Robert-Rino" + "RocketSH" ] }, - "Web/JavaScript/Reference/Errors": { - "modified": "2020-03-12T19:44:53.537Z", + "Web/JavaScript/Reference/Global_Objects/Math/round": { + "modified": "2019-03-23T22:48:34.807Z", "contributors": [ - "iigmir" + "alk03073135" ] }, - "Web/JavaScript/Reference/Errors/Bad_return_or_yield": { - "modified": "2020-03-12T19:44:54.646Z", + "Web/JavaScript/Reference/Global_Objects/NaN": { + "modified": "2020-10-15T21:47:39.178Z", "contributors": [ - "iigmir" + "iigmir", + "jackblackevo" ] }, - "Web/JavaScript/Reference/Errors/Invalid_array_length": { - "modified": "2020-03-12T19:49:01.235Z", + "Web/JavaScript/Reference/Global_Objects/Number": { + "modified": "2019-03-23T22:28:21.747Z", "contributors": [ - "gamerslouis" + "jsgao0", + "sha1337" ] }, - "Web/JavaScript/Reference/Errors/Missing_curly_after_property_list": { - "modified": "2020-03-12T19:47:08.262Z", + "Web/JavaScript/Reference/Global_Objects/Number/isFinite": { + "modified": "2020-10-15T22:03:26.099Z", "contributors": [ - "PCLIN1103" + "jackblackevo" ] }, - "Web/JavaScript/Reference/Errors/No_properties": { - "modified": "2020-03-12T19:47:20.608Z", + "Web/JavaScript/Reference/Global_Objects/Number/isNaN": { + "modified": "2020-10-15T22:14:14.999Z", "contributors": [ - "iigmir" + "xguang" ] }, - "Web/JavaScript/Reference/Errors/Not_a_function": { - "modified": "2020-03-12T19:45:02.118Z", + "Web/JavaScript/Reference/Global_Objects/Number/toExponential": { + "modified": "2019-03-23T22:28:18.890Z", "contributors": [ - "iigmir" + "jsgao0", + "Shiyou" ] }, - "Web/JavaScript/Reference/Errors/Not_defined": { - "modified": "2020-03-12T19:44:53.089Z", + "Web/JavaScript/Reference/Global_Objects/Number/toFixed": { + "modified": "2020-11-18T05:27:56.696Z", "contributors": [ - "iigmir" + "Johnnychun", + "jackblackevo" ] }, - "Web/JavaScript/Reference/Errors/Redeclared_parameter": { - "modified": "2020-03-12T19:47:17.103Z", + "Web/JavaScript/Reference/Global_Objects/Object": { + "modified": "2020-08-22T05:49:39.644Z", "contributors": [ - "iigmir" + "+ono+", + "kuolun", + "jackblackevo", + "fscholz" ] }, - "Web/JavaScript/Reference/Errors/Too_much_recursion": { - "modified": "2020-03-12T19:44:57.763Z", + "Web/JavaScript/Reference/Global_Objects/Object/assign": { + "modified": "2020-10-15T21:51:19.104Z", "contributors": [ - "iigmir" + "manny3", + "lmr3796", + "mitivic", + "BruceLi", + "septemhill", + "jsgao0" ] }, - "Web/JavaScript/Reference/Errors/Unexpected_type": { - "modified": "2019-03-23T22:20:43.997Z", + "Web/JavaScript/Reference/Global_Objects/Object/create": { + "modified": "2019-03-23T22:30:34.696Z", "contributors": [ - "andytwmvp", - "iigmir", - "kimi1111" + "yuugou727", + "septemhill", + "jackblackevo" ] }, - "Web/JavaScript/Reference/Functions": { - "modified": "2020-03-12T19:41:25.162Z", + "Web/JavaScript/Reference/Global_Objects/Object/defineProperties": { + "modified": "2019-03-23T22:18:00.161Z", "contributors": [ - "lynn456", - "fscholz" + "septemhill" ] }, - "Web/JavaScript/Reference/Functions/Arrow_functions": { - "modified": "2020-10-15T21:36:09.562Z", + "Web/JavaScript/Reference/Global_Objects/Object/defineProperty": { + "modified": "2020-10-15T21:52:17.805Z", "contributors": [ "iigmir", - "ShawnLin", - "Lazine", - "xuan0123", - "bagayollow", - "ctc53", - "kuolun", - "jackblackevo", - "freddy50806", - "Aisuzuka", - "Jaja", - "tonykuo", - "yungtah", - "Snailpool", - "wkliang", - "linjimmy168", - "foxbrush" + "PeterTing", + "btooom", + "jsgao0", + "septemhill" ] }, - "Web/JavaScript/Reference/Functions/Default_parameters": { - "modified": "2020-10-05T03:37:47.112Z", + "Web/JavaScript/Reference/Global_Objects/Object/freeze": { + "modified": "2020-10-15T22:00:25.623Z", "contributors": [ - "realspirit2017", - "Jackson45252", - "jsgao0", - "Snailpool" + "leowu" ] }, - "Web/JavaScript/Reference/Functions/Method_definitions": { - "modified": "2020-10-15T21:55:16.559Z", + "Web/JavaScript/Reference/Global_Objects/Object/getPrototypeOf": { + "modified": "2019-03-23T22:44:35.153Z", "contributors": [ - "iigmir", - "jackblackevo" + "Shiyou", + "alk03073135" ] }, - "Web/JavaScript/Reference/Functions/arguments": { - "modified": "2020-10-15T21:14:39.550Z", + "Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty": { + "modified": "2019-03-23T22:48:25.371Z", "contributors": [ - "itsems", - "jackblackevo", - "akari0624", - "fscholz", - "irvinfly", - "teoli", - "happysadman" + "Shiyou", + "alk03073135" ] }, - "Web/JavaScript/Reference/Functions/arguments/callee": { - "modified": "2020-03-12T19:45:29.084Z", + "Web/JavaScript/Reference/Global_Objects/Object/keys": { + "modified": "2019-03-23T22:30:46.813Z", "contributors": [ + "yuugou727", + "roycrxtw", + "kdex", "jackblackevo" ] }, - "Web/JavaScript/Reference/Functions/get": { - "modified": "2020-10-15T22:17:05.787Z", + "Web/JavaScript/Reference/Global_Objects/Object/preventExtensions": { + "modified": "2019-03-23T22:39:57.504Z", "contributors": [ - "iigmir" + "ALiangLiang" ] }, - "Web/JavaScript/Reference/Functions/rest_parameters": { - "modified": "2020-10-15T21:56:42.865Z", + "Web/JavaScript/Reference/Global_Objects/Object/proto": { + "modified": "2020-10-15T22:00:26.656Z", "contributors": [ - "Kevin_Chen", + "leowu" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Promise": { + "modified": "2020-10-15T21:50:59.376Z", + "contributors": [ + "iigmir", + "nyngwang", + "jackblackevo" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Promise/all": { + "modified": "2020-10-15T21:51:02.408Z", + "contributors": [ + "nyngwang", + "jackblackevo" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Promise/catch": { + "modified": "2020-10-15T21:51:02.070Z", + "contributors": [ + "nyngwang", + "Calvin-Huang", + "liuderchi", + "jackblackevo" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Promise/finally": { + "modified": "2020-10-15T22:08:07.469Z", + "contributors": [ + "t7yang", + "l13013312333" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Promise/race": { + "modified": "2020-10-15T21:51:03.822Z", + "contributors": [ + "james58899", + "nyngwang", + "jackblackevo" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Promise/reject": { + "modified": "2020-10-15T21:56:03.979Z", + "contributors": [ + "nyngwang" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Promise/resolve": { + "modified": "2020-10-15T21:56:02.943Z", + "contributors": [ + "nyngwang" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Promise/then": { + "modified": "2020-10-15T21:51:00.608Z", + "contributors": [ + "nyngwang", + "jackblackevo", + "liuderchi" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Proxy": { + "modified": "2020-10-15T21:54:48.783Z", + "contributors": [ + "aChinKaiWu", + "jackblackevo" + ] + }, + "Web/JavaScript/Reference/Global_Objects/RangeError": { + "modified": "2020-10-15T22:17:59.783Z", + "contributors": [ + "hmysjiang" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Reflect": { + "modified": "2019-03-23T22:11:01.546Z", + "contributors": [ + "jackblackevo" + ] + }, + "Web/JavaScript/Reference/Global_Objects/RegExp": { + "modified": "2020-10-15T22:28:47.846Z", + "contributors": [ + "政衛" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Set": { + "modified": "2020-10-15T22:04:11.196Z", + "contributors": [ + "manny3", + "jackblackevo" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Set/add": { + "modified": "2020-10-15T22:17:57.665Z", + "contributors": [ + "hmysjiang" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Set/clear": { + "modified": "2020-10-15T22:17:57.573Z", + "contributors": [ + "hmysjiang" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Set/delete": { + "modified": "2020-10-15T22:17:57.330Z", + "contributors": [ + "hmysjiang" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Set/entries": { + "modified": "2020-10-15T22:17:57.657Z", + "contributors": [ + "hmysjiang" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Set/has": { + "modified": "2020-10-15T22:17:58.294Z", + "contributors": [ + "hmysjiang" + ] + }, + "Web/JavaScript/Reference/Global_Objects/Set/values": { + "modified": "2020-10-15T22:18:02.187Z", + "contributors": [ + "hmysjiang" + ] + }, + "Web/JavaScript/Reference/Global_Objects/String": { + "modified": "2020-10-15T21:28:07.530Z", + "contributors": [ + "wbamberg", + "jackblackevo", + "jsgao0", + "iigmir", + "teoli", + "fscholz" + ] + }, + "Web/JavaScript/Reference/Global_Objects/String/match": { + "modified": "2020-10-15T22:05:42.504Z", + "contributors": [ + "YF-Tung", + "joshra" + ] + }, + "Web/JavaScript/Reference/Global_Objects/String/padStart": { + "modified": "2019-03-23T22:19:32.101Z", + "contributors": [ + "teoli", + "lychee.tw" + ] + }, + "Web/JavaScript/Reference/Global_Objects/String/replace": { + "modified": "2020-10-15T21:28:07.269Z", + "contributors": [ + "oooooo", + "joshra", + "imrobinized", + "iigmir", + "jackblackevo", + "teoli", + "shyangs" + ] + }, + "Web/JavaScript/Reference/Global_Objects/String/toLowerCase": { + "modified": "2020-10-15T22:21:28.664Z", + "contributors": [ + "goden.cheng" + ] + }, + "Web/JavaScript/Reference/Global_Objects/TypedArray": { + "modified": "2020-10-15T21:47:14.859Z", + "contributors": [ + "jackblackevo" + ] + }, + "Web/JavaScript/Reference/Global_Objects/URIError": { + "modified": "2020-10-15T22:17:56.619Z", + "contributors": [ + "hmysjiang" + ] + }, + "Web/JavaScript/Reference/Global_Objects/isNaN": { + "modified": "2020-10-15T21:51:29.113Z", + "contributors": [ + "bluetata", + "iigmir" + ] + }, + "Web/JavaScript/Reference/Global_Objects/null": { + "modified": "2020-03-12T19:44:24.320Z", + "contributors": [ + "jackblackevo" + ] + }, + "Web/JavaScript/Reference/Global_Objects/parseInt": { + "modified": "2020-10-15T21:48:43.179Z", + "contributors": [ + "kcliu", + "DaiYaXu", + "iigmir", + "Shiyou" + ] + }, + "Web/JavaScript/Reference/Global_Objects/undefined": { + "modified": "2020-10-15T21:47:42.561Z", + "contributors": [ + "jackblackevo" + ] + }, + "Web/JavaScript/Reference/Iteration_protocols": { + "modified": "2020-03-12T19:45:00.332Z", + "contributors": [ + "jackblackevo", + "nyngwang" + ] + }, + "Web/JavaScript/Reference/Lexical_grammar": { + "modified": "2020-10-15T22:00:27.351Z", + "contributors": [ + "leowu" + ] + }, + "Web/JavaScript/Reference/Operators": { + "modified": "2020-03-12T19:38:35.397Z", + "contributors": [ + "jackblackevo", + "cwlin0416", + "iigmir", + "teoli", + "Zhen.Di-Lin", + "ethertank" + ] + }, + "Web/JavaScript/Reference/Operators/Comma_Operator": { + "modified": "2020-03-12T19:45:21.494Z", + "contributors": [ + "jackblackevo" + ] + }, + "Web/JavaScript/Reference/Operators/Conditional_Operator": { + "modified": "2020-10-15T22:29:30.361Z", + "contributors": [ + "liaocCM" + ] + }, + "Web/JavaScript/Reference/Operators/Destructuring_assignment": { + "modified": "2020-10-15T21:51:08.444Z", + "contributors": [ + "DexterLeung", + "salagadoola", + "iigmir", + "jsgao0", + "jackblackevo", + "flyinglimao" + ] + }, + "Web/JavaScript/Reference/Operators/Object_initializer": { + "modified": "2020-03-12T19:46:20.319Z", + "contributors": [ + "cyanchu", + "jackblackevo" + ] + }, + "Web/JavaScript/Reference/Operators/Operator_Precedence": { + "modified": "2020-03-12T19:45:00.937Z", + "contributors": [ + "KateWuSH", + "jackblackevo" + ] + }, + "Web/JavaScript/Reference/Operators/Optional_chaining": { + "modified": "2020-10-15T22:28:31.905Z", + "contributors": [ + "DexterLeung" + ] + }, + "Web/JavaScript/Reference/Operators/Spread_syntax": { + "modified": "2020-10-15T22:33:09.945Z", + "contributors": [ + "neko12377", + "kenchill" + ] + }, + "Web/JavaScript/Reference/Operators/async_function": { + "modified": "2020-10-15T22:12:38.986Z", + "contributors": [ + "extend1994" + ] + }, + "Web/JavaScript/Reference/Operators/await": { + "modified": "2020-03-12T19:45:41.284Z", + "contributors": [ + "kuolun", + "liuderchi", + "roycrxtw" + ] + }, + "Web/JavaScript/Reference/Operators/super": { + "modified": "2020-10-15T22:23:09.531Z", + "contributors": [ + "YunHan-Tsai" + ] + }, + "Web/JavaScript/Reference/Operators/this": { + "modified": "2020-10-15T21:48:46.137Z", + "contributors": [ + "iigmir", + "Rocker", + "chloewlin" + ] + }, + "Web/JavaScript/Reference/Operators/typeof": { + "modified": "2020-03-12T19:38:23.416Z", + "contributors": [ + "roycrxtw", "jackblackevo", - "jsgao0" + "teoli", + "Johnny.Net" ] }, - "Web/JavaScript/Reference/Functions/set": { - "modified": "2020-10-15T22:17:33.994Z", + "Web/JavaScript/Reference/Statements": { + "modified": "2020-10-15T21:22:18.510Z", + "contributors": [ + "simba-fs", + "Ethan.Lin", + "jackblackevo", + "stdio2017", + "cwlin0416", + "teoli", + "trevorh" + ] + }, + "Web/JavaScript/Reference/Statements/async_function": { + "modified": "2020-10-15T21:53:37.954Z", + "contributors": [ + "kevin10410", + "iigmir", + "weihanglo", + "liuderchi" + ] + }, + "Web/JavaScript/Reference/Statements/block": { + "modified": "2020-03-12T19:38:43.767Z", + "contributors": [ + "lin1987www", + "jackblackevo", + "teoli", + "irvinfly", + "tjjh89017" + ] + }, + "Web/JavaScript/Reference/Statements/break": { + "modified": "2020-10-15T21:25:32.531Z", + "contributors": [ + "jackblackevo", + "teoli", + "Littlebtc", + "tjjh89017" + ] + }, + "Web/JavaScript/Reference/Statements/const": { + "modified": "2020-10-15T21:58:04.721Z", + "contributors": [ + "iigmir", + "KevinHuang" + ] + }, + "Web/JavaScript/Reference/Statements/debugger": { + "modified": "2020-10-15T22:00:23.902Z", "contributors": [ "iigmir" ] }, - "Web/JavaScript/Reference/Global_Objects": { - "modified": "2020-03-12T19:38:39.590Z", + "Web/JavaScript/Reference/Statements/export": { + "modified": "2020-10-15T21:54:04.868Z", + "contributors": [ + "wangchou", + "iigmir", + "DalaneGarmin", + "MOSapeizer" + ] + }, + "Web/JavaScript/Reference/Statements/for...in": { + "modified": "2020-03-12T19:39:20.179Z", "contributors": [ - "tony8382", - "chialin", "jackblackevo", - "jsgao0", - "cwlin0416", "teoli", - "Sheppy" + "shyangs" ] }, - "Web/JavaScript/Reference/Global_Objects/Array": { - "modified": "2020-10-15T21:31:26.717Z", + "Web/JavaScript/Reference/Statements/function*": { + "modified": "2020-10-15T21:45:50.090Z", "contributors": [ - "hua-123", - "kyob1010", - "Aries0d0f", - "KevinHuang", - "k940545", + "iendeavor", "jackblackevo", - "tswenja", + "DaomingC", "kdex", - "petercpg", - "Kaiyeh", - "cwlin0416", - "oooooo", - "m80126colin", - "lizlux" + "ALiangLiang", + "tom76kimo" + ] + }, + "Web/JavaScript/Reference/Statements/if...else": { + "modified": "2020-12-06T07:23:20.735Z", + "contributors": [ + "rei1997", + "paiyuliu", + "jackblackevo", + "willynpi" + ] + }, + "Web/JavaScript/Reference/Statements/import": { + "modified": "2020-10-15T21:53:11.297Z", + "contributors": [ + "iigmir", + "freddy50806", + "pololin", + "kweisamx", + "RichCharlie", + "DuckBreeder" + ] + }, + "Web/JavaScript/Reference/Statements/label": { + "modified": "2020-10-15T22:15:49.920Z", + "contributors": [ + "willh" + ] + }, + "Web/JavaScript/Reference/Statements/let": { + "modified": "2020-10-15T21:45:04.003Z", + "contributors": [ + "ShawnLin", + "Zhang-Junzhi", + "iigmir", + "zxa011023", + "YamiOdymel", + "ALiangLiang" + ] + }, + "Web/JavaScript/Reference/Statements/return": { + "modified": "2020-10-15T22:02:41.359Z", + "contributors": [ + "iigmir" + ] + }, + "Web/JavaScript/Reference/Statements/switch": { + "modified": "2020-10-15T22:25:04.906Z", + "contributors": [ + "iigmir", + "Lazine" + ] + }, + "Web/JavaScript/Reference/Statements/throw": { + "modified": "2020-03-12T19:45:24.946Z", + "contributors": [ + "jackblackevo" + ] + }, + "Web/JavaScript/Reference/Statements/var": { + "modified": "2020-03-12T19:38:31.590Z", + "contributors": [ + "jackblackevo", + "teoli", + "Johnny.Net" + ] + }, + "Web/JavaScript/Reference/Strict_mode": { + "modified": "2020-03-12T19:46:40.566Z", + "contributors": [ + "WellyHong", + "Aries0d0f", + "DarkNami", + "MOSapeizer" + ] + }, + "Web/JavaScript/Reference/Template_literals": { + "modified": "2020-10-15T21:53:17.228Z", + "contributors": [ + "jackblackevo", + "xsfishxs" + ] + }, + "Web/JavaScript/Shells": { + "modified": "2020-03-12T19:45:29.748Z", + "contributors": [ + "JianHuaHe" + ] + }, + "Web/JavaScript/Typed_arrays": { + "modified": "2020-03-12T19:36:15.816Z", + "contributors": [ + "ballfish", + "jackblackevo", + "roycrxtw", + "teoli", + "Kennyluck" + ] + }, + "Web/Manifest": { + "modified": "2020-11-18T03:32:37.890Z", + "contributors": [ + "SphinxKnight", + "wifr1126q", + "t7yang", + "BwayCer" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/@@iterator": { - "modified": "2020-10-15T22:02:20.291Z", + "Web/MathML": { + "modified": "2019-03-23T23:22:17.865Z", "contributors": [ - "jackblackevo" + "sailplaneTW" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/Reduce": { - "modified": "2020-10-15T21:54:40.258Z", + "Web/MathML/Authoring": { + "modified": "2019-03-23T23:22:11.037Z", "contributors": [ - "Ashe_Li", - "jackblackevo", - "iigmir", - "dwatow", - "yozian" + "fred.wang", + "sailplaneTW" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/concat": { - "modified": "2020-10-15T21:46:28.512Z", + "Web/Media": { + "modified": "2019-03-18T21:40:43.859Z", "contributors": [ - "jackblackevo", - "tericky" + "willynpi", + "learnfromfail" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/copyWithin": { - "modified": "2020-10-15T22:01:15.329Z", + "Web/Media/Formats": { + "modified": "2020-02-18T06:39:28.429Z", "contributors": [ - "jackblackevo" + "Sheppy" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/entries": { - "modified": "2020-10-15T21:47:10.197Z", + "Web/Media/Formats/Containers": { + "modified": "2020-02-19T03:38:30.649Z", "contributors": [ - "jackblackevo", - "tericky" + "JamesGoler" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/every": { - "modified": "2020-10-15T21:56:41.781Z", + "Web/OpenSearch": { + "modified": "2019-03-23T22:00:23.747Z", "contributors": [ "jackblackevo", - "AkanishiChi", - "jsgao0" + "iigmir", + "teoli", + "Mgjbot", + "Sam268276", + "BobChao" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/fill": { - "modified": "2020-10-15T21:56:41.165Z", + "Web/Progressive_web_apps": { + "modified": "2019-03-18T20:52:03.723Z", "contributors": [ - "jackblackevo", - "jsgao0" + "chrisdavidmills", + "iigmir" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/filter": { - "modified": "2020-10-15T21:38:35.707Z", + "Web/Reference": { + "modified": "2019-03-23T23:29:16.937Z", "contributors": [ - "Jenhaohsiao", "jackblackevo", - "iigmir", - "jsgao0", - "alk03073135" + "Somnlent", + "Sheppy" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/find": { - "modified": "2020-10-15T21:42:27.701Z", + "Web/Reference/API": { + "modified": "2019-03-23T23:05:52.036Z", "contributors": [ "jackblackevo", - "iigmir", - "ALiangLiang" + "wildsky" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/findIndex": { - "modified": "2020-10-15T21:51:49.109Z", + "Web/SVG": { + "modified": "2019-01-16T17:22:30.480Z", "contributors": [ - "jackblackevo", - "tooto1985", - "auver", - "Snailpool" + "ethertank", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/flat": { - "modified": "2020-10-15T22:11:38.333Z", + "Web/SVG/Attribute": { + "modified": "2019-03-23T23:26:15.897Z", "contributors": [ - "SageX", - "Euphokumiko" + "Jeremie" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/forEach": { - "modified": "2020-10-15T21:46:18.574Z", + "Web/SVG/Attribute/fill-rule": { + "modified": "2019-03-23T23:26:22.091Z", "contributors": [ - "jackblackevo", - "iigmir", - "wangqimeng", - "nt46", - "akari0624" + "panallen" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/from": { - "modified": "2020-10-15T21:52:49.849Z", + "Web/SVG/Attribute/stroke-dashoffset": { + "modified": "2019-03-20T22:42:12.300Z", "contributors": [ - "qwer5656", - "jackblackevo", - "petercpg", - "tericky" + "EnRico.Lam", + "bing-Guo" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/includes": { - "modified": "2020-10-15T22:02:19.463Z", + "Web/SVG/Tutorial": { + "modified": "2019-03-23T23:35:01.636Z", "contributors": [ - "SiderealArt", - "sonelin09", - "xuan311", - "vaynewang", - "jackblackevo" + "Snailpool", + "sunghau", + "ethertank", + "ziyunfei", + "Dx.Yang" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/indexOf": { - "modified": "2020-10-15T21:56:48.783Z", + "Web/SVG/Tutorial/Fills_and_Strokes": { + "modified": "2019-03-23T23:34:13.639Z", "contributors": [ "jackblackevo", - "jsgao0" + "ethertank", + "Dx.Yang" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/isArray": { - "modified": "2020-10-15T21:34:45.216Z", + "Web/SVG/Tutorial/Getting_Started": { + "modified": "2019-03-23T23:34:51.093Z", "contributors": [ "jackblackevo", - "tericky", - "m80126colin", - "JamesWen", - "onlinemad" + "Kustz", + "ethertank", + "Dx.Yang" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/join": { - "modified": "2020-10-15T21:47:08.883Z", + "Web/SVG/Tutorial/Gradients": { + "modified": "2019-03-23T23:34:17.990Z", "contributors": [ "jackblackevo", "iigmir", - "JamesWen" + "ethertank", + "Dx.Yang" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/keys": { - "modified": "2020-10-15T22:02:18.808Z", + "Web/SVG/Tutorial/Introduction": { + "modified": "2019-03-23T23:34:52.348Z", "contributors": [ - "jackblackevo" + "ethertank", + "Dx.Yang" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf": { - "modified": "2020-10-15T22:02:16.799Z", + "Web/SVG/Tutorial/Patterns": { + "modified": "2019-03-23T23:34:09.915Z", "contributors": [ - "jackblackevo" + "jackblackevo", + "ethertank", + "Dx.Yang" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/length": { - "modified": "2020-10-15T21:58:21.627Z", + "Web/SVG/Tutorial/Positions": { + "modified": "2019-03-23T23:34:48.671Z", "contributors": [ - "tericky", - "yenchenglai0618", - "mybaseball52" + "Kustz", + "ethertank", + "ziyunfei", + "Dx.Yang" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/map": { - "modified": "2020-10-15T21:53:08.025Z", + "Web/Security": { + "modified": "2019-09-10T16:50:03.503Z", "contributors": [ - "iigmir", - "jackblackevo", - "jWorker", - "akari0624" + "SphinxKnight", + "jackblackevo" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/of": { - "modified": "2020-10-15T22:01:03.622Z", + "Web/Security/Insecure_passwords": { + "modified": "2019-03-20T14:57:01.510Z", "contributors": [ - "jackblackevo" + "BaseChipmunk4", + "iigmir", + "jwhitlock" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/pop": { - "modified": "2020-10-15T21:56:21.800Z", + "Web/Security/Mixed_content": { + "modified": "2019-03-23T23:04:08.690Z", "contributors": [ "jackblackevo", - "yvonne6344" + "iigmir", + "a780201", + "wildsky", + "Asheesh" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/push": { - "modified": "2020-10-15T21:42:28.441Z", + "Web/Security/Mixed_content/How_to_fix_website_with_mixed_content": { + "modified": "2019-03-23T23:04:13.940Z", "contributors": [ "jackblackevo", - "yvonne6344", "iigmir", - "ALiangLiang" + "wildsky" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/reverse": { - "modified": "2020-10-15T21:31:21.385Z", + "Web/Security/Same-origin_policy": { + "modified": "2020-09-01T23:06:58.364Z", "contributors": [ + "JustBelieveMe", "jackblackevo", - "CYBAI" + "MashKao", + "teoli", + "foxbrush" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/shift": { - "modified": "2020-10-15T21:50:12.873Z", + "Web/Security/Weak_Signature_Algorithm": { + "modified": "2019-04-23T04:20:20.884Z", "contributors": [ "jackblackevo", - "marktwtn" + "15182254444", + "KINGKKALING", + "Sbabey", + "leVirve" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/slice": { - "modified": "2020-10-15T22:00:48.969Z", + "Web/Tutorials": { + "modified": "2019-09-03T07:07:31.640Z", "contributors": [ - "rosa", - "pig3629", - "jackblackevo" + "lalasoqTW", + "katsmin", + "mgrn", + "KevinHuang.lds", + "sailplaneTW" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/some": { - "modified": "2020-10-15T22:02:17.128Z", + "WebAssembly": { + "modified": "2020-10-15T22:04:56.309Z", "contributors": [ - "iigmir", - "jackblackevo" + "Aries0d0f" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/sort": { - "modified": "2020-10-15T21:31:18.682Z", + "orphaned/Core_JavaScript_1.5_正規表達式的建立": { + "modified": "2019-03-24T00:00:58.216Z", "contributors": [ - "jackblackevo", - "CYBAI" + "wbamberg", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/splice": { - "modified": "2020-10-15T21:56:28.206Z", + "orphaned/Cross-site_XMLHttpRequest": { + "modified": "2019-01-16T15:28:10.716Z", "contributors": [ - "jackblackevo", - "jsgao0", - "Mars-Hung" + "Mgjbot", + "BobChao", + "Coolcd" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/unshift": { - "modified": "2020-10-15T21:50:29.110Z", + "orphaned/DOM_觀察器": { + "modified": "2019-01-16T13:41:41.852Z", "contributors": [ - "jsgao0", - "jackblackevo", - "roycrxtw", - "marktwtn" + "273K" ] }, - "Web/JavaScript/Reference/Global_Objects/Array/values": { - "modified": "2020-10-15T22:02:17.406Z", + "conflicting/Web/API/HTML_Drag_and_Drop_API": { + "modified": "2019-01-16T13:26:51.358Z", "contributors": [ - "jackblackevo" + "sailplaneTW" ] }, - "Web/JavaScript/Reference/Global_Objects/ArrayBuffer": { - "modified": "2019-03-24T00:11:11.336Z", + "orphaned/Firefox_3.5_技術文件": { + "modified": "2019-03-23T23:59:44.778Z", "contributors": [ - "jackblackevo", + "irvinfly", + "RJ_Hsiao", "teoli", - "Kennyluck" + "Littlebtc", + "BobChao" ] }, - "Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype": { - "modified": "2019-03-23T22:31:10.924Z", + "orphaned/Firefox_中的離線資源": { + "modified": "2019-03-24T00:13:31.494Z", "contributors": [ - "teoli", - "jackblackevo" + "sailplaneTW" ] }, - "Web/JavaScript/Reference/Global_Objects/AsyncFunction": { - "modified": "2020-10-15T22:18:02.118Z", + "orphaned/HTML5_Cross_Browser_Polyfills": { + "modified": "2019-01-16T13:58:45.342Z", "contributors": [ - "gamerslouis" + "Kennyluck" ] }, - "Web/JavaScript/Reference/Global_Objects/BigInt": { - "modified": "2020-10-15T22:17:57.888Z", + "orphaned/Learn/How_to_contribute": { + "modified": "2020-07-16T22:33:48.192Z", "contributors": [ - "hmysjiang" + "SphinxKnight", + "willynpi", + "iigmir" ] }, - "Web/JavaScript/Reference/Global_Objects/Boolean": { - "modified": "2019-03-23T22:06:45.293Z", + "Learn/Forms/How_to_structure_a_web_form": { + "modified": "2020-07-16T22:21:16.863Z", "contributors": [ - "jsgao0" + "iigmir", + "anniesnoopymd", + "chrisdavidmills", + "Sheppy", + "kitty-5420" ] }, - "Web/JavaScript/Reference/Global_Objects/DataView": { - "modified": "2019-03-23T22:31:20.723Z", + "Learn/Forms": { + "modified": "2020-07-16T22:21:03.096Z", "contributors": [ - "edu1218", - "jackblackevo" + "nighet", + "chrisdavidmills", + "iigmir", + "Shiyou", + "saka6333", + "jcchang", + "sjmiles" ] }, - "Web/JavaScript/Reference/Global_Objects/Date": { - "modified": "2019-03-23T22:26:48.329Z", + "Learn/HTML/Multimedia_and_embedding/Images_in_HTML": { + "modified": "2020-07-20T05:13:25.235Z", "contributors": [ - "NoobTW", - "ddtet" + "zackjtl", + "LeonchanTW" ] }, - "Web/JavaScript/Reference/Global_Objects/Date/UTC": { - "modified": "2019-03-23T22:26:04.734Z", + "Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies": { + "modified": "2020-09-27T08:20:57.717Z", "contributors": [ - "ddtet" + "CoderAmutu" ] }, - "Web/JavaScript/Reference/Global_Objects/Date/getDay": { - "modified": "2020-10-15T22:34:16.631Z", + "Learn/HTML/Tables/Basics": { + "modified": "2020-11-25T04:21:37.312Z", "contributors": [ - "manny3" + "123milkcat", + "allchangechallenge" ] }, - "Web/JavaScript/Reference/Global_Objects/Date/now": { - "modified": "2019-03-23T22:26:18.288Z", + "Learn/Performance/Multimedia": { + "modified": "2020-07-16T22:40:44.626Z", "contributors": [ - "ddtet" + "b84330808" ] }, - "Web/JavaScript/Reference/Global_Objects/Date/prototype": { - "modified": "2019-03-23T22:26:36.902Z", + "Learn/Server-side/First_steps/Introduction": { + "modified": "2020-10-29T10:39:42.677Z", "contributors": [ - "ddtet" + "JamesGoler", + "Kun-Neng", + "vivihenry", + "frank030310" ] }, - "Web/JavaScript/Reference/Global_Objects/Error": { - "modified": "2019-03-23T22:30:39.821Z", + "MDN/At_ten": { + "modified": "2019-03-23T22:49:37.556Z", "contributors": [ - "jsgao0", - "jackblackevo", - "josephmcasey" + "alk03073135" ] }, - "Web/JavaScript/Reference/Global_Objects/Error/columnNumber": { - "modified": "2019-03-23T22:30:40.645Z", + "orphaned/MDN/Community": { + "modified": "2020-05-24T00:35:19.952Z", "contributors": [ - "teoli", - "jerrychen1013" + "nighet", + "wbamberg", + "SecondSpirit", + "ALiangLiang", + "a0983891582", + "king_5266" ] }, - "Web/JavaScript/Reference/Global_Objects/Function": { - "modified": "2019-03-23T23:25:10.636Z", + "orphaned/MDN/Community/Conversations": { + "modified": "2020-05-24T00:50:25.189Z", "contributors": [ - "Calvin-Huang", - "jackblackevo", - "teoli", - "Bergi" + "nighet" ] }, - "Web/JavaScript/Reference/Global_Objects/Function/apply": { - "modified": "2020-04-16T06:07:17.467Z", + "orphaned/MDN/Contribute/Howto/Create_an_MDN_account": { + "modified": "2019-01-16T21:17:57.540Z", "contributors": [ - "jacko1114", - "ayuha406645", - "Snailpool" + "wbamberg", + "iigmir", + "f19857466" ] }, - "Web/JavaScript/Reference/Global_Objects/Function/bind": { - "modified": "2019-03-23T22:07:11.766Z", + "orphaned/MDN/Contribute/Howto/Do_a_technical_review": { + "modified": "2019-03-23T22:32:06.855Z", "contributors": [ - "storyh66224", + "wbamberg", "iigmir", - "nyngwang", - "aaaOOttOOaaa" + "mgrn" ] }, - "Web/JavaScript/Reference/Global_Objects/Function/call": { - "modified": "2019-03-23T23:25:00.404Z", + "orphaned/MDN/Contribute/Howto/Do_an_editorial_review": { + "modified": "2019-08-12T14:08:44.950Z", "contributors": [ - "jackblackevo", - "teoli", - "Zhen.Di-Lin" + "ayugioh2003", + "wbamberg", + "jwhitlock", + "flyinglimao" ] }, - "Web/JavaScript/Reference/Global_Objects/Function/length": { - "modified": "2019-03-23T22:39:23.276Z", + "orphaned/MDN/Contribute/Howto/Set_the_summary_for_a_page": { + "modified": "2019-03-23T22:02:13.738Z", "contributors": [ - "CYBAI", - "lessmind" + "wbamberg", + "Astrid-GitHub", + "RSyehann" ] }, - "Web/JavaScript/Reference/Global_Objects/Function/prototype": { - "modified": "2019-03-23T22:30:13.335Z", + "orphaned/MDN/Editor/Basics": { + "modified": "2020-09-30T15:44:37.917Z", "contributors": [ - "jackblackevo" + "chrisdavidmills", + "wbamberg", + "tpst1114" ] }, - "Web/JavaScript/Reference/Global_Objects/Infinity": { - "modified": "2020-10-15T21:47:39.391Z", + "orphaned/MDN/Editor/Keyboard_shortcuts": { + "modified": "2020-09-30T15:44:37.748Z", "contributors": [ - "iigmir", - "tooto1985", - "jackblackevo" + "chrisdavidmills", + "wbamberg", + "jackblackevo", + "JoanneWu" ] }, - "Web/JavaScript/Reference/Global_Objects/JSON": { - "modified": "2020-10-15T21:48:40.820Z", + "orphaned/MDN/Editor": { + "modified": "2020-09-30T15:44:37.576Z", "contributors": [ - "rolflo", - "iigmir", - "Ende93" + "chrisdavidmills", + "wbamberg", + "EatPizza311", + "tpst1114", + "jswisher" ] }, - "Web/JavaScript/Reference/Global_Objects/JSON/parse": { - "modified": "2020-04-17T04:18:46.439Z", + "MDN/Yari": { + "modified": "2019-09-06T03:30:44.825Z", "contributors": [ - "jacko1114", - "bigbitesaint", - "matthung0807", + "SphinxKnight", + "wbamberg", "iigmir", - "kuolun" + "SecondSpirit", + "a8040282", + "Sheppy" ] }, - "Web/JavaScript/Reference/Global_Objects/JSON/stringify": { - "modified": "2020-10-15T22:00:16.083Z", + "orphaned/Mozilla/Firefox/Releases/4/Firefox_4_開發者新功能概覽": { + "modified": "2019-04-23T03:28:52.095Z", "contributors": [ - "gyau97", - "SolomonKang" + "jackblackevo", + "wbamberg", + "SphinxKnight", + "irvinfly", + "teoli", + "BobChao" ] }, - "Web/JavaScript/Reference/Global_Objects/Map": { - "modified": "2020-10-15T21:51:34.887Z", + "Web/SVG/Tutorial/Basic_Shapes": { + "modified": "2019-04-23T03:35:52.184Z", "contributors": [ - "othree", - "tainenko", "jackblackevo", - "jsgao0" + "ethertank", + "Dx.Yang" ] }, - "Web/JavaScript/Reference/Global_Objects/Math": { - "modified": "2020-10-15T21:38:29.906Z", + "Tools/Web_Console/UI_Tour": { + "modified": "2020-07-16T22:34:17.831Z", "contributors": [ - "hmysjiang", - "jackblackevo", - "fscholz" + "iigmir" ] }, - "Web/JavaScript/Reference/Global_Objects/Math/abs": { - "modified": "2020-10-15T22:02:08.344Z", + "conflicting/Web/Guide": { + "modified": "2019-01-16T13:10:01.650Z", "contributors": [ - "jackblackevo" + "teoli", + "Sonrisa" ] }, - "Web/JavaScript/Reference/Global_Objects/Math/ceil": { - "modified": "2020-10-15T22:02:07.035Z", + "Web/API/Document_Object_Model/Events": { + "modified": "2019-03-23T22:27:33.501Z", "contributors": [ - "jackblackevo" + "H-W-Chang" ] }, - "Web/JavaScript/Reference/Global_Objects/Math/floor": { - "modified": "2020-10-15T22:02:06.863Z", + "Web/API/Document/createTreeWalker": { + "modified": "2019-03-23T23:14:12.386Z", "contributors": [ - "ted31013", - "chochinlu", - "Hagen", - "jackblackevo" + "jsx", + "shyangs" ] }, - "Web/JavaScript/Reference/Global_Objects/Math/max": { - "modified": "2020-10-15T22:03:35.771Z", + "Web/API/Geolocation_API": { + "modified": "2019-12-15T11:33:42.173Z", "contributors": [ - "jackblackevo" + "ayugioh2003", + "jackblackevo", + "MashKao" ] }, - "Web/JavaScript/Reference/Global_Objects/Math/pow": { - "modified": "2020-10-21T10:01:06.689Z", + "Web/API/HTMLOrForeignElement/dataset": { + "modified": "2019-03-18T21:38:45.005Z", "contributors": [ - "SvampK", - "iigmir" + "willynpi" ] }, - "Web/JavaScript/Reference/Global_Objects/Math/random": { - "modified": "2020-10-17T07:58:50.159Z", + "Web/API/ElementCSSInlineStyle/style": { + "modified": "2019-03-23T22:20:07.015Z", "contributors": [ - "RocketSH" + "jackblackevo" ] }, - "Web/JavaScript/Reference/Global_Objects/Math/round": { - "modified": "2019-03-23T22:48:34.807Z", + "Web/API/HTMLElement/innerText": { + "modified": "2019-03-23T22:12:44.697Z", "contributors": [ - "alk03073135" + "jackblackevo" ] }, - "Web/JavaScript/Reference/Global_Objects/NaN": { - "modified": "2020-10-15T21:47:39.178Z", + "Web/API/Performance/timing": { + "modified": "2020-10-15T21:29:18.100Z", "contributors": [ - "iigmir", - "jackblackevo" + "fscholz", + "BobChao" ] }, - "Web/JavaScript/Reference/Global_Objects/Number": { - "modified": "2019-03-23T22:28:21.747Z", + "Web/API/WebVTT_API": { + "modified": "2019-03-23T23:11:00.411Z", "contributors": [ - "jsgao0", - "sha1337" + "wbamberg", + "BobChao" ] }, - "Web/JavaScript/Reference/Global_Objects/Number/isFinite": { - "modified": "2020-10-15T22:03:26.099Z", + "Web/API/Window/history": { + "modified": "2019-03-23T23:27:30.087Z", "contributors": [ - "jackblackevo" + "jackblackevo", + "jsx", + "ChiLiJung" ] }, - "Web/JavaScript/Reference/Global_Objects/Number/isNaN": { - "modified": "2020-10-15T22:14:14.999Z", + "Web/API/WindowEventHandlers/onpopstate": { + "modified": "2019-03-23T23:27:28.070Z", "contributors": [ - "xguang" + "irvinfly", + "khalid32", + "ChiLiJung" ] }, - "Web/JavaScript/Reference/Global_Objects/Number/prototype": { - "modified": "2020-10-15T21:56:46.161Z", + "Web/API/window/requestAnimationFrame": { + "modified": "2020-10-15T21:24:54.235Z", "contributors": [ - "jsgao0" + "t7yang", + "Ekanan", + "North", + "foxbrush" ] }, - "Web/JavaScript/Reference/Global_Objects/Number/toExponential": { - "modified": "2019-03-23T22:28:18.890Z", + "orphaned/Web/CSS/border-image/border-image": { + "modified": "2019-03-24T00:08:11.061Z", "contributors": [ - "jsgao0", - "Shiyou" + "mrstork", + "teoli", + "Kennyluck" ] }, - "Web/JavaScript/Reference/Global_Objects/Number/toFixed": { - "modified": "2020-11-18T05:27:56.696Z", + "Learn/CSS/Howto/CSS_FAQ": { + "modified": "2020-07-16T22:25:46.290Z", "contributors": [ - "Johnnychun", - "jackblackevo" + "fscholz", + "teoli", + "Mgjbot", + "BobChao" ] }, - "Web/JavaScript/Reference/Global_Objects/Object": { - "modified": "2020-08-22T05:49:39.644Z", + "Web/API/Window/DOMContentLoaded_event": { + "modified": "2019-04-30T13:56:21.954Z", "contributors": [ - "+ono+", - "kuolun", + "wbamberg", + "fscholz", + "NoctisHsu", "jackblackevo", - "fscholz" + "ethertank", + "CarterTsai" ] }, - "Web/JavaScript/Reference/Global_Objects/Object/assign": { - "modified": "2020-10-15T21:51:19.104Z", + "Web/API/Window/load_event": { + "modified": "2019-03-23T22:18:11.736Z", "contributors": [ - "manny3", - "lmr3796", - "mitivic", - "BruceLi", - "septemhill", - "jsgao0" + "fscholz", + "Snailpool" ] }, - "Web/JavaScript/Reference/Global_Objects/Object/create": { - "modified": "2019-03-23T22:30:34.696Z", + "orphaned/Learn/HTML/Forms/HTML5_updates": { + "modified": "2019-03-23T23:28:09.563Z", "contributors": [ - "yuugou727", - "septemhill", - "jackblackevo" + "foxbrush" ] }, - "Web/JavaScript/Reference/Global_Objects/Object/defineProperties": { - "modified": "2019-03-23T22:18:00.161Z", + "Web/HTTP/Basics_of_HTTP/Data_URIs": { + "modified": "2020-06-09T11:41:01.440Z", "contributors": [ - "septemhill" + "jhihruei", + "jwhitlock", + "Shiyou", + "alk03073135" ] }, - "Web/JavaScript/Reference/Global_Objects/Object/defineProperty": { - "modified": "2020-10-15T21:52:17.805Z", + "Web/HTTP/Status/418": { + "modified": "2020-10-15T22:00:43.617Z", "contributors": [ "iigmir", - "PeterTing", - "btooom", - "jsgao0", - "septemhill" + "dzamlo" ] }, - "Web/JavaScript/Reference/Global_Objects/Object/freeze": { - "modified": "2020-10-15T22:00:25.623Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要": { + "modified": "2019-01-16T14:44:37.660Z", "contributors": [ - "leowu" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Object/getPrototypeOf": { - "modified": "2019-03-23T22:44:35.153Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要": { + "modified": "2019-01-16T14:43:16.706Z", "contributors": [ - "Shiyou", - "alk03073135" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty": { - "modified": "2019-03-23T22:48:25.371Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法": { + "modified": "2019-03-24T00:00:58.152Z", "contributors": [ - "Shiyou", - "alk03073135" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Object/keys": { - "modified": "2019-03-23T22:30:46.813Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法": { + "modified": "2019-03-24T00:00:57.682Z", "contributors": [ - "yuugou727", - "roycrxtw", - "kdex", - "jackblackevo" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Object/preventExtensions": { - "modified": "2019-03-23T22:39:57.504Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法": { + "modified": "2020-08-31T05:59:42.160Z", "contributors": [ - "ALiangLiang" + "clifflu", + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Object/proto": { - "modified": "2020-10-15T22:00:26.656Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義": { + "modified": "2019-01-16T14:44:26.521Z", "contributors": [ - "leowu" + "teoli", + "Sheppy", + "Jaric", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Object/prototype": { - "modified": "2019-03-23T22:44:24.956Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件": { + "modified": "2019-03-24T00:01:06.649Z", "contributors": [ - "Shiyou", - "alk03073135" + "wbamberg", + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Promise": { - "modified": "2020-10-15T21:50:59.376Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法": { + "modified": "2019-03-24T00:00:58.023Z", "contributors": [ - "iigmir", - "nyngwang", - "jackblackevo" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Promise/all": { - "modified": "2020-10-15T21:51:02.408Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法": { + "modified": "2019-03-24T00:01:00.198Z", "contributors": [ - "nyngwang", - "jackblackevo" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Promise/catch": { - "modified": "2020-10-15T21:51:02.070Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法": { + "modified": "2019-03-24T00:00:59.356Z", "contributors": [ - "nyngwang", - "Calvin-Huang", - "liuderchi", - "jackblackevo" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Promise/finally": { - "modified": "2020-10-15T22:08:07.469Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法": { + "modified": "2019-03-24T00:01:11.869Z", "contributors": [ - "t7yang", - "l13013312333" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Promise/prototype": { - "modified": "2020-10-15T21:51:00.110Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法": { + "modified": "2019-03-24T00:01:01.557Z", "contributors": [ - "nyngwang", - "jackblackevo" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Promise/race": { - "modified": "2020-10-15T21:51:03.822Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法": { + "modified": "2019-03-24T00:01:00.950Z", "contributors": [ - "james58899", - "nyngwang", - "jackblackevo" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Promise/reject": { - "modified": "2020-10-15T21:56:03.979Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義": { + "modified": "2019-03-24T00:01:05.950Z", "contributors": [ - "nyngwang" + "fscholz", + "jigs12", + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Promise/resolve": { - "modified": "2020-10-15T21:56:02.943Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立": { + "modified": "2019-03-24T00:01:06.394Z", "contributors": [ - "nyngwang" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Promise/then": { - "modified": "2020-10-15T21:51:00.608Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考": { + "modified": "2019-03-24T00:01:06.045Z", "contributors": [ - "nyngwang", - "jackblackevo", - "liuderchi" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Proxy": { - "modified": "2020-10-15T21:54:48.783Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除": { + "modified": "2019-03-24T00:01:04.888Z", "contributors": [ - "aChinKaiWu", - "jackblackevo" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/RangeError": { - "modified": "2020-10-15T22:17:59.783Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用": { + "modified": "2019-03-24T00:01:06.293Z", "contributors": [ - "hmysjiang" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Reflect": { - "modified": "2019-03-23T22:11:01.546Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義": { + "modified": "2019-03-24T00:01:03.034Z", "contributors": [ - "jackblackevo" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/RegExp": { - "modified": "2020-10-15T22:28:47.846Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用": { + "modified": "2019-03-24T00:01:06.480Z", "contributors": [ - "政衛" + "teoli", + "happysadman" + ] + }, + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引": { + "modified": "2019-03-24T00:01:04.238Z", + "contributors": [ + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Set": { - "modified": "2020-10-15T22:04:11.196Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性": { + "modified": "2019-03-24T00:01:04.444Z", "contributors": [ - "manny3", - "jackblackevo" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Set/add": { - "modified": "2020-10-15T22:17:57.665Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫": { + "modified": "2019-03-24T00:00:58.884Z", "contributors": [ - "hmysjiang" + "wildsky", + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Set/clear": { - "modified": "2020-10-15T22:17:57.573Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立": { + "modified": "2019-03-24T00:01:00.293Z", "contributors": [ - "hmysjiang" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Set/delete": { - "modified": "2020-10-15T22:17:57.330Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例": { + "modified": "2019-03-24T00:00:59.567Z", "contributors": [ - "hmysjiang" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Set/entries": { - "modified": "2020-10-15T22:17:57.657Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法": { + "modified": "2019-03-24T00:00:59.074Z", "contributors": [ - "hmysjiang" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Set/has": { - "modified": "2020-10-15T22:17:58.294Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承": { + "modified": "2019-03-24T00:01:09.212Z", "contributors": [ - "hmysjiang" + "jsgao0", + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/Set/values": { - "modified": "2020-10-15T22:18:02.187Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子": { + "modified": "2019-03-24T00:01:18.422Z", "contributors": [ - "hmysjiang" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/String": { - "modified": "2020-10-15T21:28:07.530Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性": { + "modified": "2019-03-24T00:01:21.807Z", "contributors": [ - "wbamberg", - "jackblackevo", - "jsgao0", - "iigmir", "teoli", - "fscholz" + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/String/match": { - "modified": "2020-10-15T22:05:42.504Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入": { + "modified": "2019-03-24T00:01:15.806Z", "contributors": [ - "YF-Tung", - "joshra" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/String/padStart": { - "modified": "2019-03-23T22:19:32.101Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承": { + "modified": "2019-03-24T00:01:17.728Z", "contributors": [ "teoli", - "lychee.tw" + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/String/prototype": { - "modified": "2020-10-15T22:02:57.359Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立": { + "modified": "2019-03-24T00:01:17.848Z", "contributors": [ - "SphinxKnight", - "bine139488" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/String/replace": { - "modified": "2020-10-15T21:28:07.269Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器": { + "modified": "2019-03-24T00:01:19.860Z", "contributors": [ - "oooooo", - "joshra", - "imrobinized", - "iigmir", - "jackblackevo", + "wbamberg", "teoli", - "shyangs" + "Wladimir_Palant", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/String/toLowerCase": { - "modified": "2020-10-15T22:21:28.664Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子": { + "modified": "2019-01-16T14:44:28.417Z", "contributors": [ - "goden.cheng" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/TypedArray": { - "modified": "2020-10-15T21:47:14.859Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用": { + "modified": "2019-01-16T14:44:07.939Z", "contributors": [ - "jackblackevo" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/URIError": { - "modified": "2020-10-15T22:17:56.619Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於": { + "modified": "2019-01-16T14:44:22.263Z", "contributors": [ - "hmysjiang" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/isNaN": { - "modified": "2020-10-15T21:51:29.113Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數": { + "modified": "2019-03-24T00:01:07.340Z", "contributors": [ - "bluetata", - "iigmir" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/null": { - "modified": "2020-03-12T19:44:24.320Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件": { + "modified": "2019-03-24T00:01:13.553Z", "contributors": [ - "jackblackevo" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/parseInt": { - "modified": "2020-10-15T21:48:43.179Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件": { + "modified": "2019-03-24T00:01:13.158Z", "contributors": [ - "kcliu", - "DaiYaXu", - "iigmir", - "Shiyou" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Global_Objects/undefined": { - "modified": "2020-10-15T21:47:42.561Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件": { + "modified": "2019-03-24T00:01:09.665Z", "contributors": [ - "jackblackevo" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Iteration_protocols": { - "modified": "2020-03-12T19:45:00.332Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件": { + "modified": "2019-03-24T00:01:12.219Z", "contributors": [ - "jackblackevo", - "nyngwang" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Lexical_grammar": { - "modified": "2020-10-15T22:00:27.351Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件": { + "modified": "2019-03-24T00:01:08.965Z", "contributors": [ - "leowu" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Operators": { - "modified": "2020-03-12T19:38:35.397Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件": { + "modified": "2019-03-24T00:01:11.242Z", "contributors": [ - "jackblackevo", - "cwlin0416", - "iigmir", "teoli", - "Zhen.Di-Lin", - "ethertank" + "happysadman" ] }, - "Web/JavaScript/Reference/Operators/Arithmetic_Operators": { - "modified": "2020-10-15T22:18:48.252Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件": { + "modified": "2019-03-24T00:01:13.910Z", "contributors": [ - "zivalee" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Operators/Bitwise_Operators": { - "modified": "2020-10-15T22:19:10.927Z", + "orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件": { + "modified": "2019-03-24T00:01:08.836Z", "contributors": [ - "hmysjiang" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Reference/Operators/Comma_Operator": { - "modified": "2020-03-12T19:45:21.494Z", + "Web/SVG/Tutorial/Paths": { + "modified": "2019-05-06T13:50:22.523Z", "contributors": [ - "jackblackevo" + "Snailpool", + "ethertank", + "ziyunfei", + "Dx.Yang" ] }, - "Web/JavaScript/Reference/Operators/Comparison_Operators": { - "modified": "2020-03-12T19:45:23.267Z", + "orphaned/Web/SVG/教學": { + "modified": "2019-01-16T14:42:54.040Z", "contributors": [ - "jackblackevo" + "ethertank", + "happysadman" ] }, - "Web/JavaScript/Reference/Operators/Conditional_Operator": { - "modified": "2020-10-15T22:29:30.361Z", + "Web/Performance": { + "modified": "2019-12-05T10:33:09.898Z", "contributors": [ - "liaocCM" + "zhaoy88" ] }, - "Web/JavaScript/Reference/Operators/Destructuring_assignment": { - "modified": "2020-10-15T21:51:08.444Z", + "Web/API/Permissions_API": { + "modified": "2019-03-23T23:28:38.156Z", "contributors": [ - "DexterLeung", - "salagadoola", - "iigmir", - "jsgao0", - "jackblackevo", - "flyinglimao" + "MashKao" ] }, - "Web/JavaScript/Reference/Operators/Logical_Operators": { - "modified": "2020-10-15T22:19:41.845Z", + "Web/API/WebSockets_API": { + "modified": "2019-10-10T16:56:50.765Z", "contributors": [ - "chunhh1012" + "teoli", + "RudyLu", + "Kennyluck" ] }, - "Web/JavaScript/Reference/Operators/Object_initializer": { - "modified": "2020-03-12T19:46:20.319Z", + "Web/API/CloseEvent": { + "modified": "2019-03-24T00:11:09.722Z", "contributors": [ - "cyanchu", - "jackblackevo" + "teoli", + "Kennyluck" ] }, - "Web/JavaScript/Reference/Operators/Operator_Precedence": { - "modified": "2020-03-12T19:45:00.937Z", + "Web/API/MessageEvent": { + "modified": "2019-03-24T00:11:11.117Z", "contributors": [ - "KateWuSH", - "jackblackevo" + "teoli", + "Kennyluck" ] }, - "Web/JavaScript/Reference/Operators/Optional_chaining": { - "modified": "2020-10-15T22:28:31.905Z", + "Web/API/WebSocket": { + "modified": "2019-03-24T00:11:12.042Z", "contributors": [ - "DexterLeung" + "NoobTW", + "YamiOdymel", + "teoli", + "Kennyluck" ] }, - "Web/JavaScript/Reference/Operators/Spread_syntax": { - "modified": "2020-10-15T22:33:09.945Z", + "Web/API/WebSockets_API/Writing_WebSocket_client_applications": { + "modified": "2019-03-24T00:11:12.716Z", "contributors": [ - "neko12377", - "kenchill" + "andretw", + "Shiyou", + "ziyunfei", + "Kennyluck" ] }, - "Web/JavaScript/Reference/Operators/async_function": { - "modified": "2020-10-15T22:12:38.986Z", + "Glossary/XHTML": { + "modified": "2019-03-24T00:01:02.785Z", "contributors": [ - "extend1994" + "ethertank", + "happysadman" ] }, - "Web/JavaScript/Reference/Operators/await": { - "modified": "2020-03-12T19:45:41.284Z", + "orphaned/XPCNativeWrapper": { + "modified": "2019-03-24T00:01:38.163Z", "contributors": [ - "kuolun", - "liuderchi", - "roycrxtw" + "ethertank", + "Clydewu" ] }, - "Web/JavaScript/Reference/Operators/super": { - "modified": "2020-10-15T22:23:09.531Z", + "orphaned/zh-tw": { + "modified": "2019-01-16T13:51:15.538Z", "contributors": [ - "YunHan-Tsai" + "CQD" ] }, - "Web/JavaScript/Reference/Operators/this": { - "modified": "2020-10-15T21:48:46.137Z", + "orphaned/參與_Mozilla_專案": { + "modified": "2019-03-24T00:01:01.475Z", "contributors": [ - "iigmir", - "Rocker", - "chloewlin" + "happysadman" ] - }, - "Web/JavaScript/Reference/Operators/typeof": { - "modified": "2020-03-12T19:38:23.416Z", + }, + "orphaned/建立擴充套件": { + "modified": "2019-01-16T16:02:32.252Z", "contributors": [ - "roycrxtw", - "jackblackevo", - "teoli", - "Johnny.Net" + "Josesun", + "Haka" ] }, - "Web/JavaScript/Reference/Statements": { - "modified": "2020-10-15T21:22:18.510Z", + "conflicting/Learn/Server-side/Django": { + "modified": "2019-03-23T23:33:19.493Z", "contributors": [ - "simba-fs", - "Ethan.Lin", - "jackblackevo", - "stdio2017", - "cwlin0416", - "teoli", - "trevorh" + "garylai1990" ] }, - "Web/JavaScript/Reference/Statements/async_function": { - "modified": "2020-10-15T21:53:37.954Z", + "conflicting/Learn/HTML/Introduction_to_HTML": { + "modified": "2019-03-23T22:48:17.115Z", "contributors": [ - "kevin10410", "iigmir", - "weihanglo", - "liuderchi" + "CodinCat", + "irvinfly", + "slhuang" ] }, - "Web/JavaScript/Reference/Statements/block": { - "modified": "2020-03-12T19:38:43.767Z", + "conflicting/Web/Guide_6b4b72e1fc91461bde34734ce07b1c08": { + "modified": "2019-03-24T00:01:02.674Z", "contributors": [ - "lin1987www", - "jackblackevo", - "teoli", - "irvinfly", - "tjjh89017" + "happysadman" ] }, - "Web/JavaScript/Reference/Statements/break": { - "modified": "2020-10-15T21:25:32.531Z", + "conflicting/Web/API/Canvas_API/Tutorial": { + "modified": "2019-03-23T23:13:40.314Z", "contributors": [ - "jackblackevo", - "teoli", - "Littlebtc", - "tjjh89017" + "fscholz", + "sailplaneTW" ] }, - "Web/JavaScript/Reference/Statements/const": { - "modified": "2020-10-15T21:58:04.721Z", + "Web/API/Document/createEvent": { + "modified": "2019-03-23T22:46:58.596Z", "contributors": [ - "iigmir", - "KevinHuang" + "Shiyou" ] }, - "Web/JavaScript/Reference/Statements/debugger": { - "modified": "2020-10-15T22:00:23.902Z", + "conflicting/Web/OpenSearch": { + "modified": "2019-01-16T15:28:04.055Z", "contributors": [ - "iigmir" + "jackblackevo", + "Mgjbot", + "BobChao" ] }, - "Web/JavaScript/Reference/Statements/export": { - "modified": "2020-10-15T21:54:04.868Z", + "conflicting/Web/API/WindowOrWorkerGlobalScope": { + "modified": "2019-03-23T22:30:45.308Z", "contributors": [ - "wangchou", - "iigmir", - "DalaneGarmin", - "MOSapeizer" + "jackblackevo" ] }, - "Web/JavaScript/Reference/Statements/for...in": { - "modified": "2020-03-12T19:39:20.179Z", + "conflicting/Web/API/WindowOrWorkerGlobalScope_e2691f7ad05781a30c5fc5bb3b3f633a": { + "modified": "2019-03-18T21:16:54.761Z", "contributors": [ - "jackblackevo", - "teoli", - "shyangs" + "jackblackevo" ] }, - "Web/JavaScript/Reference/Statements/function*": { - "modified": "2020-10-15T21:45:50.090Z", + "conflicting/Web/CSS/@viewport": { + "modified": "2019-10-22T02:02:49.952Z", "contributors": [ - "iendeavor", - "jackblackevo", - "DaomingC", - "kdex", - "ALiangLiang", - "tom76kimo" + "Zhang-Junzhi", + "yvonne6344" ] }, - "Web/JavaScript/Reference/Statements/if...else": { - "modified": "2020-12-06T07:23:20.735Z", + "Web/CSS/CSS_Backgrounds_and_Borders": { + "modified": "2019-03-23T22:44:17.591Z", "contributors": [ - "rei1997", - "paiyuliu", - "jackblackevo", - "willynpi" + "teoli" ] }, - "Web/JavaScript/Reference/Statements/import": { - "modified": "2020-10-15T21:53:11.297Z", + "Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds": { + "modified": "2019-03-23T22:48:53.708Z", "contributors": [ - "iigmir", - "freddy50806", - "pololin", - "kweisamx", - "RichCharlie", - "DuckBreeder" + "sss63232", + "Shiyou", + "teoli", + "alk03073135" ] }, - "Web/JavaScript/Reference/Statements/label": { - "modified": "2020-10-15T22:15:49.920Z", + "Web/CSS/CSS_Color": { + "modified": "2019-03-23T22:44:44.114Z", "contributors": [ - "willh" + "Sebastianz", + "teoli" ] }, - "Web/JavaScript/Reference/Statements/let": { - "modified": "2020-10-15T21:45:04.003Z", + "Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox": { + "modified": "2020-05-11T23:59:37.780Z", "contributors": [ - "ShawnLin", - "Zhang-Junzhi", + "wildsky", "iigmir", - "zxa011023", - "YamiOdymel", - "ALiangLiang" + "1986slayer" ] }, - "Web/JavaScript/Reference/Statements/return": { - "modified": "2020-10-15T22:02:41.359Z", + "Web/API/HTMLMediaElement/abort_event": { + "modified": "2019-04-30T14:18:03.298Z", "contributors": [ - "iigmir" + "wbamberg", + "secminhr" ] }, - "Web/JavaScript/Reference/Statements/switch": { - "modified": "2020-10-15T22:25:04.906Z", + "conflicting/Web/API/Document_Object_Model": { + "modified": "2019-03-23T23:29:56.158Z", "contributors": [ - "iigmir", - "Lazine" + "Sheppy" ] }, - "Web/JavaScript/Reference/Statements/throw": { - "modified": "2020-03-12T19:45:24.946Z", + "Learn/JavaScript/Building_blocks/Events": { + "modified": "2019-11-20T21:38:26.184Z", "contributors": [ + "wbamberg", "jackblackevo" ] }, - "Web/JavaScript/Reference/Statements/var": { - "modified": "2020-03-12T19:38:31.590Z", + "conflicting/Web/Media/Formats": { + "modified": "2019-03-23T23:14:51.174Z", "contributors": [ - "jackblackevo", - "teoli", - "Johnny.Net" + "young3578671", + "Keeseonglee" ] }, - "Web/JavaScript/Reference/Strict_mode": { - "modified": "2020-03-12T19:46:40.566Z", + "conflicting/Web/HTTP/CORS": { + "modified": "2019-03-23T22:06:20.131Z", "contributors": [ - "WellyHong", - "Aries0d0f", - "DarkNami", - "MOSapeizer" + "jackblackevo" ] }, - "Web/JavaScript/Reference/Template_literals": { - "modified": "2020-10-15T21:53:17.228Z", + "conflicting/Learn/JavaScript/Objects": { + "modified": "2020-08-05T00:50:19.955Z", "contributors": [ + "nientsu", + "cwlin0416", + "fscholz", "jackblackevo", - "xsfishxs" + "nightsnow0918", + "irvinfly", + "sailplaneTW" ] }, - "Web/JavaScript/Shells": { - "modified": "2020-03-12T19:45:29.748Z", + "conflicting/Web/JavaScript/Guide/Grammar_and_types": { + "modified": "2019-01-16T14:44:25.337Z", "contributors": [ - "JianHuaHe" + "teoli", + "happysadman" ] }, - "Web/JavaScript/Typed_arrays": { - "modified": "2020-03-12T19:36:15.816Z", + "conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model": { + "modified": "2019-01-16T14:43:47.289Z", "contributors": [ - "ballfish", - "jackblackevo", - "roycrxtw", "teoli", - "Kennyluck" + "happysadman" ] }, - "Web/Manifest": { - "modified": "2020-11-18T03:32:37.890Z", + "conflicting/Web/JavaScript/Guide/Grammar_and_types_5c6f30ff8e011c45a011b9c8f3b5bcea": { + "modified": "2019-01-16T14:44:19.901Z", "contributors": [ - "SphinxKnight", - "wifr1126q", - "t7yang", - "BwayCer" + "teoli", + "happysadman" ] }, - "Web/MathML": { - "modified": "2019-03-23T23:22:17.865Z", + "conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_937645e235e25783cc4e9b0d7a1f6d76": { + "modified": "2019-01-16T14:43:20.597Z", "contributors": [ - "sailplaneTW" + "teoli", + "happysadman" ] }, - "Web/MathML/Authoring": { - "modified": "2019-03-23T23:22:11.037Z", + "conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_3193ca1e5a7bdb78e9d9418a947916aa": { + "modified": "2019-01-16T14:43:13.719Z", "contributors": [ - "fred.wang", - "sailplaneTW" + "teoli", + "happysadman" ] }, - "Web/Media": { - "modified": "2019-03-18T21:40:43.859Z", + "conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_483bbc3a620ead7b721647d1a2cb216f": { + "modified": "2019-01-16T14:43:16.085Z", "contributors": [ - "willynpi", - "learnfromfail" + "teoli", + "happysadman" ] }, - "Web/Media/Formats": { - "modified": "2020-02-18T06:39:28.429Z", + "conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_8898a6dd437cc51f48b4e8cade0385ac": { + "modified": "2019-01-16T14:43:20.683Z", "contributors": [ - "Sheppy" + "teoli", + "happysadman" ] }, - "Web/Media/Formats/Containers": { - "modified": "2020-02-19T03:38:30.649Z", + "conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_60d6c39d4282c67c117db9fdaf83be08": { + "modified": "2019-01-16T14:43:21.630Z", "contributors": [ - "JamesGoler" + "teoli", + "happysadman" ] }, - "Web/OpenSearch": { - "modified": "2019-03-23T22:00:23.747Z", + "conflicting/Web/JavaScript/Guide/Functions": { + "modified": "2019-03-24T00:00:58.959Z", "contributors": [ - "jackblackevo", - "iigmir", "teoli", - "Mgjbot", - "Sam268276", - "BobChao" + "happysadman" ] }, - "Web/Progressive_web_apps": { - "modified": "2019-03-18T20:52:03.723Z", + "conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling": { + "modified": "2019-01-16T13:06:24.647Z", "contributors": [ - "chrisdavidmills", - "iigmir" + "teoli", + "Sheppy", + "Jaric", + "happysadman" ] }, - "Web/Reference": { - "modified": "2019-03-23T23:29:16.937Z", + "conflicting/Web/JavaScript/Guide/Grammar_and_types_d57082c2207b466127d8dc34a980addf": { + "modified": "2019-01-16T14:44:20.274Z", "contributors": [ - "jackblackevo", - "Somnlent", - "Sheppy" + "teoli", + "happysadman" ] }, - "Web/Reference/API": { - "modified": "2019-03-23T23:05:52.036Z", + "conflicting/Web/JavaScript/Guide/Grammar_and_types_e5a53691c318855e3342ad91feb78f2e": { + "modified": "2019-01-16T14:44:19.601Z", "contributors": [ - "jackblackevo", - "wildsky" + "teoli", + "happysadman" ] }, - "Web/SVG": { - "modified": "2019-01-16T17:22:30.480Z", + "conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_a2d11ceeaeb3cb8c43292be7771f9b23": { + "modified": "2019-01-16T14:44:21.815Z", "contributors": [ - "ethertank", + "teoli", "happysadman" ] }, - "Web/SVG/Attribute": { - "modified": "2019-03-23T23:26:15.897Z", + "conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5": { + "modified": "2019-01-16T14:43:51.018Z", "contributors": [ - "Jeremie" + "teoli", + "happysadman" ] }, - "Web/SVG/Attribute/fill-rule": { - "modified": "2019-03-23T23:26:22.091Z", + "conflicting/Web/JavaScript/Guide/Regular_Expressions": { + "modified": "2019-01-16T14:44:21.287Z", "contributors": [ - "panallen" + "teoli", + "happysadman" ] }, - "Web/SVG/Attribute/stroke-dashoffset": { - "modified": "2019-03-20T22:42:12.300Z", + "conflicting/Web/JavaScript/Guide/Regular_Expressions_38b32725e0e3217a5542b1b4ee122407": { + "modified": "2019-01-16T14:44:23.103Z", "contributors": [ - "EnRico.Lam", - "bing-Guo" + "teoli", + "happysadman" ] }, - "Web/SVG/Tutorial": { - "modified": "2019-03-23T23:35:01.636Z", + "conflicting/Web/JavaScript/Guide/Regular_Expressions_24eb6498b86da57e7fb5337fd8fa04a6": { + "modified": "2019-01-16T14:44:25.974Z", "contributors": [ - "Snailpool", - "sunghau", - "ethertank", - "ziyunfei", - "Dx.Yang" + "teoli", + "happysadman" ] }, - "Web/SVG/Tutorial/Fills_and_Strokes": { - "modified": "2019-03-23T23:34:13.639Z", + "conflicting/Web/JavaScript/Guide/Working_with_Objects": { + "modified": "2019-01-16T14:44:03.755Z", "contributors": [ - "jackblackevo", - "ethertank", - "Dx.Yang" + "teoli", + "happysadman" ] }, - "Web/SVG/Tutorial/Getting_Started": { - "modified": "2019-03-23T23:34:51.093Z", + "conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_b021bd32308e4c421518cdd7104ac7bc": { + "modified": "2019-01-16T14:43:17.913Z", "contributors": [ - "jackblackevo", - "Kustz", - "ethertank", - "Dx.Yang" + "teoli", + "happysadman" ] }, - "Web/SVG/Tutorial/Gradients": { - "modified": "2019-03-23T23:34:17.990Z", + "conflicting/Web/JavaScript/Guide/Expressions_and_Operators": { + "modified": "2019-01-16T14:44:25.015Z", "contributors": [ - "jackblackevo", - "iigmir", - "ethertank", - "Dx.Yang" + "teoli", + "happysadman" ] }, - "Web/SVG/Tutorial/Introduction": { - "modified": "2019-03-23T23:34:52.348Z", + "conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_74154e098f4b1e7026df3945ceb0fa4a": { + "modified": "2019-01-16T14:44:18.898Z", "contributors": [ - "ethertank", - "Dx.Yang" + "teoli", + "happysadman" ] }, - "Web/SVG/Tutorial/Patterns": { - "modified": "2019-03-23T23:34:09.915Z", + "conflicting/Web/JavaScript/Guide/Grammar_and_types_ef6fc79abc28f5eadd6c126341df5e49": { + "modified": "2019-01-16T14:44:20.971Z", "contributors": [ - "jackblackevo", - "ethertank", - "Dx.Yang" + "teoli", + "happysadman" ] }, - "Web/SVG/Tutorial/Positions": { - "modified": "2019-03-23T23:34:48.671Z", + "conflicting/Web/JavaScript/Guide/Expressions_and_Operators_e6fc14473511cf01e7062dfb7751f49d": { + "modified": "2019-01-16T14:44:25.230Z", "contributors": [ - "Kustz", - "ethertank", - "ziyunfei", - "Dx.Yang" + "teoli", + "happysadman" ] }, - "Web/SVG/Tutorial/路径": { - "modified": "2019-05-06T13:50:22.523Z", + "conflicting/Web/JavaScript/Guide/Expressions_and_Operators_e70c1f2655520c542321ddbdb2c4f28d": { + "modified": "2019-03-24T00:01:01.353Z", "contributors": [ - "Snailpool", - "ethertank", - "ziyunfei", - "Dx.Yang" + "teoli", + "happysadman" ] }, - "Web/SVG/教學": { - "modified": "2019-01-16T14:42:54.040Z", + "conflicting/Web/JavaScript/Guide/Expressions_and_Operators_11969cb29fead65c26360f554426c217": { + "modified": "2019-01-16T14:44:24.141Z", "contributors": [ - "ethertank", + "teoli", "happysadman" ] }, - "Web/Security": { - "modified": "2019-09-10T16:50:03.503Z", + "conflicting/Web/JavaScript/Guide/Expressions_and_Operators_eb65eb8f4e6b3c16f08b95149183cfb8": { + "modified": "2019-01-16T14:44:19.884Z", "contributors": [ - "SphinxKnight", - "jackblackevo" + "teoli", + "happysadman" ] }, - "Web/Security/Insecure_passwords": { - "modified": "2019-03-20T14:57:01.510Z", + "conflicting/Web/JavaScript/Guide/Expressions_and_Operators_952d66f1fe521bc0574c89750f5b406e": { + "modified": "2019-01-16T14:44:24.727Z", "contributors": [ - "BaseChipmunk4", - "iigmir", - "jwhitlock" + "teoli", + "happysadman" ] }, - "Web/Security/Mixed_content": { - "modified": "2019-03-23T23:04:08.690Z", + "conflicting/Web/JavaScript/Guide/Expressions_and_Operators_05717c12b1ecaebc9d68cf43524d31b1": { + "modified": "2019-01-16T14:44:25.132Z", "contributors": [ - "jackblackevo", - "iigmir", - "a780201", - "wildsky", - "Asheesh" + "teoli", + "happysadman" ] }, - "Web/Security/Mixed_content/How_to_fix_website_with_mixed_content": { - "modified": "2019-03-23T23:04:13.940Z", + "conflicting/Web/JavaScript/Guide/Expressions_and_Operators_351a6d9e4d31b32eff9762ef5deead93": { + "modified": "2019-01-16T14:44:21.016Z", "contributors": [ - "jackblackevo", - "iigmir", - "wildsky" + "teoli", + "happysadman" ] }, - "Web/Security/Same-origin_policy": { - "modified": "2020-09-01T23:06:58.364Z", + "conflicting/Web/JavaScript/Guide": { + "modified": "2019-03-24T00:01:19.124Z", "contributors": [ - "JustBelieveMe", - "jackblackevo", - "MashKao", + "wbamberg", + "Jaja", "teoli", - "foxbrush" + "happysadman" ] }, - "Web/Security/Weak_Signature_Algorithm": { - "modified": "2019-04-23T04:20:20.884Z", + "conflicting/Web/JavaScript/Guide/Functions_ceaa4b2a55bb67388c2728af1ff890f5": { + "modified": "2019-03-24T00:01:07.501Z", "contributors": [ - "jackblackevo", - "15182254444", - "KINGKKALING", - "Sbabey", - "leVirve" + "teoli", + "happysadman" ] }, - "Web/Tutorials": { - "modified": "2019-09-03T07:07:31.640Z", + "conflicting/Web/JavaScript/Guide/Functions_effb9b1bcc102a5f6df7f1785ce89033": { + "modified": "2019-01-16T14:44:04.783Z", "contributors": [ - "lalasoqTW", - "katsmin", - "mgrn", - "KevinHuang.lds", - "sailplaneTW" + "teoli", + "happysadman" ] }, - "Web/性能": { - "modified": "2019-12-05T10:33:09.898Z", + "conflicting/Web/JavaScript/Guide/Functions_587eb671a310bac0771e73a91b0abe6d": { + "modified": "2019-01-16T14:44:03.697Z", "contributors": [ - "zhaoy88" + "teoli", + "happysadman" ] }, - "WebAPI": { - "modified": "2019-03-23T23:28:55.141Z", + "conflicting/Web/JavaScript/Guide/Functions_b2cd05cbfe188215dc2e3f972d293ed6": { + "modified": "2019-03-24T00:01:03.372Z", "contributors": [ - "wbamberg", - "fscholz", - "MashKao", - "sailplaneTW" + "teoli", + "happysadman" ] }, - "WebAPI/Permissions": { - "modified": "2019-03-23T23:28:38.156Z", + "conflicting/Web/JavaScript/Guide/Functions_925b2d10050621507a9c990cb803dcca": { + "modified": "2019-03-24T00:01:04.794Z", "contributors": [ - "MashKao" + "teoli", + "happysadman" ] }, - "WebAssembly": { - "modified": "2020-10-15T22:04:56.309Z", + "conflicting/Web/JavaScript/Guide/Functions_536f6bf46bbdf38cc1a0b28ca1bc41b9": { + "modified": "2019-03-24T00:01:05.054Z", "contributors": [ - "Aries0d0f" + "teoli", + "happysadman" ] }, - "WebSockets": { - "modified": "2019-10-10T16:56:50.765Z", + "conflicting/Web/JavaScript/Guide_dc05b578fe0c2f7d9a89ed82daab4e65": { + "modified": "2019-01-16T14:44:07.734Z", "contributors": [ "teoli", - "RudyLu", - "Kennyluck" + "happysadman" ] }, - "WebSockets/WebSockets_reference": { - "modified": "2019-03-24T00:11:12.133Z", + "conflicting/Web/JavaScript/Reference/Global_Objects/ArrayBuffer": { + "modified": "2019-03-23T22:31:10.924Z", "contributors": [ "teoli", - "Kennyluck" + "jackblackevo" ] }, - "WebSockets/WebSockets_reference/CloseEvent": { - "modified": "2019-03-24T00:11:09.722Z", + "conflicting/Web/JavaScript/Reference/Global_Objects/Date": { + "modified": "2019-03-23T22:26:36.902Z", "contributors": [ - "teoli", - "Kennyluck" + "ddtet" ] }, - "WebSockets/WebSockets_reference/MessageEvent": { - "modified": "2019-03-24T00:11:11.117Z", + "conflicting/Web/JavaScript/Reference/Global_Objects/Function": { + "modified": "2019-03-23T22:30:13.335Z", "contributors": [ - "teoli", - "Kennyluck" + "jackblackevo" ] }, - "WebSockets/WebSockets_reference/WebSocket": { - "modified": "2019-03-24T00:11:12.042Z", + "conflicting/Web/JavaScript/Reference/Global_Objects/Number": { + "modified": "2020-10-15T21:56:46.161Z", "contributors": [ - "NoobTW", - "YamiOdymel", - "teoli", - "Kennyluck" + "jsgao0" ] }, - "WebSockets/Writing_WebSocket_client_applications": { - "modified": "2019-03-24T00:11:12.716Z", + "conflicting/Web/JavaScript/Reference/Global_Objects/Object": { + "modified": "2019-03-23T22:44:24.956Z", "contributors": [ - "andretw", "Shiyou", - "ziyunfei", - "Kennyluck" + "alk03073135" ] }, - "Web_development": { - "modified": "2019-01-16T13:10:01.650Z", + "conflicting/Web/JavaScript/Reference/Global_Objects/Promise": { + "modified": "2020-10-15T21:51:00.110Z", "contributors": [ - "teoli", - "Sonrisa" + "nyngwang", + "jackblackevo" ] }, - "Web_開發": { - "modified": "2019-03-24T00:01:02.674Z", + "conflicting/Web/JavaScript/Reference/Global_Objects/String": { + "modified": "2020-10-15T22:02:57.359Z", "contributors": [ - "happysadman" + "SphinxKnight", + "bine139488" ] }, - "Web_開發/Historical_artifacts_to_avoid": { - "modified": "2019-03-23T22:48:17.115Z", + "conflicting/Web/JavaScript/Reference/Operators": { + "modified": "2020-10-15T22:18:48.252Z", "contributors": [ - "iigmir", - "CodinCat", - "irvinfly", - "slhuang" + "zivalee" ] }, - "XHTML": { - "modified": "2019-03-24T00:01:02.785Z", + "conflicting/Web/JavaScript/Reference/Operators_7c8eb9475d97a4a734c5991857698560": { + "modified": "2020-10-15T22:19:10.927Z", "contributors": [ - "ethertank", - "happysadman" + "hmysjiang" ] }, - "XPCNativeWrapper": { - "modified": "2019-03-24T00:01:38.163Z", + "conflicting/Web/JavaScript/Reference/Operators_310dc67549939233c3d18a8fa2cdbb23": { + "modified": "2020-03-12T19:45:23.267Z", "contributors": [ - "ethertank", - "Clydewu" + "jackblackevo" ] }, - "zh-tw": { - "modified": "2019-01-16T13:51:15.538Z", + "conflicting/Web/JavaScript/Reference/Operators_f71733c8e7001a29c3ec40d8522a4aca": { + "modified": "2020-10-15T22:19:41.845Z", "contributors": [ - "CQD" + "chunhh1012" ] }, - "參與_Mozilla_專案": { - "modified": "2019-03-24T00:01:01.475Z", + "conflicting/Web/API": { + "modified": "2019-03-23T23:28:55.141Z", "contributors": [ - "happysadman" + "wbamberg", + "fscholz", + "MashKao", + "sailplaneTW" ] }, - "建立擴充套件": { - "modified": "2019-01-16T16:02:32.252Z", + "conflicting/Web/API/WebSockets_API": { + "modified": "2019-03-24T00:11:12.133Z", "contributors": [ - "Josesun", - "Haka" + "teoli", + "Kennyluck" ] } } \ No newline at end of file diff --git a/files/zh-tw/conflicting/learn/html/introduction_to_html/index.html b/files/zh-tw/conflicting/learn/html/introduction_to_html/index.html index 29c2532f6f..1ddb9961ce 100644 --- a/files/zh-tw/conflicting/learn/html/introduction_to_html/index.html +++ b/files/zh-tw/conflicting/learn/html/introduction_to_html/index.html @@ -1,8 +1,9 @@ --- title: 應該避免的過時語法 -slug: Web_開發/Historical_artifacts_to_avoid +slug: conflicting/Learn/HTML/Introduction_to_HTML translation_of: Learn/HTML/Introduction_to_HTML translation_of_original: Web/Guide/HTML/Obsolete_things_to_avoid +original_slug: Web_開發/Historical_artifacts_to_avoid ---

介紹

diff --git a/files/zh-tw/conflicting/learn/javascript/objects/index.html b/files/zh-tw/conflicting/learn/javascript/objects/index.html index 292229d00d..98744a8369 100644 --- a/files/zh-tw/conflicting/learn/javascript/objects/index.html +++ b/files/zh-tw/conflicting/learn/javascript/objects/index.html @@ -1,6 +1,6 @@ --- title: JavaScript 物件導向介紹 -slug: Web/JavaScript/Introduction_to_Object-Oriented_JavaScript +slug: conflicting/Learn/JavaScript/Objects tags: - 中階 - 命名空間 @@ -12,6 +12,7 @@ tags: - 物件導向程式設計 translation_of: Learn/JavaScript/Objects translation_of_original: Web/JavaScript/Introduction_to_Object-Oriented_JavaScript +original_slug: Web/JavaScript/Introduction_to_Object-Oriented_JavaScript ---
{{jsSidebar("Introductory")}}
diff --git a/files/zh-tw/conflicting/learn/server-side/django/index.html b/files/zh-tw/conflicting/learn/server-side/django/index.html index 11e3c03038..302f55e871 100644 --- a/files/zh-tw/conflicting/learn/server-side/django/index.html +++ b/files/zh-tw/conflicting/learn/server-side/django/index.html @@ -1,10 +1,11 @@ --- title: Python -slug: Python +slug: conflicting/Learn/Server-side/Django tags: - Python translation_of: Learn/Server-side/Django translation_of_original: Python +original_slug: Python ---

Python 是一種直譯式的腳本語言，是一個跨平台的的語言，可以在各個平台上面使用，如：Linux、Mac OS X、以及Microsoft Windows.

學習 Python

diff --git a/files/zh-tw/conflicting/web/api/canvas_api/tutorial/index.html b/files/zh-tw/conflicting/web/api/canvas_api/tutorial/index.html index 63bd0017fc..7f7d4cd897 100644 --- a/files/zh-tw/conflicting/web/api/canvas_api/tutorial/index.html +++ b/files/zh-tw/conflicting/web/api/canvas_api/tutorial/index.html @@ -1,8 +1,9 @@ --- title: Drawing graphics with canvas -slug: Web/API/Canvas_API/Drawing_graphics_with_canvas +slug: conflicting/Web/API/Canvas_API/Tutorial translation_of: Web/API/Canvas_API/Tutorial translation_of_original: Web/API/Canvas_API/Drawing_graphics_with_canvas +original_slug: Web/API/Canvas_API/Drawing_graphics_with_canvas ---

Most of this content (but not the documentation on drawWindow) has been rolled into the more expansive Canvas tutorial, this page should probably be redirected there as it's now redundant but some information may still be relevant.

diff --git a/files/zh-tw/conflicting/web/api/document_object_model/index.html b/files/zh-tw/conflicting/web/api/document_object_model/index.html index fc26bc0bee..b9d5d2fc30 100644 --- a/files/zh-tw/conflicting/web/api/document_object_model/index.html +++ b/files/zh-tw/conflicting/web/api/document_object_model/index.html @@ -1,6 +1,6 @@ --- title: DOM developer guide -slug: Web/Guide/DOM +slug: conflicting/Web/API/Document_Object_Model tags: - API - DOM @@ -9,6 +9,7 @@ tags: - TopicStub translation_of: Web/API/Document_Object_Model translation_of_original: Web/Guide/API/DOM +original_slug: Web/Guide/DOM ---

{{draft}}

The Document Object Model is an API for HTML and XML documents. It provides a structural representation of the document, enabling the developer to modify its content and visual presentation. Essentially, it connects web pages to scripts or programming languages.

diff --git a/files/zh-tw/conflicting/web/api/html_drag_and_drop_api/index.html b/files/zh-tw/conflicting/web/api/html_drag_and_drop_api/index.html index 8113a786ec..29db189e36 100644 --- a/files/zh-tw/conflicting/web/api/html_drag_and_drop_api/index.html +++ b/files/zh-tw/conflicting/web/api/html_drag_and_drop_api/index.html @@ -1,5 +1,6 @@ --- title: DragDrop -slug: DragDrop +slug: conflicting/Web/API/HTML_Drag_and_Drop_API +original_slug: DragDrop --- This page was auto-generated because a user created a sub-page to this page. diff --git a/files/zh-tw/conflicting/web/api/index.html b/files/zh-tw/conflicting/web/api/index.html index c606a94846..e1f9906366 100644 --- a/files/zh-tw/conflicting/web/api/index.html +++ b/files/zh-tw/conflicting/web/api/index.html @@ -1,8 +1,9 @@ --- title: WebAPI -slug: WebAPI +slug: conflicting/Web/API translation_of: Web/API translation_of_original: WebAPI +original_slug: WebAPI ---

WebAPI 是指一系列的存取與裝置相容性 API，讓 Web App 及其內容能夠存取裝置的硬體 (例如電池狀態或裝置的振動硬體)，亦可存取裝置所儲存的資料 (例如行事曆或聯絡人清單)。在添加這些 API 之後，我們希望 Web 能跳脫目前的功能，並打破專利平台的限制。

diff --git a/files/zh-tw/conflicting/web/api/websockets_api/index.html b/files/zh-tw/conflicting/web/api/websockets_api/index.html index 8ba3337205..01e24642b1 100644 --- a/files/zh-tw/conflicting/web/api/websockets_api/index.html +++ b/files/zh-tw/conflicting/web/api/websockets_api/index.html @@ -1,10 +1,11 @@ --- title: WebSockets 參考 -slug: WebSockets/WebSockets_reference +slug: conflicting/Web/API/WebSockets_API tags: - WebSockets translation_of: Web/API/WebSockets_API translation_of_original: Web/API/WebSockets_API/WebSockets_reference +original_slug: WebSockets/WebSockets_reference ---

{{ draft() }}

下述文章是 WebSocket API 各介面的說明文件，本頁面為暫時的佔位文件。

diff --git a/files/zh-tw/conflicting/web/api/windoworworkerglobalscope/index.html b/files/zh-tw/conflicting/web/api/windoworworkerglobalscope/index.html index 6cf618070e..5bc6671f29 100644 --- a/files/zh-tw/conflicting/web/api/windoworworkerglobalscope/index.html +++ b/files/zh-tw/conflicting/web/api/windoworworkerglobalscope/index.html @@ -1,8 +1,9 @@ --- title: WindowBase64 -slug: Web/API/WindowBase64 +slug: conflicting/Web/API/WindowOrWorkerGlobalScope translation_of: Web/API/WindowOrWorkerGlobalScope translation_of_original: Web/API/WindowBase64 +original_slug: Web/API/WindowBase64 ---

{{APIRef("HTML DOM")}}

diff --git a/files/zh-tw/conflicting/web/api/windoworworkerglobalscope_e2691f7ad05781a30c5fc5bb3b3f633a/index.html b/files/zh-tw/conflicting/web/api/windoworworkerglobalscope_e2691f7ad05781a30c5fc5bb3b3f633a/index.html index c38c15b821..d003a22367 100644 --- a/files/zh-tw/conflicting/web/api/windoworworkerglobalscope_e2691f7ad05781a30c5fc5bb3b3f633a/index.html +++ b/files/zh-tw/conflicting/web/api/windoworworkerglobalscope_e2691f7ad05781a30c5fc5bb3b3f633a/index.html @@ -1,8 +1,9 @@ --- title: WindowTimers -slug: Web/API/WindowTimers +slug: conflicting/Web/API/WindowOrWorkerGlobalScope_e2691f7ad05781a30c5fc5bb3b3f633a translation_of: Web/API/WindowOrWorkerGlobalScope translation_of_original: Web/API/WindowTimers +original_slug: Web/API/WindowTimers ---
{{APIRef("HTML DOM")}}
diff --git a/files/zh-tw/conflicting/web/css/@viewport/index.html b/files/zh-tw/conflicting/web/css/@viewport/index.html index 78d80ee35b..02dd2cafa4 100644 --- a/files/zh-tw/conflicting/web/css/@viewport/index.html +++ b/files/zh-tw/conflicting/web/css/@viewport/index.html @@ -1,8 +1,9 @@ --- title: height -slug: Web/CSS/@viewport/height +slug: conflicting/Web/CSS/@viewport translation_of: Web/CSS/@viewport translation_of_original: Web/CSS/@viewport/height +original_slug: Web/CSS/@viewport/height ---
{{CSSRef}}
diff --git a/files/zh-tw/conflicting/web/guide/index.html b/files/zh-tw/conflicting/web/guide/index.html index 2644dd50c6..bbb29e5b59 100644 --- a/files/zh-tw/conflicting/web/guide/index.html +++ b/files/zh-tw/conflicting/web/guide/index.html @@ -1,5 +1,6 @@ --- title: Web development -slug: Web_development +slug: conflicting/Web/Guide +original_slug: Web_development --- This page was auto-generated because a user created a sub-page to this page. diff --git a/files/zh-tw/conflicting/web/guide_6b4b72e1fc91461bde34734ce07b1c08/index.html b/files/zh-tw/conflicting/web/guide_6b4b72e1fc91461bde34734ce07b1c08/index.html index 45d12b6e0f..aede5f747c 100644 --- a/files/zh-tw/conflicting/web/guide_6b4b72e1fc91461bde34734ce07b1c08/index.html +++ b/files/zh-tw/conflicting/web/guide_6b4b72e1fc91461bde34734ce07b1c08/index.html @@ -1,8 +1,9 @@ --- title: Web 開發 -slug: Web_開發 +slug: conflicting/Web/Guide_6b4b72e1fc91461bde34734ce07b1c08 translation_of: Web/Guide translation_of_original: Web_Development +original_slug: Web_開發 ---

Web 開發包括開發 Web 網站或 Web 應用程式的各方面。

學習如何建立從簡單到複雜、互動性高的 Web 網站，閱讀此處的文章，採用最新 Web 技術。

diff --git a/files/zh-tw/conflicting/web/http/cors/index.html b/files/zh-tw/conflicting/web/http/cors/index.html index 29ba4ef791..84e09bb358 100644 --- a/files/zh-tw/conflicting/web/http/cors/index.html +++ b/files/zh-tw/conflicting/web/http/cors/index.html @@ -1,8 +1,9 @@ --- title: 伺服器端存取控制（CORS） -slug: Web/HTTP/Server-Side_Access_Control +slug: conflicting/Web/HTTP/CORS translation_of: Web/HTTP/CORS translation_of_original: Web/HTTP/Server-Side_Access_Control +original_slug: Web/HTTP/Server-Side_Access_Control ---

存取控制系統是執行授權識別、認證、存取核可的實體，也負責透過登入來進行驗證，包含密碼、個人身份識別碼（personal identification numbers，PINs）、生物辨識掃描，以及物理或電子的金鑰。

diff --git a/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling/index.html b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling/index.html index 24484bb5b3..7db9752799 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling/index.html @@ -1,8 +1,9 @@ --- title: 區塊語法 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊語法 +slug: conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Block_Statement +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/區塊語法 ---

區塊語法

區塊語法用於把語句群組化。區塊的範圍是由一對大括號所界定︰

diff --git a/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5/index.html b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5/index.html index c9f263afe1..ab5427f972 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5/index.html @@ -1,8 +1,10 @@ --- title: 條件語法 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件語法 +slug: >- + conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_2691b613803afee4bca87dca2a41b5c5 translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Conditional_Statements +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/條件語法 ---

條件語法

條件語法是在當指定的條件為 true 時，就執行一整組指令。JavaScript 支援兩種條件語法︰if...else 和 switch。

diff --git a/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_74154e098f4b1e7026df3945ceb0fa4a/index.html b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_74154e098f4b1e7026df3945ceb0fa4a/index.html index 1e922b72f2..1d70a58a8a 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_74154e098f4b1e7026df3945ceb0fa4a/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_74154e098f4b1e7026df3945ceb0fa4a/index.html @@ -1,8 +1,10 @@ --- title: 註解 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/註解 +slug: >- + conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_74154e098f4b1e7026df3945ceb0fa4a translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Comments +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/註解 ---

註解

註解是作者用來解釋 Script 在做什麼的標記符號。註解會被解譯器忽略。JavaScript 支援 Java 和 C++ 形式的註解︰

diff --git a/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_a2d11ceeaeb3cb8c43292be7771f9b23/index.html b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_a2d11ceeaeb3cb8c43292be7771f9b23/index.html index af67cbfa03..cb91b2ace4 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_a2d11ceeaeb3cb8c43292be7771f9b23/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/control_flow_and_error_handling_a2d11ceeaeb3cb8c43292be7771f9b23/index.html @@ -1,8 +1,10 @@ --- title: 循環語法 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法 +slug: >- + conflicting/Web/JavaScript/Guide/Control_flow_and_error_handling_a2d11ceeaeb3cb8c43292be7771f9b23 translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Loop_Statements +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法 ---

循環語法

循環（或稱迴圈）是一組反覆執行的指令，直到滿足指定的條件為止。JavaScript 支援 for、do while、while 循環語法，除了 label 以外（label 本身不是循環語法，但經常和循環語法一起使用）。此外，你也可以在循環語法內部使用 break 和 continue 語法。

diff --git a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model/index.html b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model/index.html index 45678e3bdb..91ff45f5bd 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model/index.html @@ -1,9 +1,10 @@ --- title: 以類別為基礎的語言 vs. 以原型為基礎的語言 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/以類別為基礎的語言_vs._以原型為基礎的語言 +slug: conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Class-Based_vs._Prototype-Based_Languages +original_slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/以類別為基礎的語言_vs._以原型為基礎的語言 ---

以類別為基礎的語言 vs. 以原型為基礎的語言

以類別為基礎的語言，如 Java 和 C++，是以兩種不同實體的概念為根基︰類別（Class）和實體（Instance）。

diff --git a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_3193ca1e5a7bdb78e9d9418a947916aa/index.html b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_3193ca1e5a7bdb78e9d9418a947916aa/index.html index 451fa3036e..6997ed22f5 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_3193ca1e5a7bdb78e9d9418a947916aa/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_3193ca1e5a7bdb78e9d9418a947916aa/index.html @@ -1,9 +1,11 @@ --- title: 實體關係的確定 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/實體關係的確定 +slug: >- + conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_3193ca1e5a7bdb78e9d9418a947916aa translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model translation_of_original: >- Web/JavaScript/Guide/Obsolete_Pages/Property_Inheritance_Revisited/Determining_Instance_Relationships +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/實體關係的確定 ---

實體關係的確定

Javascript 搜尋屬性時，會先從物件內部所擁有的屬性開始，如果找不到屬性的名稱，就會從特殊的物件屬性 __proto__ 內部搜尋。不斷反覆執行；這個過程就稱為〝在原型鏈中搜尋〞。

diff --git a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_483bbc3a620ead7b721647d1a2cb216f/index.html b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_483bbc3a620ead7b721647d1a2cb216f/index.html index e042494b71..86bcfcdac9 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_483bbc3a620ead7b721647d1a2cb216f/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_483bbc3a620ead7b721647d1a2cb216f/index.html @@ -1,9 +1,11 @@ --- title: 局域值和繼承值 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/局域值和繼承值 +slug: >- + conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_483bbc3a620ead7b721647d1a2cb216f translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model translation_of_original: >- Web/JavaScript/Guide/Obsolete_Pages/Property_Inheritance_Revisited/Local_versus_Inherited_Values +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/局域值和繼承值 ---

局域值和繼承值

當你存取物件屬性的時候，JavaScript 會進行這些步驟，如同本章前面所提到過的︰

diff --git a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_60d6c39d4282c67c117db9fdaf83be08/index.html b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_60d6c39d4282c67c117db9fdaf83be08/index.html index b787de8dd0..717baf86bb 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_60d6c39d4282c67c117db9fdaf83be08/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_60d6c39d4282c67c117db9fdaf83be08/index.html @@ -1,9 +1,11 @@ --- title: 沒有多重繼承 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/沒有多重繼承 +slug: >- + conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_60d6c39d4282c67c117db9fdaf83be08 translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model translation_of_original: >- Web/JavaScript/Guide/Obsolete_Pages/Property_Inheritance_Revisited/No_Multiple_Inheritance +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/沒有多重繼承 ---

沒有多重繼承

部分物件導向語言允許多重繼承。也就是說，物件可以從互不相關的親物件繼承屬性和值。不過 JavaScript 並不支援多重繼承。

diff --git a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_8898a6dd437cc51f48b4e8cade0385ac/index.html b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_8898a6dd437cc51f48b4e8cade0385ac/index.html index cece6b5a66..b437e78707 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_8898a6dd437cc51f48b4e8cade0385ac/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_8898a6dd437cc51f48b4e8cade0385ac/index.html @@ -1,9 +1,11 @@ --- title: 建構子中的全域資訊 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/建構子中的全域資訊 +slug: >- + conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_8898a6dd437cc51f48b4e8cade0385ac translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model translation_of_original: >- Web/JavaScript/Guide/Obsolete_Pages/Property_Inheritance_Revisited/Global_Information_in_Constructors +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承/建構子中的全域資訊 ---

建構子中的全域資訊

當你建立建構子的時候，如果你在建構子中設定全域資訊，需要很小心。例如，假定你想要自動的給每一個新的職員指定一個專有的 ID。你可以給 Employee 使用下面的定義︰

diff --git a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_937645e235e25783cc4e9b0d7a1f6d76/index.html b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_937645e235e25783cc4e9b0d7a1f6d76/index.html index 3bba16f786..bca39463d4 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_937645e235e25783cc4e9b0d7a1f6d76/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_937645e235e25783cc4e9b0d7a1f6d76/index.html @@ -1,8 +1,10 @@ --- title: 再談屬性的繼承 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承 +slug: >- + conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_937645e235e25783cc4e9b0d7a1f6d76 translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Property_Inheritance_Revisited +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/再談屬性的繼承 ---

再談屬性的繼承

前面的章節說明了 JavaScript 建構子和原型如何提供階層組織和實體。本節將會討論一些稍早的討論中所看不到的細微差別。

diff --git a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_b021bd32308e4c421518cdd7104ac7bc/index.html b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_b021bd32308e4c421518cdd7104ac7bc/index.html index 5f071f0b00..ea17a4b80d 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_b021bd32308e4c421518cdd7104ac7bc/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/details_of_the_object_model_b021bd32308e4c421518cdd7104ac7bc/index.html @@ -1,9 +1,11 @@ --- title: 更靈活的建構子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/更靈活的建構子 +slug: >- + conflicting/Web/JavaScript/Guide/Details_of_the_Object_Model_b021bd32308e4c421518cdd7104ac7bc translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model translation_of_original: >- Web/JavaScript/Guide/Obsolete_Pages/The_Employee_Example/More_Flexible_Constructors +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/更靈活的建構子 ---

更靈活的建構子

目前為止所介紹的建構子函數並不能讓你在建立實體的時候指定屬性值。如同 Java 一般，你可以提供參數給建構子來為實體初始化屬性值。下圖顯示了做到這點的其中一個方式。

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators/index.html index 0d694e88f8..3acabca172 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators/index.html @@ -1,8 +1,9 @@ --- title: 表達式 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/表達式 +slug: conflicting/Web/JavaScript/Guide/Expressions_and_Operators translation_of: Web/JavaScript/Guide/Expressions_and_Operators translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Expressions +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/表達式 ---

 

表達式

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_05717c12b1ecaebc9d68cf43524d31b1/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_05717c12b1ecaebc9d68cf43524d31b1/index.html index e00a0e612b..52ff50ee43 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_05717c12b1ecaebc9d68cf43524d31b1/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_05717c12b1ecaebc9d68cf43524d31b1/index.html @@ -1,8 +1,10 @@ --- title: 算術運算子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/算術運算子 +slug: >- + conflicting/Web/JavaScript/Guide/Expressions_and_Operators_05717c12b1ecaebc9d68cf43524d31b1 translation_of: Web/JavaScript/Guide/Expressions_and_Operators translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Arithmetic_Operators +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/算術運算子 ---

 

算術運算子

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_11969cb29fead65c26360f554426c217/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_11969cb29fead65c26360f554426c217/index.html index 6109b2d6e3..900bd8c313 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_11969cb29fead65c26360f554426c217/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_11969cb29fead65c26360f554426c217/index.html @@ -1,8 +1,10 @@ --- title: 位元運算子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/位元運算子 +slug: >- + conflicting/Web/JavaScript/Guide/Expressions_and_Operators_11969cb29fead65c26360f554426c217 translation_of: Web/JavaScript/Guide/Expressions_and_Operators translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Bitwise_Operators +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/位元運算子 ---

 

 

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_351a6d9e4d31b32eff9762ef5deead93/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_351a6d9e4d31b32eff9762ef5deead93/index.html index 7ba467a3cf..e6c3371fd8 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_351a6d9e4d31b32eff9762ef5deead93/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_351a6d9e4d31b32eff9762ef5deead93/index.html @@ -1,8 +1,10 @@ --- title: 邏輯運算子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/邏輯運算子 +slug: >- + conflicting/Web/JavaScript/Guide/Expressions_and_Operators_351a6d9e4d31b32eff9762ef5deead93 translation_of: Web/JavaScript/Guide/Expressions_and_Operators translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Logical_Operators +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/邏輯運算子 ---

 

邏輯運算子

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_952d66f1fe521bc0574c89750f5b406e/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_952d66f1fe521bc0574c89750f5b406e/index.html index a37ea47e50..f080db0e15 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_952d66f1fe521bc0574c89750f5b406e/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_952d66f1fe521bc0574c89750f5b406e/index.html @@ -1,8 +1,10 @@ --- title: 特殊運算子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/特殊運算子 +slug: >- + conflicting/Web/JavaScript/Guide/Expressions_and_Operators_952d66f1fe521bc0574c89750f5b406e translation_of: Web/JavaScript/Guide/Expressions_and_Operators translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Special_Operators +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/特殊運算子 ---

 

特殊運算子

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e6fc14473511cf01e7062dfb7751f49d/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e6fc14473511cf01e7062dfb7751f49d/index.html index 5c6eb2fb16..57fc4f5c9a 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e6fc14473511cf01e7062dfb7751f49d/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e6fc14473511cf01e7062dfb7751f49d/index.html @@ -1,8 +1,10 @@ --- title: 運算子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子 +slug: >- + conflicting/Web/JavaScript/Guide/Expressions_and_Operators_e6fc14473511cf01e7062dfb7751f49d translation_of: Web/JavaScript/Guide/Expressions_and_Operators translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子 ---

 

運算子

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e70c1f2655520c542321ddbdb2c4f28d/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e70c1f2655520c542321ddbdb2c4f28d/index.html index 31b103c23f..64ee4bfe92 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e70c1f2655520c542321ddbdb2c4f28d/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_e70c1f2655520c542321ddbdb2c4f28d/index.html @@ -1,8 +1,10 @@ --- title: 代入運算子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/代入運算子 +slug: >- + conflicting/Web/JavaScript/Guide/Expressions_and_Operators_e70c1f2655520c542321ddbdb2c4f28d translation_of: Web/JavaScript/Guide/Expressions_and_Operators translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/Comparison_Operators +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/代入運算子 ---

 

代入運算子

diff --git a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_eb65eb8f4e6b3c16f08b95149183cfb8/index.html b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_eb65eb8f4e6b3c16f08b95149183cfb8/index.html index 0589aefd73..05b4e3b3d6 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_eb65eb8f4e6b3c16f08b95149183cfb8/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/expressions_and_operators_eb65eb8f4e6b3c16f08b95149183cfb8/index.html @@ -1,8 +1,10 @@ --- title: 字串運算子 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/字串運算子 +slug: >- + conflicting/Web/JavaScript/Guide/Expressions_and_Operators_eb65eb8f4e6b3c16f08b95149183cfb8 translation_of: Web/JavaScript/Guide/Expressions_and_Operators translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Operators/String_Operators +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/字串運算子 ---

 

字串運算子

diff --git a/files/zh-tw/conflicting/web/javascript/guide/functions/index.html b/files/zh-tw/conflicting/web/javascript/guide/functions/index.html index 8999a04084..503122c1bb 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/functions/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/functions/index.html @@ -1,8 +1,9 @@ --- title: 函數的呼叫 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的呼叫 +slug: conflicting/Web/JavaScript/Guide/Functions translation_of: Web/JavaScript/Guide/Functions translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Calling_Functions +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的呼叫 ---

 

diff --git a/files/zh-tw/conflicting/web/javascript/guide/functions_536f6bf46bbdf38cc1a0b28ca1bc41b9/index.html b/files/zh-tw/conflicting/web/javascript/guide/functions_536f6bf46bbdf38cc1a0b28ca1bc41b9/index.html index 0b44186a97..2c791124d8 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/functions_536f6bf46bbdf38cc1a0b28ca1bc41b9/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/functions_536f6bf46bbdf38cc1a0b28ca1bc41b9/index.html @@ -1,10 +1,11 @@ --- title: Number 和 String 函數 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/Number_和_String_函數 +slug: conflicting/Web/JavaScript/Guide/Functions_536f6bf46bbdf38cc1a0b28ca1bc41b9 translation_of: Web/JavaScript/Guide/Functions translation_of_original: >- Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions/parseInt_and_parseFloat_Functions +original_slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/Number_和_String_函數 ---

Number 和 String 函數

diff --git a/files/zh-tw/conflicting/web/javascript/guide/functions_587eb671a310bac0771e73a91b0abe6d/index.html b/files/zh-tw/conflicting/web/javascript/guide/functions_587eb671a310bac0771e73a91b0abe6d/index.html index b44b292eb8..1e8d32dd1a 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/functions_587eb671a310bac0771e73a91b0abe6d/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/functions_587eb671a310bac0771e73a91b0abe6d/index.html @@ -1,8 +1,9 @@ --- title: 預先定義的函數 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數 +slug: conflicting/Web/JavaScript/Guide/Functions_587eb671a310bac0771e73a91b0abe6d translation_of: Web/JavaScript/Guide/Functions translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數 ---

 

diff --git a/files/zh-tw/conflicting/web/javascript/guide/functions_925b2d10050621507a9c990cb803dcca/index.html b/files/zh-tw/conflicting/web/javascript/guide/functions_925b2d10050621507a9c990cb803dcca/index.html index d2ea7c4a46..7d47f51efa 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/functions_925b2d10050621507a9c990cb803dcca/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/functions_925b2d10050621507a9c990cb803dcca/index.html @@ -1,8 +1,9 @@ --- title: isNaN 函數 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isNaN_函數 +slug: conflicting/Web/JavaScript/Guide/Functions_925b2d10050621507a9c990cb803dcca translation_of: Web/JavaScript/Guide/Functions translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions/isNaN_Function +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isNaN_函數 ---

 

diff --git a/files/zh-tw/conflicting/web/javascript/guide/functions_b2cd05cbfe188215dc2e3f972d293ed6/index.html b/files/zh-tw/conflicting/web/javascript/guide/functions_b2cd05cbfe188215dc2e3f972d293ed6/index.html index db213a465e..17ab662b6a 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/functions_b2cd05cbfe188215dc2e3f972d293ed6/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/functions_b2cd05cbfe188215dc2e3f972d293ed6/index.html @@ -1,9 +1,10 @@ --- title: isFinite 函數 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isFinite_函數 +slug: conflicting/Web/JavaScript/Guide/Functions_b2cd05cbfe188215dc2e3f972d293ed6 translation_of: Web/JavaScript/Guide/Functions translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions/isFinite_Function +original_slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/isFinite_函數 ---

 

diff --git a/files/zh-tw/conflicting/web/javascript/guide/functions_ceaa4b2a55bb67388c2728af1ff890f5/index.html b/files/zh-tw/conflicting/web/javascript/guide/functions_ceaa4b2a55bb67388c2728af1ff890f5/index.html index 0533e2d1a4..5fdc5ab320 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/functions_ceaa4b2a55bb67388c2728af1ff890f5/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/functions_ceaa4b2a55bb67388c2728af1ff890f5/index.html @@ -1,10 +1,11 @@ --- title: escape 和 unescape 函數 -slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/escape_和_unescape_函數 +slug: conflicting/Web/JavaScript/Guide/Functions_ceaa4b2a55bb67388c2728af1ff890f5 translation_of: Web/JavaScript/Guide/Functions translation_of_original: >- Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions/escape_and_unescape_Functions +original_slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/escape_和_unescape_函數 ---

 

diff --git a/files/zh-tw/conflicting/web/javascript/guide/functions_effb9b1bcc102a5f6df7f1785ce89033/index.html b/files/zh-tw/conflicting/web/javascript/guide/functions_effb9b1bcc102a5f6df7f1785ce89033/index.html index fb257f891c..129d1ceaff 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/functions_effb9b1bcc102a5f6df7f1785ce89033/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/functions_effb9b1bcc102a5f6df7f1785ce89033/index.html @@ -1,8 +1,9 @@ --- title: eval 函數 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/eval_函數 +slug: conflicting/Web/JavaScript/Guide/Functions_effb9b1bcc102a5f6df7f1785ce89033 translation_of: Web/JavaScript/Guide/Functions translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions/eval_Function +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/eval_函數 ---

 

diff --git a/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types/index.html b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types/index.html index 407d484a34..d8c6b9697c 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types/index.html @@ -1,8 +1,9 @@ --- title: Unicode -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/Unicode +slug: conflicting/Web/JavaScript/Guide/Grammar_and_types translation_of: Web/JavaScript/Guide/Grammar_and_types translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Unicode +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/Unicode ---

 

Unicode

diff --git a/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_5c6f30ff8e011c45a011b9c8f3b5bcea/index.html b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_5c6f30ff8e011c45a011b9c8f3b5bcea/index.html index bea630e438..c2a24450e8 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_5c6f30ff8e011c45a011b9c8f3b5bcea/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_5c6f30ff8e011c45a011b9c8f3b5bcea/index.html @@ -1,8 +1,10 @@ --- title: 值 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/值 +slug: >- + conflicting/Web/JavaScript/Guide/Grammar_and_types_5c6f30ff8e011c45a011b9c8f3b5bcea translation_of: Web/JavaScript/Guide/Grammar_and_types translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Values +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/值 ---

 

值

diff --git a/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_d57082c2207b466127d8dc34a980addf/index.html b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_d57082c2207b466127d8dc34a980addf/index.html index 0c66b79359..625bc12ba3 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_d57082c2207b466127d8dc34a980addf/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_d57082c2207b466127d8dc34a980addf/index.html @@ -1,8 +1,10 @@ --- title: 字面表達 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/字面表達 +slug: >- + conflicting/Web/JavaScript/Guide/Grammar_and_types_d57082c2207b466127d8dc34a980addf translation_of: Web/JavaScript/Guide/Grammar_and_types translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Literals +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/字面表達 ---

 

字面表達

diff --git a/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_e5a53691c318855e3342ad91feb78f2e/index.html b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_e5a53691c318855e3342ad91feb78f2e/index.html index 9eedc7a21a..c4f601c524 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_e5a53691c318855e3342ad91feb78f2e/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_e5a53691c318855e3342ad91feb78f2e/index.html @@ -1,8 +1,10 @@ --- title: 常數 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/常數 +slug: >- + conflicting/Web/JavaScript/Guide/Grammar_and_types_e5a53691c318855e3342ad91feb78f2e translation_of: Web/JavaScript/Guide/Grammar_and_types translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Constants +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/常數 ---

 

常數

diff --git a/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_ef6fc79abc28f5eadd6c126341df5e49/index.html b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_ef6fc79abc28f5eadd6c126341df5e49/index.html index 151736f40c..d98470d4ea 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_ef6fc79abc28f5eadd6c126341df5e49/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/grammar_and_types_ef6fc79abc28f5eadd6c126341df5e49/index.html @@ -1,8 +1,10 @@ --- title: 變數 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/變數 +slug: >- + conflicting/Web/JavaScript/Guide/Grammar_and_types_ef6fc79abc28f5eadd6c126341df5e49 translation_of: Web/JavaScript/Guide/Grammar_and_types translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Variables +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/變數 ---

 

變數

diff --git a/files/zh-tw/conflicting/web/javascript/guide/index.html b/files/zh-tw/conflicting/web/javascript/guide/index.html index 7f8133da58..486b4540ff 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/index.html @@ -1,8 +1,9 @@ --- title: 陣列的運用 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/陣列的運用 +slug: conflicting/Web/JavaScript/Guide translation_of: Web/JavaScript/Guide translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Working_with_Arrays +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/陣列的運用 ---

陣列是值的有序序列。有別於其他的語言，JavaScript 並沒有明確的陣列資料類型。取而代之，提供了 Array 物件，可以直接實體化或使用陣列的字面表達記法。

diff --git a/files/zh-tw/conflicting/web/javascript/guide/regular_expressions/index.html b/files/zh-tw/conflicting/web/javascript/guide/regular_expressions/index.html index 792eec13b9..d3d624f8f1 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/regular_expressions/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/regular_expressions/index.html @@ -1,8 +1,9 @@ --- title: 正規表達式的運用 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用 +slug: conflicting/Web/JavaScript/Guide/Regular_Expressions translation_of: Web/JavaScript/Guide/Regular_Expressions translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Working_with_Regular_Expressions +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用 --- diff --git a/files/zh-tw/conflicting/web/javascript/guide/regular_expressions_24eb6498b86da57e7fb5337fd8fa04a6/index.html b/files/zh-tw/conflicting/web/javascript/guide/regular_expressions_24eb6498b86da57e7fb5337fd8fa04a6/index.html index 8abec68f16..b8317583d4 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/regular_expressions_24eb6498b86da57e7fb5337fd8fa04a6/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/regular_expressions_24eb6498b86da57e7fb5337fd8fa04a6/index.html @@ -1,10 +1,12 @@ --- title: 括弧子字串的比對結果的運用 slug: >- - Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 + conflicting/Web/JavaScript/Guide/Regular_Expressions_24eb6498b86da57e7fb5337fd8fa04a6 translation_of: Web/JavaScript/Guide/Regular_Expressions#Using_Parenthesized_Substring_Matches translation_of_original: >- Web/JavaScript/Guide/Obsolete_Pages/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches +original_slug: >- + Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/括弧子字串的比對結果的運用 ---

括弧子字串的比對結果的運用

在正規表達式的模式中包含括弧，對應的子比對結果就會被記憶。舉例來說，/a(b)c/ 比對字元 'abc' 並把 'b' 記憶起來。若要取回括弧子字串的比對結果，就使用 Array 元素 {{ mediawiki.external(1) }}, ..., {{ mediawiki.external('n') }}。

diff --git a/files/zh-tw/conflicting/web/javascript/guide/regular_expressions_38b32725e0e3217a5542b1b4ee122407/index.html b/files/zh-tw/conflicting/web/javascript/guide/regular_expressions_38b32725e0e3217a5542b1b4ee122407/index.html index 2dce68e5a9..40723757f7 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/regular_expressions_38b32725e0e3217a5542b1b4ee122407/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/regular_expressions_38b32725e0e3217a5542b1b4ee122407/index.html @@ -1,9 +1,11 @@ --- title: 使用標誌的進階搜尋 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 +slug: >- + conflicting/Web/JavaScript/Guide/Regular_Expressions_38b32725e0e3217a5542b1b4ee122407 translation_of: Web/JavaScript/Guide/Regular_Expressions translation_of_original: >- Web/JavaScript/Guide/Obsolete_Pages/Working_with_Regular_Expressions/Advanced_Searching_With_Flags +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/使用標誌的進階搜尋 ---

使用標誌的進階搜尋

正規表達式有四個選用的標誌，這些標誌可用於全域或不分大小寫等的搜尋。若要指明為全域搜尋，就使用 g 標誌。若要指明為區分大小寫來搜尋，就使用 i 標誌。若要指明為在多行中搜尋，就使用 m 標誌。若要進行“定點”搜尋，也就是以目標字串的目前位置為開始點來搜尋，那就使用 y 標誌。這些標誌可以單獨或不分順序混合使用，並作為正規表達式的一部分。

diff --git a/files/zh-tw/conflicting/web/javascript/guide/working_with_objects/index.html b/files/zh-tw/conflicting/web/javascript/guide/working_with_objects/index.html index fc10840076..2c71c4d735 100644 --- a/files/zh-tw/conflicting/web/javascript/guide/working_with_objects/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide/working_with_objects/index.html @@ -1,8 +1,9 @@ --- title: 物件和屬性 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件和屬性 +slug: conflicting/Web/JavaScript/Guide/Working_with_Objects translation_of: Web/JavaScript/Guide/Working_with_Objects translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Objects_and_Properties +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件和屬性 ---

 

物件和屬性

diff --git a/files/zh-tw/conflicting/web/javascript/guide_dc05b578fe0c2f7d9a89ed82daab4e65/index.html b/files/zh-tw/conflicting/web/javascript/guide_dc05b578fe0c2f7d9a89ed82daab4e65/index.html index 181d55974e..27c97069f5 100644 --- a/files/zh-tw/conflicting/web/javascript/guide_dc05b578fe0c2f7d9a89ed82daab4e65/index.html +++ b/files/zh-tw/conflicting/web/javascript/guide_dc05b578fe0c2f7d9a89ed82daab4e65/index.html @@ -1,8 +1,9 @@ --- title: 預先定義的核心物件 -slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件 +slug: conflicting/Web/JavaScript/Guide_dc05b578fe0c2f7d9a89ed82daab4e65 translation_of: Web/JavaScript/Guide translation_of_original: Web/JavaScript/Guide/Obsolete_Pages/Predefined_Core_Objects +original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件 ---

 

預先定義的核心物件

diff --git a/files/zh-tw/conflicting/web/javascript/reference/global_objects/arraybuffer/index.html b/files/zh-tw/conflicting/web/javascript/reference/global_objects/arraybuffer/index.html index 263726d7e0..80b284d163 100644 --- a/files/zh-tw/conflicting/web/javascript/reference/global_objects/arraybuffer/index.html +++ b/files/zh-tw/conflicting/web/javascript/reference/global_objects/arraybuffer/index.html @@ -1,8 +1,9 @@ --- title: ArrayBuffer.prototype -slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype +slug: conflicting/Web/JavaScript/Reference/Global_Objects/ArrayBuffer translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer translation_of_original: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype +original_slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype ---
{{JSRef}}
diff --git a/files/zh-tw/conflicting/web/javascript/reference/global_objects/date/index.html b/files/zh-tw/conflicting/web/javascript/reference/global_objects/date/index.html index 5490743ec0..b57eee125f 100644 --- a/files/zh-tw/conflicting/web/javascript/reference/global_objects/date/index.html +++ b/files/zh-tw/conflicting/web/javascript/reference/global_objects/date/index.html @@ -1,6 +1,6 @@ --- title: Date.prototype -slug: Web/JavaScript/Reference/Global_Objects/Date/prototype +slug: conflicting/Web/JavaScript/Reference/Global_Objects/Date tags: - Date - JavaScript @@ -9,6 +9,7 @@ tags: - 屬性 translation_of: Web/JavaScript/Reference/Global_Objects/Date translation_of_original: Web/JavaScript/Reference/Global_Objects/Date/prototype +original_slug: Web/JavaScript/Reference/Global_Objects/Date/prototype ---
{{JSRef}}
diff --git a/files/zh-tw/conflicting/web/javascript/reference/global_objects/function/index.html b/files/zh-tw/conflicting/web/javascript/reference/global_objects/function/index.html index 718454721b..6134d9116f 100644 --- a/files/zh-tw/conflicting/web/javascript/reference/global_objects/function/index.html +++ b/files/zh-tw/conflicting/web/javascript/reference/global_objects/function/index.html @@ -1,8 +1,9 @@ --- title: Function.prototype -slug: Web/JavaScript/Reference/Global_Objects/Function/prototype +slug: conflicting/Web/JavaScript/Reference/Global_Objects/Function translation_of: Web/JavaScript/Reference/Global_Objects/Function translation_of_original: Web/JavaScript/Reference/Global_Objects/Function/prototype +original_slug: Web/JavaScript/Reference/Global_Objects/Function/prototype ---
{{JSRef}}
diff --git a/files/zh-tw/conflicting/web/javascript/reference/global_objects/number/index.html b/files/zh-tw/conflicting/web/javascript/reference/global_objects/number/index.html index bfd57f3d21..c9c453592d 100644 --- a/files/zh-tw/conflicting/web/javascript/reference/global_objects/number/index.html +++ b/files/zh-tw/conflicting/web/javascript/reference/global_objects/number/index.html @@ -1,8 +1,9 @@ --- title: Number.prototype -slug: Web/JavaScript/Reference/Global_Objects/Number/prototype +slug: conflicting/Web/JavaScript/Reference/Global_Objects/Number translation_of: Web/JavaScript/Reference/Global_Objects/Number translation_of_original: Web/JavaScript/Reference/Global_Objects/Number/prototype +original_slug: Web/JavaScript/Reference/Global_Objects/Number/prototype ---
{{JSRef}}
diff --git a/files/zh-tw/conflicting/web/javascript/reference/global_objects/object/index.html b/files/zh-tw/conflicting/web/javascript/reference/global_objects/object/index.html index 4365b10c61..a81466a412 100644 --- a/files/zh-tw/conflicting/web/javascript/reference/global_objects/object/index.html +++ b/files/zh-tw/conflicting/web/javascript/reference/global_objects/object/index.html @@ -1,12 +1,13 @@ --- title: Object.prototype -slug: Web/JavaScript/Reference/Global_Objects/Object/prototype +slug: conflicting/Web/JavaScript/Reference/Global_Objects/Object tags: - JavaScript - Object - 待翻譯 translation_of: Web/JavaScript/Reference/Global_Objects/Object translation_of_original: Web/JavaScript/Reference/Global_Objects/Object/prototype +original_slug: Web/JavaScript/Reference/Global_Objects/Object/prototype ---
{{JSRef}}
diff --git a/files/zh-tw/conflicting/web/javascript/reference/global_objects/promise/index.html b/files/zh-tw/conflicting/web/javascript/reference/global_objects/promise/index.html index f93572bea3..ad266c7cce 100644 --- a/files/zh-tw/conflicting/web/javascript/reference/global_objects/promise/index.html +++ b/files/zh-tw/conflicting/web/javascript/reference/global_objects/promise/index.html @@ -1,8 +1,9 @@ --- title: Promise.prototype -slug: Web/JavaScript/Reference/Global_Objects/Promise/prototype +slug: conflicting/Web/JavaScript/Reference/Global_Objects/Promise translation_of: Web/JavaScript/Reference/Global_Objects/Promise translation_of_original: Web/JavaScript/Reference/Global_Objects/Promise/prototype +original_slug: Web/JavaScript/Reference/Global_Objects/Promise/prototype ---
{{JSRef}}
diff --git a/files/zh-tw/conflicting/web/javascript/reference/global_objects/string/index.html b/files/zh-tw/conflicting/web/javascript/reference/global_objects/string/index.html index 011c61418e..f1d7d046bf 100644 --- a/files/zh-tw/conflicting/web/javascript/reference/global_objects/string/index.html +++ b/files/zh-tw/conflicting/web/javascript/reference/global_objects/string/index.html @@ -1,8 +1,9 @@ --- title: String.prototype -slug: Web/JavaScript/Reference/Global_Objects/String/prototype +slug: conflicting/Web/JavaScript/Reference/Global_Objects/String translation_of: Web/JavaScript/Reference/Global_Objects/String translation_of_original: Web/JavaScript/Reference/Global_Objects/String/prototype +original_slug: Web/JavaScript/Reference/Global_Objects/String/prototype ---
{{JSRef}}
diff --git a/files/zh-tw/conflicting/web/javascript/reference/operators/index.html b/files/zh-tw/conflicting/web/javascript/reference/operators/index.html index 050c362008..33ec9b1065 100644 --- a/files/zh-tw/conflicting/web/javascript/reference/operators/index.html +++ b/files/zh-tw/conflicting/web/javascript/reference/operators/index.html @@ -1,8 +1,9 @@ --- title: 算術運算子 -slug: Web/JavaScript/Reference/Operators/Arithmetic_Operators +slug: conflicting/Web/JavaScript/Reference/Operators translation_of: Web/JavaScript/Reference/Operators translation_of_original: Web/JavaScript/Reference/Operators/Arithmetic_Operators +original_slug: Web/JavaScript/Reference/Operators/Arithmetic_Operators ---
{{jsSidebar("Operators")}}
diff --git a/files/zh-tw/conflicting/web/javascript/reference/operators_310dc67549939233c3d18a8fa2cdbb23/index.html b/files/zh-tw/conflicting/web/javascript/reference/operators_310dc67549939233c3d18a8fa2cdbb23/index.html index f0b3e39c6e..c470c6d8ef 100644 --- a/files/zh-tw/conflicting/web/javascript/reference/operators_310dc67549939233c3d18a8fa2cdbb23/index.html +++ b/files/zh-tw/conflicting/web/javascript/reference/operators_310dc67549939233c3d18a8fa2cdbb23/index.html @@ -1,8 +1,10 @@ --- title: 比較運算子 -slug: Web/JavaScript/Reference/Operators/Comparison_Operators +slug: >- + conflicting/Web/JavaScript/Reference/Operators_310dc67549939233c3d18a8fa2cdbb23 translation_of: Web/JavaScript/Reference/Operators translation_of_original: Web/JavaScript/Reference/Operators/Comparison_Operators +original_slug: Web/JavaScript/Reference/Operators/Comparison_Operators ---
{{jsSidebar("Operators")}}
diff --git a/files/zh-tw/conflicting/web/javascript/reference/operators_7c8eb9475d97a4a734c5991857698560/index.html b/files/zh-tw/conflicting/web/javascript/reference/operators_7c8eb9475d97a4a734c5991857698560/index.html index 86f78270b5..52a38b43b2 100644 --- a/files/zh-tw/conflicting/web/javascript/reference/operators_7c8eb9475d97a4a734c5991857698560/index.html +++ b/files/zh-tw/conflicting/web/javascript/reference/operators_7c8eb9475d97a4a734c5991857698560/index.html @@ -1,8 +1,10 @@ --- title: 位元運算子 -slug: Web/JavaScript/Reference/Operators/Bitwise_Operators +slug: >- + conflicting/Web/JavaScript/Reference/Operators_7c8eb9475d97a4a734c5991857698560 translation_of: Web/JavaScript/Reference/Operators translation_of_original: Web/JavaScript/Reference/Operators/Bitwise_Operators +original_slug: Web/JavaScript/Reference/Operators/Bitwise_Operators ---
{{jsSidebar("Operators")}}
diff --git a/files/zh-tw/conflicting/web/javascript/reference/operators_f71733c8e7001a29c3ec40d8522a4aca/index.html b/files/zh-tw/conflicting/web/javascript/reference/operators_f71733c8e7001a29c3ec40d8522a4aca/index.html index 2fb07f891e..b216afffae 100644 --- a/files/zh-tw/conflicting/web/javascript/reference/operators_f71733c8e7001a29c3ec40d8522a4aca/index.html +++ b/files/zh-tw/conflicting/web/javascript/reference/operators_f71733c8e7001a29c3ec40d8522a4aca/index.html @@ -1,8 +1,10 @@ --- title: Logical operators -slug: Web/JavaScript/Reference/Operators/Logical_Operators +slug: >- + conflicting/Web/JavaScript/Reference/Operators_f71733c8e7001a29c3ec40d8522a4aca translation_of: Web/JavaScript/Reference/Operators translation_of_original: Web/JavaScript/Reference/Operators/Logical_Operators +original_slug: Web/JavaScript/Reference/Operators/Logical_Operators ---
{{jsSidebar("Operators")}}
diff --git a/files/zh-tw/conflicting/web/media/formats/index.html b/files/zh-tw/conflicting/web/media/formats/index.html index 455655ba25..db406940f9 100644 --- a/files/zh-tw/conflicting/web/media/formats/index.html +++ b/files/zh-tw/conflicting/web/media/formats/index.html @@ -1,8 +1,9 @@ --- title: Media formats supported by the HTML audio and video elements -slug: Web/HTML/Supported_media_formats +slug: conflicting/Web/Media/Formats translation_of: Web/Media/Formats translation_of_original: Web/HTML/Supported_media_formats +original_slug: Web/HTML/Supported_media_formats ---

The {{ HTMLElement("audio") }} and {{ HTMLElement("video") }} elements provide support for playing audio and video media without requiring plug-ins. Video codecs and audio codecs are used to handle video and audio, and different codecs offer different levels of compression and quality. A container format is used to store and transmit the coded video and audio (both together, the case of a video with a soundtrack). Many combinations of codecs and container formats exist, although only a handful of these are relevant on the Web.

diff --git a/files/zh-tw/conflicting/web/opensearch/index.html b/files/zh-tw/conflicting/web/opensearch/index.html index 780e92fb84..d3a93fdd4e 100644 --- a/files/zh-tw/conflicting/web/opensearch/index.html +++ b/files/zh-tw/conflicting/web/opensearch/index.html @@ -1,10 +1,11 @@ --- title: 自網頁添加搜尋引擎 -slug: Web/API/Window/sidebar/Adding_search_engines_from_Web_pages +slug: conflicting/Web/OpenSearch tags: - 搜尋模組 translation_of: Web/OpenSearch translation_of_original: Web/API/Window/sidebar/Adding_search_engines_from_Web_pages +original_slug: Web/API/Window/sidebar/Adding_search_engines_from_Web_pages ---

Firefox 可以用 JavaScript 安裝搜尋引擎模組，且支援 OpenSearch 及 Sherlock 兩種模組格式。

diff --git a/files/zh-tw/glossary/xhtml/index.html b/files/zh-tw/glossary/xhtml/index.html index d147c26fee..b07eb0c720 100644 --- a/files/zh-tw/glossary/xhtml/index.html +++ b/files/zh-tw/glossary/xhtml/index.html @@ -1,7 +1,8 @@ --- title: XHTML -slug: XHTML +slug: Glossary/XHTML translation_of: Glossary/XHTML +original_slug: XHTML ---

 

XHTML 對 XML 而言是什麼，就如同 HTML 對 SGML 而言是什麼。也就是說，XHTML 是一種類似於 HTML 的標記語言，但是有更嚴格的語法。W3C 已完成兩種 XHTML 版本︰

diff --git a/files/zh-tw/learn/css/howto/css_faq/index.html b/files/zh-tw/learn/css/howto/css_faq/index.html index b824c671c4..8c23cbadbf 100644 --- a/files/zh-tw/learn/css/howto/css_faq/index.html +++ b/files/zh-tw/learn/css/howto/css_faq/index.html @@ -1,12 +1,13 @@ --- title: CSS 一般問題 -slug: Web/CSS/Common_CSS_Questions +slug: Learn/CSS/Howto/CSS_FAQ tags: - CSS - 待審閱技術 - 待審閱文字 - 所有類別 translation_of: Learn/CSS/Howto/CSS_FAQ +original_slug: Web/CSS/Common_CSS_Questions ---

diff --git a/files/zh-tw/learn/forms/how_to_structure_a_web_form/index.html b/files/zh-tw/learn/forms/how_to_structure_a_web_form/index.html index b403666795..75d20ace22 100644 --- a/files/zh-tw/learn/forms/how_to_structure_a_web_form/index.html +++ b/files/zh-tw/learn/forms/how_to_structure_a_web_form/index.html @@ -1,7 +1,8 @@ --- title: 如何建構 HTML 表單 -slug: Learn/HTML/Forms/How_to_structure_an_HTML_form +slug: Learn/Forms/How_to_structure_a_web_form translation_of: Learn/Forms/How_to_structure_a_web_form +original_slug: Learn/HTML/Forms/How_to_structure_an_HTML_form ---
{{LearnSidebar}}
diff --git a/files/zh-tw/learn/forms/index.html b/files/zh-tw/learn/forms/index.html index 589880794f..855e429d14 100644 --- a/files/zh-tw/learn/forms/index.html +++ b/files/zh-tw/learn/forms/index.html @@ -1,6 +1,6 @@ --- title: 網站表單-與數據合作 -slug: Learn/HTML/Forms +slug: Learn/Forms tags: - Featured - Forms @@ -11,6 +11,7 @@ tags: - Web - 待翻譯 translation_of: Learn/Forms +original_slug: Learn/HTML/Forms ---

這篇指南提供了一系列的文章，幫你掌握HTML表單的基本知識。對於與使用者互動，網站表單是一項十分有力的工具，最常使用於用戶數據蒐集，或控制使用者介面。但由於一些歷史與技術上的因素，並沒有顯著的方法發揮表單的潛力。在下面的指引中，我們將介紹網站表單所有基本面向，包括標記他們的HTML結構、設定控制器樣式、驗證數據及將數距提送至伺服器

diff --git a/files/zh-tw/learn/html/multimedia_and_embedding/images_in_html/index.html b/files/zh-tw/learn/html/multimedia_and_embedding/images_in_html/index.html index 5a2dfd7eff..90df15a4bc 100644 --- a/files/zh-tw/learn/html/multimedia_and_embedding/images_in_html/index.html +++ b/files/zh-tw/learn/html/multimedia_and_embedding/images_in_html/index.html @@ -1,7 +1,8 @@ --- title: HTML中的圖片 -slug: Learn/HTML/Multimedia_and_embedding/HTML中的圖片 +slug: Learn/HTML/Multimedia_and_embedding/Images_in_HTML translation_of: Learn/HTML/Multimedia_and_embedding/Images_in_HTML +original_slug: Learn/HTML/Multimedia_and_embedding/HTML中的圖片 ---
{{LearnSidebar}}
diff --git a/files/zh-tw/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html b/files/zh-tw/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html index a1996f2537..d828b00fca 100644 --- a/files/zh-tw/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html +++ b/files/zh-tw/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html @@ -1,7 +1,8 @@ --- title: 從物件到iframe - 其他嵌入技術 -slug: Learn/HTML/Multimedia_and_embedding/其他_嵌入_技術 +slug: Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies translation_of: Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies +original_slug: Learn/HTML/Multimedia_and_embedding/其他_嵌入_技術 ---
{{LearnSidebar}}
diff --git a/files/zh-tw/learn/html/tables/basics/index.html b/files/zh-tw/learn/html/tables/basics/index.html index 03325afbce..2d82ef2ea2 100644 --- a/files/zh-tw/learn/html/tables/basics/index.html +++ b/files/zh-tw/learn/html/tables/basics/index.html @@ -1,7 +1,8 @@ --- title: HTML表格的基礎 -slug: Learn/HTML/Tables/基礎 +slug: Learn/HTML/Tables/Basics translation_of: Learn/HTML/Tables/Basics +original_slug: Learn/HTML/Tables/基礎 ---
{{LearnSidebar}}
diff --git a/files/zh-tw/learn/javascript/building_blocks/events/index.html b/files/zh-tw/learn/javascript/building_blocks/events/index.html index 102e9cd314..9bb566a61d 100644 --- a/files/zh-tw/learn/javascript/building_blocks/events/index.html +++ b/files/zh-tw/learn/javascript/building_blocks/events/index.html @@ -1,9 +1,10 @@ --- title: Event attributes -slug: Web/Guide/HTML/Event_attributes +slug: Learn/JavaScript/Building_blocks/Events translation_of: >- Learn/JavaScript/Building_blocks/Events#Inline_event_handlers_%E2%80%94_don%27t_use_these translation_of_original: Web/Guide/HTML/Event_attributes +original_slug: Web/Guide/HTML/Event_attributes ---

每一個 HTML 元素都可以放置事件屬性，以藉此於事件發生時能執行 JavaScripte 程式。事件屬性的名稱都有一個前綴「on」，例如當使用者點選元素時要執行指定的 JavaScript，可以使用 onclick 屬性並把要執行的 JavaScript 當成屬性值。

diff --git a/files/zh-tw/learn/performance/multimedia/index.html b/files/zh-tw/learn/performance/multimedia/index.html index cbd3d8e23a..8dd950b4cc 100644 --- a/files/zh-tw/learn/performance/multimedia/index.html +++ b/files/zh-tw/learn/performance/multimedia/index.html @@ -1,7 +1,8 @@ --- title: '多媒體: 圖像跟影片' -slug: Learn/Performance/多媒體 +slug: Learn/Performance/Multimedia translation_of: Learn/Performance/Multimedia +original_slug: Learn/Performance/多媒體 ---

媒體，換句話說就是圖像跟影片，平均占了網站超過70%的下載流量。以下載的效能來考慮的話，減少媒體數量和檔案大小是一個簡單可以實現的目標。 這篇文章聚焦在優化圖像跟影片來改善網站的效能。

diff --git a/files/zh-tw/learn/server-side/first_steps/introduction/index.html b/files/zh-tw/learn/server-side/first_steps/introduction/index.html index a0919697ee..e93c7b9c32 100644 --- a/files/zh-tw/learn/server-side/first_steps/introduction/index.html +++ b/files/zh-tw/learn/server-side/first_steps/introduction/index.html @@ -1,7 +1,8 @@ --- title: 伺服器端的介紹 -slug: Learn/Server-side/First_steps/介紹 +slug: Learn/Server-side/First_steps/Introduction translation_of: Learn/Server-side/First_steps/Introduction +original_slug: Learn/Server-side/First_steps/介紹 ---
{{LearnSidebar}}
diff --git a/files/zh-tw/mdn/at_ten/index.html b/files/zh-tw/mdn/at_ten/index.html index 039fa64ed8..e64e06c637 100644 --- a/files/zh-tw/mdn/at_ten/index.html +++ b/files/zh-tw/mdn/at_ten/index.html @@ -1,7 +1,8 @@ --- title: MDN 10 週年 -slug: MDN_at_ten +slug: MDN/At_ten translation_of: MDN_at_ten +original_slug: MDN_at_ten ---
慶祝文件化網頁10年.
diff --git a/files/zh-tw/mdn/yari/index.html b/files/zh-tw/mdn/yari/index.html index 1a4263acad..5d3587a166 100644 --- a/files/zh-tw/mdn/yari/index.html +++ b/files/zh-tw/mdn/yari/index.html @@ -1,11 +1,12 @@ --- title: 'Kuma: MDN 的維基平台' -slug: MDN/Kuma +slug: MDN/Yari tags: - Kuma - Landing - MDN Meta translation_of: MDN/Kuma +original_slug: MDN/Kuma ---
{{MDNSidebar}}
diff --git "a/files/zh-tw/orphaned/core_javascript_1.5_\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" "b/files/zh-tw/orphaned/core_javascript_1.5_\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" index c7fe61614d..ece381a312 100644 --- "a/files/zh-tw/orphaned/core_javascript_1.5_\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" +++ "b/files/zh-tw/orphaned/core_javascript_1.5_\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" @@ -1,6 +1,7 @@ --- title: Core JavaScript 1.5 正規表達式的建立 -slug: Core_JavaScript_1.5_正規表達式的建立 +slug: orphaned/Core_JavaScript_1.5_正規表達式的建立 +original_slug: Core_JavaScript_1.5_正規表達式的建立 ---

 

diff --git a/files/zh-tw/orphaned/cross-site_xmlhttprequest/index.html b/files/zh-tw/orphaned/cross-site_xmlhttprequest/index.html index 9ffdd6ca6e..065bee38d6 100644 --- a/files/zh-tw/orphaned/cross-site_xmlhttprequest/index.html +++ b/files/zh-tw/orphaned/cross-site_xmlhttprequest/index.html @@ -1,6 +1,7 @@ --- title: Cross-site XMLHttpRequest -slug: Cross-site_XMLHttpRequest +slug: orphaned/Cross-site_XMLHttpRequest +original_slug: Cross-site_XMLHttpRequest ---

Firefox 3 支援了 W3C Access Control working draft，這讓你可以對其他網站作 XMLHttpRequests 以取得其他網站的資料，並加以管理，在自己建立的網站中，混入來自多個其他網站的內容。

Firefox 3 支援 Cross-site XMLHttpRequest

diff --git "a/files/zh-tw/orphaned/dom_\350\247\200\345\257\237\345\231\250/index.html" "b/files/zh-tw/orphaned/dom_\350\247\200\345\257\237\345\231\250/index.html" index 9b597bb306..99c8bbf9c8 100644 --- "a/files/zh-tw/orphaned/dom_\350\247\200\345\257\237\345\231\250/index.html" +++ "b/files/zh-tw/orphaned/dom_\350\247\200\345\257\237\345\231\250/index.html" @@ -1,5 +1,6 @@ --- title: DOM 觀察器 -slug: DOM_觀察器 +slug: orphaned/DOM_觀察器 +original_slug: DOM_觀察器 ---
diff --git "a/files/zh-tw/orphaned/firefox_3.5_\346\212\200\350\241\223\346\226\207\344\273\266/index.html" "b/files/zh-tw/orphaned/firefox_3.5_\346\212\200\350\241\223\346\226\207\344\273\266/index.html" index 0d151ee276..6a7083e2b2 100644 --- "a/files/zh-tw/orphaned/firefox_3.5_\346\212\200\350\241\223\346\226\207\344\273\266/index.html" +++ "b/files/zh-tw/orphaned/firefox_3.5_\346\212\200\350\241\223\346\226\207\344\273\266/index.html" @@ -1,9 +1,10 @@ --- title: Firefox 3.5 技術文件 -slug: Firefox_3.5_技術文件 +slug: orphaned/Firefox_3.5_技術文件 tags: - Firefox - Firefox 3.5 +original_slug: Firefox_3.5_技術文件 ---

Firefox 3.5 加入很多新功能，當然也加強了對各式網際標準的支援程度。這篇文章大致說明改進的部份、詳細的說明可見英文版原文。

限於人力，大部分的文章都是英文版。如果您有興趣，請協助翻譯。

diff --git "a/files/zh-tw/orphaned/firefox_\344\270\255\347\232\204\351\233\242\347\267\232\350\263\207\346\272\220/index.html" "b/files/zh-tw/orphaned/firefox_\344\270\255\347\232\204\351\233\242\347\267\232\350\263\207\346\272\220/index.html" index 0b1180d3ca..800bac1876 100644 --- "a/files/zh-tw/orphaned/firefox_\344\270\255\347\232\204\351\233\242\347\267\232\350\263\207\346\272\220/index.html" +++ "b/files/zh-tw/orphaned/firefox_\344\270\255\347\232\204\351\233\242\347\267\232\350\263\207\346\272\220/index.html" @@ -1,9 +1,10 @@ --- title: Firefox 中的離線資源 -slug: Firefox_中的離線資源 +slug: orphaned/Firefox_中的離線資源 tags: - HTML5 離線 - application cache +original_slug: Firefox_中的離線資源 ---

 

原文 : Using Application Cache

 

介紹

  HTML5 提供了 cache 機制，使得網路應用程式能較不受到網路狀態的影響。開發人員可以藉由 Application Cache (AppCache) 的介面來定義哪些資源應當被瀏覽器儲存起來 - 如此一來即使網路斷線使用者依舊可以取得這些資源。同時，應用程式也能正確的運行即使使用者按下了「重新載入」的按鈕。

  大抵來說，使用 Application Cache 可以取得下列好處：

  • 離線瀏覽：使用者可以在斷線/離線時瀏覽你的網站
  • 網站加速：善用 AppCache 就可以減少載入重複資源的狀況，進而加速網站讀取速度
  • 減少伺服器的負擔：瀏覽器僅只有在伺服器上資源發生變動時才重新抓取資料

application cache 運作的機制

啟動 application cache

  啟動 AppCache 的方法很簡單，你只需要在你程式頁面中，html 元素裡指名 manifest 的位置即可，這裡有個簡單範例：

<html manifest="example.appcache"> 
diff --git a/files/zh-tw/orphaned/html5_cross_browser_polyfills/index.html b/files/zh-tw/orphaned/html5_cross_browser_polyfills/index.html
index d823a44760..fdb15238ed 100644
--- a/files/zh-tw/orphaned/html5_cross_browser_polyfills/index.html
+++ b/files/zh-tw/orphaned/html5_cross_browser_polyfills/index.html
@@ -1,6 +1,7 @@
 ---
 title: HTML5 跨瀏覽器兼容程式碼
-slug: HTML5_Cross_Browser_Polyfills
+slug: orphaned/HTML5_Cross_Browser_Polyfills
+original_slug: HTML5_Cross_Browser_Polyfills
 ---
 
這是個蒐集中文世界開發（但不一定原創）的跨瀏覽器兼容代碼、連結的地方，作為 Paul Irish《HTML5 Cross Browser Polyfills》的仿效文件。蒐集不會完全，因此也強烈建議繼續追蹤上述文件的進展，或是使用搜尋引擎。

 
歡迎貢獻新的代碼、連結，不過請注意放在這個地方的代碼皆屬於公有領域。

diff --git a/files/zh-tw/orphaned/learn/how_to_contribute/index.html b/files/zh-tw/orphaned/learn/how_to_contribute/index.html
index f8a864b98d..b7b947b955 100644
--- a/files/zh-tw/orphaned/learn/how_to_contribute/index.html
+++ b/files/zh-tw/orphaned/learn/how_to_contribute/index.html
@@ -1,11 +1,12 @@
 ---
 title: 如何建設 MDN 學習專區
-slug: Learn/How_to_contribute
+slug: orphaned/Learn/How_to_contribute
 tags:
   - Documentation
   - 初學者
   - 貢獻
 translation_of: Learn/How_to_contribute
+original_slug: Learn/How_to_contribute
 ---
 
{{LearnSidebar}}

 
diff --git a/files/zh-tw/orphaned/learn/html/forms/html5_updates/index.html b/files/zh-tw/orphaned/learn/html/forms/html5_updates/index.html
index 6d83f5efea..28ec684d62 100644
--- a/files/zh-tw/orphaned/learn/html/forms/html5_updates/index.html
+++ b/files/zh-tw/orphaned/learn/html/forms/html5_updates/index.html
@@ -1,7 +1,8 @@
 ---
 title: Forms in HTML
-slug: Web/HTML/Forms_in_HTML
+slug: orphaned/Learn/HTML/Forms/HTML5_updates
 translation_of: Learn/HTML/Forms/HTML5_updates
+original_slug: Web/HTML/Forms_in_HTML
 ---
 

   {{gecko_minversion_header("2")}}

diff --git a/files/zh-tw/orphaned/mdn/community/conversations/index.html b/files/zh-tw/orphaned/mdn/community/conversations/index.html
index 955d241ece..9ae3c84f6f 100644
--- a/files/zh-tw/orphaned/mdn/community/conversations/index.html
+++ b/files/zh-tw/orphaned/mdn/community/conversations/index.html
@@ -1,11 +1,12 @@
 ---
 title: MDN的社群論壇
-slug: MDN/Community/論壇
+slug: orphaned/MDN/Community/Conversations
 tags:
   - MDN 資料
   - 指南
   - 社群論壇
 translation_of: MDN/Community/Conversations
+original_slug: MDN/Community/論壇
 ---
 
{{MDNSidebar}}

 
diff --git a/files/zh-tw/orphaned/mdn/community/index.html b/files/zh-tw/orphaned/mdn/community/index.html
index 3c6fcda1a2..1a167ae935 100644
--- a/files/zh-tw/orphaned/mdn/community/index.html
+++ b/files/zh-tw/orphaned/mdn/community/index.html
@@ -1,10 +1,11 @@
 ---
 title: 加入 MDN 社群
-slug: MDN/Community
+slug: orphaned/MDN/Community
 tags:
   - 教學
   - 社群
 translation_of: MDN/Community
+original_slug: MDN/Community
 ---
 
{{MDNSidebar}}

 
diff --git a/files/zh-tw/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html b/files/zh-tw/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html
index 6f3f294e88..b6c22589c5 100644
--- a/files/zh-tw/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html
+++ b/files/zh-tw/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html
@@ -1,7 +1,8 @@
 ---
 title: 如何創建 MDN 帳戶
-slug: MDN/Contribute/Howto/Create_an_MDN_account
+slug: orphaned/MDN/Contribute/Howto/Create_an_MDN_account
 translation_of: MDN/Contribute/Howto/Create_an_MDN_account
+original_slug: MDN/Contribute/Howto/Create_an_MDN_account
 ---
 
{{MDNSidebar}}
要針對 MDN 做出任何改變，你需要一個 MDN 帳戶。不要擔心，如果你只是想閱讀和搜索 MDN，你並不需要帳戶！這個簡單的指南幫助你設置 MDN 帳戶。

 
diff --git a/files/zh-tw/orphaned/mdn/contribute/howto/do_a_technical_review/index.html b/files/zh-tw/orphaned/mdn/contribute/howto/do_a_technical_review/index.html
index ecb35fe0be..8f0d6aca75 100644
--- a/files/zh-tw/orphaned/mdn/contribute/howto/do_a_technical_review/index.html
+++ b/files/zh-tw/orphaned/mdn/contribute/howto/do_a_technical_review/index.html
@@ -1,7 +1,8 @@
 ---
 title: 如何進行技術審查
-slug: MDN/Contribute/Howto/Do_a_technical_review
+slug: orphaned/MDN/Contribute/Howto/Do_a_technical_review
 translation_of: MDN/Contribute/Howto/Do_a_technical_review
+original_slug: MDN/Contribute/Howto/Do_a_technical_review
 ---
 
{{MDNSidebar}}
{{IncludeSubnav("/zh-TW/docs/MDN")}}

 
diff --git a/files/zh-tw/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html b/files/zh-tw/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html
index 8ef91de87d..483201e8ba 100644
--- a/files/zh-tw/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html
+++ b/files/zh-tw/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html
@@ -1,12 +1,13 @@
 ---
 title: 如何進行編輯審查
-slug: MDN/Contribute/Howto/Do_an_editorial_review
+slug: orphaned/MDN/Contribute/Howto/Do_an_editorial_review
 tags:
   - 如何
   - 指南
   - 文件
   - 編輯審查
 translation_of: MDN/Contribute/Howto/Do_an_editorial_review
+original_slug: MDN/Contribute/Howto/Do_an_editorial_review
 ---
 
{{MDNSidebar}}

 
diff --git a/files/zh-tw/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html b/files/zh-tw/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html
index e44a6fb7ce..a76ddd5cf7 100644
--- a/files/zh-tw/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html
+++ b/files/zh-tw/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html
@@ -1,9 +1,10 @@
 ---
 title: 如何撰寫文章摘要？
-slug: MDN/Contribute/Howto/Set_the_summary_for_a_page
+slug: orphaned/MDN/Contribute/Howto/Set_the_summary_for_a_page
 tags:
   - 摘要
 translation_of: MDN/Contribute/Howto/Set_the_summary_for_a_page
+original_slug: MDN/Contribute/Howto/Set_the_summary_for_a_page
 ---
 
{{MDNSidebar}}
 

 
diff --git a/files/zh-tw/orphaned/mdn/editor/basics/index.html b/files/zh-tw/orphaned/mdn/editor/basics/index.html
index d33daf9aeb..6fa44f3dbd 100644
--- a/files/zh-tw/orphaned/mdn/editor/basics/index.html
+++ b/files/zh-tw/orphaned/mdn/editor/basics/index.html
@@ -1,7 +1,8 @@
 ---
 title: Editor UI elements
-slug: MDN/Editor/Basics
+slug: orphaned/MDN/Editor/Basics
 translation_of: MDN/Editor/Basics
+original_slug: MDN/Editor/Basics
 ---
 
{{MDNSidebar}}
The built-in WYSIWYG editor on MDN is designed to make it as easy as possible to create, edit, and improve articles and other pages almost anywhere on the site. The editor window, shown below, consists of eight key area. This guide provides information about each section so you know how to use our entire editing environment.

 
diff --git a/files/zh-tw/orphaned/mdn/editor/index.html b/files/zh-tw/orphaned/mdn/editor/index.html
index 5cf0ac0a43..2b74b16953 100644
--- a/files/zh-tw/orphaned/mdn/editor/index.html
+++ b/files/zh-tw/orphaned/mdn/editor/index.html
@@ -1,6 +1,6 @@
 ---
 title: Guide to the MDN editor UI
-slug: MDN/Editor
+slug: orphaned/MDN/Editor
 tags:
   - Documentation
   - Guide
@@ -9,6 +9,7 @@ tags:
   - MDN Meta
   - 指南
 translation_of: MDN/Editor
+original_slug: MDN/Editor
 ---
 
{{MDNSidebar}}
{{IncludeSubnav("/zh-TW/docs/MDN")}}

 
diff --git a/files/zh-tw/orphaned/mdn/editor/keyboard_shortcuts/index.html b/files/zh-tw/orphaned/mdn/editor/keyboard_shortcuts/index.html
index 3c691a124b..445e502ed7 100644
--- a/files/zh-tw/orphaned/mdn/editor/keyboard_shortcuts/index.html
+++ b/files/zh-tw/orphaned/mdn/editor/keyboard_shortcuts/index.html
@@ -1,7 +1,8 @@
 ---
 title: Edit box of the MDN editor
-slug: MDN/Editor/Edit_box
+slug: orphaned/MDN/Editor/Keyboard_shortcuts
 translation_of: MDN/Editor/Keyboard_shortcuts
+original_slug: MDN/Editor/Edit_box
 ---
 
{{MDNSidebar}}
The edit box is, of course, where you actually do your writing. Right-clicking in the editor box offers appropriate additional options depending on the context of your click: right-clicking in a table offers table-related options and right-clicking in a list offers list-related options, for example.

 
diff --git "a/files/zh-tw/orphaned/mozilla/firefox/releases/4/firefox_4_\351\226\213\347\231\274\350\200\205\346\226\260\345\212\237\350\203\275\346\246\202\350\246\275/index.html" "b/files/zh-tw/orphaned/mozilla/firefox/releases/4/firefox_4_\351\226\213\347\231\274\350\200\205\346\226\260\345\212\237\350\203\275\346\246\202\350\246\275/index.html"
index c36dad8487..c081bb6303 100644
--- "a/files/zh-tw/orphaned/mozilla/firefox/releases/4/firefox_4_\351\226\213\347\231\274\350\200\205\346\226\260\345\212\237\350\203\275\346\246\202\350\246\275/index.html"
+++ "b/files/zh-tw/orphaned/mozilla/firefox/releases/4/firefox_4_\351\226\213\347\231\274\350\200\205\346\226\260\345\212\237\350\203\275\346\246\202\350\246\275/index.html"
@@ -1,6 +1,7 @@
 ---
 title: Firefox 4 for developers
-slug: Mozilla/Firefox/Releases/4/Firefox_4_開發者新功能概覽
+slug: orphaned/Mozilla/Firefox/Releases/4/Firefox_4_開發者新功能概覽
+original_slug: Mozilla/Firefox/Releases/4/Firefox_4_開發者新功能概覽
 ---
 
{{FirefoxSidebar}}
2010 年六月起進入 Beta 測試期的 Firefox 4，增進了效能、加強針對 HTML 5 及其他創新網際科技的支援程度，也更加安全。本文為網頁、附加元件、Gecko 平台開發者們提供這一版的簡要技術相關資訊。

 
diff --git a/files/zh-tw/orphaned/web/css/border-image/border-image/index.html b/files/zh-tw/orphaned/web/css/border-image/border-image/index.html
index 210a2663eb..5b3e06def0 100644
--- a/files/zh-tw/orphaned/web/css/border-image/border-image/index.html
+++ b/files/zh-tw/orphaned/web/css/border-image/border-image/index.html
@@ -1,8 +1,9 @@
 ---
 title: border-image
-slug: Web/CSS/border-image/border-image
+slug: orphaned/Web/CSS/border-image/border-image
 tags:
   - CSS
+original_slug: Web/CSS/border-image/border-image
 ---
 
摘要

 
diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/javascript_\346\246\202\350\246\201/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/javascript_\346\246\202\350\246\201/index.html"
index 9c74f992c9..40a21cc0fe 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/javascript_\346\246\202\350\246\201/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/javascript_\346\246\202\350\246\201/index.html"
@@ -1,6 +1,8 @@
 ---
 title: JavaScript 概要
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/JavaScript_概要
 ---
 
 

 
什麼是 JavaScript？

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/liveconnect_\346\246\202\350\246\201/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/liveconnect_\346\246\202\350\246\201/index.html"
index 985cfe5989..b0c24d8903 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/liveconnect_\346\246\202\350\246\201/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/liveconnect_\346\246\202\350\246\201/index.html"
@@ -1,6 +1,8 @@
 ---
 title: LiveConnect 概要
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/LiveConnect_概要
 ---
 
 

 
LiveConnect 概要

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/index.html"
index 9f369cbcac..93ff50d8e8 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/index.html"
@@ -1,6 +1,7 @@
 ---
 title: 例外處理語法
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法
+slug: orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法
 ---
 
例外處理語法

 
你可以使用 throw 語法來拋出例外，並使用 try...catch 語法來處理例外。

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/throw_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/throw_\350\252\236\346\263\225/index.html"
index 83230830e6..c7224f0391 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/throw_\350\252\236\346\263\225/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/throw_\350\252\236\346\263\225/index.html"
@@ -1,6 +1,8 @@
 ---
 title: throw 語法
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/throw_語法
 ---
 
throw 語法

 
使用 throw 語法來拋出例外。當你準備要拋出例外時，指定內含想要拋出的值的表達式︰

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/try...catch_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/try...catch_\350\252\236\346\263\225/index.html"
index 2bc150c6fc..602286497c 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/try...catch_\350\252\236\346\263\225/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\344\276\213\345\244\226\350\231\225\347\220\206\350\252\236\346\263\225/try...catch_\350\252\236\346\263\225/index.html"
@@ -1,6 +1,8 @@
 ---
 title: try...catch 語法
 slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法
+original_slug: >-
   Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/例外處理語法/try...catch_語法
 ---
 
try...catch 語法

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\256\232\347\276\251/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\256\232\347\276\251/index.html"
index f56f796a03..fd701b03ad 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\256\232\347\276\251/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\207\275\346\225\270\347\232\204\345\256\232\347\276\251/index.html"
@@ -1,6 +1,7 @@
 ---
 title: 函數的定義
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義
+slug: orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/函數的定義
 ---
 
 
函數的定義
 
函數的定義由以下的關鍵字所組成︰
 
     
  • 函數的名稱。
    •  
  • 傳給函數的參數的列表，以小括弧包夾、並以逗號分隔。
    •  
  • 用來定義函數的 JavaScript 語句，以大括弧包夾 { }。在函數裡的語句裡可含有在應用程式中已定義的其他函數的呼叫。
    •  
 
簡單的範例
 
舉例來說，以下代碼定義了一個簡單的函數，名為 square︰
 
function square(number) {
   return number * number;
diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\273\272\347\253\213\346\226\260\347\232\204\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\273\272\347\253\213\346\226\260\347\232\204\347\211\251\344\273\266/index.html"
index faadc10f07..9d059fb3a1 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\273\272\347\253\213\346\226\260\347\232\204\347\211\251\344\273\266/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\273\272\347\253\213\346\226\260\347\232\204\347\211\251\344\273\266/index.html"
@@ -1,6 +1,7 @@
 ---
 title: 建立新的物件
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件
+slug: orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/建立新的物件
 ---
 
 

 
diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/break_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/break_\350\252\236\346\263\225/index.html"
index ea6551a851..f6d1e3e5f0 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/break_\350\252\236\346\263\225/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/break_\350\252\236\346\263\225/index.html"
@@ -1,6 +1,8 @@
 ---
 title: break 語法
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/break_語法
 ---
 
break 語法

 
使用 break 語法可以終止 loop、switch、label 語法。

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/continue_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/continue_\350\252\236\346\263\225/index.html"
index 68f757d572..d7f81c5b46 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/continue_\350\252\236\346\263\225/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/continue_\350\252\236\346\263\225/index.html"
@@ -1,6 +1,8 @@
 ---
 title: continue 語法
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/continue_語法
 ---
 
continue 語法

 
continue 語法可用來重新開始 while、do-while、for、label 語法。

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/do...while_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/do...while_\350\252\236\346\263\225/index.html"
index 5091d476fd..7047913122 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/do...while_\350\252\236\346\263\225/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/do...while_\350\252\236\346\263\225/index.html"
@@ -1,6 +1,8 @@
 ---
 title: do...while 語法
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/do...while_語法
 ---
 
do...while 語法

 
do...while 語法會反覆執行直到指定條件的求值結果為 false 為止。do...while 語法如下︰

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/for_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/for_\350\252\236\346\263\225/index.html"
index 8978b7ed27..a5a48b69b3 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/for_\350\252\236\346\263\225/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/for_\350\252\236\346\263\225/index.html"
@@ -1,6 +1,8 @@
 ---
 title: for 語法
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/for_語法
 ---
 
for 語法

 
for 循環反覆執行直到指定的條件的求值為 false 為止。JavaScript 的 for 循環和 Java 和 C 的 for 循環很類似。for 語法如下︰

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/label_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/label_\350\252\236\346\263\225/index.html"
index 8b63254ac1..2aafe480fc 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/label_\350\252\236\346\263\225/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/label_\350\252\236\346\263\225/index.html"
@@ -1,6 +1,8 @@
 ---
 title: label 語法
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/label_語法
 ---
 
label 語法

 
label 提供識別子作為語法，可讓你的程式的任何一處都能參考得到。舉例來說，你可以使用標籤來標識循環，然後使用 break 或 continue 語法來指示程式是否要中斷循環或繼續執行。

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/while_\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/while_\350\252\236\346\263\225/index.html"
index 76beeaafeb..4dbfa30eee 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/while_\350\252\236\346\263\225/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\345\276\252\347\222\260\350\252\236\346\263\225/while_\350\252\236\346\263\225/index.html"
@@ -1,6 +1,8 @@
 ---
 title: while 語法
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/循環語法/while_語法
 ---
 
while 語法

 
while 語法會執行他的語句，只要指定的條件的求值結果為 true。while 語法如下︰

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/getter_\345\222\214_setter_\347\232\204\345\256\232\347\276\251/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/getter_\345\222\214_setter_\347\232\204\345\256\232\347\276\251/index.html"
index 222529aa18..6d009808d9 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/getter_\345\222\214_setter_\347\232\204\345\256\232\347\276\251/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/getter_\345\222\214_setter_\347\232\204\345\256\232\347\276\251/index.html"
@@ -1,6 +1,8 @@
 ---
 title: Getter 和 Setter 的定義
 slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義
+original_slug: >-
   Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/Getter_和_Setter_的定義
 ---
 
 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/index.html"
index 687b428275..3eb5f505c2 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/index.html"
@@ -1,6 +1,7 @@
 ---
 title: 新物件的建立
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立
+slug: orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立
 ---
 
 

 
新物件的建立

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\344\275\277\347\224\250_this_\345\217\226\345\276\227\347\211\251\344\273\266\347\232\204\345\217\203\350\200\203/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\344\275\277\347\224\250_this_\345\217\226\345\276\227\347\211\251\344\273\266\347\232\204\345\217\203\350\200\203/index.html"
index 6af61628b5..470cf523b8 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\344\275\277\347\224\250_this_\345\217\226\345\276\227\347\211\251\344\273\266\347\232\204\345\217\203\350\200\203/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\344\275\277\347\224\250_this_\345\217\226\345\276\227\347\211\251\344\273\266\347\232\204\345\217\203\350\200\203/index.html"
@@ -1,6 +1,8 @@
 ---
 title: 使用 this 取得物件的參考
 slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考
+original_slug: >-
   Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/使用_this_取得物件的參考
 ---
 
 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\261\254\346\200\247\347\232\204\345\210\252\351\231\244/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\261\254\346\200\247\347\232\204\345\210\252\351\231\244/index.html"
index ba099fa041..a46e7f8835 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\261\254\346\200\247\347\232\204\345\210\252\351\231\244/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\261\254\346\200\247\347\232\204\345\210\252\351\231\244/index.html"
@@ -1,6 +1,8 @@
 ---
 title: 屬性的刪除
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/屬性的刪除
 ---
 
 

 
屬性的刪除

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\273\272\346\247\213\345\255\220\345\207\275\346\225\270\347\232\204\344\275\277\347\224\250/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\273\272\346\247\213\345\255\220\345\207\275\346\225\270\347\232\204\344\275\277\347\224\250/index.html"
index b9832bf245..98612ee523 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\273\272\346\247\213\345\255\220\345\207\275\346\225\270\347\232\204\344\275\277\347\224\250/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\345\273\272\346\247\213\345\255\220\345\207\275\346\225\270\347\232\204\344\275\277\347\224\250/index.html"
@@ -1,6 +1,8 @@
 ---
 title: 建構子函數的使用
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/建構子函數的使用
 ---
 
 

 
建構子函數的使用

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\346\226\271\346\263\225\347\232\204\345\256\232\347\276\251/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\346\226\271\346\263\225\347\232\204\345\256\232\347\276\251/index.html"
index 67a9250b8e..c2e02a2195 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\346\226\271\346\263\225\347\232\204\345\256\232\347\276\251/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\346\226\271\346\263\225\347\232\204\345\256\232\347\276\251/index.html"
@@ -1,6 +1,8 @@
 ---
 title: 方法的定義
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/方法的定義
 ---
 
 

 
方法的定義

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\210\235\345\247\213\345\214\226\345\255\220\347\232\204\344\275\277\347\224\250/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\210\235\345\247\213\345\214\226\345\255\220\347\232\204\344\275\277\347\224\250/index.html"
index 79b7e5041b..c286b4ed1a 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\210\235\345\247\213\345\214\226\345\255\220\347\232\204\344\275\277\347\224\250/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\210\235\345\247\213\345\214\226\345\255\220\347\232\204\344\275\277\347\224\250/index.html"
@@ -1,6 +1,8 @@
 ---
 title: 物件初始化子的使用
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件初始化子的使用
 ---
 
 

 
物件初始化子的使用

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\261\254\346\200\247\347\232\204\347\264\242\345\274\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\261\254\346\200\247\347\232\204\347\264\242\345\274\225/index.html"
index 08e243c78b..5331db49f4 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\261\254\346\200\247\347\232\204\347\264\242\345\274\225/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\347\211\251\344\273\266\345\261\254\346\200\247\347\232\204\347\264\242\345\274\225/index.html"
@@ -1,6 +1,8 @@
 ---
 title: 物件屬性的索引
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/物件屬性的索引
 ---
 
 

 
物件屬性的索引

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\351\207\235\345\260\215\347\211\251\344\273\266\347\232\204\351\241\236\345\236\213\345\256\232\347\276\251\345\261\254\346\200\247/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\351\207\235\345\260\215\347\211\251\344\273\266\347\232\204\351\241\236\345\236\213\345\256\232\347\276\251\345\261\254\346\200\247/index.html"
index 0d1e55ac71..daa25406db 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\351\207\235\345\260\215\347\211\251\344\273\266\347\232\204\351\241\236\345\236\213\345\256\232\347\276\251\345\261\254\346\200\247/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\226\260\347\211\251\344\273\266\347\232\204\345\273\272\347\253\213/\351\207\235\345\260\215\347\211\251\344\273\266\347\232\204\351\241\236\345\236\213\345\256\232\347\276\251\345\261\254\346\200\247/index.html"
@@ -1,6 +1,8 @@
 ---
 title: 針對物件的類型定義屬性
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/新物件的建立/針對物件的類型定義屬性
 ---
 
 

 
針對物件的類型定義屬性

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\346\250\241\345\274\217\347\232\204\347\267\250\345\257\253/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\346\250\241\345\274\217\347\232\204\347\267\250\345\257\253/index.html"
index e07b2f6aa4..759c9151e8 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\346\250\241\345\274\217\347\232\204\347\267\250\345\257\253/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\346\250\241\345\274\217\347\232\204\347\267\250\345\257\253/index.html"
@@ -1,6 +1,8 @@
 ---
 title: 正規表達式模式的編寫
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式模式的編寫
 ---
 
正規表達式的模式是由簡單的字元所組成，如 /abc/，或由簡單的和特殊的字元所組成，如 /ab*c/ 或 /Chapter (\d+)\.\d*/。後者含有用來記憶的括弧。以模式的某一部分所產生的比對結果會被記憶起來以供稍後使用，已在 括弧子字串的比對結果的運用 一文中解說。

 
簡單模式的使用

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html"
index ffeee0f5c7..e4919fd7d2 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\345\273\272\347\253\213/index.html"
@@ -1,6 +1,7 @@
 ---
 title: 正規表達式的建立
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立
+slug: orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的建立
 ---
 
正規表達式的建立

 
正規表達式有兩種建構方式︰

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\347\257\204\344\276\213/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\347\257\204\344\276\213/index.html"
index 0bd61d90e5..7892d914e9 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\347\257\204\344\276\213/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\351\201\213\347\224\250/\346\255\243\350\246\217\350\241\250\351\201\224\345\274\217\347\232\204\347\257\204\344\276\213/index.html"
@@ -1,6 +1,8 @@
 ---
 title: 正規表達式的範例
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/正規表達式的運用/正規表達式的範例
 ---
 
範例

 
以下範例示範正規表達式的一些用法。

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\347\232\204\346\223\215\344\275\234\350\252\236\346\263\225/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\347\232\204\346\223\215\344\275\234\350\252\236\346\263\225/index.html"
index f1e46206fe..998b9bd85e 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\347\232\204\346\223\215\344\275\234\350\252\236\346\263\225/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\211\251\344\273\266\347\232\204\346\223\215\344\275\234\350\252\236\346\263\225/index.html"
@@ -1,6 +1,7 @@
 ---
 title: 物件的操作語法
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法
+slug: orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/物件的操作語法
 ---
 
物件的操作語法

 
JavaScript 使用 for...in、for each...in、with 語法來操作物件。

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\271\274\346\211\277/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\271\274\346\211\277/index.html"
index 4b1e65afce..c37315a25d 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\271\274\346\211\277/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\347\271\274\346\211\277/index.html"
@@ -1,6 +1,7 @@
 ---
 title: 繼承
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承
+slug: orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/繼承
 ---
 
 

 
diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/index.html"
index a9a7200773..fea5580a9e 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/index.html"
@@ -1,6 +1,7 @@
 ---
 title: 職員的例子
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子
+slug: orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子
 ---
 
職員的例子

 
本章的剩餘部分會使用如下所示的職員的階層圖。

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/index.html"
index 01d23df274..4049a2267b 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/index.html"
@@ -1,6 +1,8 @@
 ---
 title: 物件的屬性
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性
 ---
 
物件的屬性

 
本節討論物件如何從原型鏈上的其他物件來繼承屬性，以及當你在執行時期加入屬性的時候，發生了什麼事。

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\345\212\240\345\205\245/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\345\212\240\345\205\245/index.html"
index 4d5a456ad4..8892001b02 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\345\212\240\345\205\245/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\345\212\240\345\205\245/index.html"
@@ -1,6 +1,8 @@
 ---
 title: 屬性的加入
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的加入
 ---
 
屬性的加入

 
在 JavaScript 中，你可以在執行時期把屬性加入到任何的物件。你不會受到只能使用由建構子函數提供屬性的限制。若要為特定的單一物件加入屬性，你可以把值代入給物件，如下︰

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html"
index fa38245533..e6da5c1618 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\347\211\251\344\273\266\347\232\204\345\261\254\346\200\247/\345\261\254\346\200\247\347\232\204\347\271\274\346\211\277/index.html"
@@ -1,6 +1,8 @@
 ---
 title: 屬性的繼承
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/物件的屬性/屬性的繼承
 ---
 
屬性的繼承

 
假定你以如下語句建立了作為 WorkerBee 的 mark 物件（如同 圖 8.3 所示）︰

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\351\232\216\345\261\244\347\232\204\345\273\272\347\253\213/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\351\232\216\345\261\244\347\232\204\345\273\272\347\253\213/index.html"
index 3e7a144656..804f5e7243 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\351\232\216\345\261\244\347\232\204\345\273\272\347\253\213/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\201\267\345\223\241\347\232\204\344\276\213\345\255\220/\351\232\216\345\261\244\347\232\204\345\273\272\347\253\213/index.html"
@@ -1,6 +1,8 @@
 ---
 title: 階層的建立
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/職員的例子/階層的建立
 ---
 
階層的建立

 
這裡有一些方式可以定義適當的建構子函數，以實現 Employee 的階層結構。該如何選擇定義這些的方式，主要取決於你希望你的應用程式能做什麼。

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\277\255\344\273\243\345\231\250\345\222\214\347\224\242\347\224\237\345\231\250/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\277\255\344\273\243\345\231\250\345\222\214\347\224\242\347\224\237\345\231\250/index.html"
index 21029266db..93e9a07d82 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\277\255\344\273\243\345\231\250\345\222\214\347\224\242\347\224\237\345\231\250/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\350\277\255\344\273\243\345\231\250\345\222\214\347\224\242\347\224\237\345\231\250/index.html"
@@ -1,6 +1,7 @@
 ---
 title: 迭代器和產生器
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器
+slug: orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/迭代器和產生器
 ---
 
迭代器和產生器

 
diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\346\257\224\350\274\203\351\201\213\347\256\227\345\255\220/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\346\257\224\350\274\203\351\201\213\347\256\227\345\255\220/index.html"
index 2ce01c1501..a76bc9f8d3 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\346\257\224\350\274\203\351\201\213\347\256\227\345\255\220/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\201\213\347\256\227\345\255\220/\346\257\224\350\274\203\351\201\213\347\256\227\345\255\220/index.html"
@@ -1,6 +1,7 @@
 ---
 title: 比較運算子
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子
+slug: orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/運算子/比較運算子
 ---
 
 

 
比較運算子

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\226\211\345\214\205\347\232\204\351\201\213\347\224\250/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\226\211\345\214\205\347\232\204\351\201\213\347\224\250/index.html"
index 0e0905730f..1f4ca1ecb5 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\226\211\345\214\205\347\232\204\351\201\213\347\224\250/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\226\211\345\214\205\347\232\204\351\201\213\347\224\250/index.html"
@@ -1,6 +1,7 @@
 ---
 title: 閉包的運用
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用
+slug: orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/閉包的運用
 ---
 
閉包的運用

 
閉包（Closure）經常會被認為是 JavaScript 的高級機能，但了解閉包是精通語言的必要之事。

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\227\234\346\226\274/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\227\234\346\226\274/index.html"
index de638e2a9f..4befaef03d 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\227\234\346\226\274/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\227\234\346\226\274/index.html"
@@ -1,6 +1,7 @@
 ---
 title: 關於
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於
+slug: orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/關於
 ---
 
 

 
JavaScript 各版本的新機能

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/parseint_\345\222\214_parsefloat_\345\207\275\346\225\270/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/parseint_\345\222\214_parsefloat_\345\207\275\346\225\270/index.html"
index 65d1287175..998864e4ce 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/parseint_\345\222\214_parsefloat_\345\207\275\346\225\270/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\345\207\275\346\225\270/parseint_\345\222\214_parsefloat_\345\207\275\346\225\270/index.html"
@@ -1,6 +1,8 @@
 ---
 title: parseInt 和 parseFloat 函數
 slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數
+original_slug: >-
   Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的函數/parseInt_和_parseFloat_函數
 ---
 
 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/array_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/array_\347\211\251\344\273\266/index.html"
index a806c4dfac..b1374edbe1 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/array_\347\211\251\344\273\266/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/array_\347\211\251\344\273\266/index.html"
@@ -1,6 +1,8 @@
 ---
 title: Array 物件
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Array_物件
 ---
 
 

 
Array 物件

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/boolean_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/boolean_\347\211\251\344\273\266/index.html"
index 02648f7073..ab5587f00a 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/boolean_\347\211\251\344\273\266/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/boolean_\347\211\251\344\273\266/index.html"
@@ -1,6 +1,8 @@
 ---
 title: Boolean 物件
 slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件
+original_slug: >-
   Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Boolean_物件
 ---
 
 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/date_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/date_\347\211\251\344\273\266/index.html"
index ca94741f14..5810204a65 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/date_\347\211\251\344\273\266/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/date_\347\211\251\344\273\266/index.html"
@@ -1,6 +1,8 @@
 ---
 title: Date 物件
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Date_物件
 ---
 
 

 
Date 物件

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/function_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/function_\347\211\251\344\273\266/index.html"
index 4acf1e73ca..13a6d82775 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/function_\347\211\251\344\273\266/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/function_\347\211\251\344\273\266/index.html"
@@ -1,6 +1,8 @@
 ---
 title: Function 物件
 slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件
+original_slug: >-
   Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Function_物件
 ---
 
 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/math_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/math_\347\211\251\344\273\266/index.html"
index 8aa6bb0223..e2695f4347 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/math_\347\211\251\344\273\266/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/math_\347\211\251\344\273\266/index.html"
@@ -1,6 +1,8 @@
 ---
 title: Math 物件
-slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件
+slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件
+original_slug: Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Math_物件
 ---
 
 

 
Math 物件

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/number_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/number_\347\211\251\344\273\266/index.html"
index 01ff1ca26f..8c5fd0491b 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/number_\347\211\251\344\273\266/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/number_\347\211\251\344\273\266/index.html"
@@ -1,6 +1,8 @@
 ---
 title: Number 物件
 slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件
+original_slug: >-
   Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/Number_物件
 ---
 
 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/regexp_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/regexp_\347\211\251\344\273\266/index.html"
index 6d26e86067..c5c3766fde 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/regexp_\347\211\251\344\273\266/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/regexp_\347\211\251\344\273\266/index.html"
@@ -1,6 +1,8 @@
 ---
 title: RegExp 物件
 slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件
+original_slug: >-
   Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/RegExp_物件
 ---
 
 

diff --git "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/string_\347\211\251\344\273\266/index.html" "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/string_\347\211\251\344\273\266/index.html"
index 9e18d6ca98..45cd221374 100644
--- "a/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/string_\347\211\251\344\273\266/index.html"
+++ "b/files/zh-tw/orphaned/web/javascript/obsolete_pages/obsolete_pages/obsolete_pages/\351\240\220\345\205\210\345\256\232\347\276\251\347\232\204\346\240\270\345\277\203\347\211\251\344\273\266/string_\347\211\251\344\273\266/index.html"
@@ -1,6 +1,8 @@
 ---
 title: String 物件
 slug: >-
+  orphaned/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件
+original_slug: >-
   Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/預先定義的核心物件/String_物件
 ---
 
 

diff --git "a/files/zh-tw/orphaned/web/svg/\346\225\231\345\255\270/index.html" "b/files/zh-tw/orphaned/web/svg/\346\225\231\345\255\270/index.html"
index 5521386506..3919c60d10 100644
--- "a/files/zh-tw/orphaned/web/svg/\346\225\231\345\255\270/index.html"
+++ "b/files/zh-tw/orphaned/web/svg/\346\225\231\345\255\270/index.html"
@@ -1,6 +1,7 @@
 ---
 title: 教學
-slug: Web/SVG/教學
+slug: orphaned/Web/SVG/教學
+original_slug: Web/SVG/教學
 ---
 
 

 


diff --git a/files/zh-tw/orphaned/xpcnativewrapper/index.html b/files/zh-tw/orphaned/xpcnativewrapper/index.html
index dfd2d74d9d..6bcc74ebc9 100644
--- a/files/zh-tw/orphaned/xpcnativewrapper/index.html
+++ b/files/zh-tw/orphaned/xpcnativewrapper/index.html
@@ -1,6 +1,7 @@
 ---
 title: XPCNativeWrapper
-slug: XPCNativeWrapper
+slug: orphaned/XPCNativeWrapper
+original_slug: XPCNativeWrapper
 ---
 
XPCNativeWrapper是一種包裝物件讓他可以安全的存取特權程式的方法。It can be used in all Firefox versions, though the behavior changed somewhat starting with Firefox 1.5 (Gecko 1.8)。請看XPCNativeWrapper at the Mozilla knowledgeBase有更多在Firefox 1.5之前的版本的XPCNativeWrapper的行為。這個文件是對Firefox 版本1.5以上的。

 
diff --git a/files/zh-tw/orphaned/zh-tw/index.html b/files/zh-tw/orphaned/zh-tw/index.html
index 87489b35a7..db73f8414d 100644
--- a/files/zh-tw/orphaned/zh-tw/index.html
+++ b/files/zh-tw/orphaned/zh-tw/index.html
@@ -1,5 +1,6 @@
 ---
 title: zh-tw
-slug: zh-tw
+slug: orphaned/zh-tw
+original_slug: zh-tw
 ---
 This page was auto-generated because a user created a sub-page to this page.
diff --git "a/files/zh-tw/orphaned/\345\217\203\350\210\207_mozilla_\345\260\210\346\241\210/index.html" "b/files/zh-tw/orphaned/\345\217\203\350\210\207_mozilla_\345\260\210\346\241\210/index.html"
index ebd327fa1d..0c86cf1580 100644
--- "a/files/zh-tw/orphaned/\345\217\203\350\210\207_mozilla_\345\260\210\346\241\210/index.html"
+++ "b/files/zh-tw/orphaned/\345\217\203\350\210\207_mozilla_\345\260\210\346\241\210/index.html"
@@ -1,6 +1,7 @@
 ---
 title: 參與 Mozilla 專案
-slug: 參與_Mozilla_專案
+slug: orphaned/參與_Mozilla_專案
+original_slug: 參與_Mozilla_專案
 ---
 
如果你對幫忙修正錯誤有興趣，並以各種方式致力於 Mozilla 平台的代碼的話，這裡可以找到很多文件，並指引你往正確的方向走。

 
  
  
一般性主題

diff --git "a/files/zh-tw/orphaned/\345\273\272\347\253\213\346\223\264\345\205\205\345\245\227\344\273\266/index.html" "b/files/zh-tw/orphaned/\345\273\272\347\253\213\346\223\264\345\205\205\345\245\227\344\273\266/index.html"
index 4d6c1c5acf..bcc4910eef 100644
--- "a/files/zh-tw/orphaned/\345\273\272\347\253\213\346\223\264\345\205\205\345\245\227\344\273\266/index.html"
+++ "b/files/zh-tw/orphaned/\345\273\272\347\253\213\346\223\264\345\205\205\345\245\227\344\273\266/index.html"
@@ -1,6 +1,7 @@
 ---
 title: 建立擴充套件
-slug: 建立擴充套件
+slug: orphaned/建立擴充套件
+original_slug: 建立擴充套件
 ---
 
建立擴充套件
 

diff --git a/files/zh-tw/tools/web_console/ui_tour/index.html b/files/zh-tw/tools/web_console/ui_tour/index.html
index 85d89608b0..f0bbb3f103 100644
--- a/files/zh-tw/tools/web_console/ui_tour/index.html
+++ b/files/zh-tw/tools/web_console/ui_tour/index.html
@@ -1,7 +1,8 @@
 ---
 title: 打開網頁主控台
-slug: Tools/Web_Console/Opening_the_Web_Console
+slug: Tools/Web_Console/UI_Tour
 translation_of: Tools/Web_Console/UI_Tour
+original_slug: Tools/Web_Console/Opening_the_Web_Console
 ---
 
要開啟網頁主控台：

 
diff --git a/files/zh-tw/web/api/closeevent/index.html b/files/zh-tw/web/api/closeevent/index.html
index 0a6d0977ff..b5b10d19b2 100644
--- a/files/zh-tw/web/api/closeevent/index.html
+++ b/files/zh-tw/web/api/closeevent/index.html
@@ -1,9 +1,10 @@
 ---
 title: CloseEvent
-slug: WebSockets/WebSockets_reference/CloseEvent
+slug: Web/API/CloseEvent
 tags:
   - WebSockets
 translation_of: Web/API/CloseEvent
+original_slug: WebSockets/WebSockets_reference/CloseEvent
 ---
 
{{ draft() }}

 
當 WebSocket 連線關閉時，客戶端會收到一個 CloseEvent，由 WebSocket 物件 onclose 屬性表示的監聽器接收。

diff --git a/files/zh-tw/web/api/document/createevent/index.html b/files/zh-tw/web/api/document/createevent/index.html
index e3fd9dcd4f..31be8c914d 100644
--- a/files/zh-tw/web/api/document/createevent/index.html
+++ b/files/zh-tw/web/api/document/createevent/index.html
@@ -1,8 +1,9 @@
 ---
 title: Event.createEvent()
-slug: Web/API/Event/createEvent
+slug: Web/API/Document/createEvent
 translation_of: Web/API/Document/createEvent
 translation_of_original: Web/API/Event/createEvent
+original_slug: Web/API/Event/createEvent
 ---
 
{{APIRef("DOM")}}

 
diff --git a/files/zh-tw/web/api/document/createtreewalker/index.html b/files/zh-tw/web/api/document/createtreewalker/index.html
index 9e74411a14..5e1b889c32 100644
--- a/files/zh-tw/web/api/document/createtreewalker/index.html
+++ b/files/zh-tw/web/api/document/createtreewalker/index.html
@@ -1,7 +1,8 @@
 ---
 title: Document.createTreeWalker()
-slug: Web/API/document.createTreeWalker
+slug: Web/API/Document/createTreeWalker
 translation_of: Web/API/Document/createTreeWalker
+original_slug: Web/API/document.createTreeWalker
 ---
 

  {{ApiRef("Document")}}

diff --git a/files/zh-tw/web/api/document_object_model/events/index.html b/files/zh-tw/web/api/document_object_model/events/index.html
index ff4ecfe572..7949e5506a 100644
--- a/files/zh-tw/web/api/document_object_model/events/index.html
+++ b/files/zh-tw/web/api/document_object_model/events/index.html
@@ -1,7 +1,8 @@
 ---
 title: 事件與DOM
-slug: Web/API/Document_Object_Model/事件
+slug: Web/API/Document_Object_Model/Events
 translation_of: Web/API/Document_Object_Model/Events
+original_slug: Web/API/Document_Object_Model/事件
 ---
 
Introduction

 
diff --git a/files/zh-tw/web/api/elementcssinlinestyle/style/index.html b/files/zh-tw/web/api/elementcssinlinestyle/style/index.html
index e9e6d1171a..c8ca3484e4 100644
--- a/files/zh-tw/web/api/elementcssinlinestyle/style/index.html
+++ b/files/zh-tw/web/api/elementcssinlinestyle/style/index.html
@@ -1,7 +1,8 @@
 ---
 title: HTMLElement.style
-slug: Web/API/HTMLElement/style
+slug: Web/API/ElementCSSInlineStyle/style
 translation_of: Web/API/ElementCSSInlineStyle/style
+original_slug: Web/API/HTMLElement/style
 ---
 
{{ APIRef("HTML DOM") }}

 
diff --git a/files/zh-tw/web/api/geolocation_api/index.html b/files/zh-tw/web/api/geolocation_api/index.html
index cdc56770c4..8aa948f85e 100644
--- a/files/zh-tw/web/api/geolocation_api/index.html
+++ b/files/zh-tw/web/api/geolocation_api/index.html
@@ -1,7 +1,8 @@
 ---
 title: 地理位置定位 (Geolocation)
-slug: Web/API/Geolocation/Using_geolocation
+slug: Web/API/Geolocation_API
 translation_of: Web/API/Geolocation_API
+original_slug: Web/API/Geolocation/Using_geolocation
 ---
 
Web Apps 若需要使用者的位置，可透過 Geolocation API 取得相關資訊。而基於隱私權的考量，這些 Web Apps 均必須取得使用者的許可之後，才能發佈位置資訊。

 
diff --git a/files/zh-tw/web/api/htmlelement/innertext/index.html b/files/zh-tw/web/api/htmlelement/innertext/index.html
index 4c8a4272fc..bdabce58f1 100644
--- a/files/zh-tw/web/api/htmlelement/innertext/index.html
+++ b/files/zh-tw/web/api/htmlelement/innertext/index.html
@@ -1,7 +1,8 @@
 ---
 title: Node.innerText
-slug: Web/API/Node/innerText
+slug: Web/API/HTMLElement/innerText
 translation_of: Web/API/HTMLElement/innerText
+original_slug: Web/API/Node/innerText
 ---
 
{{APIRef("DOM")}}

 
diff --git a/files/zh-tw/web/api/htmlmediaelement/abort_event/index.html b/files/zh-tw/web/api/htmlmediaelement/abort_event/index.html
index e0330135f4..031cf18f89 100644
--- a/files/zh-tw/web/api/htmlmediaelement/abort_event/index.html
+++ b/files/zh-tw/web/api/htmlmediaelement/abort_event/index.html
@@ -1,8 +1,9 @@
 ---
 title: abort
-slug: Web/Events/abort
+slug: Web/API/HTMLMediaElement/abort_event
 translation_of: Web/API/HTMLMediaElement/abort_event
 translation_of_original: Web/Events/abort
+original_slug: Web/Events/abort
 ---
 
當資源載入被拒絕時將會觸發abort事件。

 
diff --git a/files/zh-tw/web/api/htmlorforeignelement/dataset/index.html b/files/zh-tw/web/api/htmlorforeignelement/dataset/index.html
index 690f8e1189..699dec949f 100644
--- a/files/zh-tw/web/api/htmlorforeignelement/dataset/index.html
+++ b/files/zh-tw/web/api/htmlorforeignelement/dataset/index.html
@@ -1,7 +1,8 @@
 ---
 title: HTMLElement.dataset
-slug: Web/API/HTMLElement/dataset
+slug: Web/API/HTMLOrForeignElement/dataset
 translation_of: Web/API/HTMLOrForeignElement/dataset
+original_slug: Web/API/HTMLElement/dataset
 ---
 
{{ APIRef("HTML DOM") }}

 
diff --git a/files/zh-tw/web/api/messageevent/index.html b/files/zh-tw/web/api/messageevent/index.html
index f5c0212f78..4379f0fd00 100644
--- a/files/zh-tw/web/api/messageevent/index.html
+++ b/files/zh-tw/web/api/messageevent/index.html
@@ -1,9 +1,10 @@
 ---
 title: MessageEvent
-slug: WebSockets/WebSockets_reference/MessageEvent
+slug: Web/API/MessageEvent
 tags:
   - WebSockets
 translation_of: Web/API/MessageEvent
+original_slug: WebSockets/WebSockets_reference/MessageEvent
 ---
 
{{ draft() }}

 
當伺服器傳來資料時，客戶端會收到一個 MessageEvent，由 WebSocket 物件 onmessage 表示的監聽器接收。

diff --git a/files/zh-tw/web/api/performance/timing/index.html b/files/zh-tw/web/api/performance/timing/index.html
index 33d0a54171..1d6d72254d 100644
--- a/files/zh-tw/web/api/performance/timing/index.html
+++ b/files/zh-tw/web/api/performance/timing/index.html
@@ -1,6 +1,6 @@
 ---
 title: Performance.timing
-slug: Web/API/Performance.timing
+slug: Web/API/Performance/timing
 tags:
   - API
   - Navigation Timing
@@ -11,6 +11,7 @@ tags:
   - 屬性
   - 效能
 translation_of: Web/API/Performance/timing
+original_slug: Web/API/Performance.timing
 ---
 
{{APIRef("Performance")}}

 
diff --git a/files/zh-tw/web/api/permissions_api/index.html b/files/zh-tw/web/api/permissions_api/index.html
index d58d8466be..919e053cf8 100644
--- a/files/zh-tw/web/api/permissions_api/index.html
+++ b/files/zh-tw/web/api/permissions_api/index.html
@@ -1,7 +1,8 @@
 ---
 title: 權限 (Permissions)
-slug: WebAPI/Permissions
+slug: Web/API/Permissions_API
 translation_of: Web/API/Permissions_API
+original_slug: WebAPI/Permissions
 ---
 
{{ draft() }}

 
{{ non-standard_header }}

diff --git a/files/zh-tw/web/api/websocket/index.html b/files/zh-tw/web/api/websocket/index.html
index 8acd8d03d5..cd92f4fd7a 100644
--- a/files/zh-tw/web/api/websocket/index.html
+++ b/files/zh-tw/web/api/websocket/index.html
@@ -1,9 +1,10 @@
 ---
 title: WebSocket
-slug: WebSockets/WebSockets_reference/WebSocket
+slug: Web/API/WebSocket
 tags:
   - WebSockets
 translation_of: Web/API/WebSocket
+original_slug: WebSockets/WebSockets_reference/WebSocket
 ---
 
{{ SeeCompatTable() }}

 
diff --git a/files/zh-tw/web/api/websockets_api/index.html b/files/zh-tw/web/api/websockets_api/index.html
index 3cbb630f41..403ac2b381 100644
--- a/files/zh-tw/web/api/websockets_api/index.html
+++ b/files/zh-tw/web/api/websockets_api/index.html
@@ -1,9 +1,10 @@
 ---
 title: WebSockets
-slug: WebSockets
+slug: Web/API/WebSockets_API
 tags:
   - WebSockets
 translation_of: Web/API/WebSockets_API
+original_slug: WebSockets
 ---
 
{{ SeeCompatTable() }}

 
WebSocket 是一種讓瀏覽器與伺服器進行一段互動通訊的技術。這個 API 在不必輪詢（poll）伺服器下，讓使用者傳送訊息至伺服器並接受事件驅動回應。

diff --git a/files/zh-tw/web/api/websockets_api/writing_websocket_client_applications/index.html b/files/zh-tw/web/api/websockets_api/writing_websocket_client_applications/index.html
index 8f1299379f..e5abbd7c9e 100644
--- a/files/zh-tw/web/api/websockets_api/writing_websocket_client_applications/index.html
+++ b/files/zh-tw/web/api/websockets_api/writing_websocket_client_applications/index.html
@@ -1,9 +1,10 @@
 ---
 title: 製作 WebSocket 客戶端應用程式
-slug: WebSockets/Writing_WebSocket_client_applications
+slug: Web/API/WebSockets_API/Writing_WebSocket_client_applications
 tags:
   - WebSockets
 translation_of: Web/API/WebSockets_API/Writing_WebSocket_client_applications
+original_slug: WebSockets/Writing_WebSocket_client_applications
 ---
 
{{ draft() }}

 
diff --git a/files/zh-tw/web/api/webvtt_api/index.html b/files/zh-tw/web/api/webvtt_api/index.html
index e565d2d129..ced3fbc23c 100644
--- a/files/zh-tw/web/api/webvtt_api/index.html
+++ b/files/zh-tw/web/api/webvtt_api/index.html
@@ -1,7 +1,8 @@
 ---
 title: WebVTT
-slug: Web/API/Web_Video_Text_Tracks_Format
+slug: Web/API/WebVTT_API
 translation_of: Web/API/WebVTT_API
+original_slug: Web/API/Web_Video_Text_Tracks_Format
 ---
 
WebVTT 是一種 UTF-8 編碼的文字檔案格式，可藉由 {{ HTMLElement("track") }} 元素顯示加註時間資訊之文字軌，其主要設計目的是為 {{ HTMLElement("video") }} 顯示字幕。

 
diff --git a/files/zh-tw/web/api/window/domcontentloaded_event/index.html b/files/zh-tw/web/api/window/domcontentloaded_event/index.html
index 0ec78423ec..54d0497519 100644
--- a/files/zh-tw/web/api/window/domcontentloaded_event/index.html
+++ b/files/zh-tw/web/api/window/domcontentloaded_event/index.html
@@ -1,7 +1,8 @@
 ---
 title: DOMContentLoaded
-slug: Web/Events/DOMContentLoaded
+slug: Web/API/Window/DOMContentLoaded_event
 translation_of: Web/API/Window/DOMContentLoaded_event
+original_slug: Web/Events/DOMContentLoaded
 ---
 
DOMContentLoaded事件是當document被完整的讀取跟解析後就會被觸發,不會等待 stylesheets, 圖片和subframes完成讀取  (load事件可以用來作為判斷頁面已經完整讀取的方法).

 
diff --git a/files/zh-tw/web/api/window/history/index.html b/files/zh-tw/web/api/window/history/index.html
index 67b79c5f82..9925aa1657 100644
--- a/files/zh-tw/web/api/window/history/index.html
+++ b/files/zh-tw/web/api/window/history/index.html
@@ -1,7 +1,8 @@
 ---
 title: Window.history
-slug: Web/API/Window.history
+slug: Web/API/Window/history
 translation_of: Web/API/Window/history
+original_slug: Web/API/Window.history
 ---
 
{{ APIRef }}

 
diff --git a/files/zh-tw/web/api/window/load_event/index.html b/files/zh-tw/web/api/window/load_event/index.html
index 7c6d314925..23dbc5ba5f 100644
--- a/files/zh-tw/web/api/window/load_event/index.html
+++ b/files/zh-tw/web/api/window/load_event/index.html
@@ -1,7 +1,8 @@
 ---
 title: load
-slug: Web/Events/load
+slug: Web/API/Window/load_event
 translation_of: Web/API/Window/load_event
+original_slug: Web/Events/load
 ---
 
load 事件發生在加載完目標資源、該資源依賴的其他資源時。

 
diff --git a/files/zh-tw/web/api/window/requestanimationframe/index.html b/files/zh-tw/web/api/window/requestanimationframe/index.html
index 55aa85d292..9d854da936 100644
--- a/files/zh-tw/web/api/window/requestanimationframe/index.html
+++ b/files/zh-tw/web/api/window/requestanimationframe/index.html
@@ -1,7 +1,8 @@
 ---
 title: Window.requestAnimationFrame()
-slug: Web/API/Window.requestAnimationFrame
+slug: Web/API/window/requestAnimationFrame
 translation_of: Web/API/window/requestAnimationFrame
+original_slug: Web/API/Window.requestAnimationFrame
 ---
 
{{APIRef}}

 
diff --git a/files/zh-tw/web/api/windoweventhandlers/onpopstate/index.html b/files/zh-tw/web/api/windoweventhandlers/onpopstate/index.html
index d98464d356..60f5319ec1 100644
--- a/files/zh-tw/web/api/windoweventhandlers/onpopstate/index.html
+++ b/files/zh-tw/web/api/windoweventhandlers/onpopstate/index.html
@@ -1,7 +1,8 @@
 ---
 title: window.onpopstate
-slug: Web/API/Window.onpopstate
+slug: Web/API/WindowEventHandlers/onpopstate
 translation_of: Web/API/WindowEventHandlers/onpopstate
+original_slug: Web/API/Window.onpopstate
 ---
 
{{ApiRef}} {{gecko_minversion_header("2")}}

 
diff --git a/files/zh-tw/web/css/css_backgrounds_and_borders/index.html b/files/zh-tw/web/css/css_backgrounds_and_borders/index.html
index c9232cbf7a..4bc3289fce 100644
--- a/files/zh-tw/web/css/css_backgrounds_and_borders/index.html
+++ b/files/zh-tw/web/css/css_backgrounds_and_borders/index.html
@@ -1,6 +1,6 @@
 ---
 title: CSS Background and Borders
-slug: Web/CSS/CSS_Background_and_Borders
+slug: Web/CSS/CSS_Backgrounds_and_Borders
 tags:
   - CSS
   - CSS Background and Borders
@@ -8,6 +8,7 @@ tags:
   - Overview
 translation_of: Web/CSS/CSS_Backgrounds_and_Borders
 translation_of_original: Web/CSS/CSS_Background_and_Borders
+original_slug: Web/CSS/CSS_Background_and_Borders
 ---
 
{{CSSRef}}

 
diff --git a/files/zh-tw/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html b/files/zh-tw/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html
index 66451b2ae2..39fe9dcb25 100644
--- a/files/zh-tw/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html
+++ b/files/zh-tw/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html
@@ -1,6 +1,6 @@
 ---
 title: 使用 CSS 多重背景
-slug: Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds
+slug: Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds
 tags:
   - CSS
   - CSS Background
@@ -9,6 +9,7 @@ tags:
   - Intermediate
 translation_of: Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds
 translation_of_original: Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds
+original_slug: Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds
 ---
 
{{CSSRef}}

 
diff --git a/files/zh-tw/web/css/css_color/index.html b/files/zh-tw/web/css/css_color/index.html
index 25cc1b29d8..bd5fb736d5 100644
--- a/files/zh-tw/web/css/css_color/index.html
+++ b/files/zh-tw/web/css/css_color/index.html
@@ -1,6 +1,6 @@
 ---
 title: CSS Colors
-slug: Web/CSS/CSS_Colors
+slug: Web/CSS/CSS_Color
 tags:
   - CSS
   - CSS Colors
@@ -10,6 +10,7 @@ tags:
   - TopicStub
 translation_of: Web/CSS/CSS_Color
 translation_of_original: Web/CSS/CSS_Colors
+original_slug: Web/CSS/CSS_Colors
 ---
 
{{CSSRef}}

 
diff --git a/files/zh-tw/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html b/files/zh-tw/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
index af098dde55..0ef6f2abf0 100644
--- a/files/zh-tw/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
+++ b/files/zh-tw/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
@@ -1,6 +1,6 @@
 ---
 title: CSS彈性盒子用法
-slug: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes
+slug: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
 tags:
   - '#RWD'
   - CSS
@@ -12,6 +12,7 @@ tags:
   - 盒
 translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
 translation_of_original: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes
+original_slug: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes
 ---
 
{{CSSRef}}

 
diff --git a/files/zh-tw/web/http/basics_of_http/data_uris/index.html b/files/zh-tw/web/http/basics_of_http/data_uris/index.html
index a8332c7cf3..b5ac6927cc 100644
--- a/files/zh-tw/web/http/basics_of_http/data_uris/index.html
+++ b/files/zh-tw/web/http/basics_of_http/data_uris/index.html
@@ -1,11 +1,12 @@
 ---
 title: data URIs
-slug: Web/HTTP/data_URIs
+slug: Web/HTTP/Basics_of_HTTP/Data_URIs
 tags:
   - Base64
   - Guide
   - URI
 translation_of: Web/HTTP/Basics_of_HTTP/Data_URIs
+original_slug: Web/HTTP/data_URIs
 ---
 
data URIs, 由 RFC 2397 文件定義, 允許作者在文件中嵌入檔案.

 
diff --git a/files/zh-tw/web/http/status/418/index.html b/files/zh-tw/web/http/status/418/index.html
index 0f03f77c24..279729537e 100644
--- a/files/zh-tw/web/http/status/418/index.html
+++ b/files/zh-tw/web/http/status/418/index.html
@@ -1,7 +1,8 @@
 ---
 title: 418 I'm a teapot
-slug: Web/HTTP/Status/418_I_m_a_teapot
+slug: Web/HTTP/Status/418
 translation_of: Web/HTTP/Status/418
+original_slug: Web/HTTP/Status/418_I_m_a_teapot
 ---
 
{{HTTPSidebar}}

 
diff --git a/files/zh-tw/web/performance/index.html b/files/zh-tw/web/performance/index.html
index 9c868ed393..47e40b60d6 100644
--- a/files/zh-tw/web/performance/index.html
+++ b/files/zh-tw/web/performance/index.html
@@ -1,12 +1,13 @@
 ---
 title: 網路性能
-slug: Web/性能
+slug: Web/Performance
 tags:
   - API
   - HTML
   - Mobile Performance
   - Performance
 translation_of: Web/Performance
+original_slug: Web/性能
 ---
 
Web性能是負載時間和運行時的客觀度量和用戶體驗。Web性能是指站點加載、交互和回應所需的時間，以及用戶交互過程中內容的流暢程度——滾動是否流暢?按鈕可點擊嗎?彈出窗口加載和顯示的速度是否很快?它們的動畫是否流暢?Web性能包括加載時間、每秒幀數和交互時間等客觀度量，以及加載內容所需時間的主觀體驗。

 
diff --git a/files/zh-tw/web/svg/tutorial/basic_shapes/index.html b/files/zh-tw/web/svg/tutorial/basic_shapes/index.html
index 579f39bbe9..d671b13e9e 100644
--- a/files/zh-tw/web/svg/tutorial/basic_shapes/index.html
+++ b/files/zh-tw/web/svg/tutorial/basic_shapes/index.html
@@ -1,7 +1,8 @@
 ---
 title: 基本形状
-slug: SVG/Tutorial/Basic_Shapes
+slug: Web/SVG/Tutorial/Basic_Shapes
 translation_of: Web/SVG/Tutorial/Basic_Shapes
+original_slug: SVG/Tutorial/Basic_Shapes
 ---
 

   {{ PreviousNext("SVG/Tutorial/Positions", "SVG/Tutorial/Paths") }}

diff --git a/files/zh-tw/web/svg/tutorial/paths/index.html b/files/zh-tw/web/svg/tutorial/paths/index.html
index e0a107f49a..466f38c9ac 100644
--- a/files/zh-tw/web/svg/tutorial/paths/index.html
+++ b/files/zh-tw/web/svg/tutorial/paths/index.html
@@ -1,9 +1,10 @@
 ---
 title: 路徑
-slug: Web/SVG/Tutorial/路径
+slug: Web/SVG/Tutorial/Paths
 tags:
   - SVG
 translation_of: Web/SVG/Tutorial/Paths
+original_slug: Web/SVG/Tutorial/路径
 ---
 
{{ PreviousNext("Web/SVG/Tutorial/Basic_Shapes", "Web/SVG/Tutorial/Fills_and_Strokes") }}

 
-- 
cgit v1.2.3-54-g00ecf