diff options
Diffstat (limited to 'files/ja/orphaned')
64 files changed, 51 insertions, 4238 deletions
diff --git a/files/ja/orphaned/developing_add-ons/index.html b/files/ja/orphaned/developing_add-ons/index.html index 7cdb848269..2223fbf2a2 100644 --- a/files/ja/orphaned/developing_add-ons/index.html +++ b/files/ja/orphaned/developing_add-ons/index.html @@ -4,6 +4,6 @@ slug: orphaned/Developing_add-ons original_slug: Developing_add-ons --- <p>Mozilla ベースのソフトウェアはたいていアドオンを通して拡張可能です。アドオンには、拡張機能、プラグイン、テーマの 3 つの主なタイプがあります。このページはFirefox、Thunderbird、あるいは、Mozilla プラットフォームをベースにしたその他のソフトウェア向けのアドオンを作成するために必要となる情報、および、作成したアドオンを配布する方法のガイドを提供します。</p> -<table class="mainpage-table"> <tbody> <tr> <td colspan="2"> <h2 id="アドオンに関するトピックス">アドオンに関するトピックス</h2> </td> </tr> <tr> <td> <dl> <dt><a class="internal" href="/ja/Submitting_an_add-on_to_AMO" title="ja/Submitting an add-on to AMO">アドオンを AMO に提出する</a></dt> <dd>アドオン開発者がアドオンを正しくパッケージし配布するために助けとなる情報を提供します。このページには Mozilla のアドオン配布 Web サイトである addons.mozilla.org についての情報が含まれています。</dd> <dt><a class="internal" href="/ja/Extensions" title="ja/Extensions">拡張機能</a></dt> <dd>拡張機能は Firefox や SeaMonkey、Thunderbird のような Mozilla アプリケーションに新しい機能を追加します。ツールバーボタンから完全に新しい形態のものまであらゆるものを追加できます。</dd> <dt><a class="internal" href="/ja/Plugins" title="ja/Plugins">プラグイン</a></dt> <dd>Mozilla ベースのソフトウェアにネイティブでは扱えないコンテンツを表示させることを可能にさせるバイナリコンポーネントである、プラグインの作成方法についての情報。</dd> <dt><a class="internal" href="/ja/Jetpack" title="ja/Jetpack">Jetpack</a></dt> <dd>あらゆる人のためのブラウザ拡張開発システムです。Jetpack 開発者はモダンな web のツールである HTML と CSS、JavaScript を知っているだけで良いのです。</dd> </dl> </td> <td> <dl> <dt><a class="internal" href="/ja/Themes" title="ja/Themes">テーマ</a></dt> <dd>テーマはユーザに Mozilla ベースのアプリケーションによって提供されているユーザインターフェースの見た目をカスタマイズさせることを可能にします。</dd> <dt><a class="internal" href="/ja/Creating_OpenSearch_plugins_for_Firefox" title="ja/Creating OpenSearch plugins for Firefox">検索エンジンプラグイン</a></dt> <dd>Firefox は検索ボックスで異なる検索エンジンをサポートすることを可能にする検索エンジンプラグインをサポートしています。</dd> <dt><a class="internal" href="/ja/addons.mozilla.org_(AMO)_API_Developers'_Guide" title="ja/addons.mozilla.org (AMO) API Developers' Guide">addons.mozilla.org (AMO) API Developers' Guide</a></dt> <dd>AMO Developers' Guide は addons.mozilla.org からアドオンにつての情報を入手するための AMO API の利用方法を説明します。</dd> <dt><a href="/ja/The_Mozilla_platform" title="ja/The Mozilla platform">Mozilla プラットフォーム</a></dt> <dd>API および技術のすべて、また、それらをあなた自身のプロジェクトで利用する方法を含む、Mozilla プラットフォームについての情報。</dd> </dl> </td> </tr> </tbody> +<table class="mainpage-table"> <tbody> <tr> <td colspan="2"> <h2 id="アドオンに関するトピックス">アドオンに関するトピックス</h2> </td> </tr> <tr> <td> <dl> <dt><a class="internal" href="/ja/Submitting_an_add-on_to_AMO">アドオンを AMO に提出する</a></dt> <dd>アドオン開発者がアドオンを正しくパッケージし配布するために助けとなる情報を提供します。このページには Mozilla のアドオン配布 Web サイトである addons.mozilla.org についての情報が含まれています。</dd> <dt><a class="internal" href="/ja/Extensions">拡張機能</a></dt> <dd>拡張機能は Firefox や SeaMonkey、Thunderbird のような Mozilla アプリケーションに新しい機能を追加します。ツールバーボタンから完全に新しい形態のものまであらゆるものを追加できます。</dd> <dt><a class="internal" href="/ja/Plugins">プラグイン</a></dt> <dd>Mozilla ベースのソフトウェアにネイティブでは扱えないコンテンツを表示させることを可能にさせるバイナリコンポーネントである、プラグインの作成方法についての情報。</dd> <dt><a class="internal" href="/ja/Jetpack">Jetpack</a></dt> <dd>あらゆる人のためのブラウザ拡張開発システムです。Jetpack 開発者はモダンな web のツールである HTML と CSS、JavaScript を知っているだけで良いのです。</dd> </dl> </td> <td> <dl> <dt><a class="internal" href="/ja/Themes">テーマ</a></dt> <dd>テーマはユーザに Mozilla ベースのアプリケーションによって提供されているユーザインターフェースの見た目をカスタマイズさせることを可能にします。</dd> <dt><a class="internal" href="/ja/Creating_OpenSearch_plugins_for_Firefox">検索エンジンプラグイン</a></dt> <dd>Firefox は検索ボックスで異なる検索エンジンをサポートすることを可能にする検索エンジンプラグインをサポートしています。</dd> <dt><a class="internal" href="/ja/addons.mozilla.org_(AMO)_API_Developers'_Guide">addons.mozilla.org (AMO) API Developers' Guide</a></dt> <dd>AMO Developers' Guide は addons.mozilla.org からアドオンにつての情報を入手するための AMO API の利用方法を説明します。</dd> <dt><a href="/ja/The_Mozilla_platform">Mozilla プラットフォーム</a></dt> <dd>API および技術のすべて、また、それらをあなた自身のプロジェクトで利用する方法を含む、Mozilla プラットフォームについての情報。</dd> </dl> </td> </tr> </tbody> </table> <p>{{ languages( { "en": "en/Developing_add-ons", "zh-cn": "cn/Developing_add-ons"} ) }}</p> diff --git a/files/ja/orphaned/installing_extensions/index.html b/files/ja/orphaned/installing_extensions/index.html index 2451f21b18..bd870d9056 100644 --- a/files/ja/orphaned/installing_extensions/index.html +++ b/files/ja/orphaned/installing_extensions/index.html @@ -7,7 +7,7 @@ tags: original_slug: Installing_extensions --- <p>{{ Gecko_minversion_header(1.9) }}</p> -<p>toolkit ベースのアプリケーション(Firefox やその他の <a href="/ja/XULRunner" title="ja/XULRunner">XULRunner</a> を使用したアプリケーション)向けの拡張機能をインストールする機能をインストーラに持たせたい場合について、Gecko 1.9(Firefox 3)は Windows、Mac OS X、Linux 上でそれを簡単に行えるようにするための機能を提供します。Windows ユーザについては、当面の所は<a href="/ja/Adding_Extensions_using_the_Windows_Registry" title="ja/Adding_Extensions_using_the_Windows_Registry">レジストリを使って拡張機能をインストールする方法</a>も利用できます。</p> +<p>toolkit ベースのアプリケーション(Firefox やその他の <a href="/ja/XULRunner">XULRunner</a> を使用したアプリケーション)向けの拡張機能をインストールする機能をインストーラに持たせたい場合について、Gecko 1.9(Firefox 3)は Windows、Mac OS X、Linux 上でそれを簡単に行えるようにするための機能を提供します。Windows ユーザについては、当面の所は<a href="/ja/Adding_Extensions_using_the_Windows_Registry">レジストリを使って拡張機能をインストールする方法</a>も利用できます。</p> <p>現在、Mac OS X および Linux においては、ユーザのコンピュータ内のあらかじめ決められた位置のディレクトリに拡張機能をコピーするだけでよいです。</p> <p>この方法を通じてインストールされた拡張機能については、新しく作成された物・既に存在していた物を問わず、そのアプリケーションのすべてのプロファイルに対してインストールされる事に注意してください。</p> <h3 id="Windows" name="Windows">Windows</h3> diff --git a/files/ja/orphaned/introduction_to_dom_inspector/index.html b/files/ja/orphaned/introduction_to_dom_inspector/index.html deleted file mode 100644 index 66b2844ffe..0000000000 --- a/files/ja/orphaned/introduction_to_dom_inspector/index.html +++ /dev/null @@ -1,39 +0,0 @@ ---- -title: DOM Inspector 入門 -slug: orphaned/Introduction_to_DOM_Inspector -original_slug: Introduction_to_DOM_Inspector ---- -<p>DOM Inspector はブラウザの <strong>Tools > Web Development</strong> メニューからアクセスできる Mozilla のアプリケーションです。これはウェブ開発者が <a href="/en/DOM" title="en/DOM">DOM</a> 全体を見たり、必要なら手動で DOM を更新したりできるようにします。</p> -<div class="note"><strong>注意:</strong> Firefox 3 以降、DOM Inspector はデフォルトインストールには含まれなくなりました。替わりに、Mozilla add-ons サイトから <a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/6622">ダウンロードしてインストールする</a> 必要があります。</div> -<p>DOM Inspector を最初に起動すると、Mozilla ブラウザに似た2ペインのアプリケーションウィンドウが開きます。ブラウザのように DOM Inspector は URL バー、サイドバー(左ペイン)、メニューを持ち、<strong>Window</strong> や <strong>Tools</strong> メニューは Mail や Chatzilla やその他の小さな拡張機能やダイアログのようなブラウザスイートのメインアプリケーションへのアクセスを提供します。</p> -<p><img align="none" alt="empty DOM Inspector" class=" internal" src="/@api/deki/files/177/=Di_empty.gif"></p> -<h2 id="Starting_the_DOM_Inspector" name="Starting_the_DOM_Inspector">DOM Inspector を開始する</h2> -<p>DOM Inspector の利用を開始するには、以下の3つのうちのひとつを行います:</p> -<h3 id="File_.3E_Inspect_a_Window_.3E" name="File_.3E_Inspect_a_Window_.3E">File > Inspect a Window ></h3> -<p><strong>Inspect a Window</strong> メニュー項目の右に表示されているサブメニューは現在ロードされている DOM ウィンドウのリストです。おそらくブラウザウィンドウと DOM Inspector はすでに開かれており、このリストに表示されます。DOM Inspector は — DOM として認識される — 開かれているすべてのウィンドウを追跡します。そのため、DOM Inspector で特定のウィンドウの DOM にアクセスするには、単に DOM Inspector アプリケーションの中で動的に更新されるリストからウィンドウを選択するだけです。例えば、Mail ウィンドウの DOM を調べるには、Mail を開き、DOM Inspector に戻って <strong>File > Inspect a Window > Inbox for <a class=" link-mailto" href="mailto:yourname@yourdomain.com" rel="freelink">yourname@yourdomain.com</a></strong> を選択します。</p> -<p><img align="none" alt="" class=" internal" src="/@api/deki/files/179/=Di_menu.gif"></p> -<h3 id="File_.3E_Inspect_a_URL..." name="File_.3E_Inspect_a_URL...">File > Inspect a URL...</h3> -<p>URL から任意のウェブページの DOM を調べることが出来ます。この二つ目のメニューアイテムを使用して URL を入力し、DOM Inspector にページの DOM をロードします。アプリケーションそのもののドキュメントオブジェクトモデルを表示するウィンドウの DOM とは対照的に、この "文書" の DOM は最上位の <HTML> タグから始まるウェブページの構造を示します。このメニュー項目を使うには、例えば、<strong>www.brownhen.com</strong> を入力すると brownhen のインデックスページの DOM を見ることが出来ます。</p> -<p><img align="none" alt="DOM of a Web Page" class=" internal" src="/@api/deki/files/43/=Bh_dom.gif"></p> -<h3 id="Ctrl_.2B_Shift_.2B_I_key_shortcut" name="Ctrl_.2B_Shift_.2B_I_key_shortcut"><code><strong>Ctrl + Shift + I</strong></code> キーショートカット</h3> -<p>最後に、<code>Ctrl + Shift + I</code> ショートカットキーは現在ロードしているページの DOM で DOM Inspector を開始します。例えば、Mozilla で www.cnn.com ウェブサイトを読んでいてこのキーをタイプすると、DOM Inspector はページの DOM をロードしその構造を Inspector アプリケーションウィンドウに表示します。</p> -<p>DOM Inspector が DOM をロードすると、左ペインに DOM の構造化された階層ビューを、右ペインに選択したノードの情報(属性とその値など)を表示します。</p> -<p>加えて、ウェブページの DOM を表示している間、DOM Inspector の下半分にウェブページが表示されます。</p> -<p><img align="none" alt="" class="internal" src="/@api/deki/files/43/=Bh_dom.gif"></p> -<p>これは DOM Inspector を独立したブラウザウィンドウを持つことなく利用することが可能になり、選択したノードが DOM Inspector によりページ内でハイライト表示されるのを見るのが容易になります。(最近の Firefox 版では DOM Inspector ウィンドウ内でのウェブページ表示は行われずに、Firefox 内でハイライト表示されます。) <img align="none" alt="DOM Loaded in DI" class="internal" src="/@api/deki/files/183/=Di_small.gif"></p><h2 id="Using_the_DOM_Inspector" name="Using_the_DOM_Inspector">Using the DOM Inspector</h2> -<p>Once you have the DOM of the page or chrome you are interested in, you can use the tree view in the left pane of the DOM Inspector to find and inspect aspects of that DOM you are interested in. One of the biggest and most immediate advantages that this brings to your web and application development is that it makes it possible to <em>find</em> the markup and the nodes in which the interesting parts of a page or a piece of the user interface are defined. One common use of the DOM Inspector is to find the name and location of particular icon being used in the user interface, which is not an easy task otherwise. As you select parts of the DOM in the left pane of the DOM Inspector, the rendered versions of those nodes are highlighted in the user interface itself. <img align="none" alt="" class=" internal" src="/@api/deki/files/182/=Di_select.gif"> If you inspect the main browser window, for example, and select nodes in the right pane (other than the endless list of <code>script</code> elements that are loaded into <code>navigator.xul</code> and that have no visible UI), you will see the various parts of the browser interface being highlighted with a blinking red border. You can traverse the structure and go from largest parts (e.g., the <code>statusbar</code> element that sits at the top-level of the navigator DOM) to smallest parts, such as the "mini-mail" icon that lets users access the Mail application from the bottom left corner of the browser window. <img align="none" alt="" class=" internal" src="/@api/deki/files/180/=Di_mini_mail.gif"></p> -<h3 id="DOM_Inspector_Information_Types" name="DOM_Inspector_Information_Types">DOM Inspector Information Types</h3> -<p>When you have selected a node like the "mini-mail" node, you can select any one of several <em>types</em> of information to display about that node in the right pane of the DOM Inspector application window, all of which are available from the pull-down menu in the upper left corner of the right pane. <img align="none" alt="" class=" internal" src="/@api/deki/files/184/=Di_types.gif"> In order to find out what the actual name of the file is being used to provide the small mail icon, you can select <strong>CSS Style Rules</strong> from this menu and see the various selectors and rules that have been applied for those selectors. The rule that applies the mail icon to the "mini-mail" element is ID-based (since the icon is unique to the mail item in the taskbar), and uses a <code>list-style-image</code> property to point to a file in the theme JAR. That file turns out to be a GIF located at: <code><a class=" external" rel="freelink">chrome://commmunicator/skin/taskbar/mail.gif</a></code>. The list of types available from this pull-down menu gives you some idea about how extensive the DOM Inspector's inspecting capabilities are. The following table provides an overview of what these sets of information are about:</p> -<blockquote> -<table> <tbody> <tr> <td><strong>DOM Node</strong></td> <td>The default view. DOM Node shows the structural DOM representation of the given page or chrome.</td> </tr> <tr> <td><strong>Box Model</strong></td> <td>The box model is the layout system of Mozilla's application interface. <code>box</code> elements <p>use stretchiness, flexibility, and nesting to achieve table-like layout capabilities in XUL documents. This view shows how boxes and these layout attributes are used to position elements within the interface.</p> </td> </tr> <tr> <td><strong>XBL Bindings</strong></td> <td>XBL is a language that allows you to build extensions in XUL and HTML. Where XBL <em>bindings</em> <p>are loaded into documents by means of CSS rules, this view lets you inspect them.</p> </td> </tr> <tr> <td><strong>CSS Style Rules</strong></td> <td>This view shows you all of the CSS rules that are applied to the selected nodes.</td> </tr> <tr> <td><strong>Computed Style</strong></td> <td> <p>The computed style of an element is all of the style rules that get applied to that element, whether from explicit style declarations, from script, or from inheritance. The computed style view of an element's style rules gives you a long, flat list of rules that you can inspect and {{ mediawiki.external('#update update') }} if you wish.</p> </td> </tr> <tr> <td><strong>JavaScript Object</strong></td> <td>This view shows you all of the JavaScript objects that are used to script and manipulate a given <p>node. Common examples of JavaScript objects are <code>target</code> objects that are used to trap and get information about events fired in the interface.</p> </td> </tr> </tbody> -</table> -</blockquote> -<h3 id="Selecting_Elements_in_a_User_Interface" name="Selecting_Elements_in_a_User_Interface">Selecting Elements in a User Interface</h3> -<p>Another powerful interactive feature of the DOM Inspector is that it can display the subtree of any element in any DOM it has loaded. In other words, when you have the DOM Inspector open and have enabled this functionality by choosing <strong>Search > Select Element by Click</strong> or by clicking the little magnifying glass icon in the upper left portion of the DOM Inspector application, you can click anywhere in a loaded web page or the chrome of the Mozilla application interface, and the element you click will be threaded into the left pane and information about it displayed in the right.</p> -<h3 id="Searching_for_Nodes_in_the_DOM" name="Searching_for_Nodes_in_the_DOM">Searching for Nodes in the DOM</h3> -<p>Another way to inspect the DOM is to search for particular elements you're interested in by ID, class, or attribute. When you select <strong>Search > Find Nodes...</strong> or press <code>Ctrl + F</code>, the DOM Inspector displays a find dialog that lets you find elements in various ways, and that gives you incremental searching by way of the <code><F3></code> shortcut key. <img align="none" alt="" class=" internal" src="/@api/deki/files/181/=Di_search.gif"></p> -<h3 id="Updating_the_DOM_Dynamically" name="Updating_the_DOM_Dynamically">Updating the DOM Dynamically</h3> -<p>A final feature to mention in this introduction is the ability is the ability the DOM Inspector gives you to dynamically update information reflected in the DOM about web pages, user interface, and other elements. Note that when the DOM Inspector displays information about a particular node or subtree, it presents individual nodes and their values (in the DOM, attributes are subnodes of elements, typically) in an active, sortable list. You can right-click individual items in this list and be presented with a context menu that lets you <em>edit</em> the values of those attributes. <img align="none" alt="" class=" internal" src="/@api/deki/files/176/=Di_edit.gif"> For example, <code>table</code> elements are often used to layout elements in a web page, but when something goes wrong it can be difficult to find the offending cell, especially when tables are nested several deep, as they often are on complicated web pages. You can use this dynamic editig capability of the DOM Inspector to set tables aside (i.e., by changing their background color, adding a border, and so on). This interactivity allows you to shrink and grow element size, change icons, and do other layout-tweaking updates—all without actually changing the DOM as it is defined in the file on disk.</p> -<h2 id="Loving_the_Inspector" name="Loving_the_Inspector">Loving the Inspector</h2> -<p>The DOM Inspector can take some figuring out, but once you get used to it, you may find that these structured views of web pages and interfaces were exactly the aspects of your own application development that were missing. The DOM Inspector not only presents all this information about pages in a clear and structured way, it gives you way to find and update those structures, and it's simple to access via shortcuts and menus already available in the Mozilla browser. Used in concert with Mozilla tools like <a class="external" href="http://www.mozilla.org/projects/venkman">Venkman</a>, the JavaScript debugger, the DOM Inspector can give you a <em>complete</em> view of any web page or DOM-based application interface. It's become an ordinary tool in my own web page development and even my normal browsing—where I see a page that looks like it's been put together in some interesting way and I hit <code>Ctrl + Shift + I</code> to look at the DOM of the page, interesting CSS rules the author has used to present the page, or other, sometimes hidden information about that document.</p> -<p>{{ languages( { "en": "en/Introduction_to_DOM_Inspector"} ) }}</p> diff --git a/files/ja/orphaned/learn/how_to_contribute/index.html b/files/ja/orphaned/learn/how_to_contribute/index.html deleted file mode 100644 index ceeb811b0e..0000000000 --- a/files/ja/orphaned/learn/how_to_contribute/index.html +++ /dev/null @@ -1,87 +0,0 @@ ---- -title: MDN の学習エリアに貢献するには -slug: orphaned/Learn/How_to_contribute -tags: - - Beginner - - Contribute - - Documentation - - Guide - - Learn - - MDN Meta - - l10n:priority -translation_of: Learn/How_to_contribute -original_slug: Learn/How_to_contribute ---- -<div>{{LearnSidebar}}</div> - -<p>あなたがこのページに初めて、あるいはたくさん検索した末に辿り着いたのなら、それはきっとあなたが MDN の学習エリアへの貢献に興味を持って下さったからでしょう。素晴らしいことです!</p> - -<p><span class="seoSummary">このページでは、 MDN の学習コンテンツの改良に協力し始めるのに必要となる全てが見つかるでしょう。できることはたくさんあって、それはあなたがどれくらい時間を使えるか、<a href="/ja/Learn/How_to_contribute#I'm_a_beginner">初心者</a>か<a href="/ja/Learn/How_to_contribute#I'm_a_web_developer">ウェブ開発者</a>か<a href="/ja/Learn/How_to_contribute#I'm_a_teacher">教師</a>かによって決まります。</span></p> - -<div class="note"> -<p><strong>メモ</strong>: 学習エリアの記事を書くためのガイドは、<a href="/ja/docs/MDN/Contribute/Howto/Write_an_article_to_help_learn_about_the_Web">ウェブを学習する人に役立つ記事の書き方</a>にあります。</p> -</div> - -<h2 id="特定のタスクを探す">特定のタスクを探す</h2> - -<p><strong>学習エリアに貢献する共通の方法は、記事を読み、誤字を直し、改良を提案することです。<a href="https://github.com/mdn/learning-area/">GitHub repo</a>へのサンプル追加も、何が必要か聞きたいと思って連絡頂くのも歓迎です。</strong></p> - -<p>新しいことを学習するときに、貢献することは楽しめる良い方法です。道に迷った気になったり、質問があった場合は、<a href="https://discourse.mozilla-community.org/t/learning-web-development-marking-guides-and-questions/16294">Learning Area Discourse thread</a> や <a href="/en-US/docs/MDN/Community#Get_into_IRC">IRC channel</a> いずれも英語ベース (詳しくはページ最下部を見てください)。<a href="/en-US/profiles/chrisdavidmills">Chris Mills</a> が Learning Area (学習エリア) のトピックドライバーです — 彼に直接 ping してもいいでしょう。</p> - -<p>下記の節では一般的なアイデアとして、やることの種類を挙げています。</p> - -<h2 id="初心者の方なら">初心者の方なら</h2> - -<p>すばらしい!初心者は学習エリアの中身にフィードバックを作るのに重要かつ貴重です。あなたにはこの記事のターゲット読者の一員で、われわれのチームの貴重なメンバーになりうるという独特の視点があります。実際に、記事を何かの学習に使ってつまったり、誤解を招く記事を見かけた場合、自分で修正するか、または我々が確実に修正できるように問題点を連絡することができます。</p> - -<p>次のように、貢献できるいくつかの方法があります:</p> - -<dl> - <dt><a href="/ja/docs/MDN/Contribute/Howto/Tag">記事にタグを追加する</a> (<em>5分</em>)</dt> - <dd>MDN のコンテンツをタグ付けするのは、 MDN に協力する最も簡単な方法です。タグによって状況にあわせた機能を提供できるようになるため、タグ付けはとても意味ある貢献です。タグ付けを始める前に、<a href="/ja/docs/MDN/Doc_status/Glossary#No_tags">用語集の記事</a>と<a href="/ja/docs/MDN/Doc_status/Learn#No_tags">学習記事</a>の一覧をご覧ください。</dd> - <dt><a href="/ja/docs/Glossary">用語集の記事を読んでレビューする</a> (<em>5分</em>)</dt> - <dd>コンテンツを初心者の目線で見てもらう必要があります。用語集の記事に分かりにくい箇所があれば改善が必要なため、気軽に変更してください。自分には必要なスキルが無いと感じたら、<a href="/en-US/docs/MDN/Community#Join_our_mailing_lists">私たちのメーリングリスト</a>に連絡してください。</dd> - <dt><a href="/docs/MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary">用語集の記事を書く</a> (<em>20分</em>)</dt> - <dd>これは新しいことを学ぶ最良の方法です。理解したい概念を選び、それについて学んだら、用語集の記事を書きましょう。何かを他人に説明することは、頭の中で知識を「定着」させ、物事を自分自身で良く理解できるようになり、さらに他人のために役立ちます。みんなが得をします!</dd> - <dt><a href="/ja/Learn/Index">学習記事を読んでレビューする</a> (<em>2時間</em>)</dt> - <dd>これは用語集の記事のレビューとよく似ています(上記参照)。こういった記事は通常かなり長いため、より時間を要するだけです。</dd> -</dl> - -<h2 id="ウェブ開発者なら">ウェブ開発者なら</h2> - -<p>素敵です!あなたの技術スキルは、初心者向けの技術的に正確なコンテンツを提供するために、まさに我々が必要としているものです。ここは MDN の特定の箇所としてウェブの学習専用であり、説明はできるだけ簡潔であり、簡潔すぎて役立たないのは避けないといけません。過度に正確であることよりも、理解できることがもっと重要です。</p> - -<dl> - <dt><a href="/ja/docs/Glossary">用語集の記事を読んでレビューする</a> (<em>5分</em>)</dt> - <dd>ウェブ開発者であるあなたには、私たちのコンテンツが複雑になりすぎずに技術的に正確であるかを確認していただく必要があります。必要に応じて気軽に変更を加えてください。編集の前に内容を議論したい場合は、<a href="/en-US/docs/MDN/Community#Join_our_mailing_lists">私たちのメーリングリスト</a>または <a href="/en-US/docs/MDN/Community#Get_into_IRC">IRC channel</a>でコンタクトしてください。</dd> - <dt><a href="/docs/MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary">用語集の記事を書く</a> (<em>20分</em>)</dt> - <dd>技術的な専門用語を明確にすることは、学習するのと、技術的に正確かつシンプルであるためのとても良い方法です。初心者からは感謝されるでしょう。注目すべき<a href="/ja/docs/Glossary#Contribute">未定義の用語</a>がたくさんあります。都合が良いものを選んでください。</dd> - <dt><a href="/ja/Learn/Index">学習記事を読んで</a><a href="/en-US/Learn/Index">レビューする</a> (<em>2時間</em>)</dt> - <dd>これは用語集の記事のレビュー(上記)と同じことです。この記事は少し長い時間がかかるだけです。</dd> - <dt><a href="/ja/docs/MDN/Contribute/Howto/Write_an_article_to_help_learn_about_the_Web">新しい学習記事を書く</a> (<em>4時間以上</em>)</dt> - <dd>MDN には、ウェブ技術(<a href="/en-US/docs/Learn/CSS">HTML</a>, <a href="/en-US/docs/Learn/CSS">CSS</a>, <a href="/en-US/docs/Learn/JavaScript">JavaScript</a>など)についてのシンプルで直言的な記事が欠けています。また MDN にはレビューや作り直しをするべき古いコンテンツもあります。あなたのスキルの限界までふりしぼって、ウェブ技術が初心者でも使えるようにしてください。</dd> - <dt><a href="/ja/docs/MDN/Contribute/Howto/Create_an_interactive_exercise_to_help_learning_the_web">練習、コードサンプル、インタラクティブな学習ツールの作成</a> (<em>?時間</em>)</dt> - <dd>全ての学習記事は「アクティブラーニング」と呼ぶ記事を必要としています。その理由は人は自分で何かやってみるのが学ぶのに最良だからです。この素材は、ユーザーが記事に述べられる概念を適用・操作するのを助ける、練習やインタラクティブコンテンツです。アクティブラーニングのコンテンツを作るには多数の方法があり、 <a href="http://jsfiddle.net" rel="external">JSFiddle</a> や同等品でコードサンプルを作ることから、<a href="https://thimble.mozilla.org/" rel="external">Thimble</a> で完全にハック可能なインタラクティブコンテンツを作ることまであります。創造性を解き放って!</dd> -</dl> - -<h2 id="教師なら">教師なら</h2> - -<p>MDN は技術的な卓越性において長い歴史がありますが、新人に概念を教える最良の方法についての理解は十分ではありません。ここは教師・教育者であるあなたを必要とするところです。私たちの教材が読者にとって優れた、実践的な学びの道筋を提供できるよう手助けできます。</p> - -<dl> - <dt><a href="/ja/docs/Glossary">用語集の記事を読んでレビューする </a>(<em>15分</em>)</dt> - <dd>用語集の記事を確認して、必要に応じて気軽に変更を加えてください。編集の前に内容を議論したい場合は<a href="/en-US/docs/MDN/Community#Join_our_mailing_lists">私たちのメーリングリスト</a>または <a href="/en-US/docs/MDN/Community#Get_into_IRC">IRC channel</a>でコンタクトしてください</dd> - <dt><a href="/docs/MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary">用語集の記事を書く</a> (<em>1時間</em>)</dt> - <dd>用語集にて、明確でシンプルな言葉の定義と、概念の基本的な説明は、初心者の要求を満たすのに重要です。教育者としての経験がすばらしい用語集の記事の作成に役立ちます。注目すべき<a href="/ja/docs/Glossary#Contribute">未定義の用語</a>がたくさんあります。都合が良いものを選んでください。</dd> - <dt><a href="/ja/docs/tag/needsSchema">記事のイラストや図を描く</a> (<em>1時間</em>)</dt> - <dd>ご存知のように、イラストはあらゆる学習コンテンツの中で有益な部分です。これは MDN でよく不足しているもので、あなたのスキルがそのエリアを違ったものにします。<a href="/en-US/docs/tag/needsSchema">図示コンテンツが不足している記事</a>を確認して、絵を作りたいものを選びます。</dd> - <dt><a href="/ja/Learn/Index">学習記事を読んでレビューする</a> (<em>2時間</em>)</dt> - <dd>これは用語集の記事(上記)のレビューと同じことです。この記事は少し長い時間がかかるだけです。</dd> - <dt><a href="/ja/docs/MDN/Contribute/Howto/Write_an_article_to_help_learn_about_the_Web">新しい学習記事を書く</a> (<em>4時間</em>)</dt> - <dd>ウェブのエコシステムとその周りの機能的なトピックについてのシンプルで直言的な記事が必要です。学習記事では知るべきことを全て網羅するよりも、教育的である必要があるため、何をどのように網羅すべきかを知っているあなたの経験は良い資産になるでしょう。</dd> - <dt><a href="/ja/docs/MDN/Contribute/Howto/Create_an_interactive_exercise_to_help_learning_the_web">練習、クイズ、インタラクティブな学習ツールの作成</a> (<em>?時間</em>)</dt> - <dd>全ての学習記事は「アクティブラーニング」と呼ぶ記事を必要としています。その理由は人は自分で何かやってみるのが学ぶのに最良だからです。この素材は、ユーザーが記事に述べられる概念を適用・操作するのを助ける、練習やインタラクティブコンテンツです。アクティブラーニングのコンテンツを作るには多数の方法があり、クイズを作ることから、<a href="https://thimble.mozilla.org/" rel="external">Thimble</a> で完全にハック可能なインタラクティブコンテンツを作ることまであります。創造性を解き放って!</dd> - <dt></dt> - <dt><a href="/ja/docs/MDN/Contribute/Howto/Create_learning_pathways">学習の進路を作る</a> (<em>?時間</em>)</dt> - <dd>進歩的で理解できるチュートリアルを提供するため、コンテンツを学習進路に形付ける必要があります。既存のコンテンツを集めて、学習記事を作成するのに何がたりないか理解するのに良い方法です。</dd> -</dl> diff --git a/files/ja/orphaned/localizing_extension_descriptions/index.html b/files/ja/orphaned/localizing_extension_descriptions/index.html index 184c1756de..06eaa77384 100644 --- a/files/ja/orphaned/localizing_extension_descriptions/index.html +++ b/files/ja/orphaned/localizing_extension_descriptions/index.html @@ -9,7 +9,7 @@ tags: original_slug: Localizing_extension_descriptions --- <h3 id="Gecko_1.9_.E3.81.AB.E3.81.8A.E3.81.91.E3.82.8B.E3.83.AD.E3.83.BC.E3.82.AB.E3.83.A9.E3.82.A4.E3.82.BA" name="Gecko_1.9_.E3.81.AB.E3.81.8A.E3.81.91.E3.82.8B.E3.83.AD.E3.83.BC.E3.82.AB.E3.83.A9.E3.82.A4.E3.82.BA">Gecko 1.9 におけるローカライズ</h3> -<p>Gecko 1.9 には、アドオンの説明や他のメタデータのローカライズに関して、新しく、より強力な方法が盛り込まれています。各言語の説明はすべて、<code>em:localized</code> プロパティを使って <a href="/ja/Install_Manifests" title="ja/Install_Manifests">install.rdf</a> ファイルに書かれます。<code>em:localized</code> それぞれが、情報が使われるべきロケールを示す <code>em:locale</code> プロパティを少なくとも 1 つと、そのロケールの様々な文字列を持ちます。以下の例はこのデモです (ほとんどの一般的なマニフェストプロパティは簡潔にするため削除してあります)。</p> +<p>Gecko 1.9 には、アドオンの説明や他のメタデータのローカライズに関して、新しく、より強力な方法が盛り込まれています。各言語の説明はすべて、<code>em:localized</code> プロパティを使って <a href="/ja/Install_Manifests">install.rdf</a> ファイルに書かれます。<code>em:localized</code> それぞれが、情報が使われるべきロケールを示す <code>em:locale</code> プロパティを少なくとも 1 つと、そのロケールの様々な文字列を持ちます。以下の例はこのデモです (ほとんどの一般的なマニフェストプロパティは簡潔にするため削除してあります)。</p> <pre><?xml version="1.0"?> <RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#" @@ -54,14 +54,14 @@ original_slug: Localizing_extension_descriptions <h3 id="Gecko_1.9_.E4.BB.A5.E5.89.8D.E3.81.AE.E3.83.AD.E3.83.BC.E3.82.AB.E3.83.A9.E3.82.A4.E3.82.BA" name="Gecko_1.9_.E4.BB.A5.E5.89.8D.E3.81.AE.E3.83.AD.E3.83.BC.E3.82.AB.E3.83.A9.E3.82.A4.E3.82.BA">Gecko 1.9 以前のローカライズ</h3> <p>Gecko 1.9 以前では、アドオン開発者は、Firefox や Thunderbird のようなツールキットベースのアプリケーションを対象とする拡張機能にローカライズされた説明を定義するためには以下のような特別な手順が必要でした。</p> <ul> - <li>もしあなたが <a href="/ja/Localizing_an_extension#Localizing_strings_in_JavaScript_code" title="ja/Localizing_an_extension#Localizing_strings_in_JavaScript_code">ローカライズしたプロパティファイル</a> を作っていないのであれば、それを作ってください。他言語が正しく表示されるように、(BOM なしの)UTF-8 エンコードを使うことを忘れないでください。</li> - <li>次の 1 行を、各言語のローカライズしたプロパティファイルに加えてください (EXTENSION_ID はあなたの拡張機能の ID (<a href="/ja/Install_Manifests" title="ja/Install_Manifests">install.rdf</a> の <code><em:id></code> にあります) に合わせてください。また、<var>LOCALIZED_DESCRIPTION</var> にはその言語での拡張機能の説明を入れてください)。 + <li>もしあなたが <a href="/ja/Localizing_an_extension#Localizing_strings_in_JavaScript_code">ローカライズしたプロパティファイル</a> を作っていないのであれば、それを作ってください。他言語が正しく表示されるように、(BOM なしの)UTF-8 エンコードを使うことを忘れないでください。</li> + <li>次の 1 行を、各言語のローカライズしたプロパティファイルに加えてください (EXTENSION_ID はあなたの拡張機能の ID (<a href="/ja/Install_Manifests">install.rdf</a> の <code><em:id></code> にあります) に合わせてください。また、<var>LOCALIZED_DESCRIPTION</var> にはその言語での拡張機能の説明を入れてください)。 <pre>extensions.EXTENSION_ID.description=LOCALIZED_DESCRIPTION</pre> </li> </ul> <ul> - <li>もしあなたが <a href="/ja/Building_an_Extension#Defaults_Files" title="ja/Building_an_Extension#Defaults_Files">デフォルト設定ファイル</a> を作っていないのであれば、それを作ってください。</li> - <li>次の 1 行を、デフォルト設定ファイルに加えてください (<var>EXTENSION_ID</var> は拡張機能の ID (<a href="/ja/Install_Manifests" title="ja/Install_Manifests">install.rdf</a> から)、<var>PATH_TO_LOCALIZATION_FILE</var> は上であなたが加えた、ローカライズしたプロパティファイルへの chrome パスです)。 + <li>もしあなたが <a href="/ja/Building_an_Extension#Defaults_Files">デフォルト設定ファイル</a> を作っていないのであれば、それを作ってください。</li> + <li>次の 1 行を、デフォルト設定ファイルに加えてください (<var>EXTENSION_ID</var> は拡張機能の ID (<a href="/ja/Install_Manifests">install.rdf</a> から)、<var>PATH_TO_LOCALIZATION_FILE</var> は上であなたが加えた、ローカライズしたプロパティファイルへの chrome パスです)。 <pre>pref("extensions.EXTENSION_ID.description", "PATH_TO_LOCALIZATION_FILE");</pre> </li> </ul> diff --git a/files/ja/orphaned/mcd/index.html b/files/ja/orphaned/mcd/index.html index b992797d81..7283dca2de 100644 --- a/files/ja/orphaned/mcd/index.html +++ b/files/ja/orphaned/mcd/index.html @@ -20,8 +20,8 @@ original_slug: MCD ガイド</dt> </dl> <ul> - <li><a href="/ja/MCD/Getting_Started" title="ja/MCD/Getting_Started">Getting Started with MCD</a></li> - <li><a href="/ja/MCD,_Mission_Control_Desktop_AKA_AutoConfig" title="ja/MCD,_Mission_Control_Desktop_AKA_AutoConfig">MCD, Mission Control Desktop AKA AutoConfig</a></li> + <li><a href="/ja/MCD/Getting_Started">Getting Started with MCD</a></li> + <li><a href="/ja/MCD,_Mission_Control_Desktop_AKA_AutoConfig">MCD, Mission Control Desktop AKA AutoConfig</a></li> </ul> </td> <td> diff --git a/files/ja/orphaned/mdn/dashboards/editors/index.html b/files/ja/orphaned/mdn/dashboards/editors/index.html deleted file mode 100644 index a8dd062534..0000000000 --- a/files/ja/orphaned/mdn/dashboards/editors/index.html +++ /dev/null @@ -1,22 +0,0 @@ ---- -title: 編集者 -slug: orphaned/MDN/Dashboards/Editors -tags: - - MDN Meta - - MDN プロジェクト - - ダッシュボード - - ドキュメンテーション -translation_of: MDN/Dashboards/Editors -original_slug: MDN/Dashboards/Editors ---- -<div>{{MDNSidebar}}</div> - -<h2 id="編集者の総数">編集者の総数</h2> - -<p><img alt="The amount of editors grows quickly at the beginning of the MDN history from 2005-2007, then went down and stayed flat until 2010 where it started to grow a bit. A complete changed happened in 2012 and the line grows steadily to more than 1000 editors." src="https://docs.google.com/spreadsheets/d/1IgumrIGuS2v6HVHz0Ko1SlX2dNvqwTj6rq6eldtr1EI/pubchart?oid=37&format=image" style="height: 361px; width: 645px;"></p> - -<h2 id="タイプ別エディタ">タイプ別エディタ</h2> - -<p><img alt="" src="https://docs.google.com/spreadsheets/d/1IgumrIGuS2v6HVHz0Ko1SlX2dNvqwTj6rq6eldtr1EI/pubchart?oid=19&format=image" style="height: 259px; width: 524px;"><img alt="" src="https://docs.google.com/spreadsheets/d/1IgumrIGuS2v6HVHz0Ko1SlX2dNvqwTj6rq6eldtr1EI/pubchart?oid=21&format=image" style="height: 265px; width: 428px;"></p> - -<p><img alt="" src="https://docs.google.com/spreadsheets/d/1IgumrIGuS2v6HVHz0Ko1SlX2dNvqwTj6rq6eldtr1EI/pubchart?oid=20&format=image" style="height: 257px; width: 519px;"><img alt="" src="https://docs.google.com/spreadsheets/d/1IgumrIGuS2v6HVHz0Ko1SlX2dNvqwTj6rq6eldtr1EI/pubchart?oid=22&format=image" style="height: 254px; width: 411px;"></p> diff --git a/files/ja/orphaned/mdn/dashboards/index.html b/files/ja/orphaned/mdn/dashboards/index.html deleted file mode 100644 index 11f41789b0..0000000000 --- a/files/ja/orphaned/mdn/dashboards/index.html +++ /dev/null @@ -1,18 +0,0 @@ ---- -title: ダッシュボード -slug: orphaned/MDN/Dashboards -tags: - - Draft - - MDN Meta - - ダッシュボード - - 概要 -translation_of: MDN/Dashboards -original_slug: MDN/Dashboards ---- -<div>{{MDNSidebar}}{{Draft}}</div> - -<p class="summary">いくつかの指標を表示するダッシュボードがいくつかあります。</p> - -<p><a href="/ja/docs/MDN/Dashboards/Editors">編集者の詳細について詳細を知る</a></p> - -<p>{{SubpagesWithSummaries}}</p> diff --git a/files/ja/orphaned/mdn/kuma/server_charts/index.html b/files/ja/orphaned/mdn/kuma/server_charts/index.html deleted file mode 100644 index a2946d4086..0000000000 --- a/files/ja/orphaned/mdn/kuma/server_charts/index.html +++ /dev/null @@ -1,64 +0,0 @@ ---- -title: サーバーチャート -slug: orphaned/MDN/Kuma/Server_charts -tags: - - Kuma - - MDN Meta -translation_of: MDN/Kuma/Server_charts -original_slug: MDN/Kuma/Server_charts ---- -<div>{{MDNSidebar}}{{IncludeSubnav("/ja/docs/MDN")}}</div> - -<p class="summary"><span class="seoSummary">このページには MDN サーバのステータスチャートが一覧表示されます。</span></p> - -<h2 id="Last_30_minutes" name="Last_30_minutes">直近の 30 分</h2> - -<h3 id="Error_Rate" name="Error_Rate">エラーレート</h3> - -<p>{{EmbedNewRelicChart("2fKQPvMkSwU", 300)}}</p> - -<p>Kuma Web アプリのレスポンス時間 (平均)</p> - -<p>{{EmbedNewRelicChart("43yJ3xwUecU", 300)}}</p> - -<h3 id="Kuma_web_app_response_time_Percentiles" name="Kuma_web_app_response_time_Percentiles">Kuma Web アプリのレスポンス時間 (パーセンタイル)</h3> - -<p>{{EmbedNewRelicChart("6NzEi7ZBdoN", 300)}}</p> - -<h2 id="Last_24_Hours" name="Last_24_Hours">直近の 24 時間</h2> - -<h3 id="Error_Rate_2" name="Error_Rate_2">エラーレート</h3> - -<p>{{EmbedNewRelicChart("kVeeXx52g0l", 300)}}</p> - -<h3 id="Kuma_web_app_response_time_Average" name="Kuma_web_app_response_time_Average">Kuma Web アプリのレスポンス時間 (平均)</h3> - -<p>{{EmbedNewRelicChart("2yWkQ9WbEZW", 300)}}</p> - -<h3 id="Kuma_web_app_response_time_Percentiles_2" name="Kuma_web_app_response_time_Percentiles_2">Kuma Web アプリのレスポンス時間 (パーセンタイル)</h3> - -<p>{{EmbedNewRelicChart("aeFnbLonmvx", 300)}}</p> - -<h2 id="Last_3_Days" name="Last_3_Days">直近の 3 日間</h2> - -<h3 id="Error_Rate_3" name="Error_Rate_3">エラーレート</h3> - -<p>{{ EmbedNewRelicChart("iv2F4gQYjFX", 300)}}</p> - -<h3 id="Kuma_web_app_response_time_Average_2" name="Kuma_web_app_response_time_Average_2">Kuma Web アプリのレスポンス時間 (平均)</h3> - -<p>{{EmbedNewRelicChart("ddTq7AKgyaG", 300)}}</p> - -<h3 id="Kuma_web_app_response_time_Percentiles_3" name="Kuma_web_app_response_time_Percentiles_3">Kuma Web アプリのレスポンス時間 (パーセンタイル)</h3> - -<p>{{EmbedNewRelicChart("bRmyM6ujKA8", 300)}}</p> - -<h2 id="Last_3_Months" name="Last_3_Months">直近の 3 ヶ月</h2> - -<h3 id="Error_Rate_4" name="Error_Rate_4">エラーレート</h3> - -<p>{{EmbedNewRelicChart("fjJ7HnGYNLd", 300)}}</p> - -<h3 id="Kuma_web_app_response_time_Average_3" name="Kuma_web_app_response_time_Average_3">Kuma Web アプリのレスポンス時間 (平均)</h3> - -<p>{{EmbedNewRelicChart("sIaVOeAxNx", 300)}}</p> diff --git a/files/ja/orphaned/mdn/troubleshooting/index.html b/files/ja/orphaned/mdn/troubleshooting/index.html deleted file mode 100644 index af7abca5a8..0000000000 --- a/files/ja/orphaned/mdn/troubleshooting/index.html +++ /dev/null @@ -1,87 +0,0 @@ ---- -title: トラブルシューティング -slug: orphaned/MDN/Troubleshooting -tags: - - Documentation - - MDN - - Writing Documentation - - troubleshooting -translation_of: MDN/Troubleshooting -original_slug: MDN/Troubleshooting ---- -<div>{{MDNSidebar}}</div> - -<p>この記事では、 MDN を利用して起こる問題と、その対処法を記します。</p> - -<h2 id="私の古いアカウントでログインできない">私の古いアカウントでログインできない</h2> - -<dl> - <dt>現象</dt> - <dd>数年前に MDN アカウントを持っていたが、今は唯一のログイン方法が GitHub なのでログインできない。あるいは GitHub でプロファイルを作成済みだが、古いアカウントに接続できない。</dd> - <dt>原因</dt> - <dd>GitHub認証 <a href="/en-US/docs/Archive/MDN/Persona_sign-ins">以外のログイン方法</a> のサポートは2016年11月1日以来削除されました。MDNプロファイルとGitHubアカウントをそれ以前にリンクさせてない場合、古いアカウントではログインできません。</dd> - <dt>対処法</dt> - <dd>Bugzillaで<strong> <a class="external-icon external" href="https://mzl.la/accounthelp">"Account Help" bug</a> </strong>を提出します。古いアカウントについての情報(パスワード以外!)を提供して、新アカウントがあればそれも書きます。MDN エンジニアが反応して手助けします。</dd> -</dl> - -<h2 id="ページを保存できない">ページを保存できない</h2> - -<dl> - <dt>現象</dt> - <dd>あなたが変更したものを保存しようとして、変更が保存できないというメッセージを受けている。</dd> - <dt>原因</dt> - <dd>変更が MDN のスパムトラップに捕捉されています。我々の知る限り、これはときどき間違えます。</dd> - <dt>対処法</dt> - <dd>エラーメッセージに指示されいてるように、リビジョンのコピーを保存して、<a href="mailto://mdn-admins@mozilla.org">MDN サイト管理者</a> にメール送信します。管理者の1人が実際に正当な変更であることを検証して、あなたの変更と同様なものをブロックしないようにスパムフィルターを訓練して、今後はこの問題に会わないように、あなたをホワイトリストに追加します。</dd> -</dl> - -<h2 id="公開した変更がページに出てこない">公開した変更がページに出てこない</h2> - -<dl> - <dt>現象</dt> - <dd>記事にいくらかの変更をして <strong>公開</strong> をクリックする。たった今行った変更が通常のページの見た目に反映されない。</dd> - <dt>原因</dt> - <dd>ページコンテンツがサーバーにキャッシュされていて、ページが変更されて以来リフレッシュされていません。</dd> - <dt>対処法</dt> - <dd>ブラウザーで強制リフレッシュします (例えば Shift+再読み込み)。更新されたコンテンツが見えるか、ページ更新が処理されているメッセージが見えるでしょう。2番目の場合、数分間待ってからページが更新されたかを見るために通常のリフレッシュをします。</dd> -</dl> - -<h2 id="マクロで生成したコンテンツが古い">マクロで生成したコンテンツが古い</h2> - -<dl> - <dt>現象</dt> - <dd>マクロで生成されるコンテンツを含むページを見ている。このマクロが更新されて製品に置かれているのが分かっているが、ページは古い値を表示している。</dd> - <dt>原因</dt> - <dd>マクロの出力がキャッシュされていて、マクロが更新されて以来リフレッシュされていません。このとき、マクロコードへの変更は、そのマクロを使うページに対して自動更新が強制されません。</dd> - <dt>対処法</dt> - <dd>ブラウザーで強制リフレッシュします (例えば Shift+再読み込み)。更新された出力が見えるか、ページ更新が処理されているメッセージが見えるでしょう。2番目の場合、数分間待ってからページが更新されたかを見るために通常のリフレッシュをします。</dd> -</dl> - -<h2 id="ページのスクリプトエラー">ページのスクリプトエラー</h2> - -<dl> - <dt>現象</dt> - <dd>ページ上にこんな恐ろしい赤いボックスが見える:<br> - <img alt="There was a scripting error on this page. While it is being addressed by site editors, you can view partial content below. More information about this error" src="https://mdn.mozillademos.org/files/15259/macro_error_box.png" style="height: 114px; width: 590px;"></dd> - <dt>原因</dt> - <dd>ページ内のマクロでの KumaScript エラーが原因です。マクロが GitHub に保存されて、製品に移される前にレビューやテストを通るようになった今は、この問題は製品ではさほど起こりません。自分自身でマクロを編集したり、マクロを破たんさせる引数と共にマクロを呼び出したりしたら見られる時もあります。ローカルでMDNプラットホームをビルドした場合でも見られるかもしれません。</dd> - <dt>対処法</dt> - <dd>マクロ呼び出しを変更した場合、マクロの引数名を <a href="https://github.com/mdn/kumascript/tree/master/macros">KumaScript GitHub repo</a> と見比べます。疑問のマクロを修正途中の場合、<a href="/en-US/docs/MDN/Contribute/Tools/KumaScript/Troubleshooting">KumaScript エラーのトラブルシューティング</a> が役立つかもしれません。</dd> -</dl> - -<h2 id="ページプレビュー時のスクリプトエラー">ページプレビュー時のスクリプトエラー</h2> - -<dl> - <dt>現象</dt> - <dd>ページを編集していて、<strong>プレビュー</strong>ボタンをクリックする。ページのプレビュー内に(前の節に載っている)スクリプトエラーがある。</dd> - <dt>原因</dt> - <dd>編集しているページ内に既存のスクリプトエラーがあるか、あるいはあなたがマクロの引数を変えたりすることでエラーを導入した。</dd> - <dt>対処法</dt> - <dd> - <p>あなたがページ内のマクロやテンプレートを修正していないのが本当に確実なとき、このエラーを無視できます。編集したページが最終的に保存されて再度通常表示されたときにエラーが消えるのが期待できます (通常表示でエラーがない限り)。</p> - - <p>あなたがエラーを導入したかどうかわからない場合、新しいウィンドウで同じページのコピーを開きます (そのページの最後に保存された版が出てきます)。編集モードに入り、すぐに<strong>プレビュー</strong> をクリックします。ここでエラーが起こった場合は、自信をもってあなたは原因ではないですし、その前に記述されたものでは消えている可能性が高いでしょう。</p> - - <p>あなたの変更について、古いウィンドウからの古いエラーと同じく新しいエラーが出ている場合、新しいウィンドウを閉じて古いウィンドウで作業を続けます。しかしながら、これらが別のエラーの場合、古いウィンドウで本当に何か壊したのかもそれませんので、注意して新しいウィンドウに変更をコピーして、そのたびに<strong>プレビュー</strong> をクリックします。古いエラーがすぐにここにも出る場合、あなたが最後に行った変更がエラーを起こした可能性が高く、その成果をよく調べるべきでしょう。最終的に、副作用として、<strong>プレビュー</strong>を何度もクリックして常にプレビューウィンドウを残している場合、エディターが失敗したり成果が失われる(破棄するときに起こりかねない)場合にも、素早くて未保存のままの大半の変更のコピーが残るでしょう。</p> - </dd> -</dl> diff --git a/files/ja/orphaned/monitoring_http_activity/index.html b/files/ja/orphaned/monitoring_http_activity/index.html index 9af1d8ca31..0a407cc847 100644 --- a/files/ja/orphaned/monitoring_http_activity/index.html +++ b/files/ja/orphaned/monitoring_http_activity/index.html @@ -34,7 +34,7 @@ activityDistributor.addObserver(httpObserver); <h2 id="アクティビティを観察する">アクティビティを観察する</h2> <p>観察可能なクラスは2つあります: ソケットレベルで発生するものと、HTTPトランザクションレベルで発生するものです。</p> <h3 id="観察可能なソケットのアクティビティ">観察可能なソケットのアクティビティ</h3> -<p>{{ interface("nsIHttpActivityDistributor") }} メソッドに報告され<code>た </code>アクティビティが <code>ACTIVITY_TYPE_SOCKET_TRANSPORT</code> の場合、発生したアクティビティの詳細な型を示すアクティビティサブタイプは <a href="/ja/XPCOM_Interface_Reference/nsISocketTransport#nsITransportEventSink.0a_status_codes" title="ja/XPCOM Interface Reference/nsISocketTransport#nsITransportEventSink.0a status codes">socket transport status code</a> となります。</p> +<p>{{ interface("nsIHttpActivityDistributor") }} メソッドに報告され<code>た </code>アクティビティが <code>ACTIVITY_TYPE_SOCKET_TRANSPORT</code> の場合、発生したアクティビティの詳細な型を示すアクティビティサブタイプは <a href="/ja/XPCOM_Interface_Reference/nsISocketTransport#nsITransportEventSink.0a_status_codes">socket transport status code</a> となります。</p> <h3 id="観察可能な_HTTP_のアクティビティ">観察可能な HTTP のアクティビティ</h3> <p>アクティビティタイプ が <code>ACTIVITY_TYPE_HTTP_TRANSACTION の場合</code>、アクティビティサブタイプは <a href="/en/nsIHttpActivityObserver#Activity_subtype_constants" title="en/nsIHttpActivityObserver#Activity subtype constants">activity subtype 定数</a> のうちの1つとなります。これらは送信されるHTTPリクエストヘッダやボディ、受信するHTTPヘッダなどを含むHTTPトランザクション全体を観察するための機能も含みます。</p> <h2 id="参照">参照</h2> diff --git a/files/ja/orphaned/monitoring_wifi_access_points/index.html b/files/ja/orphaned/monitoring_wifi_access_points/index.html index 2a07703194..41e2b09236 100644 --- a/files/ja/orphaned/monitoring_wifi_access_points/index.html +++ b/files/ja/orphaned/monitoring_wifi_access_points/index.html @@ -4,7 +4,7 @@ slug: orphaned/Monitoring_WiFi_access_points original_slug: Monitoring_WiFi_access_points --- <p>{{ gecko_minversion_header("1.9.1") }}</p> -<p>UniversalXPConnect 特権を用いたコードを利用することで、周囲の WiFi アクセスポイントの SSID 、 MAC アドレス、信号強度の一覧を取得することができます。この機能は、主に WiFi 情報に基づいた <a class="internal" href="/Ja/Using_geolocation" title="Ja/Using geolocation">geolocation</a> サービスのために導入されました。</p> +<p>UniversalXPConnect 特権を用いたコードを利用することで、周囲の WiFi アクセスポイントの SSID 、 MAC アドレス、信号強度の一覧を取得することができます。この機能は、主に WiFi 情報に基づいた <a class="internal" href="/Ja/Using_geolocation">geolocation</a> サービスのために導入されました。</p> <h2 id="例">例</h2> <p>この例では、利用可能なアクセスポイントの一覧を出力します。</p> <div class="note"><strong>注意:</strong> wiki の仕様上、 21 行目の表示がおかしくなることがあります。最初の "dd" は単純に "d" ですが、どういうわけか余分な1文字が付いてしまうようです。</div> diff --git a/files/ja/orphaned/mozistorageservice/index.html b/files/ja/orphaned/mozistorageservice/index.html deleted file mode 100644 index a10619fb66..0000000000 --- a/files/ja/orphaned/mozistorageservice/index.html +++ /dev/null @@ -1,156 +0,0 @@ ---- -title: mozIStorageService -slug: orphaned/mozIStorageService -original_slug: mozIStorageService ---- -<p>このインタフェースを使うことでデータベースへの<code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/mozIStorageConnection" title="">mozIStorageConnection</a></code>を開くことができます、また開かれていないデータベースファイルのバックアップを作成することもできます。</p> -<p></p><div style="border: solid #ddd 2px; margin-bottom: 12px;"> -<div style="background: #eee; padding: 2px;"><code><a href="https://dxr.mozilla.org/mozilla-central/source/storage/public/mozIStorageService.idl" rel="custom">storage/public/mozIStorageService.idl</a></code><span style="text-align: right; float: right;"><a href="/ja/docs/Interfaces/About_Scriptable_Interfaces" style="color: #00cc00; font-weight: 700;">Scriptable</a></span></div> -<span style="padding: 4px 2px;"> - -<i>Please add a summary to this article.</i> -</span> - -<div style="background: #eee; padding: 2px;"> -<span> </span> -<span style="text-align: right; float: right;">最終更新: Gecko 1.9 (Firefox 3)</span></div> -</div><p></p> -<p>継承元: <code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsISupports" title="">nsISupports</a></code></p> -<h2 id="メソッド概要">メソッド概要</h2> -<table class="standard-table"> - <tbody> - <tr> - <td><code><code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIFile" title="">nsIFile</a></code> <a href="#backupDatabaseFile.28.29">backupDatabaseFile</a>(in <code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIFile" title="">nsIFile</a></code> aDBFile, in AString aBackupFileName, [optional] in <code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIFile" title="">nsIFile</a></code> aBackupParentDirectory);</code></td> - </tr> - <tr> - <td><code><code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/mozIStorageConnection" title="">mozIStorageConnection</a></code> <a href="#openDatabase.28.29">openDatabase</a>(in <code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIFile" title="">nsIFile</a></code> aDatabaseFile);</code></td> - </tr> - <tr> - <td><code><code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/mozIStorageConnection" title="">mozIStorageConnection</a></code> <a href="#openSpecialDatabase.28.29">openSpecialDatabase</a>(in string aStorageKey);</code></td> - </tr> - <tr> - <td><code><code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/mozIStorageConnection" title="">mozIStorageConnection</a></code> <a href="#openUnsharedDatabase.28.29">openUnsharedDatabase</a>(in <code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIFile" title="">nsIFile</a></code> aDatabaseFile);</code></td> - </tr> - </tbody> -</table> -<h3 id="メソッド">メソッド</h3> -<h3 id="backupDatabaseFile.28.29" name="backupDatabaseFile.28.29">backupDatabaseFile()</h3> -<p>指定されたファイルのバックアップを作成します。データベースは開かれていない必要があります、またはこのメソッドを呼び出す際にデータベースに対する操作が行われないことが確かである必要があります。指定されたファイル名はあくまでもサジェスチョンになります。すでにファイル名が使われている場合、ユニークなファイル名になるように処理されます。実際のバックアップファイルは戻り値になり、実際のファイル名もそこから取得することができます。</p> -<pre>nsIFile backupDatabaseFile( - in nsIFile aDBFile, - in AString aBackupFileName, - [optional] in nsIFile aBackupParentDirectory -); -</pre> -<h6 id="引数">引数</h6> -<dl> - <dt> - aDBFile</dt> - <dd> - バックアップを取るデータベースファイル</dd> - <dt> - aBackupFileName</dt> - <dd> - 新しく作成するバックアップファイルの名前</dd> - <dt> - aBackupParentDirectory</dt> - <dd> - バックアップファイルを格納するディレクトリの名前。この引数が指定されない場合はオリジナルのデータベースファイルと同じ場所にバックアップファイルが作成されます。</dd> -</dl> -<h6 id="戻り値">戻り値</h6> -<p>新しいバックアップデータベースファイルを意味する<code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIFile" title="">nsIFile</a></code>オブジェクト</p> -<h3 id="openSpecialDatabase.28.29" name="openSpecialDatabase.28.29">openSpecialDatabase()</h3> -<p>要求されたストレージのタイプを特定する命名された特別なデータベースストレージへの接続を開きます。</p> -<p></p><div class="blockIndicator note"><strong>註:</strong> プロファイルデータベースへはメインスレッドからのみアクセスしてください。(他の呼び出しが利用している可能性があります。)</div><p></p> -<h6 id="引数_2">引数</h6> -<dl> - <dt> - aStorageKey</dt> - <dd> - 要求されたストレージタイプを特定するキー文字列。"profile"および"memory"が有効です。</dd> -</dl> -<h6 id="戻り値_2">戻り値</h6> -<p>指定されたデータベースへの接続を提供する新しい<code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/mozIStorageConnection" title="">mozIStorageConnection</a></code>オブジェクト</p> -<h6 id="例外">例外</h6> -<dl> - <dt> - NS_ERROR_INVALID_ARG</dt> - <dd> - <code>aStorageKey</code>が不正な場合</dd> -</dl> -<h3 id="openDatabase.28.29" name="openDatabase.28.29">openDatabase()</h3> -<p>指定されたファイルへのデータベース接続を開きます。このメソッドが<code>NS_ERROR_FILE_CORRUPTED</code>例外をスローする場合、<code><a href="https://developer.mozilla.org/ja/docs/XPCOM_Interface_Reference/mozIStorageService#backupDatabaseFile()">mozIStorageService.backupDatabaseFile()</a></code>メソッドをデータベースをバックアップするために呼び出すことが推奨されます。こうすることでユーザデータの喪失を防ぐことができます。(現在失われたデータを復旧する手段はありません。)</p> -<p></p><div class="blockIndicator warning"> - <p><strong>警告:</strong> 単一のファイルに対して複数の接続を確立する場合、<strong>必ず</strong>毎回大文字小文字を含め<strong>正確に同じ名前を</strong>使用してください。SQLiteのプログラムは既に接続が開かれているかどうかを調べるために、単純な文字列比較によって判断しています。"Foo.sqlite" と "foo.sqlite" により接続を開いた場合はあなたのデータベースは<strong>破損してしまう</strong>でしょう。</p> -</div><p></p> -<p>もし、仮想テーブルをデータベース中に含むのであれば(例えば、全文インデックスなど)、<code><a href="https://developer.mozilla.org/ja/docs/XPCOM_Interface_Reference/mozIStorageService#openUnsharedDatabase()">mozIStorageService.openUnsharedDatabase()</a></code>を開く際に使うべきです。なぜならばこのようなテーブルは共有キャッシュが使えないためです。このメソッドを仮想テーブルを含むデータベースへの接続を開くために用いた場合、データベースの破損と<code>NS_ERROR_FILE_CORRUPTED</code>例外のスローが発生するでしょう。</p> -<pre>mozIStorageConnection openDatabase( - in nsIFile aDatabaseFile -); -</pre> -<h6 id="引数_3">引数</h6> -<dl> - <dt> - aDatabaseFile</dt> - <dd> - データベースとして開くための<code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIFile" title="">nsIFile</a></code>オブジェクト</dd> -</dl> -<h6 id="戻り値_3">戻り値</h6> -<p>開かれたデータベース接続である<code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/mozIStorageConnection" title="">mozIStorageConnection</a></code>オブジェクト</p> -<h6 id="例外_2">例外</h6> -<dl> - <dt> - NS_ERROR_FAILURE</dt> - <dd> - データベースを開こうとした際にエラーが起こった場合発生</dd> - <dt> - NS_ERROR_FILE_CORRUPTED</dt> - <dd> - データベースファイルが破損した場合、またはデータベースが(このメソッドでは対応していない)仮想テーブルを含む場合に発生</dd> - <dt> - NS_ERROR_OUT_OF_MEMORY</dt> - <dd> - 新しいストレージオブジェクトの割り当てが失敗した場合に発生</dd> -</dl> -<h3 id="openUnsharedDatabase.28.29" name="openUnsharedDatabase.28.29">openUnsharedDatabase()</h3> -<p>共有キャッシュを使わずに指定されたファイルへのデータベース接続を開きます。このメソッドがNS_ERROR_FILE_CORRUPTED例外をスローする場合、<code><a href="https://developer.mozilla.org/ja/docs/XPCOM_Interface_Reference/mozIStorageService#backupDatabaseFile()">mozIStorageService.backupDatabaseFile()</a></code>メソッドをデータベースバックアップのために呼び出すことが推奨されます。こうすることでユーザデータの喪失を防ぐことができます。(現在失われたデータを復旧する手段はありません。)</p> -<p></p><div class="blockIndicator warning"> - <p><strong>警告:</strong> 単一のファイルに対して複数の接続を確立する場合、<strong>必ず</strong>毎回大文字小文字を含め<strong>正確に同じ名前を</strong>使用してください。SQLiteのプログラムは既に接続が開かれているかどうかを調べるために、単純な文字列比較によって判断しています。"Foo.sqlite" と "foo.sqlite" により接続を開いた場合はあなたのデータベースは<strong>破損してしまう</strong>でしょう。</p> -</div><p></p> -<pre>mozIStorageConnection openUnsharedDatabase( - in nsIFile aDatabaseFile -); -</pre> -<h6 id="引数_4">引数</h6> -<dl> - <dt> - aDatabaseFile</dt> - <dd> - データベースとして開くための<code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIFile" title="">nsIFile</a></code>オブジェクト</dd> -</dl> -<h6 id="戻り値_4">戻り値</h6> -<p>開かれたデータベース接続である<code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/mozIStorageConnection" title="">mozIStorageConnection</a></code>オブジェクト</p> -<h6 id="例外_3">例外</h6> -<dl> - <dt> - NS_ERROR_FAILURE</dt> - <dd> - データベースを開こうとした際にエラーが起こった場合発生</dd> - <dt> - NS_ERROR_FILE_CORRUPTED</dt> - <dd> - データベースファイルが破損した場合、またはデータベースが(このメソッドでは対応していない)仮想テーブルを含む場合に発生</dd> - <dt> - NS_ERROR_OUT_OF_MEMORY</dt> - <dd> - 新しいストレージオブジェクトの割り当てが失敗した場合に発生</dd> -</dl> -<h3 id="参照">参照</h3> -<ul> - <li><a href="/en/Storage" title="en/Storage">Storage</a></li> - <li><a href="/en/mozIStorageConnection" title="en/mozIStorageConnection">mozIStorageConnection</a></li> -</ul> -<dl> - <dd> - </dd> -</dl> diff --git a/files/ja/orphaned/mozmill/index.html b/files/ja/orphaned/mozmill/index.html deleted file mode 100644 index 59dadee8ad..0000000000 --- a/files/ja/orphaned/mozmill/index.html +++ /dev/null @@ -1,48 +0,0 @@ ---- -title: Mozmill -slug: orphaned/Mozmill -tags: - - MozMill -original_slug: Mozmill ---- -<p>MozMill はテストツールであり、Gecko ベースのアプリケーション (Firefox, Thunderbird, Songbird 等) の自動テストを書くためのフレームワークです。これは、<a class="link-https" href="https://addons.mozilla.org/ja/firefox/addon/9018">拡張機能</a> としてビルドされており、IDE (integrated development environment) も含まれています。また、<a class="external" href="http://pypi.python.org/pypi?%3Aaction=search&term=mozmill&submit=search" title="http://pypi.python.org/pypi?:action=search&term=mozmill&submit=search">コマンドライン版のクライアント</a>もあり、テストを書いたり実行したり、テストのデバッグの助けにもなります。MozMill には、ユーザとの対話をシミュレートする機能的なテストを書く助けとなる、大規模な API が用意されています。同様に、完全な <a class="internal" href="/ja/Mozmill/Mozmill_Unit_Test_Framework" title="ja/Mozmill Tests/Mozmill Unit Test Framework">ユニットテスト API</a> もあります。</p> -<p><a class="link-https" href="https://wiki.mozilla.org/QA/Mozmill_Test_Automation">Mozmill テスト自動化プロジェクト</a> は、2009 年 1 月に開始され、Firefox のための自動テスト作業をカバーしています。<a class="link-https" href="https://wiki.mozilla.org/QA/Mozmill_Test_Automation">プロジェクトのページ</a>をご覧になるか、<a href="/ja/Mozmill_Tests" title="ja/Mozmill Tests">Mozmill Tests</a> のドキュメントを見て、テスト書きへの貢献や MozMill テストの実行についてのイメージをつかんでください。既存のテストは、新しい Firefox のリリースのための <a href="/ja/Mozmill/Release_Testing" title="ja/Mozmill/Release Testing">リリーステスト</a>のサイクルで実行されます。</p> -<p>また、Mozilla Messaging チームには、<a href="/ja/Thunderbird/Thunderbird_MozMill_Testing" title="ja/Thunderbird/Thunderbird MozMill Testing">MozMill による Thunderbird のテスト</a>を扱うアクティブなプロジェクトがあります。</p> -<h2 id="インストール">インストール</h2> -<p>Mozmill は、2 通りの異なる方法でインストールできます。多くの場合は、add-ons.mozilla.org からダウンロードできる <a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/9018" title="https://addons.mozilla.org/en-US/firefox/addon/9018">Mozmill Extension</a> をお勧めします。この拡張機能には統合された開発環境といくつかのオーサリングツール、テストを実行するためのグラフィカルなインタフェースが含まれています。<a href="/ja/Mozmill_Tests#Run_Mozmill_restart_tests" title="https://developer.mozilla.org/ja/Mozmill_Tests#Run_Mozmill_restart_tests">再起動テスト</a>とオペレーティングシステムの対話に興味のある上級ユーザには、python <a class="external" href="http://pypi.python.org/pypi/pip">pip</a> (or <a class="external" href="http://pypi.python.org/pypi/setuptools">setuptools</a>) パッケージインストーラを使用した <a class="external" href="http://pypi.python.org/pypi?%3Aaction=search&term=mozmill&submit=search" title="http://pypi.python.org/pypi?:action=search&term=mozmill&submit=search">コマンドライン版のクライアント</a> のインストールをお勧めします。</p> -<h3 id="拡張機能版">拡張機能版</h3> -<p>拡張機能版をインストールするには、アドオンマネージャの "アドオンを入手" タブを開いて Mozmill を検索し、インストールするだけです。<a class="link-https" href="https://addons.mozilla.org/ja/firefox/addon/9018">addons.mozilla.org</a> の Web サイトから直接インストールすることもできます。アプリケーションを再起動してインストールを完了してください。</p> -<h3 id="コマンドライン版のクライアント">コマンドライン版のクライアント</h3> -<p>コマンドライン版の MozMill をインストールするには、さらにいくつかの手順が必要になります。この手順はオペレーティングシステムにより多少異なります。</p> -<h4 id="Windows">Windows</h4> -<p>MozMill の前に、MozillaBuildSetup パッケージをシステムにインストールしてください。このパッケージの <a class="external" href="http://ftp.mozilla.org/pub/mozilla.org/mozilla/libraries/win32/MozillaBuildSetup-Latest.exe">最新ビルド</a>を入手し、手動でインストールしてください。l10n.bat ファイルを実行した後、MozMill コマンドライン版のクライアントをインストールしてください。</p> -<pre><code>$ easy_install pip -$ pip install mozmill -$ pip install mercurial (Visual Studio がインストールされていない環境では、この <a href="http://hg.mozilla.org/qa/mozmill-automation/raw-file/tip/setup/py25.reg">レジストリファイル</a> をダウンロードして適用し、<a href="http://people.mozilla.com/~hskupin/mozmill-crowd/mozmill-windows.zip">MozMill のバイナリパッケージ</a> を手動でインストール (setup ファイルまたは setup.cmd をコマンドプロンプトで実行) してください。) -</code></pre> -<h4 id="Mac_OS_X">Mac OS X</h4> -<p>Mac OS X 10.4 の環境の場合は、先に <a class="external" href="http://python.org/download/">python.org</a> から Python 2.5 以降のバージョンをダウンロードしてインストールする必要があります。その後、MozMill を setuptools でインストールしてください。</p> -<pre><code>$ curl -O http://peak.telecommunity.com/dist/ez_setup.py</code> -<code>$ sudo python ez_setup.py -$ sudo easy_install pip</code> -$ sudo pip install mozmill mercurial -</pre> -<h4 id="Ubuntu">Ubuntu</h4> -<p>MozMill を Ubuntu にインストールするには、ターミナルで次の 2 つのコマンドを実行するだけです:</p> -<pre>$ sudo apt-get install python-pip python-dev -$ sudo pip install mozmill mercurial</pre> -<h2 id="MozMill_の更新">MozMill の更新</h2> -<p>MozMill を拡張機能としてインストールした場合は、新しいバージョンがリリースされた時に、アプリケーションから自動的に通知されます。コマンドライン版のクライアントを更新するには、次のコマンドを実行してください (sudo は Windows 環境では不要です):</p> -<pre>$ sudo pip install --upgrade mozmill -</pre> -<h2 id="さらに読むべきもの">さらに読むべきもの</h2> -<p>他にも、いくつかの MozMill の概要を説明するページがあります。後で参照するため、これらのページをブックマークに追加しておくと良いでしょう。</p> -<ul> <li><a href="/ja/Mozmill/First_Steps/Tutorial:_Introduction_to_Mozmill" title="ja/Mozmill Tests/Tutorial: Introduction to Mozmill">Introduction to Mozmill</a> - 必要な MozMill の各 API オブジェクトの詳細なチュートリアル</li> <li><a href="/ja/Mozmill_Tests" title="https://developer.mozilla.org/ja/Mozmill_Tests">Mozmill tests</a> - コマンドラインから MozMill を実行する方法</li> -</ul> -<h4 id="リファレンスデスク">リファレンスデスク</h4> -<ul> <li><a href="/ja/Mozmill/Mozmill_Controller_Object" title="ja/Mozmill/Mozmill Controller Object">controller object reference</a></li> <li><a href="/ja/Mozmill/Mozmill_Elements_Library_Object" title="ja/Mozmill/Mozmill Elements Library Object">elementslib object reference</a> (Mozmill 2.0 で非推奨 - <a href="/ja/Mozmill/Finding_Mozmill_Elements" title="Finding_Mozmill_Elements">finding mozmill elements</a> 参照)</li> <li><a href="/ja/Mozmill/Mozmill_Element_Object" title="element object reference">element object reference</a> (Mozmill 2.0+)</li> <li><a href="/ja/Mozmill/Finding_Mozmill_Elements" title="Finding Mozmill Elements">finding mozmill elements</a> (Mozmill 2.0+)</li> <li><a href="/ja/Mozmill/Mozmill_Base_Object_Interfaces" title="ja/Mozmill Tests/Mozmill Base Object Interfaces">mozmill object reference</a></li> <li><a href="/ja/Mozmill/Mozmill_Unit_Test_Framework" title="ja/Mozmill Tests/Mozmill Unit Test Framework">unit test API reference</a></li> <li><a href="/ja/Mozmill/Mozmill_Element_Object/Extending_the_MozMill_element_hierarchy" title="https://developer.mozilla.org/ja/Mozmill/Mozmill_Element_Object/Extending_Element_Hierarchy">extending the element hierarchy</a></li> -</ul> -<h2 id="バグ">バグ</h2> -<p>Mozmill は、Mozilla プロジェクト内の多くのテストシステムと同様に、開発段階にあります。バグを見つけたときは、<a class="link-https" href="https://bugzilla.mozilla.org/buglist.cgi?query_format=advanced&bug_status=UNCONFIRMED&bug_status=NEW&bug_status=ASSIGNED&bug_status=REOPENED&component=JSBridge&component=Mozmill&component=MozRunner&product=Testing" title="https://bugzilla.mozilla.org/buglist.cgi?query_format=advanced&bug_status=UNCONFIRMED&bug_status=NEW&bug_status=ASSIGNED&bug_status=REOPENED&component=JSBridge&component=Mozmill&component=MozRunner&product=Testing">既知のバグ</a> のリストですでに報告されていないか確認してください。まだ報告されていない場合は、"<code>Testing</code>" の製品カテゴリの "<code>Mozmill</code>" コンポーネント下に <a class="link-https" href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Testing">新たなバグとして報告</a>してください。バグ報告の際は、バグを再現するためのできるだけ詳細な情報と MozMill のテストを添付してください。よろしくお願いします!</p> -<div class="noinclude"> <p>{{ languages( { "en": "en/Mozmill" } ) }}</p> -</div> diff --git a/files/ja/orphaned/nsidomhtmlmediaelement/index.html b/files/ja/orphaned/nsidomhtmlmediaelement/index.html deleted file mode 100644 index 133e28a8aa..0000000000 --- a/files/ja/orphaned/nsidomhtmlmediaelement/index.html +++ /dev/null @@ -1,346 +0,0 @@ ---- -title: nsIDOMHTMLMediaElement -slug: orphaned/NsIDOMHTMLMediaElement -original_slug: NsIDOMHTMLMediaElement ---- -<p></p> - -<p><code>nsIDOMHTMLMediaElement</code> インターフェースは HTML 5 における <a class="internal" href="/Ja/HTML/Element/Audio" title="Ja/HTML/Element/Audio"><code>audio</code></a> および <a class="internal" href="/Ja/HTML/Element/Video" title="Ja/HTML/Element/Video"><code>video</code></a> 要素の実装に用いられています。</p> - -<div class="note"><strong>注意:</strong> <code> cue ranges</code> 機能の仕様は現在流動的な状況にあり、 HTML 5 標準においては大幅に改訂が加えられるか、置き換えられてしまう可能性があります。そのため、現時点では Firefox ではこの機能に対応していません。</div> - -<p></p><div style="border: solid #ddd 2px; margin-bottom: 12px;"> -<div style="background: #eee; padding: 2px;"><code><a href="https://dxr.mozilla.org/mozilla-central/source/dom/public/idl/html/nsIDOMHTMLMediaElement.idl" rel="custom">dom/public/idl/html/nsIDOMHTMLMediaElement.idl</a></code><span style="text-align: right; float: right;"><a href="/ja/docs/Interfaces/About_Scriptable_Interfaces" style="color: #00cc00; font-weight: 700;">Scriptable</a></span></div> -<span style="padding: 4px 2px;"> - -<i>Please add a summary to this article.</i> -</span> - -<div style="background: #eee; padding: 2px;"> -<span> </span> -<span style="text-align: right; float: right;">最終更新: Gecko 1.9.1 (Firefox 3.5 / Thunderbird 3.0 / SeaMonkey 2.0)</span></div> -</div><p></p> - -<p>Inherits from: <code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIDOMHTMLElement" title="">nsIDOMHTMLElement</a></code></p> - -<h2 id="Method_overview" name="Method_overview">メソッド概要 (Method Overview)</h2> - -<table class="standard-table"> - <tbody> - <tr> - <td><code>void <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#addCueRange()" title="Ja/NsIDOMHTMLMediaElement#addCueRange()">addCueRange</a>(in DOMString className, in float start, in float end, in boolean pauseOnExit, in nsIDOMHTMLVoidCallback enterCallback, in nsIDOMHTMLVoidCallback exitCallback);</code></td> - </tr> - <tr> - <td><code>DOMString <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#canPlayType()" title="Ja/NsIDOMHTMLMediaElement#canPlayType()">canPlayType</a>(in DOMString type);</code></td> - </tr> - <tr> - <td><code>void <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#load()" title="Ja/NsIDOMHTMLMediaElement#load()">load</a>();</code></td> - </tr> - <tr> - <td><code>void <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#pause()" title="Ja/NsIDOMHTMLMediaElement#pause()">pause</a>();</code></td> - </tr> - <tr> - <td><code>void <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#play()" title="Ja/NsIDOMHTMLMediaElement#play()">play</a>();</code></td> - </tr> - <tr> - <td><code>void <a class="internal" href="/Ja/NsIDOMHTMLMediaElement#removeCueRanges()" title="Ja/NsIDOMHTMLMediaElement#removeCueRanges()">removeCueRanges</a>(in DOMString className);</code></td> - </tr> - </tbody> -</table> - -<h2 id="Attributes" name="Attributes">属性 (Attributes)</h2> - -<table class="standard-table"> - <tbody> - <tr> - <td class="header" style="text-align: center;">属性</td> - <td class="header" style="text-align: center;">型</td> - <td class="header" style="text-align: center;">意味</td> - </tr> - <tr> - <td><code>autoplay</code></td> - <td><code>boolean</code></td> - <td><code>true</code> if playback should automatically begin as soon as enough media is available to do so without interruption.</td> - </tr> - <tr> - <td><code>buffered</code></td> - <td><code>TimeRanges</code></td> - <td>A static, normalized <code>TimeRanges</code> object describing the time ranges of the media that have been buffered. <strong>Read only.</strong> <span class="inlineIndicator unimplemented unimplementedInline">未実装</span></td> - </tr> - <tr> - <td><code>bufferedBytes</code></td> - <td><code>ByteRanges</code></td> - <td>A static, normalized <code>ByteRanges</code> object describing the byte ranges of the media that have been buffered. <strong>Read only.</strong> <span class="inlineIndicator unimplemented unimplementedInline">未実装</span></td> - </tr> - <tr> - <td><code>bufferingRate</code></td> - <td><code>float</code></td> - <td>The average number of bits per second for the current download over the past few seconds. If there is no download in progress, this value is 0.0. <strong>Read only.</strong> <span class="inlineIndicator unimplemented unimplementedInline">未実装</span></td> - </tr> - <tr> - <td><code>bufferingThrottled</code></td> - <td><code>boolean</code></td> - <td><code>true</code> if Firefox is intentionally throttling the bandwidth used by the download (such as when the download is paused), otherwise <code>false</code>. <strong>Read only.</strong> <span class="inlineIndicator unimplemented unimplementedInline">未実装</span></td> - </tr> - <tr> - <td><code>controls</code></td> - <td><code>boolean</code></td> - <td><code>true</code> if user interface for controlling the media should be presented.</td> - </tr> - <tr> - <td><code>currentSrc</code></td> - <td><code>DOMString</code></td> - <td>The absolute URL of the chosen media resource (if, for example, the server selects a media file based on the resolution of the user's display), or an empty string if the <code>networkState</code> is <code>EMPTY</code>. <strong>Read only.</strong></td> - </tr> - <tr> - <td><code>currentTime</code></td> - <td><code>float</code></td> - <td>The current playback time, in seconds. Setting this value will seek the media to the new time.</td> - </tr> - <tr> - <td><code>defaultPlaybackRate</code></td> - <td><code>float</code></td> - <td>The default playback rate for the media. The Ogg backend does not support this. 1.0 is "normal speed," values lower than 1.0 make the media play slower than normal, higher values make it play faster. The value 0.0 is invalid and throws a <code>NOT_SUPPORTED_ERR</code> exception.</td> - </tr> - <tr> - <td><code>duration</code></td> - <td><code>float</code></td> - <td>The length of the media in seconds, or zero if no media data is available. If the media data is available but the length is unknown, this value is <code>NaN</code>. If the media is streamed and has no predefined length, the value is <code>Inf</code>. <strong>Read only.</strong></td> - </tr> - <tr> - <td><code>ended</code></td> - <td><code>boolean</code></td> - <td><code>true</code> if playback has finished. <strong>Read only.</strong></td> - </tr> - <tr> - <td><code>error</code></td> - <td><code><code><a href="/ja/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIDOMHTMLMediaError" title="">nsIDOMHTMLMediaError</a></code></code></td> - <td>The media's error status. <strong>Read only.</strong></td> - </tr> - <tr> - <td><code>muted</code></td> - <td><code>boolean</code></td> - <td><code>true</code> if the audio is muted, otherwise <code>false</code>.</td> - </tr> - <tr> - <td><code>networkState</code></td> - <td><code>unsigned short</code></td> - <td> - <p>The current state of the fetch of the media. <strong>Read only.</strong></p> - - <table class="standard-table"> - <tbody> - <tr> - <td class="header" style="text-align: center;">定数</td> - <td class="header" style="text-align: center;">値</td> - <td class="header" style="text-align: center;">意味</td> - </tr> - <tr> - <td><code>EMPTY</code></td> - <td>0</td> - <td>There is no data yet. The <code>readyState</code> will also be <code>HAVE_NOTHING</code>.</td> - </tr> - <tr> - <td><code>LOADING</code></td> - <td>1</td> - <td>The media is loading.</td> - </tr> - <tr> - <td><code>LOADED_METADATA</code></td> - <td>2</td> - <td>The media's metadata has been loaded.</td> - </tr> - <tr> - <td><code>LOADED_FIRST_FRAME</code></td> - <td>3</td> - <td>The media's first frame has been loaded.</td> - </tr> - <tr> - <td><code>LOADED</code></td> - <td>4</td> - <td>The media has been fully loaded.</td> - </tr> - </tbody> - </table> - </td> - </tr> - <tr> - <td><code>paused</code></td> - <td><code>boolean</code></td> - <td><code>true</code> if the media playback is currently paused. <strong>Read only.</strong></td> - </tr> - <tr> - <td><code>playbackRate</code></td> - <td><code>float</code></td> - <td>The current rate at which the media is being played back. This is used to implement user controls for fast forward, slow motion, and so forth. The normal playback rate is multiplied by this value to obtain the current rate, so a value of 1.0 indicates normal speed. Not supported by the Ogg backend.</td> - </tr> - <tr> - <td><code>readyState</code></td> - <td><code>unsigned short</code></td> - <td> - <p>The media's current readiness state. <strong>Read only.</strong></p> - - <table class="standard-table"> - <tbody> - <tr> - <td class="header" style="text-align: center;">定数</td> - <td class="header" style="text-align: center;">値</td> - <td class="header" style="text-align: center;">意味</td> - </tr> - <tr> - <td><code>HAVE_NOTHING</code></td> - <td>0</td> - <td>No information is available about the media resource.</td> - </tr> - <tr> - <td><code>HAVE_METADATA</code></td> - <td>1</td> - <td>Enough of the media resource has been retrieved that the metadata attributes are initialized. Seeking will no longer raise an exception.</td> - </tr> - <tr> - <td><code>HAVE_SOME_DATA</code></td> - <td>2</td> - <td>Data for the current playback position is not available, but there is at least one playback position for which data is available.</td> - </tr> - <tr> - <td><code>HAVE_CURRENT_DATA</code></td> - <td>3</td> - <td>Data is available for the current playback position, but not enough to actually play more than one frame.</td> - </tr> - <tr> - <td><code>HAVE_FUTURE_DATA</code></td> - <td>4</td> - <td>Data for the current playback position as well as for at least a little bit of time into the future is available (in other words, at least two frames of video, for example).</td> - </tr> - <tr> - <td><code>HAVE_ENOUGH_DATA</code></td> - <td>5</td> - <td>Enough data is available—and the download rate is high enough—that the media can be played through to the end without interruption.</td> - </tr> - </tbody> - </table> - </td> - </tr> - <tr> - <td><code>seeking</code></td> - <td><code>boolean</code></td> - <td><code>true</code> if the media is in the process of seeking to a new position, otherwise <code>false</code>.<strong> Read only.</strong></td> - </tr> - <tr> - <td><code>src</code></td> - <td><code>DOMString</code></td> - <td>The URL of the media to present.</td> - </tr> - <tr> - <td><code>totalBytes</code></td> - <td><code>unsigned long</code></td> - <td>The length, in bytes, of the media resource. If the length is unknown, or the content is streamed and therefore has no specified length, this value is 0. <strong>Read only.</strong></td> - </tr> - <tr> - <td><code>volume</code></td> - <td><code>float</code></td> - <td>The current audio volume, from 0.0 (silent) to 1.0 (maximum).</td> - </tr> - </tbody> -</table> - -<h2 id="メソッド_(Methods)">メソッド (Methods)</h2> - -<h3 id="addCueRange()">addCueRange()</h3> - -<div class="note"><strong>Note:</strong> This method is not yet implemented, as its definition is in flux in the HTML 5 standard.</div> - -<p>Adds a cue range to the media element.</p> - -<pre>void addCueRange( - in DOMString className, - in float start, - in float end, - in boolean pauseOnExit, - in nsIDOMHTMLVoidCallback enterCallback, - in nsIDOMHTMLVoidCallback exitCallback -); -</pre> - -<h6 id="Parameters">Parameters</h6> - -<p>xxx</p> - -<h3 id="eatCookie.28.29" name="eatCookie.28.29">canPlayType()</h3> - -<p>Determines whether or not the specified media type can be played back.</p> - -<pre class="eval">DOMString canPlayType( - in DOMString type -);</pre> - -<h6 id="Parameters_4">Parameters</h6> - -<dl> - <dt>type</dt> - <dd>The media type to test for, such as "video/ogg".</dd> -</dl> - -<h6 id="Return_value">Return value</h6> - -<ul> - <li>"" if the specified type definitely cannot be played. (was "no" until Gecko 1.9.1.1/ Firefox 3.5.1)</li> - <li>"probably" if the specified type appears to be playable.</li> - <li>"maybe" if it's impossible to be sure if the type can be played without actually attempting to do so.</li> -</ul> - -<p>Because media formats are complicated, and it's impossible to judge every possible detail from the type string, there is no such thing as 100% certain that the specified type can be played; the best you can do is "probably".</p> - -<h3 id="eatCookie.28.29" name="eatCookie.28.29">load()</h3> - -<p>Begins loading the media content from the server.</p> - -<pre class="eval"> void load();</pre> - -<h6 id="Parameters_5">Parameters</h6> - -<p>None.</p> - -<h3 id="getFunnySaying.28.29" name="getFunnySaying.28.29">pause()</h3> - -<p>Pauses the media playback.</p> - -<pre class="eval"> void pause(); -</pre> - -<h6 id="Parameters_2" name="Parameters_2">Parameters</h6> - -<p>None.</p> - -<h3 id="sayYummy.28.29" name="sayYummy.28.29">play()</h3> - -<p>Begins playback of the media.</p> - -<pre class="eval"> void play(); -</pre> - -<h6 id="Parameters_3" name="Parameters_3">Parameters</h6> - -<p>None.</p> - -<h3 id="removeCueRanges()">removeCueRanges()</h3> - -<div class="note"><strong>Note:</strong> This function is not yet implemented, as its definition in the HTML 5 standard is in flux.</div> - -<pre>void removeCueRanges( - in DOMString className -); -</pre> - -<h6 id="Parameters_6">Parameters</h6> - -<p>xxx</p> - -<h2 id="See_also" name="See_also">参考資料</h2> - -<ul> - <li><code><a class="internal" href="/Ja/HTML/Element/Video" title="Ja/HTML/Element/Video">video</a></code></li> - <li><a class="internal" href="/Ja/HTML/Element/Audio" title="Ja/HTML/Element/Audio"><code>audio</code></a></li> - <li><a class="internal" href="/Ja/HTML/Element/Source" title="Ja/HTML/Element/Source"><code>source</code></a></li> - <li><a class="internal" href="/Ja/Using_audio_and_video_in_Firefox" title="Ja/Using audio and video in Firefox">Using audio and video in Firefox</a></li> -</ul> diff --git a/files/ja/orphaned/nsidynamiccontainer/index.html b/files/ja/orphaned/nsidynamiccontainer/index.html deleted file mode 100644 index cd637a460a..0000000000 --- a/files/ja/orphaned/nsidynamiccontainer/index.html +++ /dev/null @@ -1,88 +0,0 @@ ---- -title: nsIDynamicContainer -slug: orphaned/nsIDynamicContainer -tags: - - Developing Mozilla - - Extensions - - Interfaces - - Interfaces:Scriptable - - Places - - XPCOM - - XPCOM API Reference -original_slug: nsIDynamicContainer ---- -<p>nsIDynamicContainerインタフェースは一時的なコンテンツのコンテナを提供するベースクラスを提供します。この機能はコンテナがオープンされたタイミングで、ノードを直接満たすことができます。すべてのリザルトノードのプロパティをそれぞれのアイテムに関連したデータを保存するのに利用できます。(例えばディスク上でのフルパスなど)また、それぞれのコンテナに対してサービスに関連付けられた追加のコンテナを作成することができます。<br> - <br> - </p><div style="border: solid #ddd 2px; margin-bottom: 12px;"> -<div style="background: #eee; padding: 2px;"><code><a href="https://dxr.mozilla.org/mozilla-central/source/toolkit/components/places/public/nsIDynamicContainer.idl" rel="custom">toolkit/components/places/public/nsIDynamicContainer.idl</a></code><span style="text-align: right; float: right;"><a href="/ja/docs/Interfaces/About_Scriptable_Interfaces" style="color: #00cc00; font-weight: 700;">Scriptable</a></span></div> -<span style="padding: 4px 2px;"> - -<i>Please add a summary to this article.</i> -</span> - -<div style="background: #eee; padding: 2px;"> -<span> </span> -<span style="text-align: right; float: right;">最終更新: Gecko 1.9 (Firefox 3)</span></div> -</div><p></p> -<p>継承元: <a href="/en/nsISupports" title="en/nsISupports">nsISupports</a></p> -<h2 id="メソッドの概要"><br> - メソッドの概要</h2> -<p><code>void <a href="/ja/nsIDynamicContainer" title="ja/nsIDynamicContainer">onContainerNodeOpening</a>(in <a href="/en/nsINavHistoryContainerResultNode" title="en/nsINavHistoryContainerResultNode">nsINavHistoryContainerResultNode</a> aContainer, in <a href="/en/nsINavHistoryQueryOptions" title="en/nsINavHistoryQueryOptions">nsINavHistoryQueryOptions</a> aOptions);</code><br> - <code>void <a href="/ja/nsIDynamicContainer" title="ja/nsIDynamicContainer">onContainerNodeClosed</a>(in <a href="/en/nsINavHistoryContainerResultNode" title="en/nsINavHistoryContainerResultNode">nsINavHistoryContainerResultNode</a> aContainer);<br> - void <a href="/ja/nsIDynamicContainer" title="ja/nsIDynamicContainer">onContainerRemoving</a>(in long long aItemId);<br> - void <a href="/ja/nsIDynamicContainer" title="ja/nsIDynamicContainer">onContainerMoved</a>(in long long aItemId, in long long aNewParent, in long aNewIndex);</code></p> -<h2 id="メソッド">メソッド</h2> -<h3 id="onContainerNodeOpening()">onContainerNodeOpening()</h3> -<p>与えられたコンテナノードが新たにノードが作成されようとするときに呼ばれます。<br> - 必要であればノードの作成を実行することができます。</p> -<p></p><div class="blockIndicator note"><strong>註:</strong> 状態を保存したい場合は全てのリザルトノードはプロパティバッグをインプリメントします</div><p></p> -<pre>void onContainerNodeOpening( - in nsINavHistoryContainerResultNode aContainer, - in nsINavHistoryQueryOptions aOptions -); -</pre> -<h6 id="引数">引数</h6> -<dl> - <dt> - aContainer</dt> - <dd> - これから開かれようとしているコンテナノード</dd> - <dt> - aOptions</dt> - <dd> - このクエリを生成するために使われるオプション。コンテナは可能ならばこれらに従います。もしクエリとフォルダノードをコンテナに追加しようとしている場合、実装は可能ならばこの値を使用しないといけません。<strong>この値を変更してはいけません。</strong></dd> -</dl> -<h3 id="onContainerNodeClosed()">onContainerNodeClosed()</h3> -<p>与えられたコンテナがなくなるときに呼ばれます。従って、必要なクリーンアップ処理を実行することができます。このメソッドが呼びだされることは保証されて<strong>いません</strong>。具体的にはクエリがどこかへ行ってしまったときには呼ばれません。この現象はコンテナ自身がopen状態からclose状態へ遷移したときにのみ起こります。実際の処理ではかなり大量の動的に生成されたノードがこのメソッドをクリーンアップ処理のために呼び出します。</p> -<pre>void onTainerNodeClosed( - in nsINavHistoryContainerResultNode aContainer -); -</pre> -<h6 id="引数_2">引数</h6> -<dl> - <dt> - aContainer</dt> - <dd> - hoge</dd> -</dl> -<h3 id="onContainerRemoving()">onContainerRemoving()</h3> -<p>与えられたコンテナがブックマークテーブルから削除されようとするときに呼ばれます。従って、必要なクリーンアップ処理を実行することができます。このメソッドはコンテナが削除される<strong>前に</strong>呼ばれます、従って処理では依然としてコンテナを参照することができます。</p> -<pre>void onContainerRemoving( - in long long aItemId -); -</pre> -<h6 id="引数_3">引数</h6> -<dl> - <dt> - aItemId</dt> - <dd> - コンテナアイテムのアイテムID。</dd> -</dl> -<h3 id="onContainerMoved()">onContainerMoved()</h3> -<p>与えられたコンテナが丁度移動されようとしているときに呼ばれます。bookkeepingを行う処理に備えて存在します。このメソッドはコンテナが移動された<strong>後に</strong>呼ばれます。</p> -<h3 id="関連記事">関連記事</h3> -<ul> - <li><a href="/ja/Places" title="ja/Places">Places</a></li> - <li><a href="/en/nsINavHistoryContainerResultNode" title="en/nsINavHistoryContainerResultNode">nsINavHistoryContainerResultNode</a></li> - <li><a href="/en/nsINavHistoryQueryOptions" title="en/nsINavHistoryQueryOptions">nsINavHistoryQueryOptions</a></li> -</ul> diff --git a/files/ja/orphaned/participating_in_the_mozilla_project/index.html b/files/ja/orphaned/participating_in_the_mozilla_project/index.html deleted file mode 100644 index fa46754515..0000000000 --- a/files/ja/orphaned/participating_in_the_mozilla_project/index.html +++ /dev/null @@ -1,13 +0,0 @@ ---- -title: Mozilla プロジェクトに参加する -slug: orphaned/Participating_in_the_Mozilla_project -original_slug: Participating_in_the_Mozilla_project ---- -<p>もしあなたが Mozilla プラットフォームに関連するコードでのバグの修正やその他の仕事を手伝うことに興味があるのなら、あなたに適切な方向を指し示すであろう文書がここで見つけられます。</p> -<table class="mainpage-table"> <tbody> <tr> <td> <h2 id="ドキュメンテーショントピックス">ドキュメンテーショントピックス</h2> -<dl> <dt><a class="internal" href="/ja/Developer_Guide" title="ja/Mozilla developer guide">Mozilla 開発者ガイド</a><br> </dt> <dd>Mozilla のコードベースに貢献するための開発 Tips とガイド。</dd> <dt><a class="internal" href="/ja/Developer_Guide/Source_Code" title="Ja/Mozilla source code">Mozilla ソースコード</a><br> </dt> <dd>ダウンロードもしくはバージョン管理システムを通してMozilla のコードを手に入れる方法とあなたのコードをツリーに入れる方法についての情報。<br> </dd> <dt><a class="internal" href="/ja/Developer_Guide/Build_Instructions" title="Ja/Build Documentation">ビルドに関するドキュメンテーション</a><br> </dt> <dd>Firefox と Thunderbird を含む、Mozilla プロジェクトのビルド方法についての情報。<em>このページは内容の整理を必要としています。</em><br> </dd> <dt><a class="internal" href="/Ja/The_Mozilla_platform" title="Ja/The Mozilla platform">Mozilla プラットフォーム</a><br> </dt> <dd>Mozilla プラットフォームについての情報。その API 群と技術のすべて、そして、あなた自身のプロジェクトでそれらを利用する方法など。</dd> <dt><a class="internal" href="/Project:ja/How_to_Help" title="Project:ja/How to Help">Mozilla を文書化する</a> <br> </dt> <dd> Mozilla のためおよび開かれた Web のために私たちのドキュメンテーションの作成と改善に協力してください。</dd> <dt><a class="internal" href="/Ja/Debugging" title="Ja/Debugging">デバッグ</a><br> </dt> <dd>Mozilla のコードをデバッグするときに従うべき、役に立つTips とガイドライン。</dd> <dt><a class="internal" href="/ja/QA" title="Ja/QA">品質保証(QA)</a><br> </dt> <dd>テストおよびバグトラッキングについての情報。</dd> <dt><a class="internal" href="/ja/Localization" title="ja/Localization">ローカライゼーション</a><br> </dt> <dd>Mozilla プロジェクトやドキュメンテーションなどを複数の言語に翻訳することに関する情報。</dd> -</dl></td> <td> <h2 id="ツール">ツール</h2> -<dl> <dt><a class="link-https" href="https://bugzilla.mozilla.org/" title="https://bugzilla.mozilla.org/">Bugzilla</a><br> </dt> <dd>Mozilla プロジェクトのための問題を追跡するために使われている <a class="internal" href="/ja/Bugzilla" title="ja/Bugzilla">Bugzilla</a> データベース。<br> </dd> <dt><a class="external" href="http://mxr.mozilla.org/" title="http://mxr.mozilla.org/">MXR</a><br> </dt> <dd>Web 上で Mozilla のソースコードレポジトリをブラウズ、検索できます。<br> </dd> <dt><a class="external" href="http://bonsai.mozilla.org/cvsqueryform.cgi" title="http://bonsai.mozilla.org/cvsqueryform.cgi">Bonsai</a><br> </dt> <dd><a class="internal" href="/ja/Bonsai" title="ja/Bonsai">Bonsai</a> ツールを使えば、レポジトリ上のどのファイルを誰が変更し、そして、いつそれがなされたのかを見つけられます。 <br> </dd> <dt><a class="external" href="http://tinderbox.mozilla.org/showbuilds.cgi" title="http://tinderbox.mozilla.org/showbuilds.cgi">Tinderbox</a><br> </dt> <dd><a class="internal" href="/ja/Tinderbox" title="ja/Tinderbox">Tinderbox</a> はツリーのステータス(現在ビルドが成功しているかどうか)を示します。作業ツリーでの作業を確実にするために、チェックインとチェックアウトの前にチェックしてください。</dd> <dt><a class="internal" href="/ja/Crash_reporting" title="Ja/Crash reporting">クラッシュトラッキング</a><br> </dt> <dd><a class="link-https" href="https://crash-reports.mozilla.com/reports" title="https://crash-reports.mozilla.com/reports">Socorro</a> および <a class="external" href="http://talkback-public.mozilla.org/search/start.jsp" title="http://talkback-public.mozilla.org/search/start.jsp">Talkback</a> クラッシュ報告システムについての情報。</dd> <dt><a class="external" href="http://graphs.mozilla.org/">パフォーマンストラッキング</a><br> </dt> <dd>Mozilla プロジェクトのパフォーマンス情報が見られます。</dd> <dt><a class="external" href="http://www.mozilla.org/community/developer-forums.html">開発者フォーラム</a><br> </dt> <dd>Mozilla の開発上の問題について話すことができるディスカッションフォーラムのトピック別リスト。<br> </dd> -</dl></td> </tr> </tbody> -</table> -<p> {{ languages( { "en": "en/Participating_in_the_Mozilla_project"} ) }}</p> diff --git a/files/ja/orphaned/tools/add-ons/dom_inspector/index.html b/files/ja/orphaned/tools/add-ons/dom_inspector/index.html index 1d7222b299..cf4b6916f1 100644 --- a/files/ja/orphaned/tools/add-ons/dom_inspector/index.html +++ b/files/ja/orphaned/tools/add-ons/dom_inspector/index.html @@ -26,12 +26,12 @@ original_slug: DOM_Inspector <h2 id="Documentation" name="Documentation">ドキュメンテーション</h2> <dl> - <dt><a href="/ja/DOM_Inspector/Introduction_to_DOM_Inspector" title="ja/DOM_Inspector/Introduction_to_DOM_Inspector">DOM Inspector 入門</a></dt> + <dt><a href="/ja/DOM_Inspector/Introduction_to_DOM_Inspector">DOM Inspector 入門</a></dt> <dd>DOM Inspector を始めるのに役立つガイド付きのチュートリアルです。</dd> </dl> <dl> - <dt><a href="/ja/DOM_Inspector/DOM_Inspector_FAQ" title="ja/DOM_Inspector/DOM_Inspector_FAQ">DOM Inspector FAQ</a></dt> + <dt><a href="/ja/DOM_Inspector/DOM_Inspector_FAQ">DOM Inspector FAQ</a></dt> <dd><small>DOM Inspector に関するよくある質問への解答です。</small></dd> </dl> diff --git a/files/ja/orphaned/tools/web_console/keyboard_shortcuts/index.html b/files/ja/orphaned/tools/web_console/keyboard_shortcuts/index.html deleted file mode 100644 index 1a8af01916..0000000000 --- a/files/ja/orphaned/tools/web_console/keyboard_shortcuts/index.html +++ /dev/null @@ -1,11 +0,0 @@ ---- -title: キーボードショートカット -slug: orphaned/Tools/Web_Console/Keyboard_shortcuts -translation_of: Tools/Web_Console/Keyboard_shortcuts -original_slug: Tools/Web_Console/Keyboard_shortcuts ---- -<div>{{ToolsSidebar}}</div><p>{{Page ("ja/docs/tools/Keyboard_shortcuts", "web-console")}}</p> - -<h2 id="Global_shortcuts" name="Global_shortcuts">共通ショートカット</h2> - -<p>{{Page ("ja/docs/tools/Keyboard_shortcuts", "all-toolbox-tools")}}</p> diff --git a/files/ja/orphaned/web/api/htmlorforeignelement/index.html b/files/ja/orphaned/web/api/htmlorforeignelement/index.html deleted file mode 100644 index 99197278cb..0000000000 --- a/files/ja/orphaned/web/api/htmlorforeignelement/index.html +++ /dev/null @@ -1,57 +0,0 @@ ---- -title: HTMLOrForeignElement -slug: orphaned/Web/API/HTMLOrForeignElement -tags: - - API - - HTML - - HTMLElement - - HTMLOrForeignElement - - Interface - - MathML - - MathMLElement - - Mixin - - Reference - - SVG - - SVGElement - - ミックスイン -translation_of: Web/API/HTMLOrForeignElement -original_slug: Web/API/HTMLOrForeignElement ---- -<div>{{APIRef("HTML DOM")}}{{Draft}}</div> - -<p><span class="seoSummary"><strong><code>HTMLOrForeignElement</code></strong> ミックスインは、 {{DOMxRef("HTMLElement")}}, {{DOMxRef("SVGElement")}}, {{DOMxRef("MathMLElement")}} の各インターフェイスで共通のいくつかの機能を説明します。</span>これらのインターフェイスは、もちろん、以下の列挙したものに加えたものに加えてもっと機能があります。</p> - -<div class="blockIndicator note"> -<p><strong>メモ</strong>: <code>HTMLOrForeignElement</code> はミックスインであり、インターフェイスではありません。実際に <code>HTMLOrForeignElement</code> 型のオブジェクトを生成することはできません。</p> -</div> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName("HTML WHATWG", "dom.html#htmlorsvgelement", '<code>HTMLOrForeignElement</code>')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("api.HTMLOrForeignElement")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{DOMxRef("HTMLElement")}}</li> - <li>{{DOMxRef("SVGElement")}}</li> - <li>{{DOMxRef("MathMLElement")}}</li> -</ul> diff --git a/files/ja/orphaned/web/api/navigatorconcurrenthardware/hardwareconcurrency/index.html b/files/ja/orphaned/web/api/navigatorconcurrenthardware/hardwareconcurrency/index.html deleted file mode 100644 index e325f3ee41..0000000000 --- a/files/ja/orphaned/web/api/navigatorconcurrenthardware/hardwareconcurrency/index.html +++ /dev/null @@ -1,70 +0,0 @@ ---- -title: navigator.hardwareConcurrency -slug: orphaned/Web/API/NavigatorConcurrentHardware/hardwareConcurrency -translation_of: Web/API/NavigatorConcurrentHardware/hardwareConcurrency -original_slug: Web/API/NavigatorConcurrentHardware/hardwareConcurrency ---- -<p>{{APIRef("HTML DOM")}}</p> - -<p>{{AvailableInWorkers}}</p> - -<p><code><strong>navigator.hardwareConcurrency</strong></code> はユーザーのコンピューター上でスレッドを実行するために使用可能な論理プロセッサ数を返す読み取り専用のプロパティです。</p> - -<h2 id="構文">構文</h2> - -<pre class="syntaxbox"><em>logicalProcessors</em> = window.navigator.hardwareConcurrency -</pre> - -<h2 id="値">値</h2> - -<p>論理プロセッサのコア数を示す{{jsxref("Number")}}です。</p> - -<p>現代のコンピューターはCPUに複数の物理プロセッサのコアを持っています(通常は2コアか4コア)。しかし、通常それぞれの物理コアは高度なスケジューリング技術を用いて一度に複数スレッドを実行することができます。 したがって、例えば4コアのCPUは8個の<strong>論理プロセッサコア</strong>を提供することができます。論理プロセッサのコア数は、コンテキストスイッチを必要とせずに一度に効果的に実行できるスレッドの数を測定するために使用できます。</p> - -<p>しかしながら、ブラウザはより少ない論理コア数を報告することを選択することで、一度に実行できる{{domxref("Worker")}}の数をより正確に表すことがあります。したがって、この数値をユーザーのシステムのコア数の絶対的な測定値として扱わないようにしてください。</p> - -<h2 id="例">例</h2> - -<p>この例では、ブラウザが報告した論理プロセッサごとに{{domxref("Worker")}}が1つ作られ、新しいWorkerへの参照と、そのWorkerをまだ使用しているかどうかを示すBooleanの値を含むレコードを作っています。これらのオブジェクトは後で使用するために配列に順々に格納されています。後でリクエストを処理するために使うWorkerのプールを作っています。</p> - -<pre class="brush: js">let workerList = []; - -for (let i = 0; i < window.navigator.hardwareConcurrency; i++) { - let newWorker = { - worker: new Worker('cpuworker.js'), - inUse: false - }; - workerList.push(newWorker); -}</pre> - -<h2 id="仕様">仕様</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('HTML WHATWG', '#dom-navigator-hardwareconcurrency', 'navigator.hardwareConcurrency')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>Initial definition.</td> - </tr> - </tbody> -</table> - -<h2 id="ブラウザでの実装状況">ブラウザでの実装状況</h2> - -<div> - - -<p>{{Compat("api.NavigatorConcurrentHardware.hardwareConcurrency")}}</p> -</div> - -<h2 id="関連情報">関連情報</h2> - -<ul> - <li>{{domxref("Navigator")}}</li> - <li>{{domxref("WorkerNavigator")}}</li> -</ul> diff --git a/files/ja/orphaned/web/api/navigatorconcurrenthardware/index.html b/files/ja/orphaned/web/api/navigatorconcurrenthardware/index.html deleted file mode 100644 index 43e5ae1965..0000000000 --- a/files/ja/orphaned/web/api/navigatorconcurrenthardware/index.html +++ /dev/null @@ -1,72 +0,0 @@ ---- -title: NavigatorConcurrentHardware -slug: orphaned/Web/API/NavigatorConcurrentHardware -tags: - - API - - Concurrency - - HTML DOM - - Interface - - Navigator - - NavigatorCPU - - NavigatorConcurrentHardware - - NeedsBrowserCompatibility - - NeedsTranslation - - Reference - - Threading - - Threads - - TopicStub - - WorkerNavigator - - Workers -translation_of: Web/API/NavigatorConcurrentHardware -original_slug: Web/API/NavigatorConcurrentHardware ---- -<p>{{APIRef("HTML DOM")}}</p> - -<p>The <strong><code>NavigatorConcurrentHardware</code></strong> {{Glossary("mixin")}} adds to the {{domxref("Navigator")}} interface features which allow Web content to determine how many logical processors the user has available, in order to let content and Web apps optimize their operations to best take advantage of the user's CPU.</p> - -<p>{{AvailableInWorkers}}</p> - -<p>The number of <strong>logical processor cores</strong> is a way to measure the number of threads which can effectively be run at once without them having to share CPUs. Modern computers have multiple physical cores in their CPU (two or four cores is typical), but each physical core is also usually able to run more than one thread at a time using advanced scheduling techniques. So a four-core CPU may return 8. The browser may, however, choose to reduce the number in order to represent more accurately the number of {{domxref("Worker")}}s that can run at once</p> - -<h2 id="Properties">Properties</h2> - -<dl> - <dt>{{domxref("NavigatorConcurrentHardware.hardwareConcurrency")}} {{readonlyinline}}</dt> - <dd>Returns the number of logical processors which may be available to the user agent. This value is always at least 1, and will be 1 if the actual number of logical processors can't be determined.</dd> -</dl> - -<h2 id="Methods">Methods</h2> - -<p><em>The <code>NavigatorConcurrentHardware</code></em><em> mixin has no methods.</em></p> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML WHATWG', '#navigatorconcurrenthardware', 'NavigatorConcurrentHardware')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>Initial definition.</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - - - -<p>{{Compat("api.NavigatorConcurrentHardware")}}</p> - -<h2 id="See_also">See also</h2> - -<ul> - <li>{{domxref("Navigator")}}</li> - <li>{{domxref("WorkerNavigator")}}</li> -</ul> diff --git a/files/ja/orphaned/web/api/navigatorid/appcodename/index.html b/files/ja/orphaned/web/api/navigatorid/appcodename/index.html deleted file mode 100644 index 36f09b360f..0000000000 --- a/files/ja/orphaned/web/api/navigatorid/appcodename/index.html +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: window.navigator.appCodeName -slug: orphaned/Web/API/NavigatorID/appCodeName -tags: - - DOM - - DOM_0 - - Gecko - - Gecko DOM Reference -translation_of: Web/API/NavigatorID/appCodeName -original_slug: Web/API/NavigatorID/appCodeName ---- -<div> - {{ApiRef}}</div> -<h2 id="Summary" name="Summary">概要</h2> -<p>現在のブラウザの内部 "コード" ネームを返します。</p> -<h2 id="Syntax" name="Syntax">構文</h2> -<pre class="syntaxbox"><code>codeName = window.navigator.appCodeName</code></pre> -<ul> - <li><code>codeName</code> : ブラウザの内部名を表す文字列</li> -</ul> -<h2 id="Example" name="Example">例</h2> -<pre class="brush:js">console.log(window.navigator.appCodeName); -</pre> -<h2 id="Notes" name="Notes">注記</h2> -<p>Mozilla、Netscape 6、IE5 は全て、内部名に "Mozilla" を用いています。</p> -<h2 id="Specification" name="Specification">仕様</h2> -<p>{{DOM0()}}</p> diff --git a/files/ja/orphaned/web/api/navigatorid/appname/index.html b/files/ja/orphaned/web/api/navigatorid/appname/index.html deleted file mode 100644 index 450525027b..0000000000 --- a/files/ja/orphaned/web/api/navigatorid/appname/index.html +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: window.navigator.appName -slug: orphaned/Web/API/NavigatorID/appName -tags: - - DOM - - DOM_0 - - Gecko - - Gecko DOM Reference - - 要更新 -translation_of: Web/API/NavigatorID/appName -original_slug: Web/API/NavigatorID/appName ---- -<div> - {{ApiRef}}</div> -<h2 id="Summary" name="Summary">概要</h2> -<p>ブラウザの公式な名前を返します。</p> -<h2 id="Syntax" name="Syntax">構文</h2> -<pre class="syntaxbox"><code>appName = window.navigator.appName</code></pre> -<ul> - <li><code>appName</code> は、ブラウザの名前を表す文字列です。</li> -</ul> -<h2 id="Example" name="Example">例</h2> -<pre class="brush:js">dump(window.navigator.appName); -// NS6 のコンソールに "Navigator" を出力します。 -</pre> -<h2 id="Specification" name="Specification">仕様</h2> -<p>{{DOM0}}</p> diff --git a/files/ja/orphaned/web/api/navigatorid/appversion/index.html b/files/ja/orphaned/web/api/navigatorid/appversion/index.html deleted file mode 100644 index 48436c71ca..0000000000 --- a/files/ja/orphaned/web/api/navigatorid/appversion/index.html +++ /dev/null @@ -1,65 +0,0 @@ ---- -title: NavigatorID.appVersion -slug: orphaned/Web/API/NavigatorID/appVersion -tags: - - API - - Deprecated - - NavigatorID - - Property - - Reference - - appVersion -translation_of: Web/API/NavigatorID/appVersion -original_slug: Web/API/NavigatorID/appVersion ---- -<p>{{APIRef("HTML DOM")}} {{Deprecated_Header}}</p> - -<p>"<code>4.0</code>" またはそのブラウザーのバージョン情報を表す文字列のどちらかを返します。</p> - -<div class="notecard note"> - <h4>注</h4> - <p>このプロパティがブラウザーの正しいバージョンを返すことを期待しないでください。</p> -</div> - -<h2 id="Syntax">構文</h2> - -<pre class="brush: js">window.navigator.appVersion -</pre> - -<h3 id="Returned_value">値</h3> - -<p>"<code>4.0</code>" またはそのブラウザーのバージョン情報を表す文字列のどちらかです。</p> - -<h2 id="Example">例</h2> - -<pre class="brush: js">alert("このブラウザーのバージョンは " + navigator.appVersion + " と報告されています。"); -</pre> - -<h2 id="Notes">注</h2> - -<p><code>window.navigator.userAgent</code> プロパティもバージョン番号を含んでいる場合がありますが ("<code>Mozilla/5.0 (Windows; U; Win98; en-US; rv:0.9.2) Gecko/20010725 Netscape 6/6.1</code>" など)、ユーザーエージェント文字列を変更したり、他のブラウザー、プラットフォーム、ユーザーエージェントに「偽装」したり、ブラウザーベンダー自身がこれらのプロパティに無頓着であったりすることを意識しておいてください。</p> - -<p><code>window.navigator.appVersion</code>, <code>window.navigator.appName</code>, <code>window.navigator.userAgent</code> の各プロパティは、「ブラウザー推定」 (browser sniffing) コード、すなわち使用しているブラウザーを検出し、それに従ってページを調整しようとするスクリプトで使われてきました。これにより、一部のウェブサイトから拒否されないようにするために、ブラウザーがこれらのプロパティで偽の情報を返さなければならないという現在の状況が発生したのです。</p> - -<h2 id="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML WHATWG', '#dom-navigator-appversion', - 'NavigatorID.appVersion')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("api.NavigatorID.appVersion")}}</p> diff --git a/files/ja/orphaned/web/api/navigatorid/index.html b/files/ja/orphaned/web/api/navigatorid/index.html deleted file mode 100644 index bea00f1477..0000000000 --- a/files/ja/orphaned/web/api/navigatorid/index.html +++ /dev/null @@ -1,75 +0,0 @@ ---- -title: NavigatorID -slug: orphaned/Web/API/NavigatorID -tags: - - API -translation_of: Web/API/NavigatorID -original_slug: Web/API/NavigatorID ---- -<p>{{APIRef("HTML DOM")}}</p> - -<p>The <code><strong>NavigatorID</strong></code> interface contains methods and properties related to the identity of the browser.</p> - -<p>There is no object of type <code>NavigatorID</code>, but other interfaces, like {{domxref("Navigator")}} or {{domxref("WorkerNavigator")}}, implement it.</p> - -<h2 id="Properties">Properties</h2> - -<p><em>The <code>NavigatorID</code></em><em> interface doesn't inherit any property.</em></p> - -<dl> - <dt>{{domxref("NavigatorID.appCodeName")}} {{readonlyInline}}{{deprecated_inline}}</dt> - <dd>Always returns <code>'Mozilla'</code>, on any browser. This property is kept only for compatibility purpose.</dd> - <dt>{{domxref("NavigatorID.appName")}} {{readonlyInline}} {{deprecated_inline}}</dt> - <dd>Returns the official name of the browser. Do not rely on this property to return the correct value.</dd> - <dt>{{domxref("NavigatorID.appVersion")}} {{readonlyInline}} {{deprecated_inline}}</dt> - <dd>Returns the version of the browser as a string. Do not rely on this property to return the correct value.</dd> - <dt>{{domxref("NavigatorID.platform")}} {{readonlyInline}} {{deprecated_inline}}</dt> - <dd>Returns a string representing the platform of the browser. Do not rely on this property to return the correct value.</dd> - <dt>{{domxref("NavigatorID.product")}} {{readonlyInline}} {{deprecated_inline}}</dt> - <dd>Always returns <code>'Gecko'</code>, on any browser. This property is kept only for compatibility purpose.</dd> - <dt>{{domxref("NavigatorID.userAgent")}} {{readonlyInline}}</dt> - <dd>Returns the user agent string for the current browser.</dd> -</dl> - -<h2 id="Methods">Methods</h2> - -<p><em>The </em><em><code>NavigatorID</code></em><em> interface doesn't inherit any method.</em></p> - -<dl> - <dt>{{domxref("NavigatorID.taintEnabled()")}} {{deprecated_inline()}}</dt> - <dd>Always returns <code>false</code>. JavaScript taint/untaint functions were removed in JavaScript 1.2. This method is only kept for compatibility purpose</dd> -</dl> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML WHATWG', '#navigatorid', 'NavigatorID')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>Added the <code>appCodeName</code> property and the <code>taintEnabled()</code> method, for compatibility purpose.</td> - </tr> - <tr> - <td>{{SpecName('HTML5 W3C', '#navigatorid', 'NavigatorID')}}</td> - <td>{{Spec2('HTML5 W3C')}}</td> - <td>Initial specification.</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - -<p>{{Compat("api.NavigatorID")}}</p> - -<h2 id="See_also">See also</h2> - -<ul> - <li>The {{domxref("Navigator")}} and {{domxref("WorkerNavigator")}} interfaces that implement it.</li> -</ul> diff --git a/files/ja/orphaned/web/api/navigatorid/platform/index.html b/files/ja/orphaned/web/api/navigatorid/platform/index.html deleted file mode 100644 index a369a1f12e..0000000000 --- a/files/ja/orphaned/web/api/navigatorid/platform/index.html +++ /dev/null @@ -1,66 +0,0 @@ ---- -title: NavigatorID.platform -slug: orphaned/Web/API/NavigatorID/platform -tags: - - API - - Navigator - - NavigatorID - - Property - - Reference - - platform -translation_of: Web/API/NavigatorID/platform -original_slug: Web/API/NavigatorID/platform ---- -<p>{{APIRef("HTML DOM")}}</p> - -<p>ブラウザーのプラットフォームを表す文字列を返します。仕様書ではブラウザーが常に空文字列を返すことを許可していますので、信頼できる答えを得るためにこのプロパティを頼らないようにしてください。</p> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox"><em>platform</em> = <em>navigator</em>.platform -</pre> - -<ul> - <li><code>platform</code> : 文字列 (例: "Win32" 、 "Linux i686" 、 "MacPPC" 、 "MacIntel" ...等)</li> -</ul> - -<h3 id="Value" name="Value">値</h3> - -<p>ブラウザーを実行しているプラットフォームを識別する {{domxref("DOMString")}}、あるいはブラウザーがプラットフォームの識別を断る (または識別できない) 場合は空文字列になります。<code>platform</code> は空文字列か、ブラウザーを実行しているプラットフォームを表す文字列でなければなりません。</p> - -<p>例: "<code>MacIntel</code>", "<code>Win32</code>", "<code>FreeBSD i386</code>", "<code>WebTV OS</code>"</p> - -<h2 id="Example" name="Example">例</h2> - -<pre class="brush:js">console.log(navigator.platform);</pre> - -<h2 id="Notes" name="Notes">注記</h2> - -<p>Chrome、Edge、Firefox 63 以降を含むほとんどのブラウザーは、64 ビット版の Windows で実行していても <code>"Win32"</code> を返します。Internet Explorer やバージョン 63 より前の Firefox は <code>"Win64"</code> を返します。</p> - -<p>Firefox は設定項目 <code>general.platform.override</code> で、このプロパティが返す値を上書きできます。</p> - -<h2 id="Specifications" name="Specifications">仕様</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">策定状況</th> - <th scope="col">コメント</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML WHATWG', '#dom-navigator-platform', 'NavigatorID.platform')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>初期定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> - - - -<p>{{Compat("api.NavigatorID.platform")}}</p> diff --git a/files/ja/orphaned/web/api/navigatorid/product/index.html b/files/ja/orphaned/web/api/navigatorid/product/index.html deleted file mode 100644 index 7c9649cf3d..0000000000 --- a/files/ja/orphaned/web/api/navigatorid/product/index.html +++ /dev/null @@ -1,39 +0,0 @@ ---- -title: window.navigator.product -slug: orphaned/Web/API/NavigatorID/product -tags: - - DOM - - DOM_0 - - Gecko - - Gecko DOM Reference -translation_of: Web/API/NavigatorID/product -original_slug: Web/API/NavigatorID/product ---- -<div> - {{ApiRef}}</div> -<h2 id="Summary" name="Summary">概要</h2> -<p>このプロパティは、現在のブラウザの製品名を返します。</p> -<h2 id="Syntax" name="Syntax">構文</h2> -<pre class="syntaxbox"><i>productName</i> = window.navigator.product -</pre> -<ul> - <li><code>productName</code> : 製品名を表す文字列</li> -</ul> -<h2 id="Example" name="Example">例</h2> -<pre class="brush:html"><script> -function prod() { - dt = document.getElementById("d"); - dt.innerHTML = window.navigator.product; -} -</script> - -<button onclick="prod();">product</button> -<div id="d"> </div> - -<!-- "Gecko" などの文字列が表示される --> -</pre> -<h2 id="Notes" name="Notes">注記</h2> -<p>製品名は、ユーザエージェント全体の文字列の一部(プラットフォームの直後)です。例えば、Netscape 6.1 を表すユーザエージェントでは、製品名は、"Gecko" であり、ユーザエージェント文字列全体は、次の通りです。</p> -<pre>Mozilla/5.0 (Windows; U; Win98; en-US; rv:0.9.2) Gecko/20010725 Netscape6/6.1</pre> -<h2 id="Specification" name="Specification">仕様</h2> -<p>{{DOM0}}</p> diff --git a/files/ja/orphaned/web/api/navigatorid/useragent/index.html b/files/ja/orphaned/web/api/navigatorid/useragent/index.html deleted file mode 100644 index 6fe20d0c79..0000000000 --- a/files/ja/orphaned/web/api/navigatorid/useragent/index.html +++ /dev/null @@ -1,85 +0,0 @@ ---- -title: NavigatorID.userAgent -slug: orphaned/Web/API/NavigatorID/userAgent -tags: - - API - - Deprecated - - NavigatorID - - Property - - Read-only - - Reference -translation_of: Web/API/NavigatorID/userAgent -original_slug: Web/API/NavigatorID/userAgent ---- -<p>{{ApiRef("HTML DOM")}}</p> - -<p><code><strong>NavigatorID.userAgent</strong></code> は読み取り専用のプロパティで、現在のブラウザーのユーザーエージェント文字列を返します。</p> - -<div class="note"> -<p>仕様書では、ブラウザーがこのフィールドを介して提供する情報をできるだけ少なくすることを求めています。このプロパティの値は、同じブラウザーの将来のバージョンでも同じままであると仮定してはいけません。まったく使用しないようにしたり、ブラウザーの現在のバージョンと過去のバージョンのためだけに使用するようにしてください。新しいブラウザーは、古いブラウザーと同じ UA、またはその一部を使い始めるかもしれません。ブラウザーエージェントが本当にこのプロパティによって広告されたものであるという保証は本当にありません。<br> -<br> -また、ブラウザのユーザーはこのフィールドの値を変更することができることを覚えておいてください (UA なりすまし)。</p> -</div> - -<p>ユーザーエージェント文字列の検出に基づくブラウザーの識別は<strong>信頼性が低く</strong>、ユーザーエージェント文字列はユーザーが設定可能なので<strong>推奨されません</strong>。例えば、以下のようになります。</p> - -<ul> - <li>Mozilla Suite と Firefox では、 about:config の "general.useragent.override" 設定を使うことができます。いくつかの Firefox の拡張や多機能バーでも設定可能です。</li> - <li>Opera 6 以降では、メニューからブラウザー識別文字列を設定できます。</li> - <li>Microsoft Internet Explorer では、 Windows レジストリを利用できます。</li> - <li>Safari と iCab は、メニューから、ブラウザユーザエージェントを定義済みの Internet Explorer、または、 Netscape の文字列に変更できます。</li> -</ul> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox notranslate">var <var>ua</var> = navigator.userAgent; -</pre> - -<h3 id="Value" name="Value">値</h3> - -<p>{{domxref("DOMString")}} で、ブラウザーが {{Glossary("HTTP")}} ヘッダーで提供する完全なユーザーエージェント文字列と、 {{domxref("Navigator")}} オブジェクト上のメソッドやその他の関連メソッドへのレスポンスを指定します。</p> - -<p>ユーザーエージェント文字列は形式的な構造に基づいて構築されており、いくつかの情報に分解することができます。これらの情報の各部分は、ユーザ-が設定可能な他の Navigator のプロパティから来ています。Gecko ベースのブラウザは以下の一般的な構造に準拠しています。</p> - -<pre class="notranslate">userAgent = appCodeName/appVersion number (Platform; Security; OS-or-CPU; -Localization; rv: revision-version-number) product/productSub -Application-Name Application-Name-version -</pre> - -<h2 id="Example" name="Example">例</h2> - -<pre class="brush:js notranslate">alert(window.navigator.userAgent) -// alerts "Mozilla/5.0 (Windows; U; Win98; en-US; rv:0.9.2) Gecko/20010725 Netscape6/6.1" -</pre> - -<ul> -</ul> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML WHATWG', '#dom-navigator-useragent', 'NavigatorID.userAgent')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("api.NavigatorID.userAgent")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{httpheader("User-Agent")}} HTTP ヘッダー</li> -</ul> diff --git a/files/ja/orphaned/web/api/navigatorlanguage/index.html b/files/ja/orphaned/web/api/navigatorlanguage/index.html deleted file mode 100644 index 05a2180b9f..0000000000 --- a/files/ja/orphaned/web/api/navigatorlanguage/index.html +++ /dev/null @@ -1,64 +0,0 @@ ---- -title: NavigatorLanguage -slug: orphaned/Web/API/NavigatorLanguage -tags: - - API - - HTML-DOM - - Reference -translation_of: Web/API/NavigatorLanguage -original_slug: Web/API/NavigatorLanguage ---- -<div>{{APIRef("HTML DOM")}}</div> - -<p><code><strong>NavigatorLanguage</strong></code> はナビゲーターの言語に関するメソッドやプロパティを含んでいます。</p> - -<p><code>NavigatorLanguage</code> 型のオブジェクトはありませんが、 {{domxref("Navigator")}} や {{domxref("WorkerNavigator")}} 等の他のインターフェイスが実装しています。</p> - -<h2 id="Properties" name="Properties">プロパティ</h2> - -<p><em><code>NavigatorLanguage</code> インターフェイスが継承するプロパティはありません。</em></p> - -<dl> - <dt>{{domxref("NavigatorLanguage.language")}} {{readonlyInline}}</dt> - <dd>ユーザーの推奨言語、ふつうはブラウザーの UI の言語を表す {{domxref("DOMString")}} を返します。これが分からない場合は <code>null</code> 値を返します。</dd> - <dt>{{domxref("NavigatorLanguage.languages")}} {{readonlyInline}}</dt> - <dd>ユーザーが理解できる言語を表す {{domxref("DOMString")}} の設定順の配列を返します。</dd> -</dl> - -<h2 id="Methods" name="Methods">メソッド</h2> - -<p><em><code>NavigatorLanguage</code> インターフェイスが実装・継承するメソッドはありません。</em></p> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML WHATWG', '#navigatorlanguage', 'NavigatorLanguage')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>{{SpecName('HTML5 W3C')}} のスナップショット以降、 <code>languages</code> プロパティが追加された。</td> - </tr> - <tr> - <td>{{SpecName('HTML5 W3C', '#navigatorlanguage', 'NavigatorLanguage')}}</td> - <td>{{Spec2('HTML5 W3C')}}</td> - <td>初回の仕様書。早期版の {{SpecName('HTML WHATWG')}} のスナップショット。</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの対応</h2> - -<p>{{Compat("api.NavigatorLanguage")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>このインターフェイスを実装する {{domxref("Navigator")}} インターフェイス</li> -</ul> diff --git a/files/ja/orphaned/web/api/navigatorlanguage/language/index.html b/files/ja/orphaned/web/api/navigatorlanguage/language/index.html deleted file mode 100644 index 1fd6c7b55f..0000000000 --- a/files/ja/orphaned/web/api/navigatorlanguage/language/index.html +++ /dev/null @@ -1,66 +0,0 @@ ---- -title: window.navigator.language -slug: orphaned/Web/API/NavigatorLanguage/language -tags: - - API - - Language - - NavigatorLanguage - - Property - - Read-only - - Reference -translation_of: Web/API/NavigatorLanguage/language -original_slug: Web/API/NavigatorLanguage/language ---- -<div>{{APIRef("HTML DOM")}}</div> - -<p><strong><code>NavigatorLanguage.language</code></strong> は、読み取り専用プロパティで、ユーザーの言語を表す文字列を返します。普通、ブラウザー UI の言語が返されます。</p> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox notranslate">const <em>lang</em> = navigator.language -</pre> - -<h3 id="Value" name="Value">値</h3> - -<p>{{domxref("DOMString")}}。<em><code>lang</code></em> は、<a class="external" href="https://tools.ietf.org/rfc/bcp/bcp47.txt">BCP 47</a> で定義された言語バージョンを表す文字列が格納されます。例えば、"en", "en-US", "fr", "fr-FR", "es-ES" などが含まれます。</p> - -<p>iOS 10.2 以前の Safari では、国コードは小文字で返されます: "en-us", "fr-fr"</p> - -<h2 id="Example" name="Example">例</h2> - -<pre class="brush: js notranslate">if (window.navigator.language.slice(0, 2) !== 'en') { - doLangSelect(window.navigator.language); -} -</pre> - -<h2 id="Specification" name="Specification">仕様</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様</th> - <th scope="col">ステータス</th> - <th scope="col">コメント</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML WHATWG', '#dom-navigator-language', 'NavigatorLanguage: language')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> - - - -<p>{{Compat("api.NavigatorLanguage.language")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{domxref("NavigatorLanguage.languages", "navigator.languages")}}</li> - <li>{{domxref("navigator")}}</li> -</ul> diff --git a/files/ja/orphaned/web/api/navigatorlanguage/languages/index.html b/files/ja/orphaned/web/api/navigatorlanguage/languages/index.html deleted file mode 100644 index 106a5975b2..0000000000 --- a/files/ja/orphaned/web/api/navigatorlanguage/languages/index.html +++ /dev/null @@ -1,44 +0,0 @@ ---- -title: navigator.languages -slug: orphaned/Web/API/NavigatorLanguage/languages -translation_of: Web/API/NavigatorLanguage/languages -original_slug: Web/API/NavigatorLanguage/languages ---- -<p>{{APIRef}}</p> -<h2 id="Summary" name="Summary">概要</h2> -<p><code><strong>navigator.languages</strong></code> を参照することで、ユーザの使用する言語を表すタグを取得できます。</p> -<h2 id="構文">構文</h2> -<pre class="syntaxbox">preferredLanguages = navigator.languages -</pre> -<h2 id="説明">説明</h2> -<p><code><strong>navigator.languages</strong></code> 属性を参照することで、ユーザが使用する言語の配列を取得できます。この配列は読み取り専用で、各要素は <a href="http://tools.ietf.org/html/bcp47">BCP 47</a> 言語タグです。並び順はユーザの設定した優先度順となっています。この配列の先頭にある、もっとも優先される言語タグは {{domxref("NavigatorLanguage.language","navigator.language")}} を参照することで取得できます。</p> -<p>Firefox の場合、<code><strong>navigator.languages</strong></code> 属性には、 <code>intl.accept_languages</code> の値が利用されます.</p> -<p>ユーザが言語設定を変更した場合、{{domxref("window")}} に対して <a href="/en-US/docs/Web/Reference/Events/languagechange">languagechange</a> イベントが発生します。</p> -<p>全ての HTTP リクエストの <code>Accept-Language</code> ヘッダは、<strong>qvalues</strong> (quality values) がつくことを除き、 <code><strong>navigator.languages</strong></code> と同じ値でなければなりません。 (例: <code>en-US;q=0.8</code>).</p> -<h2 id="例">例</h2> -<pre class="brush: js">navigator.language //"en-US" -navigator.languages //["en-US", "zh-CN", "ja-JP"] -</pre> -<h2 id="仕様">仕様</h2> -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{ SpecName('HTML5 Web application', '#dom-navigator-languages', 'navigator.languages') }}</td> - <td>{{ Spec2('HTML5.1') }}</td> - <td>Initial definition.</td> - </tr> - </tbody> -</table> -<h2 id="ブラウザ互換性">ブラウザ互換性</h2> -<p>{{Compat("api.NavigatorLanguage.languages")}}</p> -<h2 id="See_also" name="See_also">関連情報</h2> -<ul> - <li>{{domxref("NavigatorLanguage.language","navigator.language")}}</li> - <li>{{domxref("navigator")}}</li> - <li>{{domxref("window.onlanguagechange")}}</li> -</ul> diff --git a/files/ja/orphaned/web/api/node/getuserdata/index.html b/files/ja/orphaned/web/api/node/getuserdata/index.html deleted file mode 100644 index 8c0a07a058..0000000000 --- a/files/ja/orphaned/web/api/node/getuserdata/index.html +++ /dev/null @@ -1,67 +0,0 @@ ---- -title: Node.getUserData() -slug: orphaned/Web/API/Node/getUserData -tags: - - API - - DOM - - Method - - Node - - Obsolete - - Reference - - メソッド -translation_of: Web/API/Node/getUserData -original_slug: Web/API/Node/getUserData ---- -<div>{{APIRef("DOM")}}{{obsolete_header}}</div> - -<p><code><strong>Node.getUserData()</strong></code> メソッドは、以前 {{domxref("Node.setUserData()")}} によってノードに設定されたすべてのユーザーデータを {{domxref("DOMUserData")}} 形式で返します。</p> - -<div class="note"> -<p><code>Node.setUserData</code> および {{domxref("Node.getUserData")}} メソッドはウェブコンテンツから利用できなくなりました。 {{domxref("Element.dataset")}} または <a href="/ja/docs/JavaScript/Reference/Global_Objects/WeakMap"><code>WeakMap</code></a> を代わりに利用することができます。</p> -</div> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox"><em>userData</em> = <em>someNode</em>.getUserData(<em>userKey</em>);</pre> - -<h3 id="Parameters" name="Parameters">引数</h3> - -<ul> - <li><code>userKey</code> は指定されたノードに関連付けられた特定のデータを選択するためのキーです。指定されたノードに複数のキーが、それぞれの値を所持して割り当てられている可能性があります。</li> -</ul> - -<h2 id="Example" name="Example">例</h2> - -<pre class="brush: js">var d = document.setUserData('key', 15, null); -console.log(document.getUserData('key')); // 15</pre> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('DOM3 Core', 'core.html#Node3-getUserData', 'Node.getUserData()')}}</td> - <td>{{Spec2('DOM3 Core')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("api.Node.getUserData")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{domxref("Node.setUserData()")}}</li> - <li>{{domxref("UserDataHandler")}}</li> - <li>{{domxref("DOMUserData")}}</li> -</ul> diff --git a/files/ja/orphaned/web/api/parentnode/append/index.html b/files/ja/orphaned/web/api/parentnode/append/index.html deleted file mode 100644 index 1206957c43..0000000000 --- a/files/ja/orphaned/web/api/parentnode/append/index.html +++ /dev/null @@ -1,143 +0,0 @@ ---- -title: ParentNode.append() -slug: orphaned/Web/API/ParentNode/append -tags: - - API - - DOM - - Method - - Node - - ParentNode - - Reference -translation_of: Web/API/ParentNode/append -original_slug: Web/API/ParentNode/append ---- -<p>{{APIRef("DOM")}}</p> - -<p><strong><code>ParentNode.append()</code></strong> メソッドは、{{domxref("Node")}} オブジェクト、または {{domxref("DOMString")}} オブジェクトのセットを <code>ParentNode</code> の最後に追加します。 {{domxref("DOMString")}} オブジェクトは {{domxref("Text")}} ノードと同等に挿入されます。</p> - -<p>{{domxref("Node.appendChild()")}} との違いは次の通りです。</p> - -<ul> - <li><code>ParentNode.append()</code> は {{domxref("DOMString")}} も追加することができますが、<code>Node.appendChild()</code> は{{domxref("Node")}} オブジェクトのみを受け付けます。</li> - <li><code>ParentNode.append()</code> は戻り値を持っていませんが、<code>Node.appendChild()</code> は追加された{{domxref("Node")}} オブジェクトを返します。</li> - <li><code>ParentNode.append()</code> は複数のノードや文字列を追加することができますが、<code>Node.appendChild()</code> 一つのノードだけしか追加することができせん。</li> -</ul> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox notranslate">// [Throws, Unscopable] -ParentNode.append(...<var>nodesOrDOMStrings</var>) // returns undefined -</pre> - -<h3 id="Parameters" name="Parameters">引数</h3> - -<dl> - <dt><code>nodes</code></dt> - <dd>追加する {{domxref("Node")}} または {{domxref("DOMString")}} オブジェクトのセット</dd> -</dl> - -<h3 id="Exceptions" name="Exceptions">例外</h3> - -<ul> - <li>{{domxref("HierarchyRequestError")}}: ノードを階層の特定の箇所に追加させることができません。</li> -</ul> - -<h2 id="Examples" name="Examples">例</h2> - -<h3 id="Appending_an_element" name="Appending_an_element">要素の追加</h3> - -<pre class="brush: js notranslate">let parent = document.createElement("div") -let p = document.createElement("p") -parent.append(p) - -console.log(parent.childNodes) // NodeList [ <p> ] -</pre> - -<h3 id="Appending_text" name="Appending_text">テキストの追加</h3> - -<pre class="brush: js notranslate">let parent = document.createElement("div") -parent.append("Some text") - -console.log(parent.textContent) // "Some text"</pre> - -<h3 id="Appending_an_element_and_text" name="Appending_an_element_and_text">要素とテキストの追加</h3> - -<pre class="brush: js notranslate">let parent = document.createElement("div") -let p = document.createElement("p") -parent.append("Some text", p) - -console.log(parent.childNodes) // NodeList [ #text "Some text", <p> ]</pre> - -<h3 id="ParentNode.append_is_unscopable" name="ParentNode.append_is_unscopable">ParentNode.append() はスコープが効かない</h3> - -<p><code>append()</code> メソッドは <code>with</code> 文の中ではスコープが効きません。詳しくは {{jsxref("Symbol.unscopables")}} をご覧ください。</p> - -<pre class="brush: js notranslate">let parent = document.createElement("div") - -with(parent) { - append("foo") -} -// ReferenceError: append is not defined </pre> - -<h2 id="Polyfill">Polyfill</h2> - -<p><code>append()</code> メソッドはInternet Explorer 9 以上であれば以下のコードでポリフィルを当てることができます。</p> - -<pre class="brush: js notranslate">// Source: https://github.com/jserz/js_piece/blob/master/DOM/ParentNode/append()/append().md -(function (arr) { - arr.forEach(function (item) { - if (item.hasOwnProperty('append')) { - return; - } - Object.defineProperty(item, 'append', { - configurable: true, - enumerable: true, - writable: true, - value: function append() { - var argArr = Array.prototype.slice.call(arguments), - docFrag = document.createDocumentFragment(); - - argArr.forEach(function (argItem) { - var isNode = argItem instanceof Node; - docFrag.appendChild(isNode ? argItem : document.createTextNode(String(argItem))); - }); - - this.appendChild(docFrag); - } - }); - }); -})([Element.prototype, Document.prototype, DocumentFragment.prototype]);</pre> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('DOM WHATWG', '#dom-parentnode-append', 'ParentNode.append()')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("api.ParentNode.append")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{domxref("ParentNode")}} および {{domxref("ChildNode")}}</li> - <li>{{domxref("ParentNode.prepend()")}}</li> - <li>{{domxref("Node.appendChild()")}}</li> - <li>{{domxref("ChildNode.after()")}}</li> - <li>{{domxref("Element.insertAdjacentElement()")}}</li> - <li>{{domxref("NodeList")}}</li> -</ul> diff --git a/files/ja/orphaned/web/api/parentnode/children/index.html b/files/ja/orphaned/web/api/parentnode/children/index.html deleted file mode 100644 index 537c91d1c6..0000000000 --- a/files/ja/orphaned/web/api/parentnode/children/index.html +++ /dev/null @@ -1,93 +0,0 @@ ---- -title: ParentNode.children -slug: orphaned/Web/API/ParentNode/children -tags: - - API - - Child - - Child Nodes - - DOM - - HTMLCollection - - Node - - ParentNode - - Property - - children -translation_of: Web/API/ParentNode/children -original_slug: Web/API/ParentNode/children ---- -<div>{{ APIRef("DOM") }}</div> - -<p>{{domxref("ParentNode")}} の <strong><code>children</code></strong> プロパティは、呼び出された際のノードの子{{domxref("Element", "要素", "", 1)}}ノードをすべて含んだ動的な(生きている) {{domxref("HTMLCollection")}} を返す、読み取り専用プロパティです。</p> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox notranslate">let <em>children</em> = <var>node</var>.children;</pre> - -<h3 id="Value" name="Value">値</h3> - -<p><em><code>node</code></em> の子の DOM要素の生きている順序付きコレクションの、 {{ domxref("HTMLCollection") }} です。コレクションの {{domxref("HTMLCollection.item()", "item()")}} メソッドか、JavaScript の配列スタイルの記法を使って、コレクション内の個々の子ノードにアクセスすることができます。</p> - -<p>ノードが子要素を持たない場合、 <code>children</code> は要素を含まず、<code>length</code> は <code>0</code> です。</p> - -<h2 id="Example" name="Example">例 </h2> - -<pre class="brush: js notranslate">const foo = document.getElementById('foo'); -for (let i = 0; i < foo.children.length; i++) { - console.log(foo.children[i].tagName); -}</pre> - -<h2 id="Polyfill" name="Polyfill">Polyfill</h2> - -<pre class="brush: js notranslate">// Overwrites native 'children' prototype. -// Adds Document & DocumentFragment support for IE9 & Safari. -// Returns array instead of HTMLCollection. -;(function(constructor) { - if (constructor && - constructor.prototype && - constructor.prototype.children == null) { - Object.defineProperty(constructor.prototype, 'children', { - get: function() { - let i = 0, node, nodes = this.childNodes, children = []; - while (node = nodes[i++]) { - if (node.nodeType === 1) { - children.push(node); - } - } - return children; - } - }); - } -})(window.Node || window.Element); -</pre> - -<h2 id="Specification" name="Specification">仕様</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">仕様</th> - <th scope="col">状態</th> - <th scope="col">コメント</th> - </tr> - <tr> - <td>{{SpecName('DOM WHATWG', '#dom-parentnode-children', 'ParentNode.children')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td>初めての定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> - -<p>{{Compat("api.ParentNode.children")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{domxref("ParentNode")}} および {{domxref("ChildNode")}} インターフェイス</li> - <li> - <div class="syntaxbox">このインターフェイスを実装する次のオブジェクトタイプ。{{domxref("Document")}}、{{domxref("Element")}}、 および {{domxref("DocumentFragment")}}</div> - </li> - <li> - <div class="syntaxbox">{{domxref("Node.childNodes")}}</div> - </li> -</ul> diff --git a/files/ja/orphaned/web/api/parentnode/index.html b/files/ja/orphaned/web/api/parentnode/index.html deleted file mode 100644 index 5d1ec6c97e..0000000000 --- a/files/ja/orphaned/web/api/parentnode/index.html +++ /dev/null @@ -1,93 +0,0 @@ ---- -title: ParentNode -slug: orphaned/Web/API/ParentNode -tags: - - API - - DOM - - Finding Elements - - Finding Nodes - - Interface - - Locating Elements - - Locating Nodes - - Managing Elements - - Managing Nodes - - Mixin - - Node - - ParentNode - - Reference - - Selectors -translation_of: Web/API/ParentNode -original_slug: Web/API/ParentNode ---- -<div>{{APIRef("DOM")}}</div> - -<p><span class="seoSummary"><code><strong>ParentNode</strong></code> ミックスインは、子を持つことができるすべての型の {{domxref("Node")}} オブジェクトに特有のメソッドやプロパティを含みます。</span>これは、{{domxref("Element")}} と {{domxref("Document")}}、{{domxref("DocumentFragment")}} オブジェクトに実装されています。</p> - -<p>対象のノードや要素を見つけるために<a href="/ja/docs/Web/CSS/CSS_Selectors">CSS セレクター</a>を使用する方法について、詳しくは<a href="/ja/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors">セレクタを使用した DOM 要素の指定</a>をご覧ください。</p> - -<h2 id="Properties" name="Properties">プロパティ</h2> - -<dl> - <dt>{{domxref("ParentNode.childElementCount")}} {{readonlyInline}}</dt> - <dd>オブジェクトが持つ子の数を表す <code>unsigned long</code> 値を返します。</dd> - <dt>{{domxref("ParentNode.children")}} {{readonlyInline}}</dt> - <dd>この <code>ParentNode</code> の子であるすべての {{domxref("Element")}} 型のオブジェクトを含む実際の {{domxref("HTMLCollection")}} を返します。要素ではないノードは省きます。</dd> - <dt>{{domxref("ParentNode.firstElementChild")}} {{readonlyInline}}</dt> - <dd>この <code>ParentNode</code> の最初の子である {{domxref("Element")}} を返します。存在しない場合は <code>null</code> を返す。</dd> - <dt>{{domxref("ParentNode.lastElementChild")}} {{readonlyInline}}</dt> - <dd>この <code>ParentNode</code> の最後の子である {{domxref("Element")}} を返します。存在しない場合は <code>null</code> を返す。</dd> -</dl> - -<h2 id="Methods" name="Methods">メソッド</h2> - -<dl> - <dt>{{domxref("ParentNode.append()")}} {{experimental_inline}}</dt> - <dd><code>ParentNode</code> の最後の子の後ろに、{{domxref("Node")}} オブジェクトまたは {{domxref("DOMString")}} オブジェクトのセットを挿入します。{{domxref("DOMString")}} オブジェクトは、同等の {{domxref("Text")}} ノードとして挿入されます。</dd> - <dt>{{domxref("ParentNode.prepend()")}} {{experimental_inline}}</dt> - <dd><code>ParentNode</code> の最初の子の前に、{{domxref("Node")}} オブジェクトまたは {{domxref("DOMString")}} オブジェクトのセットを挿入します。{{domxref("DOMString")}} オブジェクトは、同等の {{domxref("Text")}} ノードとして挿入されます。</dd> - <dt>{{domxref("ParentNode.querySelector()")}}</dt> - <dd>現在の要素をルートとして、指定したセレクターのグループにマッチする最初の {{domxref("Element")}} を返します。</dd> - <dt>{{domxref("ParentNode.querySelectorAll()")}}</dt> - <dd>現在の要素をルートとして、指定したセレクターのグループにマッチする要素のリストを表す {{domxref("NodeList")}} を返します。</dd> - <dt>{{domxref("ParentNode.replaceChildren()")}}</dt> - <dd>ノードの既存の子ノードを、指定した新しい子ノードのセットに入れ替えます。</dd> -</dl> - -<h2 id="Specification" name="Specification">仕様</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状況</th> - <th scope="col">コメント</th> - </tr> - <tr> - <td>{{SpecName('DOM WHATWG', '#parentnode', 'ParentNode')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td><code>ElementTraversal</code> インターフェイスを {{domxref("ChildNode")}} と {{domxref("ParentNode")}} に分割しました。{{domxref("ParentNode.firstElementChild")}} と {{domxref("ParentNode.lastElementChild")}}、{{domxref("ParentNode.childElementCount")}} プロパティは、後者で定義されていません。<br> - {{domxref("ParentNode.children")}} プロパティが追加されました。<br> - {{domxref("ParentNode.querySelector()")}}、{{domxref("ParentNode.querySelectorAll()")}}、{{domxref("ParentNode.append()")}}、{{domxref("ParentNode.prepend()")}} メソッドが追加されました。</td> - </tr> - <tr> - <td>{{SpecName('Element Traversal', '#interface-elementTraversal', 'ElementTraversal')}}</td> - <td>{{Spec2('Element Traversal')}}</td> - <td><code>ElementTraversal</code> 基本インターフェイスにこのプロパティの初期定義が追加され、{{domxref("Element")}} で使われます。</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> - - - -<p>{{Compat("api.ParentNode")}}</p> - -<h2 id="See_also" name="See_also">関連項目</h2> - -<ul> - <li>{{domxref("ChildNode")}} 基本インターフェース。</li> - <li> - <div class="syntaxbox">このミックスインを実装したオブジェクト型: {{domxref("Document")}} と {{domxref("Element")}}、{{domxref("DocumentFragment")}}。</div> - </li> -</ul> diff --git a/files/ja/orphaned/web/api/parentnode/prepend/index.html b/files/ja/orphaned/web/api/parentnode/prepend/index.html deleted file mode 100644 index 8c6c87cede..0000000000 --- a/files/ja/orphaned/web/api/parentnode/prepend/index.html +++ /dev/null @@ -1,143 +0,0 @@ ---- -title: ParentNode.prepend() -slug: orphaned/Web/API/ParentNode/prepend -tags: - - API - - DOM - - Method - - Node - - ParentNode - - Reference - - prepend -translation_of: Web/API/ParentNode/prepend -original_slug: Web/API/ParentNode/prepend ---- -<p>{{APIRef("DOM")}}</p> - -<p><strong><code>ParentNode.prepend()</code></strong> メソッドは、{{domxref("Node")}} オブジェクトまたは {{domxref("DOMString")}} オブジェクトのセットを {{domxref("ParentNode")}} の最初の子の前に挿入します。 {{domxref("DOMString")}} オブジェクトは、同等の {{domxref("Text")}} ノードとして挿入されます。</p> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox notranslate"><em>ParentNode</em>.prepend(<em>...nodesToPrepend</em>); -</pre> - -<h3 id="Parameters" name="Parameters">引数</h3> - -<dl> - <dt><code>nodesToPrepend</code></dt> - <dd>現在 <code>ParentNode</code> にある最初の子ノードの前に挿入する1つ以上のノード。各ノードは {{domxref("Node")}} オブジェクトまたは文字列として指定できます。文字列は新しい {{domxref("Text")}} ノードとして挿入されます。</dd> -</dl> - -<h3 id="Return_value" name="Return_value">返値</h3> - -<p><code>undefined</code>.</p> - -<h3 id="Exceptions" name="Exceptions">例外</h3> - -<ul> - <li>{{domxref("HierarchyRequestError")}}: ノードを階層の特定の箇所に追加させることができません。</li> -</ul> - -<h2 id="Examples" name="Examples">例</h2> - -<h3 id="Prepending_an_element" name="Prepending_an_element">要素の前に追加</h3> - -<pre class="brush: js notranslate">var parent = document.createElement("div"); -var p = document.createElement("p"); -var span = document.createElement("span"); -parent.append(p); -parent.prepend(span); - -console.log(parent.childNodes); // NodeList [ <span>, <p> ] -</pre> - -<h3 id="Prepending_text" name="Prepending_text">テキストの前に追加</h3> - -<pre class="brush: js notranslate">var parent = document.createElement("div"); -parent.append("Some text"); -parent.prepend("Headline: "); - -console.log(parent.textContent); // "Headline: Some text"</pre> - -<h3 id="Appending_an_element_and_text" name="Appending_an_element_and_text">要素とテキストの追加</h3> - -<pre class="brush: js notranslate">var parent = document.createElement("div"); -var p = document.createElement("p"); -parent.prepend("Some text", p); - -console.log(parent.childNodes); // NodeList [ #text "Some text", <p> ]</pre> - -<h3 id="ParentNode.prepend_is_unscopable" name="ParentNode.prepend_is_unscopable">ParentNode.prepend() はスコープが効かない</h3> - -<p><code>prepend()</code> メソッドは <code>with</code> 文の中ではスコープが効きません。詳しくは {{jsxref("Symbol.unscopables")}} をご覧ください。</p> - -<pre class="brush: js notranslate">var parent = document.createElement("div"); - -with(parent) { - prepend("foo"); -} -// ReferenceError: prepend is not defined </pre> - -<h2 id="Polyfill">Polyfill</h2> - -<p><code>prepend()</code> メソッドは Internet Explorer 9 以上であれば以下のコードでポリフィルを当てることができます。</p> - -<pre class="brush: js notranslate">// Source: https://github.com/jserz/js_piece/blob/master/DOM/ParentNode/prepend()/prepend().md -(function (arr) { - arr.forEach(function (item) { - if (item.hasOwnProperty('prepend')) { - return; - } - Object.defineProperty(item, 'prepend', { - configurable: true, - enumerable: true, - writable: true, - value: function prepend() { - var argArr = Array.prototype.slice.call(arguments), - docFrag = document.createDocumentFragment(); - - argArr.forEach(function (argItem) { - var isNode = argItem instanceof Node; - docFrag.appendChild(isNode ? argItem : document.createTextNode(String(argItem))); - }); - - this.insertBefore(docFrag, this.firstChild); - } - }); - }); -})([Element.prototype, Document.prototype, DocumentFragment.prototype]);</pre> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('DOM WHATWG', '#dom-parentnode-prepend', 'ParentNode.prepend()')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("api.ParentNode.prepend")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{domxref("ParentNode")}} および {{domxref("ChildNode")}}</li> - <li>{{domxref("ParentNode.append()")}}</li> - <li>{{domxref("Node.appendChild()")}}</li> - <li>{{domxref("Node.insertBefore()")}}</li> - <li>{{domxref("ChildNode.before()")}}</li> - <li>{{domxref("Element.insertAdjacentElement()")}}</li> - <li>{{domxref("NodeList")}}</li> -</ul> diff --git a/files/ja/orphaned/web/api/parentnode/queryselectorall/index.html b/files/ja/orphaned/web/api/parentnode/queryselectorall/index.html deleted file mode 100644 index 01e307ed31..0000000000 --- a/files/ja/orphaned/web/api/parentnode/queryselectorall/index.html +++ /dev/null @@ -1,162 +0,0 @@ ---- -title: ParentNode.querySelectorAll() -slug: orphaned/Web/API/ParentNode/querySelectorAll -tags: - - API - - DOM - - Document - - Finding Elements - - Finding Nodes - - Method - - ParentNode - - Reference - - Searching Elements - - Searching Nodes - - Selectors - - querySelectorAll -translation_of: Web/API/ParentNode/querySelectorAll -original_slug: Web/API/ParentNode/querySelectorAll ---- -<div>{{ApiRef("DOM")}}</div> - -<p>{{domxref("ParentNode")}} ミックスインは <code><strong>querySelectorAll()</strong></code> メソッドを定義しており、メソッド呼び出しの時点でそのオブジェクトの子孫にあたる要素のうち、一連のセレクターに一致するもののリストを示す {{domxref("NodeList")}} を返します。</p> - -<p>単一の結果のみが必要な場合は、代わりに {{domxref("ParentNode.querySelector", "querySelector()")}} メソッドを使用することを検討してください。</p> - -<div class="note"> -<p><strong>メモ:</strong> このメソッドは {{domxref("Element.querySelectorAll()")}}, {{domxref("Document.querySelectorAll()")}}, {{domxref("DocumentFragment.querySelectorAll()")}} として実装されています。</p> -</div> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox"><var>elementList</var> = <em>parentNode</em>.querySelectorAll(<var>selectors</var>); -</pre> - -<h3 id="Parameters" name="Parameters">引数</h3> - -<dl> - <dt><code>selectors</code></dt> - <dd>マッチのための 1 つまたは複数のセレクターを含む {{domxref("DOMString")}}。この文字列は妥当な <a href="/ja/docs/Web/CSS/CSS_Selectors">CSS セレクター</a>でなければならず、そうでない場合は <code>SyntaxError</code> 例外がスローされます。セレクターの仕様と要素の識別の詳細は、<a href="/ja/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors">セレクターを使用した DOM 要素の指定</a>を参照してください。複数のセレクターを指定する際は、カンマで区切ります。</dd> -</dl> - -<div class="note"> -<p><strong>メモ:</strong> 標準の CSS 構文の一部ではない文字は、バックスラッシュ文字を使ってエスケープしなければなりません。 JavaScript でもバックスラッシュによるエスケープが使われているため、これらの文字を使った文字列リテラルを記述する際は、特に注意する必要があります。詳細は {{anch("Escaping special characters")}} を参照してください。</p> -</div> - -<h3 id="Return_value" name="Return_value">返値</h3> - -<p>生きていない {{domxref("NodeList")}} で、指定されたセレクターの1つ以上に一致する子孫ノード1つに対して1つずつの {{domxref("Element")}} を含みます。</p> - -<div class="note"> -<p><strong>メモ:</strong> 指定された <code>selectors</code> が <a href="/ja/docs/Web/CSS/Pseudo-elements">CSS 擬似要素</a>を含む場合、返されるリストは常に空になります。</p> -</div> - -<h3 id="Exceptions" name="Exceptions">例外</h3> - -<dl> - <dt><code>SyntaxError</code></dt> - <dd>指定された <code>selectors</code> の構文が妥当ではない。</dd> -</dl> - -<h2 id="Examples" name="Examples">例</h2> - -<p>文書内のすべての {{HTMLElement("p")}} 要素の {{domxref("NodeList")}} を入手します。</p> - -<pre class="brush: js">var matches = document.querySelectorAll("p");</pre> - -<p>次の例では、文書内にある <code>note</code> または <code>alert</code> のいずれかのクラスを持つ、すべての {{HTMLElement("div")}} 要素のリストを返します。</p> - -<pre class="brush: js">var matches = document.querySelectorAll("div.note, div.alert"); -</pre> - -<p>次に、 <code>test</code> という ID を持つコンテナ内に位置し、直接の親要素が <code>highlighted</code> クラスを持つ {{HTMLElement("div")}} である、<code><p></code> 要素のリストを取得します。</p> - -<pre class="brush: js">var container = document.querySelector("#test"); -var matches = container.querySelectorAll("div.highlighted > p");</pre> - -<p>次の例では<a href="/ja/docs/Web/CSS/Attribute_selectors">属性セレクター</a>を使用しており、 <code>data-src</code> という名前の属性を持つ、文書内の {{HTMLElement("iframe")}} 要素のリストを返します。</p> - -<pre class="brush: js">var matches = document.querySelectorAll("iframe[data-src]");</pre> - -<p>次の例では、ID が <code>userlist</code> の要素の中にあり、<code>data-active</code> 属性を持ち、その値が <code>1</code> であるリスト項目のリストを返すため、属性セレクターが使用されています。</p> - -<pre class="brush: js">var container = document.querySelector("#userlist"); -var matches = container.querySelectorAll("li[data-active=1]");</pre> - -<h2 id="User_notes" name="User_notes">ユーザーのメモ</h2> - -<p>querySelectorAll() は、最も一般的な JavaScript DOM ライブラリと異なる動作を持ち、意図しない結果をもたらすことがあります。</p> - -<h3 id="HTML">HTML</h3> - -<p>次の、入れ子になった 3 つの {{HTMLElement("div")}} ブロックを持つ HTML について検討します。</p> - -<pre class="brush: html"><div class="outer"> - <div class="select"> - <div class="inner"> - </div> - </div> -</div></pre> - -<h3 id="JavaScript">JavaScript</h3> - -<pre class="brush: js">var select = document.querySelector('.select'); -var inner = select.querySelectorAll('.outer .inner'); -inner.length; // 1 です。0 ではありません! -</pre> - -<p>この例では、<code>select</code> class を持つ <code><div></code> の文脈で <code>.outer .inner</code> を選択するとき、<code>.outer</code> が基準となる要素(<code>.select</code> で検索される)の子孫ではないにもかかわらず、<code>.inner</code> class を持つ要素が見つけられています。<code>querySelectorAll()</code> はデフォルトでは、セレクターの最後の要素が検索スコープに含まれているかどうかのみ検証します。</p> - -<p>{{cssxref(":scope")}} 擬似クラスを使うと、基準となる要素の子孫だけが一致するようになり、期待される挙動を取り戻すことができます。</p> - -<pre class="brush: js">var select = document.querySelector('.select'); -var inner = select.querySelectorAll(':scope .outer .inner'); -inner.length; // 0</pre> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName("DOM WHATWG", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}</td> - <td>{{Spec2("DOM WHATWG")}}</td> - <td>Living standard</td> - </tr> - <tr> - <td>{{SpecName("Selectors API Level 2", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}</td> - <td>{{Spec2("Selectors API Level 2")}}</td> - <td>変更なし</td> - </tr> - <tr> - <td>{{SpecName("DOM4", "#dom-parentnode-queryselectorall", "ParentNode.querySelectorAll()")}}</td> - <td>{{Spec2("DOM4")}}</td> - <td>初回定義</td> - </tr> - <tr> - <td>{{SpecName("Selectors API Level 1", "#interface-definitions", "document.querySelector()")}}</td> - <td>{{Spec2("Selectors API Level 1")}}</td> - <td>元の定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("api.ParentNode.querySelectorAll")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li><a href="/ja/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors">セレクターを使用した DOM 要素の指定</a></li> - <li><a href="/ja/docs/Code_snippets/QuerySelector"><code>querySelector()</code> のコードスニペット</a></li> - <li>CSS ガイドの<a href="/ja/docs/Web/CSS/Attribute_selectors">属性セレクター</a></li> - <li>MDN 学習エリアの<a href="/ja/docs/Learn/CSS/Introduction_to_CSS/Attribute_selectors">属性セレクター</a></li> - <li>メソッドは {{domxref("Element.querySelectorAll()")}}, {{domxref("Document.querySelectorAll()")}}, {{domxref("DocumentFragment.querySelectorAll()")}} で利用可能です</li> -</ul> diff --git a/files/ja/orphaned/web/css/conic-gradient()/index.html b/files/ja/orphaned/web/css/conic-gradient()/index.html deleted file mode 100644 index d030c33b9d..0000000000 --- a/files/ja/orphaned/web/css/conic-gradient()/index.html +++ /dev/null @@ -1,268 +0,0 @@ ---- -title: conic-gradient() -slug: orphaned/Web/CSS/conic-gradient() -tags: - - CSS - - CSS 画像 - - CSS 関数 - - Reference - - ウェブ - - グラデーション - - グラフィック - - レイアウト -translation_of: Web/CSS/conic-gradient() -original_slug: Web/CSS/conic-gradient() ---- -<div>{{CSSRef}}</div> - -<p><strong><code>conic-gradient()</code></strong> は <a href="/ja/docs/Web/CSS">CSS</a> の関数で、 (中心から広がるのではなく) 中心点の周りを回りながら色が変化する放射グラデーションから成る画像を生成します。扇型グラデーションの例としては、円グラフや色相環などがあります。 <code>conic-gradient()</code> 関数の結果は {{CSSxRef("<gradient>")}} データ型のオブジェクトであり、これは {{CSSxRef("<image>")}} の特殊型です。</p> - -<div>{{EmbedInteractiveExample("pages/css/function-conic-gradient.html")}}</div> - -<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> - -<p>他のグラデーションと同様、扇形グラデーションは<a href="/ja/docs/CSS/image#no_intrinsic">固有の寸法を持ちません</a>。つまり、自然の寸法や推奨される寸法、推奨される縦横比もありません。固有の寸法は適用先の要素の寸法、または要素の寸法以外で設定された <code><image></code> の寸法に一致します。</p> - -<p>繰り返して360度の回転を埋める扇形グラデーションを生成するには、代わりに {{CSSxRef("repeating-conic-gradient")}} 関数を使用してください。</p> - -<p>g</p> - -<p><code><gradient></code> は <code><image></code> データ型に属するため、 <code><image></code> が使用できるところでしか使用できません。このため、 <code>conic-gradient()</code> は {{CSSxRef("background-color")}} や、その他の {{CSSxRef("<color>")}} データ型を使用するプロパティでは動作しません。</p> - -<div class="blockIndicator note"> -<p>なぜ "conic" (円錐の) グラデーションと呼ばれるのか。色経由点が一方よりもう一方が明るい場合、上から見た円錐のように見えるからです。</p> -</div> - -<h2 id="Understanding_conic_gradients" name="Understanding_conic_gradients">扇型グラデーションの理解</h2> - -<p>扇形グラデーションの構文は放射グラデーションの構文と似ていますが、色経由点はグラデーションの中心から現れるグラデーションライン上ではなく、グラデーションアーク、すなわち円周上に配置されます。扇形グラデーションでは、色の遷移は円の中心を回るように、上から始まって時計回りに行われます。放射グラデーションでは、色の遷移は楕円の中心から外に向けて、すべての方向に行われます。</p> - -<p><img alt="扇形グラデーションの円周と放射グラデーションの軸に沿った色経由点" src="https://mdn.mozillademos.org/files/16361/Screenshot_2018-11-29_21.09.19.png" style="height: 258px; width: 515px;"></p> - -<p>扇形グラデーションは、回転角度とグラデーションの中心を指定し、色停止点のリストを指定して指定します。<a href="/ja/docs/Web/CSS/length">長さ</a>を指定して色停止点を配置する線形グラデーションや放射グラデーションとは異なり、扇形グラデーションの色停止点は角度を指定します。単位には<a href="/ja/docs/Web/CSS/angle">度</a>を表す <code>deg</code>、グラデーションを表す <code>grad</code>、ラジアンを表す <code>rad</code>、回転数を表す <code>turn</code> があります。1つの円は360度、400グラデーション、2πラジアン、1回転になります。扇形グラデーションに対応しているブラウザーはパーセント値も受け付けており、100%は360度に相当しますが、これは仕様にはありません。</p> - -<p>放射グラデーションと同様に、扇形グラデーションの構文では、グラデーションの中心を画像内のどこにでも、あるいは画像の外側にでも配置することができます。位置の値は、 2 値の背景位置の構文に似ています。</p> - -<p>グラデーション円弧は、グラデーションのの円周です。グラデーションまたは円弧の<em>始点</em>は北、つまり12時の方向です。そして、グラデーションは <em>from</em> の角度だけ回転します。グラデーションの色は、角度のついた色停止点、それらの開始点、終了点、および、その間、および、任意の角度のついた色停止点によって決定されます。色間の遷移は、隣接する色の色停止点の間のカラーヒントで変更することができます。</p> - -<h3 id="Customizing_gradients" name="Customizing_gradients">グラデーションのカスタマイズ</h3> - -<p>By adding more angled color-stop points on the gradient arc, you can create a highly customized transition between multiple colors. A color-stop's position can be explicitly defined by using an {{CSSxRef("<angle>")}}. If you don't specify the location of a color stop, it is placed halfway between the one that precedes it and the one that follows it. If you don't specify an angle for the first or last color stop, their values are 0deg and 360deg respectively. The following two gradients are equivalent</p> - -<pre class="brush: css notranslate">conic-gradient(red, orange, yellow, green, blue); -conic-gradient(red 0deg, orange 90deg, yellow 180deg, green 270deg, blue 360deg);</pre> - -<p>By default, colors transition smoothly from the color at one color stop to the color at the subsequent color stop, with the midpoint between the colors being the half way point between the color transition. You can move this color transition midpoint to any point between two color stops by adding a color hint, indicating where the middle of the color transition should be. The following is solid red from the start to the 10% mark, transitions from red to blue over 80% of the turn, with the final 10% being solid blue. The midpoint of the red to blue gradient change, however, is at the 20% mark rather than the 50% mark as would have happened without the 80grad, or 20%, color hint.</p> - -<pre class="brush: css notranslate">conic-gradient(red 40grad, 80grad, blue 360grad);</pre> - -<p>If two or more color stops are at the same location, the transition will be a hard line between the first and last colors declared at that location. To use conic gradients to create pie charts --- which is NOT the correct way to create pie charts as background images are not accessible -- use hard color stops, where the color stop angles for two adjacent color stops are the same. The easiest way to do this is to use multip position colors stops. The following two declarations are equivalent:</p> - -<pre class="brush: css notranslate">conic-gradient(#fff 0.09turn, #bbb 0.09turn, #bbb 0.27turn, #666 0.27turn, #666 0.54turn, #000 0.54turn); -conic-gradient(#fff 0turn 0.09turn, #bbb 0.09turn 0.27turn, #666 0.27turn 0.54turn, #000 0.54turn 1turn);</pre> - -<p>Color stops should be listed in ascending order. Subsequent color stops of lower value will override the value of the previous color stop creating a hard transition. The following changes from red to yellow at the 30% mark, and then transitions from yellow to blue over 35% of the gradient</p> - -<pre class="brush: css notranslate">conic-gradient(red .8rad, yellow .6rad, blue 1.3rad); -</pre> - -<p>There are other effects you can create with conic gradients. Oddly, a checkerboard is one of them. By creating quadrants with an upper left and lower right white quadrant and lower left and upper right black quadrants, then repeating the gradient 16 times (four times across and four times down) you can make a checkerboard.</p> - -<pre class="brush: css notranslate">conic-gradient(#fff 90deg, #000 0.25turn 0.5turn, #fff 1rad 1.5rad, #000 300grad); -background-size: 25% 25%; -</pre> - -<p>And, yes, you can mix and match different angle units, but don't. The above is hard to read.</p> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="language-css notranslate" id="css">/* 45度回転した扇形グラデーション、 - 青で始まり赤で終わる */ -conic-gradient(from 45deg, blue, red); - -/* A a bluish purple box: the gradient goes from blue to red, - but as only the bottom right quadrant is visible, as the - center of the conic gradient is in at the top left corner */ -conic-gradient(from 90deg at 0 0, blue, red); - -/* 色相環 */ -background: conic-gradient( - hsl(360, 100%, 50%), - hsl(315, 100%, 50%), - hsl(270, 100%, 50%), - hsl(225, 100%, 50%), - hsl(180, 100%, 50%), - hsl(135, 100%, 50%), - hsl(90, 100%, 50%), - hsl(45, 100%, 50%), - hsl(0, 100%, 50%) -);</pre> - -<h3 id="Values" name="Values">値</h3> - -<dl> - <dt>{{CSSxRef("<angle>")}}</dt> - <dd>Preceded by the <code>from</code> keyterm, and taking an angle as its value, defines the gradient rotation in clockwise direction.</dd> - <dt><code><position></code></dt> - <dd>Using the same length, order and keyterm values as the <a href="/en-US/docs/Web/CSS/background-position">background-position</a> property, the position defines center of the gradient. If omitted, the default value is <code>center</code>, meaing the gradient will be centered, .</dd> - <dt><code><angular-color-stop></code></dt> - <dd>A color-stop's {{CSSxRef("<color>")}} value, followed by one or two optional stop positions, (an {{CSSxRef("<angle>")}} along the gradient's circumference axis).</dd> - <dt><code><color-hint></code></dt> - <dd>Th color-hint is an interpolation hint defining how the gradient progresses between adjacent color stops. The length defines at which point between two color stops the gradient color should reach the midpoint of the color transition. If omitted, the midpoint of the color transition is the midpoint between two color stops.</dd> - <dd> - <div class="note"> - <p><strong>Note:</strong> Rendering of <a href="#Gradient_with_multiple_color_stops">color stops in CSS gradients</a> follows the same rules as color stops in <a href="/en-US/docs/Web/SVG/Tutorial/Gradients">SVG gradients</a>.</p> - </div> - </dd> -</dl> - -<h3 id="Formal_syntax" name="Formal_syntax">形式文法</h3> - -<pre class="syntaxbox notranslate">conic-gradient( - [ from <angle> ]? [ at <position> ]?, <angular-color-stop-list> ) - \---------------------------------/ \----------------------------/ - Gradient definition List of color stops - -where <angular-color-stop-list> = [ <angular-color-stop> [, <angular-color-hint>]? ]# , <angular-color-stop> - and <angular-color-stop> = <color> && <color-stop-angle>? - and <angular-color-hint> = <angle-percentage> - and <color-stop-angle> = <angle-percentage>{1,2}</pre> - -<h2 id="Examples" name="Examples">例</h2> - -<div> -<h3 id="Gradient_at_a_40-degrees" name="Gradient_at_a_40-degrees">40度のグラデーション</h3> - -<div class="hidden"> -<pre class="brush: css notranslate">div { - width: 100px; - height: 100px; -}</pre> - -<pre class="brush: html notranslate"><div></div> -</pre> -</div> - -<pre class="brush: css notranslate">div { - background-image: - conic-gradient(from 40deg, #fff, #000); -} -</pre> - -<p>{{EmbedLiveSample("Gradient_at_40-degrees", 120, 120)}}</p> -</div> - -<div> -<h3 id="Off-centered_gradient" name="Off-centered_gradient">中心をずらしたグラデーション</h3> - -<div class="hidden"> -<pre class="brush: css notranslate">div { - width: 100px; - height: 100px; -}</pre> - -<pre class="brush: html notranslate"><div></div> -</pre> -</div> - -<pre class="brush: css notranslate">div { - background: conic-gradient(from 0deg at 0% 25%, blue, green, yellow 180deg); -}</pre> - -<p>{{EmbedLiveSample("Off-centered_gradient", 120, 120)}}</p> -</div> - -<div> -<h3 id="Gradient_pie-chart" name="Gradient_pie-chart">グラデーションの円グラフ</h3> - -<p>This example uses multi-position color stops, with adjacent colors having the same color stop value, creating a striped effect.</p> - -<div class="hidden"> -<pre class="brush: css notranslate">div { - width: 100px; - height: 100px; -}</pre> - -<pre class="brush: html notranslate"><div></div> -</pre> -</div> - -<pre class="brush: css notranslate">div { - background: conic-gradient( - red 36deg, orange 36deg 170deg, yellow 170deg); - border-radius: 50% -}</pre> - -<p>{{EmbedLiveSample("Gradient_pie-chart", 120, 120)}}</p> -</div> - -<div> -<h3 id="Checkerboard">Checkerboard</h3> - -<div class="hidden"> -<pre class="brush: css notranslate">div { - width: 100px; - height: 100px; -}</pre> - -<pre class="brush: html notranslate"><div></div> -</pre> -</div> - -<pre class="brush: css notranslate">div { - background: - conic-gradient(#fff 0.25turn, #000 0.25turn 0.5turn, #fff 0.5turn 0.75turn, #000 0.75turn) - top left / 25% 25% repeat; - border: 1px solid; -}</pre> - -<p>{{EmbedLiveSample("Checkerboard", 120, 120)}}</p> -</div> - -<div class="note"> -<p><strong>注:</strong> 他の例は <a href="/ja/docs/Web/CSS/CSS_Images/Using_CSS_gradients">CSS グラデーションの使用</a> をご覧ください。</p> -</div> - -<h2 id="Acessibility_Concerns" name="Acessibility_Concerns">アクセシビリティの考慮事項</h2> - -<p>Browsers do not provide any special information on background images to assistive technology. This is important primarily for screen readers, as a screen reader will not announce its presence and therefore convey nothing to its users. While it is possible to create pie charts, checkerboards, and other effects with conic gradients, CSS images provide no native way to assign alternative text, and therefore the image represented by the conic gradient will not be accessible to screen reader users. If the image contains information critical to understanding the page's overall purpose, it is better to describe it semantically in the document.</p> - -<ul> - <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG/Perceivable#Guideline_1.1_%E2%80%94_Providing_text_alternatives_for_non-text_content">MDN Understanding WCAG, Guideline 1.1 explanations</a></li> - <li><a href="https://www.w3.org/TR/2016/NOTE-UNDERSTANDING-WCAG20-20161007/text-equiv-all.html">Understanding Success Criterion 1.1.1 | W3C Understanding WCAG 2.0</a></li> -</ul> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('CSS4 Images', '#conic-gradients', 'conic-gradient()')}}</td> - <td>{{Spec2('CSS4 Images')}}</td> - <td></td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<div>{{Compat("css.types.image.gradient.conic-gradient")}}</div> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li><a href="/ja/docs/Web/CSS/CSS_Images/Using_CSS_gradients">CSS グラデーションの使用</a></li> - <li>他のグラデーション関数: {{CSSxRef("repeating-conic-gradient")}}, {{CSSxRef("linear-gradient")}}, {{CSSxRef("repeating-linear-gradient")}}, {{CSSxRef("radial-gradient")}}, {{CSSxRef("repeating-radial-gradient")}}</li> - <li>{{cssxref("<image>")}}</li> - <li>{{cssxref("_image","image()")}}</li> - <li>{{cssxref("element()")}}</li> - <li>{{cssxref("image-set","image-set()")}}</li> - <li>{{cssxref("cross-fade")}}</li> -</ul> diff --git a/files/ja/orphaned/web/css/image-set()/index.html b/files/ja/orphaned/web/css/image-set()/index.html deleted file mode 100644 index 1e8e370e2a..0000000000 --- a/files/ja/orphaned/web/css/image-set()/index.html +++ /dev/null @@ -1,86 +0,0 @@ ---- -title: image-set() -slug: orphaned/Web/CSS/image-set() -tags: - - CSS - - CSS Function - - CSS-4 Images - - Function - - Reference - - Web -translation_of: Web/CSS/image-set() -original_slug: Web/CSS/image-set() ---- -<div>{{cssref}}</div> - -<p class="summary"><strong><code>image-set()</code></strong> は <a href="/ja/docs/Web/CSS">CSS</a> の<a href="/ja/docs/Web/CSS/CSS_Functions">関数</a>表記で、主に高密度の画面において、指定されたセットから最も適切な CSS 画像をブラウザーに選択させる方法です。</p> - -<p>解像度と帯域は端末やネットワークアクセスによって様々です。 <code>image-set()</code> 関数は、画像オプションのセットを提供して — それぞれが解像度の宣言に関連付けられ — ブラウザーが端末および設定にもっともふさわしいものを選択することで、ユーザーの端末にもっとも適切な解像度の画像を配信します。解像度はファイルサイズのプロキシとして使用することができます。 — 高い密度の画面で遅いモバイル接続を使用しているユーザーエージェントは、高解像度の画面の読み込みを待つよりも、低解像度の画像を受信したほうが良いかもしれません。</p> - -<p><code>image-set()</code> はそれぞれのユーザーが必要なことを判断するのではなく、オプションを提供することができます。</p> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox notranslate">image-set() = image-set( <image-set-option># ) -where <image-set-option> = [ <image> | <string> ] <resolution> and - <string> is an <url> -</pre> - -<h3 id="Values" name="Values">値</h3> - -<p>もっともよく見かけるのは <code>url()</code> または <code><string></code> 値ですが、 <code><a href="/ja/docs/Web/CSS/image"><image></a></code> は画像セット以外のあらゆる画像型を取ることができます。 <code>image-set()</code> 関数は他の <code>image-set()</code> 関数の中に入れることはできません。</p> - -<p><code><a href="/ja/docs/Web/CSS/resolution"><resolution></a></code> の単位には、ピクセル当たりのドット数を表す <code>x</code> または <code>dppx</code>、インチ当たりのドット数を表す <code>dpi</code>、センチメートル当たりのドット数を表す <code>dpcm</code> があります。 <code>image-set()</code> の中の画像はすべて、固有の解像度が必要です。</p> - -<h2 id="Examples" name="Examples">例</h2> - -<h3 id="Using_image-set_to_provide_alternative_background-image_options" name="Using_image-set_to_provide_alternative_background-image_options">image-set() を使用して代替の background-image オプションを提供する</h3> - -<pre class="brush: css notranslate">background-image: image-set( "cat.png" 1x, - "cat-2x.png" 2x, - "cat-print.png" 600dpi);</pre> - -<p>この例は <code><a class="css" href="https://drafts.csswg.org/css-images-4/#funcdef-image-set" id="ref-for-funcdef-image-set⑨">image-set()</a></code> の使い方を示しており、 {{cssxref("background-image")}} のオプションとして、必要な解像度に応じて2つの異なる画像、通常版と高解像度版を選択する方法を示しています。</p> - -<h2 id="Accessibility_concerns" name="Accessibility_concerns">アクセシビリティの考慮</h2> - -<p>ブラウザーは支援技術に対して、背景画像についての特別な情報を何も提供しません。これは主に読み上げソフトにとって重要であり、読み上げソフトは背景画像が存在することをアナウンスせず、したがってユーザーには何も伝えられません。もし画像がページ全体の目的を理解するのに重要な情報を含んでいる場合は、文書中に意味的に記述するようにしてください。</p> - -<ul> - <li><a href="/ja/docs/Web/Accessibility/Understanding_WCAG/Perceivable#Guideline_1.1_%E2%80%94_Providing_text_alternatives_for_non-text_content">MDN Understanding WCAG, Guideline 1.1 explanations</a></li> - <li><a class="external external-icon" href="https://www.w3.org/TR/2016/NOTE-UNDERSTANDING-WCAG20-20161007/text-equiv-all.html" rel="noopener">Understanding Success Criterion 1.1.1 | W3C Understanding WCAG 2.0</a></li> -</ul> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th>仕様書</th> - <th>状態</th> - <th>備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('CSS4 Images', '#image-set-notation', 'The image-set() notation')}}</td> - <td>{{Spec2('CSS4 Images')}}</td> - <td></td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("css.types.image.image-set")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{cssxref("image")}}</li> - <li>{{cssxref("_image", "image()")}}</li> - <li>{{cssxref("element")}}</li> - <li>{{cssxref("url")}}</li> - <li>{{cssxref("<gradient>")}}</li> - <li>{{cssxref("cross-fade")}}</li> -</ul> diff --git a/files/ja/orphaned/web/css/linear-gradient()/index.html b/files/ja/orphaned/web/css/linear-gradient()/index.html deleted file mode 100644 index a5659d4660..0000000000 --- a/files/ja/orphaned/web/css/linear-gradient()/index.html +++ /dev/null @@ -1,217 +0,0 @@ ---- -title: linear-gradient() -slug: orphaned/Web/CSS/linear-gradient() -tags: - - CSS - - CSS 画像 - - CSS 関数 - - Reference - - Web - - ウェブ - - グラフィック - - レイアウト -translation_of: Web/CSS/linear-gradient() -original_slug: Web/CSS/linear-gradient() ---- -<div>{{CSSRef}}</div> - -<p><a href="/ja/docs/Web/CSS">CSS</a> の <strong><code>linear-gradient()</code></strong> 関数は、二つ以上の色の間で、連続的な直線の変化から構成される画像を生成します。結果は {{CSSxRef("<gradient>")}} データ型のオブジェクトであり、これは {{CSSxRef("<image>")}} の特殊型です。</p> - -<div>{{EmbedInteractiveExample("pages/css/function-linear-gradient.html")}}</div> - -<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> - -<p>他のグラデーションと同様、線形グラデーションは<a href="/ja/docs/CSS/image#no_intrinsic">固有の寸法を持ちません</a>。つまり、画像本来の寸法や、優先されるアスペクト比を持たないということです。実際の寸法は、適用先の要素の寸法と一致します。</p> - -<p>繰り返して領域を埋め尽くす線形グラデーションを生成するには、代わりに {{CSSxRef("repeating-linear-gradient")}} プロパティを使用してください。</p> - -<p><code><gradient></code> は CSS の <code><image></code> データ型に所属しますので、 <code><image></code> が使用できるところでのみ使用できます。このため、 <code>linear-gradient</code> は {{CSSxRef("background-color")}} や、その他の {{CSSxRef("<color>")}} を要求するプロパティでは動作しません。</p> - -<h2 id="Composition_of_a_linear_gradient" name="Composition_of_a_linear_gradient">線形グラデーションの構成</h2> - -<p>線形グラデーションは、グラデーションライン (Gradient line) と呼ばれる軸によって定義されます。軸上の各点にはそれぞれ違った色が割り当てられます。なめらかなグラデーションを作成するために、 <code>linear-gradient()</code> 関数はグラデーションラインと直行した線を、グラデーションライン上の交点の色で連続して引きます。</p> - -<p><img alt="linear-gradient.png" src="/files/3537/linear-gradient.png" style="float: left; height: 383px; width: 309px;"></p> - -<p>グラデーションラインは、グラデーション画像を含むボックスの中心と、角度によって定義されます。グラデーションの色は、開始点 (Starting point)、 <em>終了点</em> (Ending point) と、省略可能な色経由点 (color-stop point) の各点でそれぞれ定義されます。</p> - -<p>開始点は、グラデーションラインの最初の色が始まる点です。終了点は最後の色が終わるところです。これらの点は、グラデーションラインとそれに直交し、ボックスの同一象限にあるコーナーを通る直線との交点によって定義されます。ただ、もっと簡単に、ボックスの中心を原点としたときの開始点の点対称な位置としても定義できます。こうした何だかややこしい開始点と終了点の定義が、<em>マジックコーナー</em>と呼ばれることのある興味深いプロパティを生みました。開始点と終了点に近いコーナーは、それぞれ開始点と終了点と同じ色を持ちます。</p> - -<h3 id="Customizing_Gradients" name="Customizing_Gradients">グラデーションのカスタマイズ</h3> - -<p>グラデーションラインに色経由点を追加することで、開始点と終了点の間で高度にカスタマイズした変化を作成することができます。色経由点は {{CSSxRef("<length>")}} や {{CSSxRef("<percentage>")}} データ型を使って、明示的に定義することができます。もし場所を定義しなかったときは、直前の点と直後の点の中間点になります。以下の二つのグラデーションは等価です。</p> - -<pre class="brush: css notranslate">linear-gradient(red, orange, yellow, green, blue); -linear-gradient(red 0%, orange 25%, yellow 50%, green 75%, blue 100%);</pre> - -<p>ある色経由点の色から次の色経由点の色まで滑らかに色が変化し、色と色の中間点は、既定では色の変化の中間の位置になります。色の変化の中間点をどこに置くかを示すために、二つの色の間でラベルのない % の色ヒントを追加することで、色の中間点を二つの色経由点の間の任意の位置に移動することができます。次の例では、純粋な赤を先頭から10%の位置まで、純粋な青を90%の位置から末尾までに配置します。10%から90%までの間は、赤から青への色変化ですが、色ヒントがない30%があるので、変化の中間点は50%の位置ではなく30%の位置になります。</p> - -<pre class="brush: css notranslate">linear-gradient(red 10%, 30%, blue 90%);</pre> - -<p>2つ以上の色経由点が同じ位置である場合、その位置で宣言された最初と最後の色の間で明確な線になります。</p> - -<p>色経由点は昇順に並べてください。次の色経由点がより小さな値になると、以前の色経由点を上書きすることになり、急な変化になります。以下の例は30%が赤から黄へ変化し、黄から青への変化がその上でグラデーションの35%になります。</p> - -<pre class="brush: css notranslate">linear-gradient(red 40%, yellow 30%, blue 65%); -</pre> - -<p>複数位置の色経由点が利用できます。 CSS 宣言の中で二つの位置を含めることで、二つの隣り合う色経由点として色を宣言することができます。</p> - -<pre class="brush: css notranslate">linear-gradient(red 0%, orange 10%, orange 30%, yellow 50%, yellow 70%, green 90%, green 100%); -linear-gradient(red, orange 10% 30%, yellow 50% 70%, green 90%); -linear-gradient(red 0%, orange 10% 30%, yellow 50% 70%, green 90% 100%);</pre> - -<p>既定では、0%の経由点に色がない場合、宣言されている最初の色がその場所の色になります。同様に、最後の色経由点に位置が宣言されていない場合は、最後の色が100%の位置まで続くか、100%の位置の色になります。</p> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="language-css notranslate" id="css">/* 45度に傾いたグラデーションで、 - 青から始まり赤で終わる */ -linear-gradient(45deg, blue, red); - -/* 右下から左上に向かうグラデーションで、 - 青から始まり赤で終わる */ -linear-gradient(to left top, blue, red); - -/* 色経由点: 下から上に向かうグラデーションで、 - 青から始まり、長さの40%ののところで緑になり、 - 赤で終わる */ -linear-gradient(0deg, blue, green 40%, red); - -/* 色ヒント: 左から右に向かうグラデーションで、 - 赤から始まり、グラデーションの長さ全体の - 10%に中間点が来て、残りの90%の長さをかけて - 青色に変わる */ -linear-gradient(.25turn, red, 10%, blue); - -/* 複数位置の色経由点: 45度傾いたグラデーションで、 - 左下半分が赤で右上半分が青、 - 赤から青への変化は明確な線 */ -linear-gradient(45deg, red 0 50%, blue 50% 100%);</pre> - -<h3 id="Values" name="Values">値</h3> - -<dl> - <dt><code><side-or-corner></code></dt> - <dd>グラデーションラインの開始点の位置。指定する場合は、 <code>to</code> に続けて2つ以下のキーワードから成ります。一つは水平方向の辺 (<code>left</code> または <code>right</code>)、もう一方は垂直方向の辺 (<code>top</code> または <code>bottom</code>) です。辺を表すキーワードは順不同です。指定しない場合は、 <code>to bottom</code> が既定になります。</dd> - <dd><code>to top</code>, <code>to bottom</code>, <code>to left</code>, <code>to right</code> の値は、 <code>0deg</code>, <code>180deg</code>, <code>270deg</code>, <code>90deg</code>, の角度にそれぞれ対応します。他の値は角度に変換されます。</dd> - <dt>{{CSSxRef("<angle>")}}</dt> - <dd>グラデーションラインの方向を角度で示します。 <code>0deg</code> の値は <code>to top</code> と等価で、値が増加するとそこから時計回りに回ります。</dd> - <dt><code><linear-color-stop></code></dt> - <dd>色経由点の {{CSSxRef("<color>")}} の値であり、任意でその後に停止位置を指定します(グラデーションの軸に沿った {{CSSxRef("<percentage>")}} または {{CSSxRef("<length>")}} の位置)。</dd> - <dt><code><color-hint></code></dt> - <dd>color-hint は、隣り合う色経由点の間でどのようにグラデーションが進むかを定義する補間のヒントです。長さによって、どの位置で二つの色経由点のグラデーション色が色の移行の中間点に達するかを定義します。省略された場合、色の移行の中間点は二つの色経由点の中点になります。</dd> - <dd> - <div class="note"> - <p><strong>メモ:</strong> <a href="#Gradient_with_multiple_color_stops">CSS グラデーションにおける色経由点</a>の描画は、 <a href="/ja/docs/Web/SVG/Tutorial/Gradients">SVG グラデーション</a>と同じ規則に従います。</p> - </div> - </dd> -</dl> - -<h3 id="Formal_syntax" name="Formal_syntax">形式文法</h3> - -<pre class="syntaxbox notranslate">linear-gradient( - [ <a href="/ja/CSS/angle"><angle></a> | to <side-or-corner> ,]? <color-stop-list> ) - \---------------------------------/ \----------------------------/ - Definition of the gradient line List of color stops - -where <side-or-corner> = [ left | right ] || [ top | bottom ] - and <color-stop-list> = [ <linear-color-stop> [, <color-hint> ]? ]#, <linear-color-stop> - and <linear-color-stop> = <color> [ <color-stop-length> ]? - and <color-stop-length> = [ <percentage> | <length> ]{1,2} - and <color-hint> = [ <percentage> | <length> ]</pre> - -<h2 id="Examples" name="Examples">例</h2> - -<h3 id="Gradient_at_a_45-degree_angle" name="Gradient_at_a_45-degree_angle">45 度 のグラデーション</h3> - -<div class="hidden"> -<pre class="brush: css notranslate">body { - width: 100vw; - height: 100vh; -}</pre> -</div> - -<pre class="brush: css notranslate">body { - background: linear-gradient(45deg, red, blue); -} -</pre> - -<p>{{EmbedLiveSample("Gradient_at_a_45-degree_angle", 120, 120)}}</p> - -<h3 id="Gradient_that_starts_at_60_of_the_gradient_line" name="Gradient_that_starts_at_60_of_the_gradient_line">グラデーションラインの60%から始まるグラデーション</h3> - -<div class="hidden"> -<pre class="brush: css notranslate">body { - width: 100vw; - height: 100vh; -}</pre> -</div> - -<pre class="brush: css notranslate">body { - background: linear-gradient(135deg, orange, orange 60%, cyan); -}</pre> - -<p>{{EmbedLiveSample("Gradient_that_starts_at_60_of_the_gradient_line", 120, 120)}}</p> - -<h3 id="Gradient_with_multi-position_color_stops" name="Gradient_with_multi-position_color_stops">複数の位置の色経由点があるグラデーション</h3> - -<p>この例は複数の位置の色経由点を使用しており、隣り合う色に同じ色経由値があるため、縞模様の効果になります。</p> - -<div class="hidden"> -<pre class="brush: css notranslate">body { - width: 100vw; - height: 100vh; -}</pre> -</div> - -<pre class="brush: css notranslate">body { - background: linear-gradient(to right, - red 20%, orange 20% 40%, yellow 40% 60%, green 60% 80%, blue 80%); -}</pre> - -<p>{{EmbedLiveSample("Gradient_with_multi-position_color_stops", 120, 120)}}</p> - -<div class="note"> -<p><strong>メモ:</strong> 他の例は <a href="/ja/docs/Web/CSS/CSS_Images/Using_CSS_gradients">CSS グラデーションの使用</a>を参照してください。</p> -</div> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('CSS4 Images', '#color-stop-syntax', 'Gradient Color-Stops')}}</td> - <td>{{Spec2('CSS4 Images')}}</td> - <td>補間のヒントを追加。</td> - </tr> - <tr> - <td>{{SpecName('CSS3 Images', '#linear-gradients', 'linear-gradient()')}}</td> - <td>{{Spec2('CSS3 Images')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<div>{{Compat("css.types.image.gradient.linear-gradient")}}</div> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li><a href="/ja/docs/Web/CSS/CSS_Images/Using_CSS_gradients">CSS グラデーションの利用</a></li> - <li>他のグラデーション関数: {{CSSxRef("repeating-linear-gradient")}}, {{CSSxRef("radial-gradient")}}, {{CSSxRef("repeating-radial-gradient")}}</li> - <li>{{CSSxRef("<image>")}}</li> - <li>{{cssxref("element()")}}</li> - <li>{{cssxref("_image","image()")}}</li> - <li>{{cssxref("image-set","image-set()")}}</li> - <li>{{cssxref("cross-fade")}}</li> -</ul> diff --git a/files/ja/orphaned/web/css/paint()/index.html b/files/ja/orphaned/web/css/paint()/index.html deleted file mode 100644 index 9f29cb31e3..0000000000 --- a/files/ja/orphaned/web/css/paint()/index.html +++ /dev/null @@ -1,113 +0,0 @@ ---- -title: paint() -slug: orphaned/Web/CSS/paint() -tags: - - CSS - - CSS Function - - CSS 関数 - - CSS4-images - - Houdini - - Reference - - Web - - ウェブ -translation_of: Web/CSS/paint() -original_slug: Web/CSS/paint() ---- -<div>{{CSSRef}}{{SeeCompatTable}}</div> - -<p><strong><code>paint()</code></strong> は <a href="/en-US/docs/Web/CSS">CSS</a> の関数で、 PaintWorklet で生成された {{cssxref("<image>")}} の値を定義します。</p> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox">paint(<var>workletName</var>, <var>parameters</var>)</pre> - -<p>凡例</p> - -<dl> - <dt><var>workletName</var></dt> - <dd>登録された Worklet の名前です。</dd> - <dt><var>parameters</var></dt> - <dd>PaintWorklet へ渡される省略可能な追加の引数です。</dd> -</dl> - -<h2 id="Examples" name="Examples">例</h2> - -<p>CSS の paint() 関数で追加の引数を渡すことができます。この例では、二つの引数を渡しています。リストアイテムのグループの背景画像が塗りつぶしか輪郭線だけかと、輪郭線の太さです。</p> - -<pre class="brush: html hidden"><ul> - <li>item 1</li> - <li>item 2</li> - <li>item 3</li> - <li>item 4</li> - <li>item 5</li> - <li>item 6</li> - <li>item 7</li> - <li>item 8</li> - <li>item 9</li> - <li>item 10</li> - <li>item 11</li> - <li>item 12</li> - <li>item 13</li> - <li>item 14</li> - <li>item 15</li> - <li>item 16</li> - <li>item 17</li> - <li>item 18</li> - <li>item 19</li> - <li>item 20</li> -</ul></pre> - -<pre class="brush: js hidden"> CSS.paintWorklet.addModule('https://mdn.github.io/houdini-examples/cssPaint/intro/worklets/hilite.js'); -</pre> - -<pre class="brush: css">li { - --boxColor: hsla(55, 90%, 60%, 1.0); - background-image: paint(hollowHighlights, stroke, 2px); -} - -li:nth-of-type(3n) { - --boxColor: hsla(155, 90%, 60%, 1.0); - background-image: paint(hollowHighlights, filled, 3px); -} - -li:nth-of-type(3n+1) { - --boxColor: hsla(255, 90%, 60%, 1.0); - background-image: paint(hollowHighlights, stroke, 1px); -}</pre> - -<p>boxColor を定義しているセレクターブロックにカスタムプロパティを設定しました。カスタムプロパティは PaintWorklet にアクセスすることができます。</p> - -<p>{{EmbedLiveSample("Examples", 300, 300)}}</p> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('CSS Painting API', '#paint-notation', 'Paint Notation')}}</td> - <td>{{Spec2('CSS Painting API')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("css.types.image.paint")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{domxref('PaintWorklet')}}</li> - <li>{{domxref('CSS Painting API')}}</li> - <li><a href="/ja/docs/Web/API/CSS_Painting_API/Guide">CSS Painting API の使用</a></li> - <li>{{cssxref("<image>")}}</li> - <li>{{domxref("canvas")}}</li> -</ul> diff --git a/files/ja/orphaned/web/css/radial-gradient()/index.html b/files/ja/orphaned/web/css/radial-gradient()/index.html deleted file mode 100644 index c2caff4bc1..0000000000 --- a/files/ja/orphaned/web/css/radial-gradient()/index.html +++ /dev/null @@ -1,173 +0,0 @@ ---- -title: radial-gradient() -slug: orphaned/Web/CSS/radial-gradient() -tags: - - CSS - - CSS Function - - CSS Images - - Function - - Graphics - - Layout - - Reference - - Web - - gradient -translation_of: Web/CSS/radial-gradient() -original_slug: Web/CSS/radial-gradient() ---- -<div>{{CSSRef}}</div> - -<p><a href="/ja/docs/Web/CSS">CSS</a> の <strong><code>radial-gradient()</code></strong> 関数は、二つ以上の色の連続的な移行が原点から放射状に広がる画像を生成します。形状は円形になったり楕円形になったりします。関数の結果は {{cssxref("<gradient>")}} データ型のオブジェクトであり、これは {{cssxref("<image>")}} の特殊形です。</p> - -<div>{{EmbedInteractiveExample("pages/css/function-radial-gradient.html")}}</div> - -<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="brush: css no-line-numbers notranslate">/* コンテナーの中央にあるグラデーション、 - 赤で始まり、青へ変わり、緑で終わる */ -radial-gradient(circle at center, red 0, blue, green 100%)</pre> - -<h3 id="Values" name="Values">値</h3> - -<dl> - <dt>{{cssxref("<position>")}}</dt> - <dd>グラデーションの位置で、 {{cssxref("background-position")}} や {{cssxref("transform-origin")}} と同じ方法で解釈されます。指定されなかった場合、既定値は <code>center</code> です。</dd> - <dt><code><shape></code></dt> - <dd>グラデーションの形状です。値は <code>circle</code> (つまり、グラデーションの形状が一定の半径の円) か <code>ellipse</code> (つまり、軸に沿った楕円) のいずれかです。指定されなかった場合、既定値は <code>ellipse</code> です。</dd> - <dt><code><extent-keyword></code></dt> - <dd>終端の形状の大きさを指定するキーワードです。利用可能な値は次の通りです。 - <table class="standard-table"> - <thead> - <tr> - <th>キーワード</th> - <th>説明</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>closest-side</code></td> - <td>グラデーションの終端の形状は、中心から最も近いボックスの辺に (circle の場合) または中心から最も近い縦の辺と横の辺に (ellipse の場合) 内接します。</td> - </tr> - <tr> - <td><code>closest-corner</code></td> - <td>グラデーションの終端の形状は、ボックスの中心から最も近い頂点に接するように大きさが調整されます。</td> - </tr> - <tr> - <td><code>farthest-side</code></td> - <td><code>closest-side</code> と同様ですが、終端の形状がその中心から最も遠い辺 (または縦と横の辺) に接するように大きさが調整される点が異なります。</td> - </tr> - <tr> - <td><code>farthest-corner</code></td> - <td>既定値で、グラデーションの終端の形状は、ボックスの中心から最も遠い頂点に接するように大きさが調整されます。</td> - </tr> - </tbody> - </table> - - <div class="note"> - <p><strong>注:</strong> この関数の初期の実装では、他のキーワード (<code>cover</code> および <code>contain</code>) をそれぞれ標準の <code>farthest-corner</code> および <code>closest-side</code> の別名として含めていました。実装によってはすでに古い形を外しているので、標準のキーワードのみを使用してください。</p> - </div> - </dd> - <dt><code><linear-color-stop></code></dt> - <dd>色経由点の {{cssxref("<color>")}} 値と、それに続く1つまたは2つの省略可能な経由位置 (グラデーション軸沿いの {{cssxref("<percentage>")}} または {{cssxref("<length>")}}) です。 percentage が <code>0%</code>、または length が <code>0</code> の場合は、グラデーションの中心を表します。 <code>100%</code> は終端の形状と仮想グラデーションレイの交点を表します。その間のパーセント値はグラデーションレイにおける直線的な位置です。</dd> - <dt><code><color-hint></code></dt> - <dd>color-hint は、隣り合う色経由点の間でどのようにグラデーションが進むかを定義する補間のヒントです。長さによって、どの位置で二つの色経由点のグラデーション色が色の移行の中間点に達するかを定義します。省略された場合、色の移行の中間点は二つの色経由点の中点になります。</dd> -</dl> - -<h2 id="Description" name="Description">解説</h2> - -<p>他のグラデーションと同様、放射グラデーションは<a href="/ja/docs/CSS/image#no_intrinsic">固有の寸法を持ちません</a>。つまり、自然の寸法や推奨される寸法、推奨される縦横比もありません。具体的な寸法は、適用先の要素の寸法に一致します。</p> - -<p>繰り返してコンテナーを埋める放射グラデーションを生成するには、代わりに {{cssxref("repeating-radial-gradient")}} 関数を使用してください。</p> - -<p><code><gradient></code> は <code><image></code> データ型に属するため、 <code><image></code> が使用できるところでしか使用できません。このため、 <code>radial-gradient()</code> は {{cssxref("background-color")}} や、その他の {{cssxref("<color>")}} データ型を使用するプロパティでは動作しません。</p> - -<h3 id="放射グラデーションの構成">放射グラデーションの構成</h3> - -<p><img alt="" src="/files/3795/radial%20gradient.png" style="float: left; height: 176px; width: 396px;">放射グラデーションは<em>中心位置</em>、<em>最終的な形状</em>、および二つ以上の<em>色経由点</em>で定義されます。</p> - -<p>滑らかなグラデーションを生成するために、 <code>radial-gradient()</code> 関数は中央から<em>最終的な形状</em> (およびその先) に向けて一連の同心円の形状を描きます。最終的な形状は円または楕円です。</p> - -<p>色経由点は、中心から右方向に水平に延びる<em>仮想的なグラデーション光</em>の上に配置されます。色経由点の位置を決めるパーセンテージは、最終的な形状とこのグラデーションレイの交点を <code>100%</code> としたときの相対値です。各形状は単色で、色は交差したグラデーション光の色によって定義されます。</p> - -<h2 id="Examples" name="Examples">例</h2> - -<h3 id="Simple_gradient" name="Simple_gradient">シンプルなグラデーション</h3> - -<div class="hidden"> -<pre class="brush: html notranslate"><div class="radial-gradient"></div> -</pre> - -<pre class="brush: css notranslate">.radial-gradient { - width: 240px; - height: 120px; -}</pre> -</div> - -<pre class="brush: css notranslate">.radial-gradient { - background-image: radial-gradient(cyan 0%, transparent 20%, salmon 40%); -} </pre> - -<p>{{EmbedLiveSample('Simple_gradient', 120, 120)}}</p> - -<h3 id="Non-centered_gradient" name="Non-centered_gradient">中央から外れたグラデーション</h3> - -<div class="hidden"> -<pre class="brush: html notranslate"><div class="radial-gradient"></div> -</pre> - -<pre class="brush: css notranslate">.radial-gradient { - width: 240px; - height: 120px; -}</pre> -</div> - -<pre class="brush: css notranslate">.radial-gradient { - background-image: radial-gradient(farthest-corner at 40px 40px, - #f35 0%, #43e 100%); -}</pre> - -<p>{{EmbedLiveSample('Non-centered_gradient', 240, 120)}}</p> - -<h3 id="More_radial-gradient_examples" name="More_radial-gradient_examples">他の radial-gradient の例</h3> - -<p>他の例は <a href="/ja/docs/Web/CSS/CSS_Images/Using_CSS_gradients">CSS グラデーションの使用</a>を参照してください。</p> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('CSS3 Images', '#radial-gradients', 'radial-gradients()')}}</td> - <td>{{Spec2('CSS3 Images')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<div>{{Compat("css.types.image.gradient.radial-gradient")}}</div> - -<h3 id="Quantum_CSS_notes" name="Quantum_CSS_notes">Quantum CSS のメモ</h3> - -<p>Gecko は <code>radial-gradient(circle gold,red)</code> のような放射グラデーションが動きそうで、 <code>circle</code> と <code>gold</code> との間にカンマがないので動作しないというバグを持っていました。また、 {{cssxref("calc")}} 式が <code>radial-gradient()</code> 関数の半径の部分に使用されると、弾かれて — 値が無効になって — いました ({{bug(1376019)}})。 Firefox の新しいパラレル CSS エンジン (<a href="https://wiki.mozilla.org/Quantum">Quantum CSS</a> または <a href="https://wiki.mozilla.org/Quantum/Stylo">Stylo</a> とも呼ばれ、 Firefox 57 でリリース) は、これらのバグを修正しています。</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li><a href="/ja/docs/Web/CSS/CSS_Images/Using_CSS_gradients">CSS グラデーションの利用</a></li> - <li>他のグラデーション関数: {{cssxref("repeating-radial-gradient")}}, {{cssxref("linear-gradient")}}, {{cssxref("repeating-linear-gradient")}}, {{cssxref("conic-gradient")}}, {{cssxref("repeating-conic-gradient")}}</li> - <li>{{cssxref("<image>")}}</li> - <li>{{cssxref("_image","image()")}}</li> - <li>{{cssxref("element()")}}</li> - <li>{{cssxref("image-set","image-set()")}}</li> - <li>{{cssxref("cross-fade")}}</li> -</ul> diff --git a/files/ja/orphaned/web/css/repeating-linear-gradient()/index.html b/files/ja/orphaned/web/css/repeating-linear-gradient()/index.html deleted file mode 100644 index 0a7f158327..0000000000 --- a/files/ja/orphaned/web/css/repeating-linear-gradient()/index.html +++ /dev/null @@ -1,165 +0,0 @@ ---- -title: repeating-linear-gradient() -slug: orphaned/Web/CSS/repeating-linear-gradient() -tags: - - CSS - - CSS 画像 - - CSS 関数 - - Reference - - ウェブ - - グラフィック - - レイアウト -translation_of: Web/CSS/repeating-linear-gradient() -original_slug: Web/CSS/repeating-linear-gradient() ---- -<div>{{CSSRef}}</div> - -<p><a href="/ja/docs/Web/CSS">CSS</a> の <code>repeating-linear-gradient()</code> 関数は、反復線形グラデーションによる画像を生成します。 {{cssxref("linear-gradient")}} と似ており、同じ引数を取りますが、両方向に無限に色経由点を繰り返してコンテナー全体を埋めます。関数の返値は {{cssxref("<gradient>")}} データ型のオブジェクトであり、これは {{cssxref("<image>")}} の特殊型です。</p> - -<div>{{EmbedInteractiveExample("pages/css/function-repeating-linear-gradient.html")}}</div> - -<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> - -<p>繰り返すグラデーションの長さは、最初の色経由点と最後の色経由点の間の距離です。最初の色に color-stop-length がない場合、 color-stop-length の既定値は 0 になります。それぞれの繰り返しにおいて、色経由点の位置は基本的な線形グラデーションの長さの倍数だけずらしたものになります。この結果、グラデーションの最初と最後の色は常に隣り合わせになります。二つが異なる色であれば、視覚的に明確な変わり目ができるでしょう。これは最初の色を最後の色として再び使用することで修正することができます。</p> - -<p>他のグラデーションと同じく、線形反復グラデーションも<a href="/ja/docs/CSS/image#no_intrinsic">固有の寸法を持ちません</a>。つまり、本来の寸法も優先される寸法も、優先されるアスペクト比も持たないということです。実際の寸法は、適用先の要素の寸法と一致します。</p> - -<p><code><gradient></code> は CSS の <code><image></code> データ型に所属しますので、 <code><image></code> が使用できるところでのみ使用できます。このため、 <code>repeating-linear-gradient()</code> は {{CSSxRef("background-color")}} や、その他の {{CSSxRef("<color>")}} を要求するプロパティでは動作しません。</p> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="brush: css no-line-numbers notranslate">/* 45度方向に軸を延ばし、青で始め赤で終わり、 - 3回繰り返す反復グラデーション */ -repeating-linear-gradient(45deg, blue, red 33.3%); - -/* 右下から左上に延び、青で始め赤で終わり、 - 20px ごとに繰り返す反復グラデーション */ -repeating-linear-gradient(to left top, blue, red 20px); - -/* 下から上に延び、青で始め、 40% から緑になり、赤で終わる - グラデーション。最後の色経由点が既定で 100% なので、 - グラデーションは繰り返されない */ -repeating-linear-gradient(0deg, blue, green 40%, red); - -/* 5回繰り返し、左から右に、赤で始まり、緑に変わり、 - 赤に戻るグラデーション */ -repeating-linear-gradient(to right, red 0%, green 10%, red 20%); -</pre> - -<h3 id="Values" name="Values">値</h3> - -<dl> - <dt><code><side-or-corner></code></dt> - <dd>グラデーション線の開始点の位置。指定する場合は、 <code>to</code> に続けて2つ以下のキーワードを指定します。一つは水平方向の辺 (<code>left</code> または <code>right</code>)、もう一方は垂直方向の辺 (<code>top</code> または <code>bottom</code>) です。辺を表すキーワードは順不同です。指定しない場合は、 <code>to bottom</code> が既定になります。</dd> - <dd><code>to top</code>, <code>to bottom</code>, <code>to left</code>, <code>to right</code> の値は、 <code>0deg</code>, <code>180deg</code>, <code>270deg</code>, <code>90deg</code> の角度にそれぞれ対応します。他の値は角度に変換されます。</dd> - <dt>{{cssxref("<angle>")}}</dt> - <dd>グラデーション線の方向を角度で示します。 <code>0deg</code> の値は <code>to top</code> と等価で、値が増加するとそこから時計回りに回ります。</dd> - <dt><code><linear-color-stop></code></dt> - <dd>色経由点の {{CSSxRef("<color>")}} の値であり、任意でその後に停止位置を指定します(グラデーションの軸に沿った {{CSSxRef("<percentage>")}} または {{CSSxRef("<length>")}} の位置)。 <code>0%</code> のパーセント値または <code>0</code> の長さは、グラデーションの先頭を表します。 <code>100%</code> の値は画像の寸法の 100% であり、つまりグラデーションは反復されません。</dd> - <dt><code><color-hint></code></dt> - <dd>color-hint は、隣り合う色経由点の間でどのようにグラデーションが進むかを定義する補間のヒントです。長さによって、どの位置で二つの色経由点のグラデーション色が色の移行の中間点に達するかを定義します。省略された場合、色の移行の中間点は二つの色経由点の中点になります。</dd> - <dd> - <div class="note"> - <p><strong>メモ:</strong> <a href="#Gradient_with_multiple_color_stops">CSS グラデーションにおける色経由点</a>の描画は、 <a href="/ja/docs/Web/SVG/Tutorial/Gradients">SVG グラデーション</a>と同じ規則に従います。</p> - </div> - </dd> -</dl> - -<h3 id="Formal_syntax" name="Formal_syntax">形式文法</h3> - -<pre class="syntaxbox notranslate">repeating-linear-gradient( [ <a href="/ja/CSS/angle"><angle></a> | to <side-or-corner> ,]? <color-stop-list> ) - \---------------------------------/ \---------------/ - Definition of the gradient line List of color stops - -where <side-or-corner> = [left | right] || [top | bottom] - and <color-stop-list> = [ <linear-color-stop> [, <color-hint>? ]? ]#, <linear-color-stop> - and <linear-color-stop> = <color> [ <color-stop-length> ]? - and <color-stop-length> = [ <percentage> | <length> ]{1,2} - and <color-hint> = [ <percentage> | <length> ] -</pre> - -<h2 id="Examples" name="Examples">例</h2> - -<h3 id="Zebra_stripes" name="Zebra_stripes">縞模様</h3> - -<div class="hidden"> -<pre class="brush: css notranslate">body { - width: 100vw; - height: 100vh; -}</pre> -</div> - -<pre class="brush: css notranslate">body { - background-image: repeating-linear-gradient(-45deg, - transparent, - transparent 20px, - black 20px, - black 40px); - /* 複数の色経由点の位置 */ - background-image: repeating-linear-gradient(-45deg, - transparent 0 20px, - black 20px 40px); -} -</pre> - -<p>{{EmbedLiveSample('Zebra_stripes', 120, 120)}}</p> - -<h3 id="Ten_repeating_horizontal_bars" name="Ten_repeating_horizontal_bars">10回繰り返す水平線</h3> - -<div class="hidden"> -<pre class="brush: css notranslate">body { - width: 100vw; - height: 100vh; -}</pre> -</div> - -<pre class="brush: css notranslate">body { - background-image: repeating-linear-gradient(to bottom, - rgb(26,198,204), - rgb(26,198,204) 7%, - rgb(100,100,100) 10%); -} -</pre> - -<p>{{EmbedLiveSample('Ten_repeating_horizontal_bars', 120, 120)}}</p> - -<p>最後の色経由点が10%であり、グラデーションが垂直なので、反復グラデーション内の各グラデーションは10%の高さになり、10本の水平線に相当します。</p> - -<div class="note"> -<p><strong>メモ:</strong> 他の例は <a href="/ja/docs/Web/CSS/CSS_Images/Using_CSS_gradients">CSS グラデーションの使用</a>を参照してください。</p> -</div> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('CSS3 Images', '#repeating-gradients', 'repeating-linear-gradient()')}}</td> - <td>{{Spec2('CSS3 Images')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの対応</h2> - -<div>{{Compat("css.types.image.gradient.repeating-linear-gradient")}}</div> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li><a href="/en-US/docs/Web/CSS/CSS_Images/Using_CSS_gradients">CSS グラデーションの使用</a></li> - <li>他のグラデーション関数: {{cssxref("linear-gradient")}}, {{cssxref("radial-gradient")}}, {{cssxref("repeating-radial-gradient")}}, {{cssxref("conic-gradient")}}, {{cssxref("repeating-conic-gradient")}}</li> - <li>{{cssxref("<image>")}}</li> - <li>{{cssxref("_image","image()")}}</li> - <li>{{cssxref("element()")}}</li> - <li>{{cssxref("image-set","image-set()")}}</li> - <li>{{cssxref("cross-fade")}}</li> -</ul> diff --git a/files/ja/orphaned/web/css/repeating-radial-gradient()/index.html b/files/ja/orphaned/web/css/repeating-radial-gradient()/index.html deleted file mode 100644 index a28cc76903..0000000000 --- a/files/ja/orphaned/web/css/repeating-radial-gradient()/index.html +++ /dev/null @@ -1,185 +0,0 @@ ---- -title: repeating-radial-gradient() -slug: orphaned/Web/CSS/repeating-radial-gradient() -tags: - - CSS - - CSS 画像 - - CSS 関数 - - Reference - - ウェブ - - グラデーション - - グラフィック - - レイアウト -translation_of: Web/CSS/repeating-radial-gradient() -original_slug: Web/CSS/repeating-radial-gradient() ---- -<div>{{CSSRef}}</div> - -<p><a href="/ja/docs/Web/CSS">CSS</a> の <strong><code>repeating-radial-gradient()</code></strong> 関数は、原点から広がり繰り返すグラデーションから成る画像を生成します。 {{cssxref("radial-gradient")}} と似ており、同じ引数を取りますが、 {{cssxref("repeating-linear-gradient")}} と同様にすべての方向に色経由点を無限に繰り返してコンテナー全体を埋めます。関数の返値は {{cssxref("<gradient>")}} データ型のオブジェクトであり、これは {{cssxref("<image>")}} の特殊型です。</p> - -<div>{{EmbedInteractiveExample("pages/css/function-repeating-radial-gradient.html")}}</div> - -<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> - -<p>それぞれの繰り返しにおいて、色経由点の位置は基本的な放射グラデーションの寸法 (最初と最後の色経由点の間の距離) の倍数だけずらしたものになります。この結果、グラデーションの最初と最後の色は常に隣り合わせになります。二つが異なる色であれば、視覚的に明確な変わり目ができるので、最初の色を最後の色として繰り返すことで緩和できます。</p> - -<p>他のグラデーションと同じく、放射反復グラデーションも<a href="/ja/docs/CSS/image#no_intrinsic">固有の寸法を持ちません</a>。つまり、本来の寸法も優先される寸法も、優先されるアスペクト比も持たないということです。実際の寸法は、適用先の要素の寸法と一致します。</p> - -<p><code><gradient></code> は <code><image></code> データ型に属するため、 <code><image></code> が使用できるところでしか使用できません。このため、 <code>repeating-radial-gradient()</code> は {{cssxref("background-color")}} や、その他の {{cssxref("<color>")}} データ型を使用するプロパティでは動作しません。</p> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="brush: css no-line-numbers notranslate">/* コンテナーの中央からのグラデーションで、 - 赤で始まり、青に変化し、緑で終わり、 - それぞれ 30px ごとに色が繰り返される */ -repeating-radial-gradient(circle at center, red 0, blue, green 30px); - -/* 左上の角付近の楕円形のグラデーションで、 - 赤で始まり、緑に変化し、また戻り、 - 中央と右下の角の間で5回繰り返され、 - 中央と左上の角の間は1回だけ */ -repeating-radial-gradient(farthest-corner at 20% 20%, red 0, green, red 20%); -</pre> - -<h3 id="Values" name="Values">値</h3> - -<dl> - <dt>{{cssxref("<position>")}}</dt> - <dd>グラデーションの位置で、 {{cssxref("background-position")}} や {{cssxref("transform-origin")}} と同じ方法で解釈されます。指定されなかった場合、既定値は <code>center</code>です。</dd> - <dt><code><shape></code></dt> - <dd>グラデーションの形状です。 <code>circle</code> (グラデーションの形状が一定の半径の円の意味) か <code>ellipse</code> (軸に沿った楕円の意味) のいずれかです。指定されなかった場合、既定値は <code>ellipse</code> です。</dd> - <dt><code><extent-keyword></code></dt> - <dd>終端の形状の大きさを指定するキーワードです。利用可能な値は次の通りです。</dd> - <dd> - <table class="standard-table"> - <tbody> - <tr> - <th>キーワード</th> - <th>説明</th> - </tr> - <tr> - <td><code>closest-side</code></td> - <td>グラデーションの終端の形状は、中心から最も近いボックスの辺に (circle の場合) または中心から最も近い縦の辺と横の辺に (ellipse の場合) 内接します。</td> - </tr> - <tr> - <td><code>closest-corner</code></td> - <td>グラデーションの終端の形状は、ボックスの中心から最も近い頂点に接するように大きさが調整されます。</td> - </tr> - <tr> - <td><code>farthest-side</code></td> - <td><code>closest-side</code> と同様ですが、終端の形状がその中心から最も遠い辺 (または縦と横の辺) に接するように大きさが調整される点が異なります。</td> - </tr> - <tr> - <td><code>farthest-corner</code></td> - <td>グラデーションの終端の形状は、ボックスの中心から最も遠い頂点に接するように大きさが調整されます。</td> - </tr> - </tbody> - </table> - - <div class="note"> - <p><strong>メモ:</strong> この関数の初期の実装では、他のキーワード (<code>cover</code> および <code>contain</code>) をそれぞれ標準の <code>farthest-corner</code> および <code>closest-side</code> の別名として含めていました。実装によってはすでに古い形を外しているので、標準的なキーワードのみを使用してください。</p> - </div> - </dd> - <dt><code><color-stop></code></dt> - <dd>色経由点の {{cssxref("<color>")}} 値と、それに続く省略可能な経由位置 (グラデーション軸沿いの {{cssxref("<percentage>")}} または {{cssxref("<length>")}}) です。 percentage が <code>0%</code>、または length が <code>0</code> の場合は、グラデーションの中心を表します。 <code>100%</code> は終端の形状と仮想グラデーション光の交点を表します。その間のパーセント値は仮想グラデーション光における直線的な位置です。</dd> -</dl> - -<h3 id="Formal_syntax" name="Formal_syntax">形式文法</h3> - -<pre class="syntaxbox notranslate">repeating-radial-gradient( - [[ circle || <a href="/ja/docs/CSS/length"><length></a> ] [at <a href="/ja/docs/Web/CSS/position_value"><position></a>]? , | - [ ellipse || [<a href="/ja/docs/CSS/length"><length></a> | <a href="/ja/docs/CSS/percentage"><percentage></a> ]{2}] [at <a href="/ja/docs/Web/CSS/position_value"><position></a>]? , | - [[ circle | ellipse ] || <extent-keyword> ] [at <a href="/ja/docs/Web/CSS/position_value"><position></a>]? , | - at <a href="/ja/docs/Web/CSS/position_value"><position></a> , <color-stop-list> ) - \---------------------------------------------------------------/\-----------------/ - Contour, size and position of the ending shape List of color stops - -where <extent-keyword> = closest-corner | closest-side | farthest-corner | farthest-side - and <color-stop-list> = [ <linear-color-stop> [, <color-hint>? ]? ]#, <linear-color-stop> - and <linear-color-stop> = <color> [ <color-stop-length> ]? - and <color-stop-length> = [ <percentage> | <length> ]{1,2} - and <color-hint> = [ <percentage> | <length> ]</pre> - -<h2 id="Examples" name="Examples">例</h2> - -<h3 id="Black_and_white_gradient" name="Black_and_white_gradient">白と黒のグラデーション</h3> - -<div class="hidden"> -<pre class="brush: html notranslate"><div class="radial-gradient"></div> -</pre> - -<pre class="brush: css notranslate">.radial-gradient { - width: 120px; - height: 120px; -}</pre> -</div> - -<pre class="brush: css notranslate">.radial-gradient { - background: repeating-radial-gradient(black, black 5px, white 5px, white 10px); -} -</pre> - -<p>{{EmbedLiveSample('Black_and_white_gradient', 120, 120)}}</p> - -<h3 id="Farthest-corner" name="Farthest-corner">最も遠い角</h3> - -<div class="hidden"> -<pre class="brush: html notranslate"><div class="radial-gradient"></div> -</pre> - -<pre class="brush: css notranslate">.radial-gradient { - width: 240px; - height: 120px; -}</pre> -</div> - -<pre class="brush: css notranslate">.radial-gradient { - background: repeating-radial-gradient(ellipse farthest-corner at 20% 20%, - red, black 5%, blue 5%, green 10%); - background: repeating-radial-gradient(ellipse farthest-corner at 20% 20%, - red 0 5%, green 5% 10%); -} -</pre> - -<p>{{EmbedLiveSample('Farthest-corner', 120, 120)}}</p> - -<p>楕円のグラデーションは左上から20%の位置が中心となり、中心と最も遠い角 (右下の角) の間で10回繰り返します。色経由で複数の位置に対応しているブラウザーでは、赤と緑の縞模様の楕円が表示されます。この構文にまだ対応していないブラウザーでは、赤から黒、それから青から緑へと変化するグラデーションが表示されます。</p> - -<div class="note"> -<p><strong>メモ:</strong> 他の例は <a href="/ja/docs/Web/CSS/CSS_Images/Using_CSS_gradients">CSS グラデーションの使用</a> をご覧ください。</p> -</div> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('CSS3 Images', '#repeating-gradients', 'repeating-radial-gradient()')}}</td> - <td>{{Spec2('CSS3 Images')}}</td> - <td>初回定義</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの対応</h2> - -<div>{{Compat("css.types.image.gradient.repeating-radial-gradient")}}</div> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li><a href="/ja/docs/Web/CSS/CSS_Images/Using_CSS_gradients">CSS グラデーションの使用</a></li> - <li>他のグラデーション関数: {{cssxref("radial-gradient")}}, {{cssxref("linear-gradient")}}, {{cssxref("repeating-linear-gradient")}}, {{cssxref("conic-gradient")}}, {{cssxref("repeating-conic-gradient")}}</li> - <li>{{cssxref("<image>")}}</li> - <li>{{cssxref("_image","image()")}}</li> - <li>{{cssxref("element()")}}</li> - <li>{{cssxref("image-set","image-set()")}}</li> - <li>{{cssxref("cross-fade")}}</li> -</ul> diff --git a/files/ja/orphaned/web/guide/html/html5/constraint_validation/index.html b/files/ja/orphaned/web/guide/html/html5/constraint_validation/index.html deleted file mode 100644 index a392493e50..0000000000 --- a/files/ja/orphaned/web/guide/html/html5/constraint_validation/index.html +++ /dev/null @@ -1,330 +0,0 @@ ---- -title: 制約検証 -slug: orphaned/Web/Guide/HTML/HTML5/Constraint_validation -tags: - - CSS - - Guide - - HTML5 - - NeedsContent - - Selectors -translation_of: Web/Guide/HTML/HTML5/Constraint_validation -original_slug: Web/Guide/HTML/HTML5/Constraint_validation ---- -<p>ウェブフォームの作成は常に複雑な作業でした。フォーム自体をマークアップすること自体は簡単ですが、それぞれの入力欄が妥当で一貫しているかどうかをチェックすることはもっと難しく、問題をユーザーに伝えることは頭痛がするかもしれません。<a href="/ja/docs/Web/Guide/HTML/HTML5">HTML5</a> では、フォームに新しい仕組みが導入されました。{{ HTMLElement("input") }} 要素に意味を持つ新しい型と、クライアント側でフォームの内容をチェックする作業を簡単にする<em>制約検証</em>が追加されました。基本的な、よくある制約は、JavaScript を必要とせずに、新しい属性を設定することでチェックできます。もっと複雑な制約は<a href="/ja/docs/Web/API/Constraint_validation">制約検証 API</a> を使用して検査することができます。</p> - -<p>これらの概念の基本的な入門 (サンプル付き) は、<a href="/ja/docs/Learn/HTML/Forms/Form_validation">フォーム検証チュートリアル</a>をご覧ください。</p> - -<div class="note"><strong>メモ:</strong> HTML5 の制約検証は、<em>サーバー側</em>での検証の必要性をなくす訳ではありません。不正なフォームのリクエストは減少することが期待されるものの、不正なリクエストはまだ互換性のないブラウザー(例えば、HTML5 や JavaScript に対応していないブラウザー)から送られたり、ウェブアプリケーションをだまそうとする悪意のある人から送られたりする可能性があります。従って、HTML4 の時と同様、クライアント側で行われている検証と一貫性のある方法で、サーバー側でも入力の制約を検証する必要があります。</div> - -<h2 id="Intrinsic_and_basic_constraints" name="Intrinsic_and_basic_constraints">組込みの基本的な制約</h2> - -<p>HTML5 では、基本的な制約は 2通りの方法で定義されます。</p> - -<ul> - <li>{{ HTMLElement("input") }} 要素の {{ htmlattrxref("type", "input") }} 属性に意味的に最も適切な値を選択することで、例えば <code>email</code> を選択することで、値が妥当なメールアドレスであるかどうかをチェックする制約が自動的に作成されます。</li> - <li>検証関連属性を設定することで、基本的な制約を簡単な方法で、JavaScript の必要なく記述できます。</li> -</ul> - -<h3 id="意味を持つ入力型">意味を持つ入力型</h3> - -<p>{{ htmlattrxref("type", "input") }} 属性の組込み制約は次の通りです。</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">入力型</th> - <th scope="col">制約の説明</th> - <th scope="col">関連付けられた違反</th> - </tr> - </thead> - <tbody> - <tr> - <td><code><a href="/ja/docs/Web/HTML/Element/input/url"><input type="URL"></a></code></td> - <td>値は絶対 <a href="/ja/docs/Learn/Common_questions/What_is_a_URL">URL</a> であり、<a href="https://url.spec.whatwg.org/">URL Living Standard</a> で定義された通りでなければなりません。</td> - <td><strong><a href="/ja/docs/Web/API/ValidityState/typeMismatch">TypeMismatch</a></strong> 制約違反</td> - </tr> - <tr> - <td><code><a href="/ja/docs/Web/HTML/Element/input/email"><input type="email"></a></code></td> - <td>値は統語的に妥当なメールアドレス、ふつうは <code><var>username</var>@<var>hostname</var>.<var>tld</var></code> の書式でなければなりません。</td> - <td><strong><a href="/ja/docs/Web/API/ValidityState/typeMismatch">TypeMismatch</a></strong> 制約違反</td> - </tr> - </tbody> -</table> - -<p>これらの入力型のどちらでも、{{ htmlattrxref("multiple", "input") }} 属性が設定されていたら、この入力欄にカンマ区切りのリストで複数の値を設定することができます。これらの中でここで書かれた条件に満足しないものがある場合、<strong>Type mismatch</strong> 制約違反が発生します。</p> - -<p>なお、ほとんどの入力型には組込み制約がありません。制約検証によって防ぐことができたり、既定で不正な値を妥当な値に変換する無害化アルゴリズムがあったりするためです。</p> - -<h3 id="Validation-related_attributes" name="Validation-related_attributes">検証関連属性</h3> - -<p>上記で述べた <code>type</code> 属性に加えて、下記の要素が基本的な制約を記述するのに使われます。</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">属性</th> - <th scope="col">属性をサポートする入力タイプ</th> - <th scope="col">とりうる値</th> - <th scope="col">制約の説明</th> - <th scope="col">関連する違反</th> - </tr> - </thead> - <tbody> - <tr> - <td><code><a href="/ja/docs/Web/HTML/Attributes/pattern">pattern</a></code></td> - <td><code>text</code>, <code>search</code>, <code>url</code>, <code>tel</code>, <code>email</code>, <code>password</code></td> - <td><a href="/ja/docs/Web/JavaScript/Guide/Regular_Expressions">JavaScript 正規表現</a> (<a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMAScript 5</a> <code>global</code>, <code>ignoreCase</code> と <code>multiline</code> フラグが<em>無効で</em>コンパイルされたもの)</td> - <td>値はパターンに一致する必要があります。</td> - <td><code><strong><a href="/ja/docs/Web/API/ValidityState/patternMismatch">patternMismatch</a></strong></code> 制約違反</td> - </tr> - <tr> - <td rowspan="3"><code><a href="/ja/docs/Web/HTML/Attributes/min">min</a></code></td> - <td><code>range</code>, <code>number</code></td> - <td>有効な数値</td> - <td rowspan="3">値以上であること。</td> - <td rowspan="3"><strong><code><a href="/ja/docs/Web/API/ValidityState/rangeUnderflow">rangeUnderflow</a></code></strong> 制約違反</td> - </tr> - <tr> - <td><code>date</code>, <code>month</code>, <code>week</code></td> - <td>有効な日付</td> - </tr> - <tr> - <td><code>datetime</code>, <code>datetime-local</code>, <code>time</code></td> - <td>有効な日付と時刻</td> - </tr> - <tr> - <td rowspan="3"><code><a href="/ja/docs/Web/HTML/Attributes/max">max</a></code></td> - <td><code>range</code>, <code>number</code></td> - <td>有効な数値</td> - <td rowspan="3">値以下であること。</td> - <td rowspan="3"><strong><code><a href="/ja/docs/Web/API/ValidityState/rangeOverflow">rangeOverflow</a></code></strong> 制約違反</td> - </tr> - <tr> - <td><code>date</code>, <code>month</code>, <code>week</code></td> - <td>有効な日付</td> - </tr> - <tr> - <td><code>datetime</code>, <code>datetime-local</code>, <code>time</code></td> - <td>有効な日付と時刻</td> - </tr> - <tr> - <td><code><a href="/ja/docs/Web/HTML/Attributes/required">required</a></code></td> - <td><code>text</code>, <code>search</code>, <code>url</code>, <code>tel</code>, <code>email</code>, <code>password</code>, <code>date</code>, <code>datetime</code>, <code>datetime-local</code>, <code>month</code>, <code>week</code>, <code>time</code>, <code>number</code>, <code>checkbox</code>, <code>radio</code>, <code>file</code>; {{ HTMLElement("select") }} と {{ HTMLElement("textarea") }} 要素にも。</td> - <td><em>none</em> Boolean 属性のため: 存在すれば <em>true</em>, 存在しなければ <em>false</em></td> - <td>値は必須 (セットされた場合)。</td> - <td><strong><code><a href="/ja/docs/Web/API/ValidityState/valueMissing">valueMissing</a></code></strong> 制約違反</td> - </tr> - <tr> - <td rowspan="5"><code><a href="/ja/docs/Web/HTML/Attributes/step">step</a></code></td> - <td><code>date</code></td> - <td>日の整数値</td> - <td rowspan="5">step がリテラル値 <code>any</code> にセットされていない場合、値は <strong>min</strong> + step の整数倍</td> - <td rowspan="5"><strong><code><a href="/ja/docs/Web/API/ValidityState/stepMismatch">stepMismatch</a></code></strong> 制約違反</td> - </tr> - <tr> - <td><code>month</code></td> - <td>月の整数値</td> - </tr> - <tr> - <td><code>week</code></td> - <td>週の整数値</td> - </tr> - <tr> - <td><code>datetime</code>, <code>datetime-local</code>, <code>time</code></td> - <td>秒の整数値</td> - </tr> - <tr> - <td><code>range</code>, <code>number</code></td> - <td>整数値</td> - </tr> - <tr> - <td><code><a href="/ja/docs/Web/HTML/Attributes/minlength">minlength</a></code></td> - <td><code>text</code>, <code>search</code>, <code>url</code>, <code>tel</code>, <code>email</code>, <code>password</code>; と {{ HTMLElement("textarea") }} 要素</td> - <td>整数長</td> - <td>文字列数 (code points) は、空でない場合は属性値より少なくならない。{{ HTMLElement("textarea") }}では改行はすべて 1 つの文字に正規化される (CRLF の組と対象的に)。</td> - <td><strong><code><a href="/ja/docs/Web/API/ValidityState/tooShort">tooShort</a></code></strong> 制約違反</td> - </tr> - <tr> - <td><code><a href="/ja/docs/Web/HTML/Attributes/maxlength">maxlength</a></code></td> - <td><code>text</code>, <code>search</code>, <code>url</code>, <code>tel</code>, <code>email</code>, <code>password</code>; と {{ HTMLElement("textarea") }} 要素</td> - <td>整数長</td> - <td>文字列数 (code points) は属性値を超えない。</td> - <td><strong><code><a href="/ja/docs/Web/API/ValidityState/tooLong">tooLong</a></code></strong> 制約違反</td> - </tr> - </tbody> -</table> - -<h2 id="Constraint_validation_process" name="Constraint_validation_process">制約検証プロセス</h2> - -<p>Constraint validation is done through the Constraint Validation API either on a single form element or at the form level, on the {{ HTMLElement("form") }} element itself. The constraint validation is done in the following ways:</p> - -<ul> - <li>By a call to the <code>checkValidity()</code> or <code>reportValidity()</code> method of a form-associated DOM interface, (<code><a href="/ja/docs/Web/API/HTMLInputElement">HTMLInputElement</a></code>, <code><a href="/ja/docs/Web/API/HTMLSelectElement">HTMLSelectElement</a></code>, <code><a href="/ja/docs/Web/API/HTMLButtonElement">HTMLButtonElement</a></code>, <code><a href="/ja/docs/Web/API/HTMLOutputElement">HTMLOutputElement</a></code> or <code><a href="/ja/docs/Web/API/HTMLTextAreaElement">HTMLTextAreaElement</a></code>), which evaluates the constraints only on this element, allowing a script to get this information. The <code>checkValidity()</code> method returns a Boolean indicating whether the element's value passes its constraints. (This is typically done by the user-agent when determining which of the CSS pseudo-classes, {{ Cssxref(":valid") }} or {{ Cssxref(":invalid") }}, applies.) In contrast, the <code>reportValidity()</code> method reports any constraint failures to the user.</li> - <li>By a call to the <code>checkValidity()</code> or <code>reportValidity()</code> method on the <code><a href="/ja/docs/Web/API/HTMLFormElement">HTMLFormElement</a></code> interface.</li> - <li>By submitting the form itself.</li> -</ul> - -<p>Calling <code>checkValidity()</code> is called <em>statically</em> validating the constraints, while calling <code>reportValidity()</code> or submitting the form is called <em>interactively</em> validating the constraints.</p> - -<div class="note"><strong>Note: </strong> - -<ul> - <li>If the {{ htmlattrxref("novalidate", "form") }} attribute is set on the {{ HTMLElement("form") }} element, interactive validation of the constraints doesn't happen.</li> - <li>Calling the <code>submit()</code> method on the <code><a href="/en/DOM/HTMLFormElement">HTMLFormElement</a></code> interface doesn't trigger a constraint validation. In other words, this method sends the form data to the server even if doesn't satisfy the constraints. Call the <code>click()</code> method on a submit button instead.</li> -</ul> -</div> - -<h2 id="Complex_constraints_using_HTML5_Constraint_API" name="Complex_constraints_using_HTML5_Constraint_API">HTML5 制約 API を使用した複雑な制約</h2> - -<p>Using JavaScript and the Constraint API, it is possible to implement more complex constraints, 例えば、constraints combining several fields, or constraints involving complex calculations.</p> - -<p>Basically, the idea is to trigger JavaScript on some form field event (like <strong>onchange</strong>) to calculate whether the constraint is violated, and then to use the method <code><em>field</em>.setCustomValidity()</code> to set the result of the validation: an empty string means the constraint is satisfied, and any other string means there is an error and this string is the error message to display to the user.</p> - -<h3 id="Constraint_combining_several_fields_Postal_code_validation" name="Constraint_combining_several_fields_Postal_code_validation">Constraint combining several fields: Postal code validation</h3> - -<p>The postal code format varies from one country to another. Not only do most countries allow an optional prefix with the country code (like <code>D-</code> in Germany, <code>F- </code> in France or Switzerland), but some countries have postal codes with only a fixed number of digits; others, like the UK, have more complex structures, allowing letters at some specific positions.</p> - -<div class="note"> -<p><strong>注:</strong> This is not a comprehensive postal code validation library, but rather a demonstration of the key concepts.</p> -</div> - -<p>As an example, we will add a script checking the constraint validation for this simple form:</p> - -<pre class="brush: html notranslate"><form> - <label for="ZIP">ZIP : </label> - <input type="text" id="ZIP"> - <label for="Country">Country : </label> - <select id="Country"> - <option value="ch">Switzerland</option> - <option value="fr">France</option> - <option value="de">Germany</option> - <option value="nl">The Netherlands</option> - </select> - <input type="submit" value="Validate"> -</form></pre> - -<p>This displays the following form:</p> - -<p>{{EmbedLiveSample("Constraint_combining_several_fields_Postal_code_validation")}}</p> - -<p>First, we write a function checking the constraint itself:</p> - -<pre class="brush: js notranslate">function checkZIP() { - // For each country, defines the pattern that the ZIP has to follow - var constraints = { - ch : [ '^(CH-)?\\d{4}$', "Switzerland ZIPs must have exactly 4 digits: e.g. CH-1950 or 1950" ], - fr : [ '^(F-)?\\d{5}$' , "France ZIPs must have exactly 5 digits: e.g. F-75012 or 75012" ], - de : [ '^(D-)?\\d{5}$' , "Germany ZIPs must have exactly 5 digits: e.g. D-12345 or 12345" ], - nl : [ '^(NL-)?\\d{4}\\s*([A-RT-Z][A-Z]|S[BCE-RT-Z])$', - "Nederland ZIPs must have exactly 4 digits, followed by 2 letters except SA, SD and SS" ] - }; - - // Read the country id - var country = document.getElementById("Country").value; - - // Get the NPA field - var ZIPField = document.getElementById("ZIP"); - - // Build the constraint checker - var constraint = new RegExp(constraints[country][0], ""); - console.log(constraint); - - - // Check it! - if (constraint.test(ZIPField.value)) { - // The ZIP follows the constraint, we use the ConstraintAPI to tell it - ZIPField.setCustomValidity(""); - } - else { - // The ZIP doesn't follow the constraint, we use the ConstraintAPI to - // give a message about the format required for this country - ZIPField.setCustomValidity(constraints[country][1]); - } -} -</pre> - -<p>Then we link it to the <strong>onchange</strong> event for the {{ HTMLElement("select") }} and the <strong>oninput</strong> event for the {{ HTMLElement("input") }}:</p> - -<pre class="brush: js notranslate">window.onload = function () { - document.getElementById("Country").onchange = checkZIP; - document.getElementById("ZIP").oninput = checkZIP; -}</pre> - -<p>You can see a <a href="/@api/deki/files/4744/=constraint.html">live example</a> of the postal code validation.</p> - -<h3 id="Limiting_the_size_of_a_file_before_its_upload" name="Limiting_the_size_of_a_file_before_its_upload">アップロード前のファイルサイズの制限</h3> - -<p>Another common constraint is to limit the size of a file to be uploaded. Checking this on the client side before the file is transmitted to the server requires combining the Constraint Validation API, and especially the <code>field.setCustomValidity()</code> method, with another JavaScript API, here the File API.</p> - -<p>Here is the HTML part:</p> - -<pre class="brush: html notranslate"><label for="FS">Select a file smaller than 75 kB : </label> -<input type="file" id="FS"></pre> - -<p>This displays:</p> - -<p>{{EmbedLiveSample("Limiting_the_size_of_a_file_before_its_upload")}}</p> - -<p>The JavaScript reads the file selected, uses the <code>File.size()</code> method to get its size, compares it to the (hard coded) limit, and calls the Constraint API to inform the browser if there is a violation:</p> - -<pre class="brush: js notranslate">function checkFileSize() { - var FS = document.getElementById("FS"); - var files = FS.files; - - // If there is (at least) one file selected - if (files.length > 0) { - if (files[0].size > 75 * 1024) { // Check the constraint - FS.setCustomValidity("The selected file must not be larger than 75 kB"); - return; - } - } - // No custom constraint violation - FS.setCustomValidity(""); -}</pre> - -<p>Finally we hook the method with the correct event:</p> - -<pre class="brush: js notranslate">window.onload = function () { - document.getElementById("FS").onchange = checkFileSize; -}</pre> - -<p>You can see a <a href="/@api/deki/files/4745/=fileconstraint.html">live example</a> of the File size constraint validation.</p> - -<h2 id="Visual_styling_of_constraint_validation" name="Visual_styling_of_constraint_validation">制約検証における表示の整形</h2> - -<p>Apart from setting constraints, web developers want to control what messages are displayed to the users and how they are styled.</p> - -<h3 id="Controlling_the_look_of_elements" name="Controlling_the_look_of_elements">要素の外見の制御</h3> - -<p>The look of elements can be controlled via CSS pseudo-classes.</p> - -<h4 id="required_and_optional_CSS_pseudo-classes" name="required_and_optional_CSS_pseudo-classes">CSS の :required および :optional 疑似クラス</h4> - -<p>The {{cssxref(':required')}} and {{cssxref(':optional')}} <a href="/ja/docs/Web/CSS/Pseudo-classes">pseudo-classes</a> allow writing selectors that match form elements that have the {{ htmlattrxref("required") }} attribute, or that don't have it.</p> - -<h4 id="placeholder-shown_CSS_pseudo-class" name="placeholder-shown_CSS_pseudo-class">:placeholder-shown CSS pseudo-class</h4> - -<p>See {{cssxref(':placeholder-shown')}}</p> - -<h4 id="valid_invalid_CSS_pseudo-classes" name="valid_invalid_CSS_pseudo-classes">CSS の :valid :invalid 疑似クラス</h4> - -<p>The {{cssxref(':valid')}} and {{cssxref(':invalid')}} <a href="/ja/docs/Web/CSS/Pseudo-classes">pseudo-classes</a> are used to represent <input> elements whose content validates and fails to validate respectively according to the input's type setting. These classes allow the user to style valid or invalid form elements to make it easier to identify elements that are either formatted correctly or incorrectly.</p> - -<h3 id="Controlling_the_text_of_constraint_violation" name="Controlling_the_text_of_constraint_violation">制約違反の文字列の制御</h3> - -<p>The following items can help with controlling the text of a constraint violation:</p> - -<ul> - <li><a href="/ja/docs/Web/API/Constraint_validation#element.setCustomValidity(message)">element.setCustomValidity(message)</a> method on the following elements: - - <ul> - <li>{{HTMLElement("fieldset")}}. Note: Setting a custom validity message on fieldset elements will not prevent form submission in most browsers.</li> - <li>{{HTMLElement("input")}}</li> - <li>{{HTMLElement("output")}}</li> - <li>{{HTMLElement("select")}}</li> - <li>Submit buttons (created with either a {{HTMLElement("button")}} element with the <code>submit</code> type, or an <code>input</code> element with the {{HTMLElement("input/submit", "submit")}} type. Other types of buttons do not participate in constraint validation.</li> - <li>{{HTMLElement("textarea")}}</li> - </ul> - </li> - <li>The <a href="/ja/docs/Web/API/ValidityState"><code>ValidityState</code></a> interface describes the object returned by the <a href="/ja/docs/Web/API/Constraint_validation#validity">validity</a> property of the element types listed above. It represents various ways that an entered value can be invalid. Together, they help explain why an element's value fails to validate, if it's not valid.</li> -</ul> diff --git a/files/ja/orphaned/web/guide/html/html5/introduction_to_html5/index.html b/files/ja/orphaned/web/guide/html/html5/introduction_to_html5/index.html index 861044c138..c1cdd1d6b5 100644 --- a/files/ja/orphaned/web/guide/html/html5/introduction_to_html5/index.html +++ b/files/ja/orphaned/web/guide/html/html5/introduction_to_html5/index.html @@ -9,7 +9,7 @@ original_slug: Web/Guide/HTML/HTML5/Introduction_to_HTML5 --- <p><a class="external" href="https://www.whatwg.org/specs/web-apps/current-work/">HTML5</a> は、HTML 標準の最も新しいバージョンです。HTML5 によって、リッチメディアのサポートだけでなく、ユーザ、彼らのローカルデータ、サーバの間でより簡単にかつ効果的にやり取りするための Web アプリケーションを作成するための拡張されたサポートを提供するための新機能も手に入れることができます。</p> -<p>HTML5 はまだ策定段階にあるため、現在の仕様に対する変更は当然あり得ます。そのため、すべてのブラウザで HTML5 の機能のすべてがサポートされているわけではありません。ですが、Gecko (そしてその拡張である、Firefox) には、素晴らしいほどに、HTML5 の最初の段階のサポートが含まれており、さらなる機能のサポートに対する取り組みを続けています。Gecko は バージョン1.8.1 から HTML5 の機能をサポートし始めました。<a href="/ja/docs/orphaned/Web/Guide/HTML/HTML5" title="ja/HTML/HTML5">HTML5 のメインページ</a>に Gecko がサポートしている HTML5 の機能のリストがあります。複数ブラウザのサポート状況の詳細な情報については、<a class="external" href="http://caniuse.com/#cats=HTML5">CanIUse</a> ウェブサイトを参照してください。</p> +<p>HTML5 はまだ策定段階にあるため、現在の仕様に対する変更は当然あり得ます。そのため、すべてのブラウザで HTML5 の機能のすべてがサポートされているわけではありません。ですが、Gecko (そしてその拡張である、Firefox) には、素晴らしいほどに、HTML5 の最初の段階のサポートが含まれており、さらなる機能のサポートに対する取り組みを続けています。Gecko は バージョン1.8.1 から HTML5 の機能をサポートし始めました。<a href="/ja/docs/orphaned/Web/Guide/HTML/HTML5">HTML5 のメインページ</a>に Gecko がサポートしている HTML5 の機能のリストがあります。複数ブラウザのサポート状況の詳細な情報については、<a class="external" href="http://caniuse.com/#cats=HTML5">CanIUse</a> ウェブサイトを参照してください。</p> <h2 id="The_HTML5_doctype">HTML5 の DOCTYPE</h2> diff --git a/files/ja/orphaned/web/javascript/guide/class-based_vs._prototype-based_languages/index.html b/files/ja/orphaned/web/javascript/guide/class-based_vs._prototype-based_languages/index.html deleted file mode 100644 index 23daae0e6b..0000000000 --- a/files/ja/orphaned/web/javascript/guide/class-based_vs._prototype-based_languages/index.html +++ /dev/null @@ -1,26 +0,0 @@ ---- -title: Class-Based vs. Prototype-Based Languages -slug: orphaned/Web/JavaScript/Guide/Class-Based_vs._Prototype-Based_Languages -original_slug: Web/JavaScript/Guide/Class-Based_vs._Prototype-Based_Languages ---- -<h3 id=".E3.82.AF.E3.83.A9.E3.82.B9.E3.83.99.E3.83.BC.E3.82.B9.E8.A8.80.E8.AA.9E.E3.81.A8.E3.83.97.E3.83.AD.E3.83.88.E3.82.BF.E3.82.A4.E3.83.97.E3.83.99.E3.83.BC.E3.82.B9.E8.A8.80.E8.AA.9E" name=".E3.82.AF.E3.83.A9.E3.82.B9.E3.83.99.E3.83.BC.E3.82.B9.E8.A8.80.E8.AA.9E.E3.81.A8.E3.83.97.E3.83.AD.E3.83.88.E3.82.BF.E3.82.A4.E3.83.97.E3.83.99.E3.83.BC.E3.82.B9.E8.A8.80.E8.AA.9E">クラスベース言語とプロトタイプベース言語</h3> -<p>Java や C++ といったクラスベースのオブジェクト指向言語はクラスとインスタンスという 2 つの異なる実体があるという概念に基づいています。</p> -<ul> <li>クラスはあるオブジェクトの集合を特徴付けるすべてのプロパティ(Java ではメソッドとフィールドを、C++ ではメンバをプロパティと見なす)を定義する。クラスとはそれが表すオブジェクトの集合の特定のメンバではなく、抽象的なものである。例えば、Employee クラスで従業員すべてを含む集合を表す。</li> <li>一方、インスタンスはクラスを実例にしたものである。つまり、そのメンバの 1 つということである。例えば、Victoria は Employee クラスのインスタンスとなることができる。このクラスは特定の個人を従業者として表すものである。インスタンスはその親クラスのプロパティを正確に保持する(それに他ならない)。</li> -</ul> -<p>JavaScript のようなプロトタイプベース言語はこの区別がありません。単にオブジェクトがあるだけです。プロトタイプベース言語には原型的なオブジェクトという概念があります。このオブジェクトは新しいオブジェクトの初期プロパティを取得する元になるテンプレートとして使用されます。どのオブジェクトもそれ独自のプロパティを指定できます。オブジェクト作成時にも実行時にも可能です。さらに、どのオブジェクトも別のオブジェクトに対するプロトタイプとして関連付けることができます。2 つ目のオブジェクトが 1 つ目のオブジェクトのプロトタイプを共有するということもできます。</p> -<h4 id=".E3.82.AF.E3.83.A9.E3.82.B9.E3.81.AE.E5.AE.9A.E7.BE.A9" name=".E3.82.AF.E3.83.A9.E3.82.B9.E3.81.AE.E5.AE.9A.E7.BE.A9">クラスの定義</h4> -<p>クラスベース言語ではクラス定義ごとにクラスを定義します。定義では特殊なメソッドを指定してそのクラスのインスタンスを作成することができます。そのようなメソッドはコンストラクタと呼びます。コンストラクタメソッドはインスタンスのプロパティに対する初期値を指定することができます。また、作成時に他の適当な処理を実行することもできます。new 演算子をコンストラクタメソッドと一緒に用いることでクラスのインスタンスを作成できます。</p> -<p>JavaScript は同様のモデルに従っていますが、コンストラクタと別になっているクラス定義がありません。その代わりに、プロパティと値からなる特定の初期的なセットを持つオブジェクトを作成するコンストラクタ関数を定義します。どの JavaScript 関数もコンストラクタとして使用できます。new 演算子をコンストラクタ関数とともに使用することで新しいオブジェクトを作成します。</p> -<h4 id=".E3.82.B5.E3.83.96.E3.82.AF.E3.83.A9.E3.82.B9.E3.81.A8.E7.B6.99.E6.89.BF" name=".E3.82.B5.E3.83.96.E3.82.AF.E3.83.A9.E3.82.B9.E3.81.A8.E7.B6.99.E6.89.BF">サブクラスと継承</h4> -<p>クラスベース言語ではクラス定義を通じてクラスの階層を作ります。クラス定義では新しいクラスがある既存のクラスのサブクラスになるように指定することができます。サブクラスはスーパークラスの全プロパティを継承します。さらに新しくプロパティを追加したり継承したものを変更することもできます。例えば、Employee クラスが name および dept プロパティのみを含んでおり、Manager は reports プロパティを追加する Employee のサブクラスであるとします。この場合、Manager クラスのインスタンスは name、dept、reports という 3 つのプロパティをすべて持つことになります。</p> -<p>JavaScript では、原型的なオブジェクトをどのコンストラクタ関数にも結びつけることができるようにして継承を実装しています。そのため、全く同じような Employee と Manager の例を作成することができますが、使用する用語が若干異なります。まず、Employee コンストラクタ関数を定義します。これは name および dept プロパティを指定します。次に Manager コンストラクタ関数を定義します。これは reports プロパティを指定します。最後に新しい Employee オブジェクトを Manager コンストラクタ関数に対するプロトタイプとして代入します。そして新しい Manager を作成すると、このオブジェクトは Employee オブジェクトから name および dept プロパティを継承します。</p> -<h4 id=".E3.83.97.E3.83.AD.E3.83.91.E3.83.86.E3.82.A3.E3.81.AE.E8.BF.BD.E5.8A.A0.E3.81.A8.E5.89.8A.E9.99.A4" name=".E3.83.97.E3.83.AD.E3.83.91.E3.83.86.E3.82.A3.E3.81.AE.E8.BF.BD.E5.8A.A0.E3.81.A8.E5.89.8A.E9.99.A4">プロパティの追加と削除</h4> -<p>クラスベース言語では一般的にクラスをコンパイル時に生成し、コンパイル時または実行時にクラスのインスタンスを作成します。クラス定義後にそのクラスのプロパティの数や型を変更することはできません。しかし、JavaScript ではどんなオブジェクトでも実行時にプロパティを追加したり削除したりすることができます。あるオブジェクトのセットでプロトタイプとして使用されているオブジェクトにプロパティを追加すると、そのプロトタイプの使用元であるオブジェクトにも新しいプロパティが追加されます。</p> -<h4 id=".E9.81.95.E3.81.84.E3.81.AE.E6.A6.82.E8.A6.81" name=".E9.81.95.E3.81.84.E3.81.AE.E6.A6.82.E8.A6.81">違いの概要</h4> -<p>次の表でこれらの違いをいくつか短くまとめてみます。この章の残りで、JavaScript のコンストラクタとプロトタイプを用いてオブジェクト階層を作成することについての詳細を説明していきます。また、この方法が Java ではどう変わるかという比較もします。</p> -<table class="fullwidth-table"> <tbody> <tr> <th>クラスベース (Java)</th> <th>プロトタイプベース (JavaScript)</th> </tr> <tr> <td>クラスとインスタンスは異なる実体である。</td> <td>すべてのオブジェクトはインスタンスである。</td> </tr> <tr> <td>クラス定義を用いてクラスを定義する。また、コンストラクタメソッドを用いてクラスをインスタンス化する。</td> <td>コンストラクタ関数を用いてオブジェクトのセットを定義し、作成する。</td> </tr> <tr> <td><code>new</code> 演算子を用いて単一のオブジェクトを作成する。</td> <td>同じ。</td> </tr> <tr> <td>既存のクラスのサブクラスを定義するクラス定義を用いてオブジェクト階層を構築する。</td> <td>コンストラクタ関数に結びつけられたプロトタイプとしてオブジェクトを代入することでオブジェクト階層を構築する。</td> </tr> <tr> <td>クラスチェーンに従ってプロパティを継承する。</td> <td>プロトタイプチェーンに従ってプロパティを継承する。</td> </tr> <tr> <td>クラス定義がクラスの全インスタンスの全プロパティを指定する。実行時に動的にプロパティを追加することはできない。</td> <td>コンストラクタ関数またはプロトタイプがプロパティの初期セットを指定する。個々のオブジェクトやオブジェクトの全体のセットに動的にプロパティを追加したり、それらからプロパティを除去したりできる。</td> </tr> </tbody> -</table> -<div class="noinclude"> -<p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Predefined_Core_Objects:String_Object", "Core_JavaScript_1.5_Guide:The_Employee_Example") }}</p> -</div> -<p>{{ languages( { "zh-tw": "zh_tw/Core_JavaScript_1.5_教學/以類別為基礎的語言_vs._以原型為基礎的語言", "en": "en/Core_JavaScript_1.5_Guide/Class-Based_vs._Prototype-Based_Languages", "es": "es/Gu\u00eda_JavaScript_1.5/Lenguajes_basados_en_clases_frente_a_basados_en_prototipos", "fr": "fr/Guide_JavaScript_1.5/Langages_bas\u00e9s_sur_les_classes_et_langages_bas\u00e9s_sur_les_prototypes", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/J\u0119zyki_oparte_na_klasach_vs._oparte_na_prototypach", "zh-cn": "cn/Core_JavaScript_1.5_Guide/Class-Based_vs._Prototype-Based_Languages" } ) }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/creating_a_regular_expression/index.html b/files/ja/orphaned/web/javascript/guide/creating_a_regular_expression/index.html index 4da2f3be90..9b09e6c5d2 100644 --- a/files/ja/orphaned/web/javascript/guide/creating_a_regular_expression/index.html +++ b/files/ja/orphaned/web/javascript/guide/creating_a_regular_expression/index.html @@ -18,7 +18,7 @@ original_slug: Web/JavaScript/Guide/Creating_a_Regular_Expression </dd> </dl> <ul> - <li>次のように、<a href="/ja/JavaScript/Reference/Global_Objects/RegExp" title="ja/JavaScript/Reference/Global_Objects/RegExp">RegExp</a> オブジェクトのコンストラクタ関数を呼び出す。</li> + <li>次のように、<a href="/ja/JavaScript/Reference/Global_Objects/RegExp">RegExp</a> オブジェクトのコンストラクタ関数を呼び出す。</li> </ul> <pre>var re = new RegExp("ab+c"); </pre> <dl> diff --git a/files/ja/orphaned/web/javascript/guide/expressions/index.html b/files/ja/orphaned/web/javascript/guide/expressions/index.html index 6c27367d80..90deb434f3 100644 --- a/files/ja/orphaned/web/javascript/guide/expressions/index.html +++ b/files/ja/orphaned/web/javascript/guide/expressions/index.html @@ -8,9 +8,9 @@ original_slug: Web/JavaScript/Guide/Expressions <p>概念的に、式は 2 つの種類に分けることができます。ある値を変数に代入するものと、単純にある値を持つものです。例えば、<code>x = 7</code> という式は x に 7 という値を代入する式です。この式自体の評価結果は 7 です。このような式では<em>代入演算子</em>を用います。一方、<code>3 + 4</code> という式では単純に評価結果が 7 になります。この式は代入を行いません。このような式で用いられる演算子は単に<em>演算子</em>と呼ばれます。</p> <p>JavaScript には以下の種類の式があります。</p> <ul> - <li>算術式:数値に評価する。例えば 3.14159。(一般に <a href="/ja/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators" title="ja/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators">算術演算子</a> を使用)</li> - <li>文字列式:文字列に評価する。例えば "Fred" や "234"。(一般に <a href="/ja/Core_JavaScript_1.5_Guide/Operators/String_Operators" title="ja/Core_JavaScript_1.5_Guide/Operators/String_Operators">文字列演算子</a> を使用)</li> - <li>論理式:true または false に評価する。(よく <a href="/ja/Core_JavaScript_1.5_Guide/Operators/Logical_Operators" title="ja/Core_JavaScript_1.5_Guide/Operators/Logical_Operators">論理演算子</a> を用いる)</li> - <li>オブジェクト式:オブジェクトに評価する。(オブジェクトに評価するさまざまな例については <a href="/ja/Core_JavaScript_1.5_Guide/Operators/Special_Operators" title="ja/Core_JavaScript_1.5_Guide/Operators/Special_Operators">特殊演算子</a> を参照)</li> + <li>算術式:数値に評価する。例えば 3.14159。(一般に <a href="/ja/Core_JavaScript_1.5_Guide/Operators/Arithmetic_Operators">算術演算子</a> を使用)</li> + <li>文字列式:文字列に評価する。例えば "Fred" や "234"。(一般に <a href="/ja/Core_JavaScript_1.5_Guide/Operators/String_Operators">文字列演算子</a> を使用)</li> + <li>論理式:true または false に評価する。(よく <a href="/ja/Core_JavaScript_1.5_Guide/Operators/Logical_Operators">論理演算子</a> を用いる)</li> + <li>オブジェクト式:オブジェクトに評価する。(オブジェクトに評価するさまざまな例については <a href="/ja/Core_JavaScript_1.5_Guide/Operators/Special_Operators">特殊演算子</a> を参照)</li> </ul> <p>{{ PreviousNext("JavaScript/Guide/Unicode", "JavaScript/Guide/Operators") }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/loop_statements/index.html b/files/ja/orphaned/web/javascript/guide/loop_statements/index.html index 93f9f2c65a..68dab826b1 100644 --- a/files/ja/orphaned/web/javascript/guide/loop_statements/index.html +++ b/files/ja/orphaned/web/javascript/guide/loop_statements/index.html @@ -5,14 +5,14 @@ original_slug: Web/JavaScript/Guide/Loop_Statements --- <h2 id=".E3.83.AB.E3.83.BC.E3.83.97.E6.96.87" name=".E3.83.AB.E3.83.BC.E3.83.97.E6.96.87">ループ文</h2> <p>ループは指定した条件が満たされている限り繰り返し実行されるコマンドのセットです。JavaScript は、label はもちろん、for、do while、while といったループ文をサポートしています(label 自体はループ文ではありませんが、これらの文とともに頻繁に使用されます)。さらに、<code>break</code> および <code>continue</code> 文をループ文の中で使うことができます。</p> -<p>さらに <code>for...in</code> 文も文を繰り返し実行しますが、これはオブジェクトの操作に使用します。<a href="/ja/Core_JavaScript_1.5_Guide/Object_Manipulation_Statements" title="ja/Core_JavaScript_1.5_Guide/Object_Manipulation_Statements">オブジェクト操作文</a> をご覧ください。</p> +<p>さらに <code>for...in</code> 文も文を繰り返し実行しますが、これはオブジェクトの操作に使用します。<a href="/ja/Core_JavaScript_1.5_Guide/Object_Manipulation_Statements">オブジェクト操作文</a> をご覧ください。</p> <p>ループ文は以下のとおりです。</p> <ul> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/for_Statement" title="ja/Core_JavaScript_1.5_Guide/Loop_Statements/for_Statement">for 文</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/do...while_Statement" title="ja/Core_JavaScript_1.5_Guide/Loop_Statements/do...while_Statement">do...while 文</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/while_Statement" title="ja/Core_JavaScript_1.5_Guide/Loop_Statements/while_Statement">while 文</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/label_Statement" title="ja/Core_JavaScript_1.5_Guide/Loop_Statements/label_Statement">label 文</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/break_Statement" title="ja/Core_JavaScript_1.5_Guide/Loop_Statements/break_Statement">break 文</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/continue_Statement" title="ja/Core_JavaScript_1.5_Guide/Loop_Statements/continue_Statement">continue 文</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/for_Statement">for 文</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/do...while_Statement">do...while 文</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/while_Statement">while 文</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/label_Statement">label 文</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/break_Statement">break 文</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Loop_Statements/continue_Statement">continue 文</a></li> </ul> <p>{{ PreviousNext("JavaScript/Guide/Conditional_Statements", "JavaScript/Guide/Loop_Statements/for_Statement") }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/object_manipulation_statements/index.html b/files/ja/orphaned/web/javascript/guide/object_manipulation_statements/index.html index 48e820e9ae..800a9e95cf 100644 --- a/files/ja/orphaned/web/javascript/guide/object_manipulation_statements/index.html +++ b/files/ja/orphaned/web/javascript/guide/object_manipulation_statements/index.html @@ -6,7 +6,7 @@ original_slug: Web/JavaScript/Guide/Object_Manipulation_Statements <h3 id=".E3.82.AA.E3.83.96.E3.82.B8.E3.82.A7.E3.82.AF.E3.83.88.E6.93.8D.E4.BD.9C.E6.96.87" name=".E3.82.AA.E3.83.96.E3.82.B8.E3.82.A7.E3.82.AF.E3.83.88.E6.93.8D.E4.BD.9C.E6.96.87">オブジェクト操作文</h3> <p>JavaScript はオブジェクトの操作に <code>for...in</code>、<code>for each...in</code> および <code>with</code> 文を使用します。</p> <h4 id="for...in_.E6.96.87" name="for...in_.E6.96.87">for...in 文</h4> -<p><a href="/ja/Core_JavaScript_1.5_Reference/Statements/for...in" title="ja/Core_JavaScript_1.5_Reference/Statements/for...in"><code>for...in</code></a> 文は指定した変数をオブジェクトの全プロパティに対して反復します。それぞれのプロパティに対して JavaScript は指定した文を実行します。<code>for...in</code> 文は次のように使用します。</p> +<p><a href="/ja/Core_JavaScript_1.5_Reference/Statements/for...in"><code>for...in</code></a> 文は指定した変数をオブジェクトの全プロパティに対して反復します。それぞれのプロパティに対して JavaScript は指定した文を実行します。<code>for...in</code> 文は次のように使用します。</p> <pre>for (variable in object) { statements } @@ -27,11 +27,11 @@ original_slug: Web/JavaScript/Guide/Object_Manipulation_Statements car.model = Mustang </pre> <p><strong>配列</strong><br> - <a href="/ja/Core_JavaScript_1.5_Reference/Global_Objects/Array" title="ja/Core_JavaScript_1.5_Reference/Global_Objects/Array">Array</a> の要素に対して反復する方法としてこれを用いることは魅力的かもしれませんが、<strong>for...in</strong> 文はその配列の要素に加えてユーザ定義プロパティに対して繰り返すため、独自のプロパティやメソッドを追加するなどして Array オブジェクトに変更を加えると <strong>for...in</strong> 文は数値のインデックスに加えてユーザ定義プロパティの名前を返します。したがって、配列に対して反復したいときには数値のインデックスを用いた従来の <a href="/ja/Core_JavaScript_1.5_Reference/Statements/for" title="ja/Core_JavaScript_1.5_Reference/Statements/for">for</a> ループを使用したほうがいいでしょう。</p> + <a href="/ja/Core_JavaScript_1.5_Reference/Global_Objects/Array">Array</a> の要素に対して反復する方法としてこれを用いることは魅力的かもしれませんが、<strong>for...in</strong> 文はその配列の要素に加えてユーザ定義プロパティに対して繰り返すため、独自のプロパティやメソッドを追加するなどして Array オブジェクトに変更を加えると <strong>for...in</strong> 文は数値のインデックスに加えてユーザ定義プロパティの名前を返します。したがって、配列に対して反復したいときには数値のインデックスを用いた従来の <a href="/ja/Core_JavaScript_1.5_Reference/Statements/for">for</a> ループを使用したほうがいいでしょう。</p> <h4 id="for_each...in_.E6.96.87" name="for_each...in_.E6.96.87">for each...in 文</h4> -<p><a href="/ja/Core_JavaScript_1.5_Reference/Statements/for_each...in" title="ja/Core_JavaScript_1.5_Reference/Statements/for_each...in"><code>for each...in</code></a> は <a href="/ja/New_in_JavaScript_1.6" title="ja/New_in_JavaScript_1.6">JavaScript 1.6</a> で導入されるループ文です。これは <code>for...in</code> に似ていますが、オブジェクトのプロパティの名前ではなく、プロパティの値に対して反復します。</p> +<p><a href="/ja/Core_JavaScript_1.5_Reference/Statements/for_each...in"><code>for each...in</code></a> は <a href="/ja/New_in_JavaScript_1.6">JavaScript 1.6</a> で導入されるループ文です。これは <code>for...in</code> に似ていますが、オブジェクトのプロパティの名前ではなく、プロパティの値に対して反復します。</p> <h4 id="with_.E6.96.87" name="with_.E6.96.87">with 文</h4> -<p><a href="/ja/Core_JavaScript_1.5_Reference/Statements/with" title="ja/Core_JavaScript_1.5_Reference/Statements/with"><code>with</code></a> 文はデフォルトのオブジェクトについて文のセットを実行します。JavaScript はその文のセットにおいて非修飾名を検索し、その名前がデフォルトのオブジェクトのプロパティであるかを決定します。非修飾名がプロパティにマッチすると、そのプロパティがその文で使われます。そうでない場合はローカル変数かグローバル変数が使われます。</p> +<p><a href="/ja/Core_JavaScript_1.5_Reference/Statements/with"><code>with</code></a> 文はデフォルトのオブジェクトについて文のセットを実行します。JavaScript はその文のセットにおいて非修飾名を検索し、その名前がデフォルトのオブジェクトのプロパティであるかを決定します。非修飾名がプロパティにマッチすると、そのプロパティがその文で使われます。そうでない場合はローカル変数かグローバル変数が使われます。</p> <p><code>with</code> 文は次のように使用します。</p> <pre>with (object) { statements @@ -47,6 +47,6 @@ with (Math) { y = r * sin(PI/2); } </pre> -<p>注意:<code>with</code> 文を使うことでプログラムをより簡潔にすることができますが、<code>with</code> の不適切な使用はプログラムを大幅にスローダウンさせることに繋がります。<a href="/ja/Core_JavaScript_1.5_Reference/Statements/with" title="ja/Core_JavaScript_1.5_Reference/Statements/with">Core JavaScript 1.5 Reference:Statements:with</a> を参照してください。</p> +<p>注意:<code>with</code> 文を使うことでプログラムをより簡潔にすることができますが、<code>with</code> の不適切な使用はプログラムを大幅にスローダウンさせることに繋がります。<a href="/ja/Core_JavaScript_1.5_Reference/Statements/with">Core JavaScript 1.5 Reference:Statements:with</a> を参照してください。</p> <p>{{ PreviousNext("JavaScript/Guide/Loop_Statements/continue_Statement", "JavaScript/Guide/Comments") }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/predefined_functions/escape_and_unescape_functions/index.html b/files/ja/orphaned/web/javascript/guide/predefined_functions/escape_and_unescape_functions/index.html index 6d126722b1..ca2ec31ef2 100644 --- a/files/ja/orphaned/web/javascript/guide/predefined_functions/escape_and_unescape_functions/index.html +++ b/files/ja/orphaned/web/javascript/guide/predefined_functions/escape_and_unescape_functions/index.html @@ -12,5 +12,5 @@ original_slug: Web/JavaScript/Guide/Predefined_Functions/escape_and_unescape_Fun unescape(string) </pre> <p>これらの関数は主にサーバサイド JavaScript で URL 中の名前と値のペアのエンコードやデコードに使用されます。</p> - <code>escape</code> および <code>unescape</code> 関数は 非 ASCII 文字に対しては正しく機能せず、廃止予定になっています。JavaScript 1.5 以降では <code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/encodeURI" title="ja/Core_JavaScript_1.5_Reference/Global_Functions/encodeURI">encodeURI</a></code>、<code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/decodeURI" title="ja/Core_JavaScript_1.5_Reference/Global_Functions/decodeURI">decodeURI</a></code>、<code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/encodeURIComponent" title="ja/Core_JavaScript_1.5_Reference/Global_Functions/encodeURIComponent">encodeURIComponent</a></code> および <code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/decodeURIComponent" title="ja/Core_JavaScript_1.5_Reference/Global_Functions/decodeURIComponent">decodeURIComponent</a></code> を使用してください。</div> + <code>escape</code> および <code>unescape</code> 関数は 非 ASCII 文字に対しては正しく機能せず、廃止予定になっています。JavaScript 1.5 以降では <code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/encodeURI">encodeURI</a></code>、<code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/decodeURI">decodeURI</a></code>、<code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/encodeURIComponent">encodeURIComponent</a></code> および <code><a href="/ja/Core_JavaScript_1.5_Reference/Global_Functions/decodeURIComponent">decodeURIComponent</a></code> を使用してください。</div> <p>{{ PreviousNext("JavaScript/Guide/Predefined_Functions/Number_and_String_Functions", "JavaScript/Guide/Objects_and_Properties") }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/predefined_functions/index.html b/files/ja/orphaned/web/javascript/guide/predefined_functions/index.html index 3738bf8da4..e802cc270a 100644 --- a/files/ja/orphaned/web/javascript/guide/predefined_functions/index.html +++ b/files/ja/orphaned/web/javascript/guide/predefined_functions/index.html @@ -7,12 +7,12 @@ original_slug: Web/JavaScript/Guide/Predefined_Functions <h3 id=".E5.AE.9A.E7.BE.A9.E6.B8.88.E3.81.BF.E9.96.A2.E6.95.B0" name=".E5.AE.9A.E7.BE.A9.E6.B8.88.E3.81.BF.E9.96.A2.E6.95.B0">定義済み関数</h3> <p>JavaScript にはトップレベルの定義済み関数がいくつかあります。</p> <ul> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/eval_Function" title="ja/Core_JavaScript_1.5_Guide/Predefined_Functions/eval_Function">eval</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isFinite_Function" title="ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isFinite_Function">isFinite</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isNaN_Function" title="ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isNaN_Function">isNaN</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/parseInt_and_parseFloat_Functions" title="ja/Core_JavaScript_1.5_Guide/Predefined_Functions/parseInt_and_parseFloat_Functions">parseInt と parseFloat</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/Number_and_String_Functions" title="ja/Core_JavaScript_1.5_Guide/Predefined_Functions/Number_and_String_Functions">Number と String</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/escape_and_unescape_Functions" title="ja/Core_JavaScript_1.5_Guide/Predefined_Functions/escape_and_unescape_Functions">encodeURI と decodeURI、encodeURIComponent、decodeURIComponent(すべて Javascript 1.5 以降で使用可能)</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/eval_Function">eval</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isFinite_Function">isFinite</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/isNaN_Function">isNaN</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/parseInt_and_parseFloat_Functions">parseInt と parseFloat</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/Number_and_String_Functions">Number と String</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/escape_and_unescape_Functions">encodeURI と decodeURI、encodeURIComponent、decodeURIComponent(すべて Javascript 1.5 以降で使用可能)</a></li> </ul> </div> <p>{{ PreviousNext("JavaScript/Guide/Using_the_arguments_object", "JavaScript/Guide/Predefined_Functions/eval_Function") }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/the_employee_example/creating_the_hierarchy/index.html b/files/ja/orphaned/web/javascript/guide/the_employee_example/creating_the_hierarchy/index.html index 9ed2621e37..41ec88a890 100644 --- a/files/ja/orphaned/web/javascript/guide/the_employee_example/creating_the_hierarchy/index.html +++ b/files/ja/orphaned/web/javascript/guide/the_employee_example/creating_the_hierarchy/index.html @@ -6,7 +6,7 @@ original_slug: Web/JavaScript/Guide/The_Employee_Example/Creating_the_Hierarchy <h3 id=".E9.9A.8E.E5.B1.A4.E3.81.AE.E4.BD.9C.E6.88.90" name=".E9.9A.8E.E5.B1.A4.E3.81.AE.E4.BD.9C.E6.88.90">階層の作成</h3> <p>Employee の階層を実装するための適当なコンストラクタ関数を定義する方法はいくつかあります。これの定義に何を選択するかは、アプリケーションで何ができるようにしたいかに大きくよります。</p> <p>このセクションではとても単純(かつ比較的柔軟でない)定義の使用方法を示し、継承を機能させる方法を実際に示します。これらの定義では、オブジェクト作成時に何らかのプロパティの値を指定することはできません。新しく作成されるオブジェクトは単にデフォルトの値を取得するだけです。これは後から変更できます。図 8.2 ではこれらの単純な定義を備えた階層を例示します。</p> -<p>実際のアプリケーションでは、オブジェクト作成時にプロパティの値を設定できるようにするコンストラクタを定義することになるでしょう(詳しくは <a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors">より柔軟なコンストラクタ</a> を参照)。今回はこれらの単純な定義を使用して、継承はどのようにして起こるのかを実際に示していくことにします。</p> +<p>実際のアプリケーションでは、オブジェクト作成時にプロパティの値を設定できるようにするコンストラクタを定義することになるでしょう(詳しくは <a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors">より柔軟なコンストラクタ</a> を参照)。今回はこれらの単純な定義を使用して、継承はどのようにして起こるのかを実際に示していくことにします。</p> <p><img alt="Image:hier02.gif" class="internal" src="/@api/deki/files/1905/=Hier02.gif"><br> <small><strong>図 8.2:Employee オブジェクトの定義</strong></small></p> <p>以下に示すように、Java と JavaScript の <code>Employee</code> の定義は似ています。唯一の相違点は、Java では各プロパティに対して型を指定する必要があるのに対して、JavaScript ではその必要がないことです。また、Java のクラスでは明示的なコンストラクタメソッドを作成する必要があります。</p> diff --git a/files/ja/orphaned/web/javascript/guide/the_employee_example/index.html b/files/ja/orphaned/web/javascript/guide/the_employee_example/index.html index b47856921c..79fd796301 100644 --- a/files/ja/orphaned/web/javascript/guide/the_employee_example/index.html +++ b/files/ja/orphaned/web/javascript/guide/the_employee_example/index.html @@ -17,14 +17,14 @@ original_slug: Web/JavaScript/Guide/The_Employee_Example </ul> <p>残りの例:</p> <ul> - <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Creating_the_Hierarchy" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Creating_the_Hierarchy">階層の作成</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties">オブジェクトのプロパティ</a> + <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Creating_the_Hierarchy">階層の作成</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties">オブジェクトのプロパティ</a> <ul> - <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Inheriting_Properties" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Inheriting_Properties">プロパティの継承</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Adding_Properties" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Adding_Properties">プロパティの追加</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Inheriting_Properties">プロパティの継承</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Adding_Properties">プロパティの追加</a></li> </ul> </li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors">より柔軟なコンストラクタ</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/More_Flexible_Constructors">より柔軟なコンストラクタ</a></li> </ul> <div class="noinclude"> <p>{{ PreviousNext("Core_JavaScript_1.5_Guide:Class-Based_vs._Prototype-Based_Languages", "Core_JavaScript_1.5_Guide:The_Employee_Example:Creating_the_Hierarchy") }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/index.html b/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/index.html index 80c2494cf2..2cf27ea0ba 100644 --- a/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/index.html +++ b/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/index.html @@ -6,8 +6,8 @@ original_slug: Web/JavaScript/Guide/The_Employee_Example/Object_Properties <h3 id=".E3.82.AA.E3.83.96.E3.82.B8.E3.82.A7.E3.82.AF.E3.83.88.E3.81.AE.E3.83.97.E3.83.AD.E3.83.91.E3.83.86.E3.82.A3" name=".E3.82.AA.E3.83.96.E3.82.B8.E3.82.A7.E3.82.AF.E3.83.88.E3.81.AE.E3.83.97.E3.83.AD.E3.83.91.E3.83.86.E3.82.A3">オブジェクトのプロパティ</h3> <p>このセクションでは、プロトタイプチェーンにおいてオブジェクトが他のオブジェクトからどのようにプロパティを継承するのか、また、実行時にプロパティを追加すると何が起きるのかについて論じます。</p> <ul> - <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Inheriting_Properties" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Inheriting_Properties">プロパティの継承</a></li> - <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Adding_Properties" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Adding_Properties">プロパティの追加</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Inheriting_Properties">プロパティの継承</a></li> + <li><a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Object_Properties/Adding_Properties">プロパティの追加</a></li> </ul> <div class="noinclude"> <p>{{ PreviousNext("Core_JavaScript_1.5_Guide:The_Employee_Example:Creating_the_Hierarchy", "Core_JavaScript_1.5_Guide:The_Employee_Example:Object_Properties:Inheriting_Properties") }}</p> diff --git a/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/inheriting_properties/index.html b/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/inheriting_properties/index.html index 159c3c4e01..b860b5871f 100644 --- a/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/inheriting_properties/index.html +++ b/files/ja/orphaned/web/javascript/guide/the_employee_example/object_properties/inheriting_properties/index.html @@ -6,7 +6,7 @@ original_slug: >- Web/JavaScript/Guide/The_Employee_Example/Object_Properties/Inheriting_Properties --- <h3 id=".E3.83.97.E3.83.AD.E3.83.91.E3.83.86.E3.82.A3.E3.81.AE.E7.B6.99.E6.89.BF" name=".E3.83.97.E3.83.AD.E3.83.91.E3.83.86.E3.82.A3.E3.81.AE.E7.B6.99.E6.89.BF">プロパティの継承</h3> -<p>次の文を用いて(<a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Creating_the_Hierarchy" title="ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Creating_the_Hierarchy">図 8.3</a> で示したように)<code>mark</code> オブジェクトを <code>WorkerBee</code> として作成するとします。</p> +<p>次の文を用いて(<a href="/ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Creating_the_Hierarchy">図 8.3</a> で示したように)<code>mark</code> オブジェクトを <code>WorkerBee</code> として作成するとします。</p> <pre class="eval">mark = new WorkerBee; </pre> <p>JavaScript は new 演算子に出くわすと、新しく汎用オブジェクトを生成し、この新しいオブジェクトを <code>this</code> キーワードの値として WorkerBee コンストラクタ関数に渡します。コンストラクタ関数は明示的に <code>projects</code> プロパティの値をセットします。さらに、内部的な <code>__proto__</code> プロパティの値として <code>WorkerBee.prototype</code> の値をセットします。(このプロパティ名は最初と最後に 2 文字ずつのアンダースコアが付いています。)<code>__proto__</code> プロパティはプロパティの値を返すのに使用されるプロトタイプチェーンを決定します。これらのプロパティがセットされると JavaScript は新しいオブジェクトを返し、代入文は変数 <code>mark</code> にそのオブジェクトをセットします。</p> @@ -15,7 +15,7 @@ original_slug: >- mark.dept = "general"; mark.projects = []; </pre> -<p><code>mark</code> オブジェクトは <code>mark.__proto__</code> の原型的なオブジェクトから name および dept プロパティの値を継承します。WorkerBee コンストラクタによって projects プロパティにローカルの値が代入されます。このことでプロパティとその値を継承することができます。このプロセスの細かいところは <a href="/ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited" title="ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited">プロパティの継承、再び</a> にて議論します。</p> +<p><code>mark</code> オブジェクトは <code>mark.__proto__</code> の原型的なオブジェクトから name および dept プロパティの値を継承します。WorkerBee コンストラクタによって projects プロパティにローカルの値が代入されます。このことでプロパティとその値を継承することができます。このプロセスの細かいところは <a href="/ja/Core_JavaScript_1.5_Guide/Property_Inheritance_Revisited">プロパティの継承、再び</a> にて議論します。</p> <p>これらのコンストラクタにインスタンス固有の値を渡せないため、この情報は汎用的になります。プロパティの値は WorkerBee によって作成されるすべての新しいオブジェクトに共有される、デフォルトの値になります。もちろん、これらのどのプロパティのでもその値を変えることができます。そのためには次のようにして <code>mark</code> に固有の情報を与えます。</p> <pre class="eval">mark.name = "Doe, Mark"; mark.dept = "admin"; diff --git a/files/ja/orphaned/web/javascript/guide/using_the_arguments_object/index.html b/files/ja/orphaned/web/javascript/guide/using_the_arguments_object/index.html index 18259c91ce..446895507c 100644 --- a/files/ja/orphaned/web/javascript/guide/using_the_arguments_object/index.html +++ b/files/ja/orphaned/web/javascript/guide/using_the_arguments_object/index.html @@ -30,7 +30,7 @@ myConcat("; ", "elephant", "giraffe", "lion", "cheetah"); // "sage. basil. oregano. pepper. parsley. " を返す myConcat(". ", "sage", "basil", "oregano", "pepper", "parsley"); </pre> - <p>さらなる情報については、コア JavaScript リファレンスの <a href="/ja/Core_JavaScript_1.5_Reference/Objects/Function" title="ja/Core_JavaScript_1.5_Reference/Objects/Function">Function オブジェクト</a> をご覧ください。</p> + <p>さらなる情報については、コア JavaScript リファレンスの <a href="/ja/Core_JavaScript_1.5_Reference/Objects/Function">Function オブジェクト</a> をご覧ください。</p> <p><strong>JavaScript 1.3 以前のバージョン</strong><br> arguments オブジェクトは <code>Function</code> オブジェクトのプロパティであり、次のように関数の名前を前に付けることができます。</p> functionName.arguments{{ mediawiki.external('i') }}</div> diff --git a/files/ja/orphaned/web/javascript/guide/writing_a_regular_expression_pattern/index.html b/files/ja/orphaned/web/javascript/guide/writing_a_regular_expression_pattern/index.html index ee4583e4b4..f94d505365 100644 --- a/files/ja/orphaned/web/javascript/guide/writing_a_regular_expression_pattern/index.html +++ b/files/ja/orphaned/web/javascript/guide/writing_a_regular_expression_pattern/index.html @@ -5,7 +5,7 @@ original_slug: Web/JavaScript/Guide/Writing_a_Regular_Expression_Pattern --- <h3 id=".E6.AD.A3.E8.A6.8F.E8.A1.A8.E7.8F.BE.E3.83.91.E3.82.BF.E3.83.BC.E3.83.B3.E3.82.92.E6.9B.B8.E3.81.8F" name=".E6.AD.A3.E8.A6.8F.E8.A1.A8.E7.8F.BE.E3.83.91.E3.82.BF.E3.83.BC.E3.83.B3.E3.82.92.E6.9B.B8.E3.81.8F">正規表現パターンを書く</h3> -<p>正規表現パターンは、<code>/abc/</code> のような単純な文字、または <code>/ab*c/</code> や <code>/Chapter (\d+)\.\d*/</code> のような単純な文字と特殊文字との組み合わせからなります。最後の例では記憶装置として使われている丸括弧が含まれています。パターンのこの部分でなされたマッチは後で使用できるように記憶されます。詳しくは <a href="/ja/docs/JavaScript/Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches" title="ja/docs/JavaScript/Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches">括弧で囲まれた部分文字列のマッチの使用</a> を参照してください。</p> +<p>正規表現パターンは、<code>/abc/</code> のような単純な文字、または <code>/ab*c/</code> や <code>/Chapter (\d+)\.\d*/</code> のような単純な文字と特殊文字との組み合わせからなります。最後の例では記憶装置として使われている丸括弧が含まれています。パターンのこの部分でなされたマッチは後で使用できるように記憶されます。詳しくは <a href="/ja/docs/JavaScript/Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches">括弧で囲まれた部分文字列のマッチの使用</a> を参照してください。</p> <h4 id="単純なパターンの使用">単純なパターンの使用</h4> @@ -183,7 +183,7 @@ original_slug: Web/JavaScript/Guide/Writing_a_Regular_Expression_Pattern <h4 id="括弧の使用">括弧の使用</h4> -<p>正規表現パターンの一部分を括弧で囲むことで、マッチした部分文字列のその部分を記憶しておくことができます。一度記憶すると、後からその部分文字列を呼び戻すことができます。これに関しては <a href="/ja/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches" title="ja/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches">括弧で囲まれた部分文字列のマッチの使用</a> で説明しています。</p> +<p>正規表現パターンの一部分を括弧で囲むことで、マッチした部分文字列のその部分を記憶しておくことができます。一度記憶すると、後からその部分文字列を呼び戻すことができます。これに関しては <a href="/ja/Core_JavaScript_1.5_Guide/Working_with_Regular_Expressions/Using_Parenthesized_Substring_Matches">括弧で囲まれた部分文字列のマッチの使用</a> で説明しています。</p> <p>例えば、<code>/Chapter (\d+)\.\d*/</code> というパターンでは、エスケープされた文字と特殊文字の部分がその例で、その部分を記憶するように指示しています。これは 'Chapter ' という文字列、それに続く 1 文字以上の数字(\d はいずれかの数字を意味し、+ は 1 回以上の繰り返しを意味する)、それに続く小数点(それ自体は特殊文字であり、小数点の前の \ はパターンが '.' という文字そのものを探すようにすることを意味する)、それに続く 0 文字以上の数字(\d は数字を意味し、* は 0 回以上の繰り返しを意味する)にマッチします。さらに、括弧を使うことで最初のマッチした数値を記憶させます。</p> diff --git a/files/ja/orphaned/web/javascript/reference/global_objects/weakset/clear/index.html b/files/ja/orphaned/web/javascript/reference/global_objects/weakset/clear/index.html deleted file mode 100644 index 0ed95f130e..0000000000 --- a/files/ja/orphaned/web/javascript/reference/global_objects/weakset/clear/index.html +++ /dev/null @@ -1,50 +0,0 @@ ---- -title: WeakSet.prototype.clear() -slug: orphaned/Web/JavaScript/Reference/Global_Objects/WeakSet/clear -tags: - - JavaScript - - Method - - Obsolute - - Prototype - - WeakSet -translation_of: Web/JavaScript/Reference/Global_Objects/WeakSet/clear -original_slug: Web/JavaScript/Reference/Global_Objects/WeakSet/clear ---- -<div>{{JSRef("Global_Objects", "WeakSet")}} {{obsolete_header}}</div> - -<h2 id="Summary" name="Summary">概要</h2> - -<p><code>WeakSet</code>オブジェクトからすべての要素を削除します。</p> - -<h2 id="Syntax" name="Syntax">構文</h2> - -<pre class="syntaxbox"><code><em>ws</em>.clear();</code></pre> - -<h2 id="Examples" name="Examples">例</h2> - -<h3 id="Example:_Testing_size_of_all_array_elements" name="Example:_Testing_size_of_all_array_elements">例: <code>clear</code> メソッドを使う</h3> - -<pre class="brush: js">var ws = new WeakSet(); - -ws.add(window); -ws.has(window); // true - -ws.clear(); - -ws.has(window); // false -</pre> - -<h2 id="仕様">仕様</h2> - -<p>すべての現在の標準やドラフトでサポートされていません。このメソッドは、リビジョン 28 (October 14, 2014のバージョン)までECMAScript第6版ドラフト仕様でサポートされました。しかし、最新バージョンのドラフトで削除されました。最終仕様では、サポートされていません。</p> - -<h2 id="ブラウザ実装状況">ブラウザ実装状況</h2> - -<p>{{Compat("javascript.builtins.WeakSet.clear")}}</p> - -<h2 id="関連情報">関連情報</h2> - -<ul> - <li>{{jsxref("WeakSet")}}</li> - <li>{{jsxref("WeakSet.prototype.delete()")}}</li> -</ul> diff --git a/files/ja/orphaned/web/svg/element/solidcolor/index.html b/files/ja/orphaned/web/svg/element/solidcolor/index.html deleted file mode 100644 index 56480133c7..0000000000 --- a/files/ja/orphaned/web/svg/element/solidcolor/index.html +++ /dev/null @@ -1,84 +0,0 @@ ---- -title: <solidcolor> -slug: orphaned/Web/SVG/Element/solidColor -tags: - - Element - - Experimental - - Reference - - SVG -translation_of: Web/SVG/Element/solidColor -original_slug: Web/SVG/Element/solidColor ---- -<div>{{SVGRef}}{{obsolete_header}}</div> - -<p class="seoSummary"><strong><code><solidcolor></code></strong> は <a href="/ja/docs/Web/SVG">SVG</a> の要素で、 SVG 文書内の複数の場所で使用する単一の色を定義することができます。パレットの色をアニメーションさせるのにも便利です。</p> - -<p class="note"><strong>注:</strong> これは実験的な義jツウであり、まだブラウザーには実装されていません。回避策としては、 {{SVGElement("linearGradient")}} を単一の色経由点で扱うというものがあります。これはあまりすっきりしておらず、 <code><solidcolor></code> とは異なり、それ自身をグラデーションの定義に使用することができません。</p> - -<h2 id="Usage_context" name="Usage_context">使用場面</h2> - -<p>{{svginfo}}</p> - -<h2 id="Attributes" name="Attributes">属性</h2> - -<h3 id="Global_attributes" name="Global_attributes">グローバル属性</h3> - -<ul> - <li><a href="/ja/docs/Web/SVG/Attribute#Core_attributes">コア属性</a></li> - <li><a href="/ja/docs/Web/API/GlobalEventHandlers">グローバルイベント属性</a></li> - <li><a href="/ja/docs/Web/SVG/Attribute#Presentation_attributes">プレゼンテーション属性</a></li> - <li><a href="/en-US/docs/Web/SVG/Attribute#Style_attributes">スタイル属性</a></li> -</ul> - -<h3 id="Specific_attributes" name="Specific_attributes">固有の属性</h3> - -<p><em>なし。</em></p> - -<h2 id="DOM_interface" name="DOM_interface">DOM インターフェイス</h2> - -<p>この要素は {{domxref("SVGSolidcolorElement")}} インターフェイスを実装しています。</p> - -<h2 id="Example" name="Example">例</h2> - -<h3 id="SVG">SVG</h3> - -<pre class="brush: html notranslate"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 200" height="150"> - <defs> - <!-- solidColor is experimental. --> - <solidcolor id="myColor" solid-color="gold" solid-opacity="0.8"/> - - <!-- linearGradient with a single color stop is a less elegant way to - achieve the same effect, but it works in current browsers. --> - <linearGradient id="myGradient"> - <stop offset="0" stop-color="green" /> - </linearGradient> - </defs> - - <text x="10" y="20">Circles colored with solidColor</text> - <circle cx="150" cy="65" r="35" stroke-width="2" stroke="url(#myColor)" - fill="white"/> - <circle cx="50" cy="65" r="35" fill="url(#myColor)"/> - - <text x="10" y="120">Circles colored with linearGradient</text> - <circle cx="150" cy="165" r="35" stroke-width="2" stroke="url(#myGradient)" - fill="white"/> - <circle cx="50" cy="165" r="35" fill="url(#myGradient)"/> -</svg> -</pre> - -<h3 id="Result" name="Result">結果</h3> - -<p>{{EmbedLiveSample("Example")}}</p> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("svg.elements.solidcolor")}}</p> - -<h2 id="See_also" name="See_also">関連情報</h2> - -<ul> - <li>{{domxref("SVGSolidcolorElement")}}</li> - <li>{{cssxref("solid-color")}}</li> - <li>{{cssxref("solid-opacity")}}</li> - <li>{{SVGElement("linearGradient")}}</li> -</ul> diff --git a/files/ja/orphaned/xpcom_components_list/index.html b/files/ja/orphaned/xpcom_components_list/index.html deleted file mode 100644 index 82111f5f42..0000000000 --- a/files/ja/orphaned/xpcom_components_list/index.html +++ /dev/null @@ -1,20 +0,0 @@ ---- -title: XPCOM components list -slug: orphaned/XPCOM_components_list -tags: - - Components - - NeedsContent - - XPCOM - - XPCOM API Reference -original_slug: XPCOM_components_list ---- -<p>ここには<a href="ja/Interfaces">Interfaces</a>一覧のようなコンポーネントの包括的な一覧を必要としています。 -</p> -<h3 id=".E3.82.B3.E3.83.B3.E3.83.9D.E3.83.BC.E3.83.8D.E3.83.B3.E3.83.88.E3.81.AE.E3.82.A2.E3.83.AB.E3.83.95.E3.82.A1.E3.83.99.E3.83.83.E3.83.88.E9.A0.86.E3.81.AE.E4.B8.80.E8.A6.A7_.28.E6.9C.AA.E5.AE.8C.E6.88.90.29"> コンポーネントのアルファベット順の一覧 (未完成) </h3> -<ul><li> <a href="ja/NsDirectoryService">nsDirectoryService</a> -</li><li> <a href="ja/NsObserverService">nsObserverService</a> -</li><li> <a href="ja/NsScriptableInputStream">nsScriptableInputStream</a> -</li></ul> -<div class="noinclude"> -</div> -{{ languages( { "en": "en/XPCOM_components_list", "fr": "fr/Liste_des_composants_XPCOM", "ko": "ko/XPCOM_components_list", "pl": "pl/Lista_komponent\u00f3w_XPCOM" } ) }} diff --git a/files/ja/orphaned/xpcom_plans/index.html b/files/ja/orphaned/xpcom_plans/index.html deleted file mode 100644 index ec97ffe14b..0000000000 --- a/files/ja/orphaned/xpcom_plans/index.html +++ /dev/null @@ -1,33 +0,0 @@ ---- -title: XPCOM plans -slug: orphaned/XPCOM_plans -tags: - - XPCOM -original_slug: XPCOM_plans ---- -<p>{{ Outdated("このページは 2001 年 8 月を最後に更新されておらず、歴史的重要性を残すにとどまるでしょう。") }}</p> -<h3 id=".E3.82.82.E3.81.A3.E3.81.A8.E3.82.82.E9.87.8D.E8.A6.81.E3.81.AA.E7.9B.AE.E6.A8.99:_Mozilla_.E3.81.AE.E8.88.B9.E5.87.BA.E3.80.82" name=".E3.82.82.E3.81.A3.E3.81.A8.E3.82.82.E9.87.8D.E8.A6.81.E3.81.AA.E7.9B.AE.E6.A8.99:_Mozilla_.E3.81.AE.E8.88.B9.E5.87.BA.E3.80.82">もっとも重要な目標: Mozilla の船出。</h3> -<p><em>完了</em></p> -<p>XPCOM のもっとも重要な目標は、何年も前から述べられているとおり、ブラウザを船出させることでした。そこまでこぎつけました。そして今、私たちは複数のバージョンの Mozilla ブラウザを得ています。 Netscape 6.x、Galleon、など。最近数週間を通して、次に何をすべきかについて XPCOM を使っているさまざまなグループと意見交換をしました。使用者たちは API セットの変更に追従するための労力を費やしたくない、というひとつのことが、くっきりと明瞭になりました。これらの議論から、私たちは Mozilla 1.0 リリースへの迅速なアプローチとして、要求される XPCOM インタフェースに対して 最小主義的なアプローチをすべきだと信じます (例:どうしても必要な最小限の API だけをフリーズ (固定) する)。</p> -<p>安定した API を危機的なほど必要としている二つの利用者は、プラグインと組み込みです。いずれも XPCOM の初期化、停止、コンポーネントとサービスの管理を可能とする XPCOM の API のセットに興味を持っています。 Mozilla 1.0 のためには、XPCOM は最低限としてこの機能性を得られる API をフリーズすべきと信じています。</p> -<p>私たちは組み込みグループで作業してきています。そして <a class="external" href="http://www.mozilla.org/projects/embedding/EmbedInterfaceFreeze.html">必要</a>と考えられるインタフェースのこのリストを提示しました。(これらのインタフェースのいくつかは XPCOM には当てはまらないことに注意) もし、必要と思われるのにこのリストから抜け落ちている XPCOM インタフェースが見つかったら、私 <a class="link-mailto" href="mailto:dougt@netscape.com">Doug Turner</a> 宛にメールをするか、XPCOM <a class="external" href="/news:mozilla.dev.tech.xpcom" title="news:mozilla.dev.tech.xpcom">ニュースグループ</a> に投稿するかをぜひお願いします。</p> -<h3 id="XPCOM_.E3.81.AE_Mozilla_1.0_.E3.81.B8.E3.81.AE.E9.81.93" name="XPCOM_.E3.81.AE_Mozilla_1.0_.E3.81.B8.E3.81.AE.E9.81.93">XPCOM の Mozilla 1.0 への道</h3> -<p><strong>もっとも重要な目標は XPCOM 中核の機能へのインタフェースのフリーズです。</strong></p> -<p>私たちのリスト上の現在のインタフェースリストは、基本的な COM の機能を含んでいます。スレッド処理、リフレクション、多くのデータ構造など、ほとんどの XPCOM の機能は Mozilla 1.0 を前にしたこの時間枠において、フリーズされないでしょう。</p> -<p>この SDK はインタフェースのセットと接続ライブラリをフリーズすることも含むでしょう。このインタフェースのセットは、組み込みとプラグインの要求によって定義されてきました。これらのインタフェースは以下のものを含んでいます:</p> -<ul> <li>nsIClassInfo</li> <li>nsIComponentManager</li> <li>nsIDirectoryService</li> <li>nsIDirectoryServiceProvider</li> <li>nsIFactory</li> <li>nsIFile</li> <li>nsIInputStream</li> <li>nsIInterfaceRequestor</li> <li>nsILocalFile</li> <li>nsIMemory</li> <li>nsIModule</li> <li>nsIObserver</li> <li>nsIOutputStream</li> <li>nsIProperties</li> <li>nsIServiceManager</li> <li>nsISimpleEnumerator</li> <li>nsISupports</li> <li>nsIWeakReference</li> -</ul> -<p>接続ライブラリは、気軽に使えるクラスとマクロのセット、そしてフリーズされていないクラスで構成されます。これをコンポーネント開発者は、例えば XPCOM にリンクしなくてよい nsCOMPtr の構成要素を活用することができます。<strong>次に重要な目標は XPCOM 中核の機能へのインタフェースのフリーズです。</strong></p> -<p>ひとたび、フリーズされたインタフェースのセットを得ました。これらのインタフェースの実装の内部の起動・終了・スレッド処理などの問題に言及しなくてはいけません。トラッキングバグ {{ Bug(101976) }} の追跡で言及されるべき知られた問題を一覧とすることができます。</p> -<h3 id="Mozilla_1.0_.E4.BB.A5.E9.99.8D:_XPCOM_.E3.81.AE.E6.94.B9.E8.89.AF" name="Mozilla_1.0_.E4.BB.A5.E9.99.8D:_XPCOM_.E3.81.AE.E6.94.B9.E8.89.AF">Mozilla 1.0 以降: XPCOM の改良</h3> -<p>XPCOM 改良のための全体的な計画は、小さくすること、シンプルにすること、クリーンにすること、必要な機能によりチューニングすること、より関係する標準に沿わせること、などを中心に展開しています。 XPCOM を軽く保つほど、XPCOM のデバッグ、移植、保守が楽になり、アプリケーションの組み込みの手間が減ります。そのためには、それほどには活用されない XPCOM の機能はもう必要ないでしょう。単独のクライアントが使うためだけに存在するものは、検証済みでなくてはならず、願わくば根絶されるべきです。</p> -<p>XPCOM の機能の大きな部分が、C++ クライアントへ向けられています。標準 C++ ライブラリを使った組み込みアプリケーションを期待することができます。 XPCOM の機能が標準 C++ ライブラリによって提供される類似のサービスと重なっている場所では、 API と機能を標準ライブラリのそれへ変換したいです。いずれは、クライアントは標準ライブラリから実装を入手できるようになり、API が取り除かれるようになります。</p> -<p>標準ライブラリから提供されるのではないこれらの機能のために、私たちは適切に標準ライブラリと互換を持った API を作りたいのです。例えば、XPCOM の container は標準アルゴリズムとともに働くべきでしょう。</p> -<h3 id=".E5.8F.82.E8.80.83.E8.B3.87.E6.96.99" name=".E5.8F.82.E8.80.83.E8.B3.87.E6.96.99">参考資料</h3> -<ul> <li><a class="external" href="http://www.mozilla.org/projects/xpcom/XPCOM_tasks.html">既知の作業</a></li> <li>{{ Bug(98278) }} - XPCOM API 変更についてのメタバグ</li> -</ul> -<div class="originaldocinfo"> -<h2 id=".E5.8E.9F.E6.96.87.E6.9B.B8.E3.81.AE.E6.83.85.E5.A0.B1" name=".E5.8E.9F.E6.96.87.E6.9B.B8.E3.81.AE.E6.83.85.E5.A0.B1">原文書の情報</h2> -<ul> <li>著者: 不明</li> <li>最終日: October 30, 2001</li> <li>著作権: Portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a Creative Commons license | <a class="external" href="http://www.mozilla.org/foundation/licensing/website-content.html">詳細</a>.</li> -</ul> -</div> |
