这两者有什么区别，
b1.setAttribute('id','b1');
和
b1.id='b1';
其中一个比另一个更有效吗？并且他们两个都会做完全相同的任务吗？在某些情况下它们会有所不同吗？
【问题讨论】：
setAttribute 和 htmlElement.attribute='value' 的区别
后一点，htmlElement.attribute='value'，不太准确。您不是在此处设置 属性，而是在设置属性。
内存中的 DOM 元素实例具有各种属性，一些与属性连接或相关，而另一些则不。
另一方面，属性是直接从 HTML 标记读取的名称/值对（如果您序列化 DOM 元素，例如通过访问其 innerHTML 属性，则写入您返回的标记中）。
当属性和属性以某种方式相关/链接时，该属性称为（属性的）反射属性。有时，反射属性的名称与属性名称不完全相同（class 变为 className，for 变为 htmlFor），有时它们之间的链接不是 1:1。
例如，id 是 id 属性的反射属性。但是选择框有一个 selectedIndex 属性，它没有属性。
他们俩会做完全相同的任务吗？
在某些情况下它们会有所不同吗？
这取决于属性/属性：
id 和其他几个直接反映：设置id 属性和设置id 属性完全相同。顺便说一句，htmlFor 属性/for 属性也是如此（除了在setAttribute 中有错误的旧IE），rel 属性/属性，className/class 属性（除了旧的 IE，它在 setAttribute 中存在错误），表单字段和其他一些元素上的 name 属性，表单上的 method 和 action 属性/属性，以及其他几个。
另一方面，value 属性并没有设置value 属性。它只是从中获取默认值。在大多数浏览器上（此时“全部”？），有一个单独的 defaultValue 属性，确实直接反映了 value 属性。
在相对链接和绝对链接方面，href 属性与 href 属性略有不同。该属性可以包含一个相对路径，使用str = elm.getAttribute("href") 可以为您提供该相对路径；如果您阅读 property (str = elm.href)，它将始终是绝对路径（例如，解析路径）。将href 属性设置为相对路径会将属性设置为该路径，但再次阅读href 属性将为您提供绝对（已解决）版本。将href 属性设置为绝对路径会将属性设置为该绝对路径。
有几个布尔属性表示为布尔值 (true/false)，但由于属性值始终是字符串，因此属性要么不存在为 false（getAttribute 返回 null ) 或那里是真的。如果它存在，它必须具有值"" 或与其名称相同（例如，multiple="multiple"，不区分大小写），尽管实际上浏览器将任何存在的属性视为true，而不管其实际内容如何。
一些属性根本不会反映在属性中，因此设置它们不会设置/更改任何属性。
其中一个比另一个更有效吗？
它永远不会产生足够大的差异来关心，所以没关系。它也可能因浏览器而异。
【讨论】：
If it's there, it must have the value "" or the same as its name (e.g., multiple="multiple", case-insensitive)"。这是真的，不过，根据这个答案stackoverflow.com/a/6961821/2827823，它显然会根据它是 XHTML 还是 HTML5 的解释略有不同。