Javascript 分配一个字符串，但返回一个对象-浏览器在发挥作用？

给定此标签：

<p id="myp">foo para

p.style

现在应该指向一个字符串，我想。但如果我随后要求使用style属性，我会得到一个对象而不是字符串：

console.log(p.style); //get back an object

---

通常在JavaScript中，如果我给变量或对象属性分配了一个字符串，当我请求该值时，我希望该值仍然是一个字符串。那么是浏览器跳入来改变这一点，还是有JavaScript机制在起作用？

p元素的样式是一个包含其所有样式的对象，您需要选择所需的样式

更新：您也可以从代码段中的

cssText

获取字符串

p.style='color:red'我认为这一行是：

p.style.color: 'red'; 


let p=document.getElementById（'myp'）；
p、 风格='颜色：红色'；
console.log（p.style.color）；
console.log（p.style.cssText）
p元素的样式是包含其所有样式的对象，您需要选择所需的样式

更新：您也可以从代码段中的
cssText
获取字符串

p.style='color:red'我认为这一行是：

p.style.color: 'red'; 


let p=document.getElementById（'myp'）；
p、 风格='颜色：红色'；
console.log（p.style.color）；
console.log（p.style.cssText）
foo para
如果您在控制台中调试
HTMLElement.prototype
，您可以看到
style
是一个访问器属性。当您给它赋值时，它会执行一个setter方法，该方法可以覆盖您传递的值，而不是仅仅覆盖有问题的属性。这无疑是为了确保
style
属性始终是一个对象（即
CSSStyleDeclaration
的实例），因为很多事情都依赖于此

要覆盖元素的
style
属性，可以安全地使用
p.setAttribute（'style'，'color:red'）
如果在控制台中调试
HTMLElement.prototype
，则可以看到
style
是一个访问器属性。当您给它赋值时，它会执行一个setter方法，该方法可以覆盖您传递的值，而不是仅仅覆盖有问题的属性。这无疑是为了确保
style
属性始终是一个对象（即
CSSStyleDeclaration
的实例），因为很多事情都依赖于此

要覆盖元素的
style
属性，可以安全地使用
p.setAttribute（'style'，'color:red'）
根据mozilla文档

HtmleElement.style属性用于获取和设置
元素的内联样式。获取时，它返回一个
对象，该对象包含所有样式的列表
为该元素指定值的属性
在元素的内联样式属性中定义的

参见：developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style
根据mozilla文档

HtmleElement.style属性用于获取和设置
元素的内联样式。获取时，它返回一个
对象，该对象包含所有样式的列表
为该元素指定值的属性
在元素的内联样式属性中定义的

请参阅：developer.mozilla.org/en US/docs/Web/API/HTMLElement/style
document.getElementById
返回一个，如果您查看它的原型

我们看到
style
不是一个“普通”属性，而是一个
getter
和

显然，这是一个超级简化的示例，但本质上它的实现类似于：


let元素={
颜色：“红色”，
获取样式（）{
返回{color:this.color}
},
设置样式{
this.color=s.split（“：”）[1]
}
}
element.style='color:blue'；
console.log（element.style）
document.getElementById
返回一个

我们看到
style
不是一个“普通”属性，而是一个
getter
和

显然，这是一个超级简化的示例，但本质上它的实现类似于：


let元素={
颜色：“红色”，
获取样式（）{
返回{color:this.color}
},
设置样式{
this.color=s.split（“：”）[1]
}
}
element.style='color:blue'；
console.log（element.style）