From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../getpropertycssvalue/index.html | 61 +++++++++ .../getpropertypriority/index.html | 119 ++++++++++++++++++ .../getpropertyvalue/index.html | 71 +++++++++++ files/zh-cn/web/api/cssstyledeclaration/index.html | 98 +++++++++++++++ .../web/api/cssstyledeclaration/item/index.html | 117 ++++++++++++++++++ .../web/api/cssstyledeclaration/length/index.html | 108 ++++++++++++++++ .../cssstyledeclaration/removeproperty/index.html | 125 +++++++++++++++++++ .../api/cssstyledeclaration/setproperty/index.html | 137 +++++++++++++++++++++ 8 files changed, 836 insertions(+) create mode 100644 files/zh-cn/web/api/cssstyledeclaration/getpropertycssvalue/index.html create mode 100644 files/zh-cn/web/api/cssstyledeclaration/getpropertypriority/index.html create mode 100644 files/zh-cn/web/api/cssstyledeclaration/getpropertyvalue/index.html create mode 100644 files/zh-cn/web/api/cssstyledeclaration/index.html create mode 100644 files/zh-cn/web/api/cssstyledeclaration/item/index.html create mode 100644 files/zh-cn/web/api/cssstyledeclaration/length/index.html create mode 100644 files/zh-cn/web/api/cssstyledeclaration/removeproperty/index.html create mode 100644 files/zh-cn/web/api/cssstyledeclaration/setproperty/index.html (limited to 'files/zh-cn/web/api/cssstyledeclaration') diff --git a/files/zh-cn/web/api/cssstyledeclaration/getpropertycssvalue/index.html b/files/zh-cn/web/api/cssstyledeclaration/getpropertycssvalue/index.html new file mode 100644 index 0000000000..732ae8229c --- /dev/null +++ b/files/zh-cn/web/api/cssstyledeclaration/getpropertycssvalue/index.html @@ -0,0 +1,61 @@ +--- +title: CSSStyleDeclaration.getPropertyCSSValue() +slug: Web/API/CSSStyleDeclaration/getPropertyCSSValue +tags: + - CSSOM + - Obsolete + - Reference +translation_of: Web/API/CSSStyleDeclaration/getPropertyCSSValue +--- +

{{ APIRef("CSSOM") }} {{Obsolete_header}}

+ +

CSSStyleDeclaration.getPropertyCSSValue() 方法接口返回一个{{domxref('CSSValue')}} 包含一个属性的CSS值。请注意，如果属性名称是速记属性，则返回null。

+ +

现在你应该使用 {{domxref("CSSStyleDeclaration.getPropertyValue()")}}。

+ +

语法

+ +
let value = style.getPropertyCSSValue(property);
+ +

参数

+ + + +

返回值

+ + + +

示例

+ +

The following JavaScript code gets an object containing the computed RGB values of the color CSS property:

+ +
var style = window.getComputedStyle(elem, null);
+var rgbObj = style.getPropertyCSSValue('color').getRGBColorValue();
+
+ +

规范

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('DOM2 Style', 'css.html#CSS-CSSStyleDeclaration', 'CSSStyleDeclaration')}}{{Spec2('DOM2 Style')}}Declared as obsolete in July 2003.
+ +

浏览器兼容性

+ +

{{Compat("api.CSSStyleDeclaration.getPropertyCSSValue")}}

diff --git a/files/zh-cn/web/api/cssstyledeclaration/getpropertypriority/index.html b/files/zh-cn/web/api/cssstyledeclaration/getpropertypriority/index.html new file mode 100644 index 0000000000..a2881f7aa9 --- /dev/null +++ b/files/zh-cn/web/api/cssstyledeclaration/getpropertypriority/index.html @@ -0,0 +1,119 @@ +--- +title: CSSStyleDeclaration.getPropertyPriority() +slug: Web/API/CSSStyleDeclaration/getPropertyPriority +tags: + - API + - CSSDOM + - Method + - Reference +translation_of: Web/API/CSSStyleDeclaration/getPropertyPriority +--- +

{{ APIRef("CSSOM") }}

+ +

CSSStyleDeclaration.getPropertyPriority() 方法会根据传入的CSS属性，返回一个 {{domxref('DOMString')}} 来表示该属性的优先级。

+ +

Syntax

+ +
var priority = style.getPropertyPriority(property);
+ +

参数

+ + + +

返回值

+ + + +

例子

+ +

下面的代码检查了margin，在CSS规则中是否被设置为 important 优先级。

+ +
var declaration = document.styleSheets[0].cssRules[0].style;
+var isImportant = declaration.getPropertyPriority('margin') === 'important';
+
+ +

标准

+ + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('CSSOM', '#dom-cssstyledeclaration-getpropertypriority', 'CSSStyleDeclaration.getPropertyPriority()')}}{{Spec2('CSSOM')}} 
{{SpecName('DOM2 Style', 'css.html#CSS-CSSStyleDeclaration', 'CSSStyleDeclaration')}}{{Spec2('DOM2 Style')}} 
+ +

浏览器兼容性

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
diff --git a/files/zh-cn/web/api/cssstyledeclaration/getpropertyvalue/index.html b/files/zh-cn/web/api/cssstyledeclaration/getpropertyvalue/index.html new file mode 100644 index 0000000000..c5eff00183 --- /dev/null +++ b/files/zh-cn/web/api/cssstyledeclaration/getpropertyvalue/index.html @@ -0,0 +1,71 @@ +--- +title: CSSStyleDeclaration.getPropertyValue() +slug: Web/API/CSSStyleDeclaration/getPropertyValue +tags: + - CSSOM + - Reference + - getComputedStyle + - getPropertyValue + - setProperty + - 参考 + - 方法 + - 标签 +translation_of: Web/API/CSSStyleDeclaration/getPropertyValue +--- +

{{ APIRef("CSSOM") }}

+ +

CSSStyleDeclaration.getPropertyValue() 接口返回一个 {{domxref('DOMString')}} ，其中包含请求的CSS属性的值。

+ +

语法

+ +
var value = style.getPropertyValue(property);
+ +

参数

+ + + +

返回值

+ + + +

示例

+ +

下述示例使用一个CSS选择器规则查询对应的margin 属性的值:

+ +
var declaration = document.styleSheets[0].cssRules[0].style;
+var value = declaration.getPropertyValue('margin'); // "1px 2px"
+
+ +

规范

+ + + + + + + + + + + + + + + + + + + + + +
规范状态注
{{SpecName('CSSOM', '#dom-cssstyledeclaration-getpropertyvalue', 'CSSStyleDeclaration.getPropertyValue()')}}{{Spec2('CSSOM')}}
{{SpecName('DOM2 Style', 'css.html#CSS-CSSStyleDeclaration', 'CSSStyleDeclaration')}}{{Spec2('DOM2 Style')}}
+ +

浏览器兼容性

+ +

{{Compat("api.CSSStyleDeclaration.getPropertyValue")}}

+ +
diff --git a/files/zh-cn/web/api/cssstyledeclaration/index.html b/files/zh-cn/web/api/cssstyledeclaration/index.html new file mode 100644 index 0000000000..0a8fd0ae45 --- /dev/null +++ b/files/zh-cn/web/api/cssstyledeclaration/index.html @@ -0,0 +1,98 @@ +--- +title: CSSStyleDeclaration +slug: Web/API/CSSStyleDeclaration +tags: + - API + - CSSOM + - 参考 + - 接口 +translation_of: Web/API/CSSStyleDeclaration +--- +

{{ APIRef("CSSOM") }}

+ +

CSSStyleDeclaration 接口表示一个对象，它是一个 CSS 声明块，CSS 属性键值对的集合。它暴露了样式信息和各种与样式相关的方法和属性。

+ +

CSSStyleDeclaration 对象可被暴露于三种不同的 API 下：

+ + + +

属性

+ +
+
{{domxref("CSSStyleDeclaration.cssText")}}
+
当前声明块的文本内容。设置此属性会改变样式。
+
{{domxref("CSSStyleDeclaration.length")}}
+
属性的数量。参照下面的 {{domxref("CSSStyleDeclaration.item()", 'item()')}} 方法。
+
{{domxref("CSSStyleDeclaration.parentRule")}}
+
包含当前声明块的 {{domxref("CssRule")}}。
+
+ +

方法

+ +
+
{{domxref("CSSStyleDeclaration.getPropertyPriority()")}}
+
返回可选的优先级，"important"。
+
{{domxref("CSSStyleDeclaration.getPropertyValue()")}}
+
返回给定属性的值。
+
{{domxref("CSSStyleDeclaration.item()")}}
+
返回用index标记的属性名，当index越界时返回空字符串。
+
另一个可选方案：使用nodeList[i]（在i越界时返回 undefined）获取。通常在非JavaScript Dom 实现方案是很有用。
+
{{domxref("CSSStyleDeclaration.removeProperty()")}}
+
从 CSS 声明块中删除属性。
+
{{domxref("CSSStyleDeclaration.setProperty()")}}
+
在CSS声明块中修改现有属性或设置新属性。
+
{{domxref("CSSStyleDeclaration.getPropertyCSSValue()")}} {{obsolete_inline}}
+
仅在火狐浏览器中支持 getComputedStyle. 返回 {{ domxref("CSSPrimitiveValue") }} or null for shorthand properties.
+
+ +

范例

+ +
var styleObj = document.styleSheets[0].cssRules[0].style;
+console.log(styleObj.cssText);
+
+for (var i = styleObj.length; i--;) {
+  var nameString = styleObj[i];
+  styleObj.removeProperty(nameString);
+}
+
+console.log(styleObj.cssText);
+ +

规范

+ + + + + + + + + + + + + + + + + + + + + +
规范状态备注
{{SpecName('CSSOM', '#the-cssstyledeclaration-interface', 'CSSStyleDeclaration')}}{{Spec2('CSSOM')}}
{{SpecName('DOM2 Style', 'css.html#CSS-CSSStyleDeclaration', 'CSSStyleDeclaration')}}{{Spec2('DOM2 Style')}}Initial definition
+ +

浏览器兼容性

+ + + +

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

+ +

参见

+ + diff --git a/files/zh-cn/web/api/cssstyledeclaration/item/index.html b/files/zh-cn/web/api/cssstyledeclaration/item/index.html new file mode 100644 index 0000000000..f3e5350ef9 --- /dev/null +++ b/files/zh-cn/web/api/cssstyledeclaration/item/index.html @@ -0,0 +1,117 @@ +--- +title: CSSStyleDeclaration.item() +slug: Web/API/CSSStyleDeclaration/item +translation_of: Web/API/CSSStyleDeclaration/item +--- +

{{ APIRef("CSSOM") }}

+ +

CSSStyleDeclaration.item() 通过下标从 {{domxref('CSSStyleDeclaration')}} 返回一个 CSS 属性值。只要传入参数这个方法就不会抛出异常； 当传入的下标越界时会返回空字符串，当未传入参数时会抛出一个 TypeError 。

+ +

语法

+ +
var propertyName = style.item(index);
+
+ +

参数

+ + + +

Return value

+ + + +

使用以下的 javascript 语法可以通过索引从 style 的节点列表中获取对应值：

+ +
var propertyName = style[index];
+
+ +

范例

+ +
var style = document.getElementById('div1').style;
+var propertyName = style.item(1); // or simply style[1] - returns the second style listed
+ +

规范

+ + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('CSSOM', '#dom-cssstyledeclaration-item', 'CSSStyleDeclaration.item()')}}{{Spec2('CSSOM')}} 
{{SpecName('DOM2 Style', 'css.html#CSS-CSSStyleDeclaration', 'CSSStyleDeclaration')}}{{Spec2('DOM2 Style')}} 
+ +

浏览器兼容性

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
diff --git a/files/zh-cn/web/api/cssstyledeclaration/length/index.html b/files/zh-cn/web/api/cssstyledeclaration/length/index.html new file mode 100644 index 0000000000..4075f9f4a4 --- /dev/null +++ b/files/zh-cn/web/api/cssstyledeclaration/length/index.html @@ -0,0 +1,108 @@ +--- +title: CSSStyleDeclaration.length +slug: Web/API/CSSStyleDeclaration/length +translation_of: Web/API/CSSStyleDeclaration/length +--- +

{{ APIRef("CSSOM") }}

+ +

这是一个只读的属性，它返回一个指定元素声明过的样式个数

+ +

语法

+ +
var num = styles.length;
+ +

值

+ +

指定元素上明确声明过的样式属性个数.

+ +

示例

+ +

获取下面HTML元素明确设置过的属性个数:

+ +
<div id="div1" style="margin: 0 10px; background-color: #CA1; font-family: monospace"></div>
+ +

JavaScript代码:

+ +
var myDiv = document.getElementById('div1'); var divStyle = myDiv.style; var len = divStyle.length; // 6
+ +

说明

+ + + + + + + + + + + + + + + + + + + + + +
描述状态注释
{{SpecName('CSSOM', '#dom-cssstyledeclaration-length', 'CSSStyleDeclaration.length')}}工作草案
{{SpecName('DOM2 Style', 'css.html#CSS-CSSStyleDeclaration', 'CSSStyleDeclaration')}}废弃
+ +

浏览器兼容性

+ +

兼容性列表

+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
特性ChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
基础支持{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
基础支持{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
diff --git a/files/zh-cn/web/api/cssstyledeclaration/removeproperty/index.html b/files/zh-cn/web/api/cssstyledeclaration/removeproperty/index.html new file mode 100644 index 0000000000..b4437515b3 --- /dev/null +++ b/files/zh-cn/web/api/cssstyledeclaration/removeproperty/index.html @@ -0,0 +1,125 @@ +--- +title: CSSStyleDeclaration.removeProperty() +slug: Web/API/CSSStyleDeclaration/removeProperty +tags: + - API + - CSSOM + - Method + - Reference +translation_of: Web/API/CSSStyleDeclaration/removeProperty +--- +

{{ APIRef("CSSOM") }}

+ +

CSSStyleDeclaration.removeProperty() 方法移除style对象的一个属性。

+ +

语法

+ +
var oldValue = style.removeProperty(property);
+ +

参数

+ + + +

返回值

+ + + +

异常

+ + + +

例子

+ +

下面的 JavaScript 代码从样式表里移除了 margin 属性:

+ +
var declaration = document.styleSheets[0].rules[0].style;
+var oldValue = declaration.removeProperty('margin');
+
+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('CSSOM', '#dom-cssstyledeclaration-removeproperty', 'CSSStyleDeclaration.removeProperty()')}}{{Spec2('CSSOM')}} 
{{SpecName('DOM2 Style', 'css.html#CSS-CSSStyleDeclaration', 'CSSStyleDeclaration')}}{{Spec2('DOM2 Style')}} 
+ +

浏览器支持情况

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
diff --git a/files/zh-cn/web/api/cssstyledeclaration/setproperty/index.html b/files/zh-cn/web/api/cssstyledeclaration/setproperty/index.html new file mode 100644 index 0000000000..269faaad26 --- /dev/null +++ b/files/zh-cn/web/api/cssstyledeclaration/setproperty/index.html @@ -0,0 +1,137 @@ +--- +title: CSSStyleDeclaration.setProperty() +slug: Web/API/CSSStyleDeclaration/setProperty +translation_of: Web/API/CSSStyleDeclaration/setProperty +--- +

{{ APIRef("CSSOM") }}

+ +

CSSStyleDeclaration.setProperty() 方法接口为一个声明了CSS样式的对象设置一个新的值 。

+ +

语法

+ +
style.setProperty(propertyName, value, priority);
+ +

参数

+ + + +

返回值

+ + + +

异常

+ + + +

JavaScript 有一个特别的，更简单的在 CSSStyleDeclaration 对象上设置CSS属性值的语法：

+ +
style.cssPropertyName = 'value';
+ +

示例

+ +

下面的Javascript代码为一个选中元素样式的 margin 属性设置一个新的值:

+ +
var declaration = document.styleSheets[0].rules[0].style;
+declaration.setProperty('margin', '1px 2px');
+// Equivalent to:
+// declaration.margin = '1px 2px';
+
+ +

  说明

+ + + + + + + + + + + + + + + + + + + + + +
描述状态注释
{{SpecName('CSSOM', '#dom-cssstyledeclaration-setproperty', 'CSSStyleDeclaration.setProperty()')}}工作草案 
{{SpecName('DOM2 Style', 'css.html#CSS-CSSStyleDeclaration', 'CSSStyleDeclaration')}}被废弃 
+ +

浏览器兼容

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
特性ChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
基础支持{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
特性AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
基础支持{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+ +
+

want learn more

+getComputedStyle
+getPropertyValue
+
-- cgit v1.2.3-54-g00ecf