From a5fcfafb665e96cae5d04dfba927db8dcdfd7f14 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Sun, 13 Dec 2020 17:16:08 -0500 Subject: 2020-12-13 --- files/ja/web/api/clipboard/index.html | 2 +- files/ja/web/css/content-visibility/index.html | 119 +++++++++++++++++++++ .../intl/numberformat/resolvedoptions/index.html | 109 +++++++------------ .../numberformat/supportedlocalesof/index.html | 58 +++++----- 4 files changed, 188 insertions(+), 100 deletions(-) create mode 100644 files/ja/web/css/content-visibility/index.html (limited to 'files/ja/web') diff --git a/files/ja/web/api/clipboard/index.html b/files/ja/web/api/clipboard/index.html index cd25f411b6..c4cf3e26d4 100644 --- a/files/ja/web/api/clipboard/index.html +++ b/files/ja/web/api/clipboard/index.html @@ -59,7 +59,7 @@ translation_of: Web/API/Clipboard

例えば、Firefox はまだ "clipboard-read" と "clipboard-write" パーミッションをサポートしていないため、これとは異なる方法でクリップボードの内容にアクセスし変更するメソッドへのアクセスを制限します。

-

WebExtension の場合、clipboardRead や clipboardWrite パーミッションを要求することで clipboard.readText() や clipboard.writeText() を使うことができます。ウェブサイトに適用されたコンテンツスクリプトは、Clipboard オブジェクトにアクセスすることはできません。Extensions in Firefox 63 を参照してください。

+

WebExtension の場合、clipboardRead や clipboardWrite パーミッションを要求することで clipboard.readText() や clipboard.writeText() を使うことができます。HTTPサイトに適用されたコンテンツスクリプトは、Clipboard オブジェクトにアクセスすることはできません。Extensions in Firefox 63 を参照してください。

また、{{domxref("Clipboard.read", "read()")}} と {{domxref("Clipboard.write", "write()")}} はデフォルトで無効にされており、これらを有効にするには設定を変更する必要があります。これらを使う前にブラウザー実装状況の表を確認してください。

diff --git a/files/ja/web/css/content-visibility/index.html b/files/ja/web/css/content-visibility/index.html new file mode 100644 index 0000000000..d480c67fed --- /dev/null +++ b/files/ja/web/css/content-visibility/index.html @@ -0,0 +1,119 @@ +--- +title: content-visibility +slug: Web/CSS/content-visibility +translation_of: Web/CSS/content-visibility +--- +

{{CSSRef}}

+ +

content-visibility CSSプロパティは、要素がそのコンテンツをレンダリングするかどうかを制御するとともに、強力な包含セットを強制することで、ユーザーエージェントが必要になるまで大量のレイアウトとレンダリング作業を省略できるようにします。基本的に、ユーザーエージェントは、レイアウトやペイントなどの要素のレンダリング作業を必要になるまでスキップできるため、最初のページの読み込みがはるかに高速になります。

+ +

文法

+ + + +
/* Keyword values */
+content-visibility: visible;
+content-visibility: hidden;
+content-visibility: auto;
+
+/* Global values */
+content-visibility: initial;
+content-visibility: unset;
+
+ + + +

値

+ +
+
visible
+
+

無効。要素のコンテンツは通常どおりにレイアウトおよびレンダリングされます。

+ + +
+
hidden
+
+

要素はその内容をスキップします。スキップされたコンテンツは、ページ内検索、タブオーダーナビゲーションなどのユーザーエージェント機能にアクセスできたり、選択またはフォーカス可能であってはなりません。これは、display: noneをコンテンツに与えるのと似ています。

+ + +
+
auto
+
+

この要素は、レイアウトの封じ込め、スタイルの封じ込め、およびペイントの封じ込めをオンにします。要素がユーザーに関連していない場合は、その内容もスキップします。非表示とは異なり、スキップされたコンテンツは、ページ内検索、タブオーダーナビゲーションなどのユーザーエージェント機能に対して通常どおり利用可能である必要があり、通常どおりフォーカス可能で選択可能である必要があります。

+
+
+ +

例

+ +

autoを使用して長いページのレンダリングコストを削減

+ +

次の例は、autoを使用して画面外のセクションのペイントとレンダリングをスキップする方法を示しています。ビューポート外のコンテンツはレンダリングされないため、これはページの読み込みと操作の両方に役立ちます。

+ +
<style>
+section {
+  content-visibility: auto;
+  contain-intrinsic-size: 0 500px;
+}
+
+<section>...
+<section>...
+<section>...
+<section>...
+...
+
+ +

hiddenを使用して手動で可視性を管理

+ +

次の例は、スクリプトで可視性を管理できることを示しています。たとえば、display：noneの代わりにcontent-visiblity：hiddenを使用することの追加の利点は、content-visibilityで非表示にしたときにレンダリングされたコンテンツがレンダリング状態を保持することです。これは、コンテンツが再度表示される場合、他のコンテンツよりも速くレンダリングされることを意味します。

+ +
<style>
+.hidden {
+  content-visibility: hidden;
+  /* 非表示の場合、要素のサイズを0x500pxサイズの子が1つあるかのようにします */
+  contain-intrinsic-size: 0 500px;
+}
+.visible {
+  content-visibility: visible;
+  /* これは、.hiddenと.visibleを切り替えるときにレイアウトがシフトしないようにするためです */
+  contain: style layout paint;
+}
+
+
+
+<div class=hidden>...
+<div class=visible>...
+<div class=hidden>...
+<div class=hidden>...
+
+ +

Specifications

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('CSS Containment 2', '#content-visibility')}}{{Spec2('CSS Containment 2')}}Initial definition
+ +

Browser compatibility

+ + + +

{{Compat("css.properties.content-visibility")}}

+ +

See Also

+ + diff --git a/files/ja/web/javascript/reference/global_objects/intl/numberformat/resolvedoptions/index.html b/files/ja/web/javascript/reference/global_objects/intl/numberformat/resolvedoptions/index.html index e32c959169..737c53f023 100644 --- a/files/ja/web/javascript/reference/global_objects/intl/numberformat/resolvedoptions/index.html +++ b/files/ja/web/javascript/reference/global_objects/intl/numberformat/resolvedoptions/index.html @@ -11,27 +11,41 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/resolv ---
{{JSRef}}
-

ローケルを反映しているプロパティとこの{{jsxref("Global_Objects/NumberFormat", "NumberFormat")}}オブジェクトの初期化中に計算された数値変換オプションをもった新しいオブジェクトを返します。

+

Intl.NumberFormat.prototype.resolvedOptions() メソッドは、この {{jsxref("NumberFormat")}} オブジェクトの初期化時に計算されたロケールと数値整形オプションを反映したプロパティを持つ新しいオブジェクトを返します。

-

構文

+
{{EmbedInteractiveExample("pages/js/intl-numberformat-prototype-resolvedoptions.html")}}
-
numberFormat.resolvedOptions()
+ -

説明

+

構文

-

ローケルを反映しているプロパティとこの{{jsxref("Global_Objects/NumberFormat", "NumberFormat")}}オブジェクトの初期化中に計算された数値変換オプションをもった新しいオブジェクトを返します。オブジェクトは次のプロパティを持っています。:

+
numberFormat.resolvedOptions()
+ +

返値

+ +

この {{jsxref("NumberFormat")}} オブジェクトの初期化時に計算されたロケールと数値整形オプションを反映したプロパティを持つ新しいオブジェクトです。

+ +

解説

+ +

返されるオブジェクトには以下のプロパティがあります。

locale
-
実際に使われているローケルに対するBCP47言語タグ。Unicode表現値が入力BCP47言語タグでリクエストされたら、このローケルに対してリクエストされサポートされているキー／バリューペアはlocaleに含まれます。
+
実際に使用したロケールの BCP 47 言語タグ。このロケールにつながる入力 BCP 47 言語タグに Unicode 拡張値が要求された場合、要求されたキーと値のペアのうち、このロケールで対応しているものが locale に含まれます。
numberingSystem
-
Unicode表現キー"nu"を使うかデフォルトとして設定される値。
-
style
+
もし存在すれば、 options 引数でこのプロパティに指定された値、または Unicode 拡張キーの "nu" を使って要求された値、または既定として設定される値です。
+
notation
+
options 引数でこのプロパティに指定された値、または既定として設定される standard です。
+
compactDisplay
+
options 引数でこのプロパティに指定された値、または既定として設定される short です。
+
このプロパティは notation が "compact" に設定されている場合のみ存在します。
+
signDisplay
+
options 引数でこのプロパティに指定された値、または既定として設定される auto です。
useGrouping
-
options引数でプロパティに対して提供されるかデフォルトとして設定される値。
+
options 引数でこのプロパティに指定された値、または既定として設定される値。
currency
currencyDisplay
-
options引数でプロパティに対して提供されるかデフォルトとして設定される値。styleが"currency"の場合のみ、これらのプロパティは存在しています。
+
options 引数でこのプロパティに指定された値、または既定として設定される値。styleが"currency"の場合のみ、これらのプロパティは存在しています。

次の２つのプロパティのグループのうちどちらかのみが含まれています。:

@@ -40,21 +54,23 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/resolv
minimumIntegerDigits
minimumFractionDigits
maximumFractionDigits
-
options引数でプロパティに対して提供されるかデフォルトとして設定される値。minimumSignificantDigitsまたはmaximumSignificantDigitsがoptions引数で提供されなかった場合のみ、これらのプロパティは存在しています。
+
options 引数でプロパティに対して提供されるか既定で設定される値。 minimumSignificantDigits または maximumSignificantDigits が options 引数で提供されなかった場合のみ、これらのプロパティは存在しています。
minimumSignificantDigits
maximumSignificantDigits
options引数でプロパティに対して提供されるかデフォルトとして設定される値。 これらのプロパティのうち少なくとも１つがoptions引数で提供された場合のみ、これらのプロパティは存在しています。
-

例

+

例

-

resolvedOptions メソッドを使う

+

resolvedOptions メソッドの使用

-
var de = new Intl.NumberFormat('de-DE');
+
var de = new Intl.NumberFormat('de-DE');
 var usedOptions = de.resolvedOptions();
 
 usedOptions.locale;                // "de-DE"
 usedOptions.numberingSystem;       // "latn"
+usedOptions.notation;              // "standard"
+usedOptions.signDisplay;           // "auto"
 usedOption.style;                  // "decimal"
 usedOptions.minimumIntegerDigits;  // 1
 usedOptions.minimumFractionDigits; // 0
@@ -62,77 +78,28 @@ usedOptions.maximumFractionDigits; // 3
 usedOptions.useGrouping;           // true
 

 
-
仕様

+
仕様書

 
 
-   
-   
-   
+   
-   
-   
-   
+   

  
   
仕様状況コメント仕様書
   

   
{{SpecName('ES Int 1.0', '#sec-11.3.3', 'Intl.NumberFormat.prototype.resolvedOptions')}}{{Spec2('ES Int 1.0')}}Initial definition.{{SpecName('ES Int Draft', '#sec-intl.numberformat.prototype.resolvedoptions', 'Intl.NumberFormat.prototype.resolvedOptions')}}
   

  
 

 
-
ブラウザ実装状況

-
-
{{CompatibilityTable}}

+
ブラウザーの互換性

 
-

-
- 
-  
-   
-   
-   
-   
-   
-   
-  
-  
-   
-   
-   
-   
-   
-   
-  
- 
-
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
基本サポート{{CompatChrome("24")}}{{CompatGeckoDesktop("29")}}{{CompatIE("11")}}{{CompatOpera("15")}}{{CompatNo}}

-

+

+
 
-

-
- 
-  
-   
-   
-   
-   
-   
-   
-   
-  
-  
-   
-   
-   
-   
-   
-   
-   
-  
- 
-
機能AndroidChrome for AndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
基本サポート{{CompatNo}}{{CompatChrome("26")}}{{CompatNo}}

-    {{bug("864843")}}		{{CompatNo}}{{CompatNo}}{{CompatNo}}

+
{{Compat("javascript.builtins.Intl.NumberFormat.resolvedOptions")}}

 

 
-
関連情報

+
関連情報

 
 
    
  
  • {{jsxref("NumberFormat", "Intl.NumberFormat")}}
    • 
diff --git a/files/ja/web/javascript/reference/global_objects/intl/numberformat/supportedlocalesof/index.html b/files/ja/web/javascript/reference/global_objects/intl/numberformat/supportedlocalesof/index.html
index 8108241d0b..866ceb218c 100644
--- a/files/ja/web/javascript/reference/global_objects/intl/numberformat/supportedlocalesof/index.html
+++ b/files/ja/web/javascript/reference/global_objects/intl/numberformat/supportedlocalesof/index.html
@@ -8,76 +8,78 @@ tags:
   - NumberFormat
 translation_of: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/supportedLocalesOf
 ---
-
    {{JSRef("Global_Objects", "NumberFormat", "Intl,Collator,DateTimeFormat")}}
    
+
    {{JSRef}}
    
+
+
    Intl.ListFormat.supportedLocalesOf() メソッドは、ランタイムの既定のロケールで代替する必要なく数値の書式で対応されているものを含む配列を返します。
    
+
+
    {{EmbedInteractiveExample("pages/js/intl-numberformat-prototype-supportedlocalesof.html","shorter")}}
    
 
-
    概要
    
 
-
    ランタイムのデフォルトローケルに戻る必要なしで数値変換でサポートされる提供されたローケルを含んでいる配列を返します。
    
 
 
    構文
    
 
-
    Intl.NumberFormat.supportedLocalesOf(locales[, options])
    
+
    Intl.NumberFormat.supportedLocalesOf(locales[, options])
    
 
 
    引数
    
 
 
    
- 
    locales
    
- 
    BCP47言語タグをもった文字列、そのような文字列の配列。locales引数の一般的な形式に対して、{{jsxref("Global_Objects/Intl", "Intl page", "#Locale_identification_and_negotiation", 1)}}を確認して下さい。
    
- 
    options
    
+ 
    locales
    
+ 
    BCP 47 言語タグを持つ文字列、またはそのような文字列の配列です。 locales 引数の一般的な形式については、 {{jsxref("Intl", "Intl のページ", "#Locale_identification_and_negotiation", 1)}}を参照してください。
    
+ 
    options
    
  
    
- 
    任意。次のプロパティを持つオブジェクト:
    
+ 
    省略可能です。以下のプロパティを持つことがあるオブジェクトです。
    
 
  
    
   
    localeMatcher
    
-  
    使用するローケルマッチングアルゴリズム。利用可能な値は"lookup" や "best fit"です。デフォルトは"best fit"です。このオプションについての情報のために、{{jsxref("Global_Objects/Intl", "Intl page", "#Locale_negotiation", 1)}}を確認して下さい。
    
+  
    使用するロケールの一致アルゴリズムです。指定可能な値は lookup および best fit で、既定値は best fit です。このオプションの詳細は、 {{jsxref("Intl", "Intl のページ", "#Locale_negotiation", 1)}}を参照してください。
    
  
    
  
    
 
    
 
-
    説明
    
+
    返値
    
+
+
    指定したロケールタグのサブセットを表す文字列の配列で、ランタイムの既定のロケールで代替する必要なく数値の書式で対応されているものを含みます。
    
 
-
    localesで提供された言語パックのサブセットをもった配列を返します。返される言語タグでは、ランタイムが使われているローケルマッチングアルゴリズムが考慮して数値変換でローケルをサポートしているので、デフォルトローケルに戻る必要はありません。
    
+
    解説
    
 
-
    例
    
+
    locales で提供されている言語タグのサブセットを含む配列を返します。返される言語タグは、ランタイムが数値のロケールに対応しているもので、使用しているロケール一致アルゴリズムで一致しているとみなされているものです。
    
 
-
    例: supportedLocalesOfを使う
    
+
    例
    
 
-
    数値フォーマットで、バリ語ではなく、インドネシア語とドイツ語をサポートしているランタイムを仮定すると、supportedLocalesOf はインドネシア語とドイツ語の言語タグを返します。pinyin は数値フォーマットには適切ではなくインドネシア語では使われていません。インドネシアの特定のドイツ語はサポートされそうにもありません。"lookup"アルゴリズムの指定に注意して下さい。"best fit" はインドネシア語はバリ語に対して、十分にふさわしいと決定するかもしれません。というのも、 ほとんどのバリの人はインドネシア語も理解するからです。それゆえバリ言語タグも同様に返します。
    
+
    supportedLocalesOf() の使用
    
 
-
    var locales = ['ban', 'id-u-co-pinyin', 'de-ID'];
+
    数値の書式でインドネシア語とドイツ語に対応しており、バリ語に対応していないランタイムを想定すると、 supportedLocalesOf はインドネシア語とドイツ語の言語タグを変更せずに返しますが、 pinyin の照合は数値の書式には関係なく、インドネシア語でも使用されません。ここでの lookup アルゴリズムの仕様に注意してください — バリ語話者のほとんどはインドネシア語も理解しているので、 best fit のマッチャーはインドネシア語がバリ語に適切に一致すると判断し、バリ語の言語タグも返すかもしれません。
    
+
+
    var locales = ['ban', 'id-u-co-pinyin', 'de-ID'];
 var options = { localeMatcher: 'lookup' };
 console.log(Intl.NumberFormat.supportedLocalesOf(locales, options).join(', '));
 // → "id-u-co-pinyin, de-ID"
 
    
 
-
    仕様
    
+
    仕様書
    
 
 
- 
+ 
-   
-   
-   
+   
+ 
+ 
-   
-   
-   
+   
    
   
    仕様状況コメント仕様書
   
    
   
    {{SpecName('ES Int 1.0', '#sec-11.2.2', 'Intl.NumberFormat.supportedLocalesOf')}}{{Spec2('ES Int 1.0')}}Initial definition.{{SpecName('ES Int Draft', '#sec-intl.numberformat.supportedlocalesof', 'Intl.NumberFormat.supportedLocalesOf')}}
   
    
      
 
    
 
-
    ブラウザ実装状況
    
+
    ブラウザーの互換性
    
 
 
    
-
    
-
+
 
 
    {{Compat("javascript.builtins.Intl.NumberFormat.supportedLocalesOf")}}
    
 
    
-
    
 
-
    関連情報
    
+
    関連情報
    
 
 
      
  
    • {{jsxref("NumberFormat", "Intl.NumberFormat")}}
      • 
-- 
cgit v1.2.3-54-g00ecf