Question

第一个： -

ReactDOM.render((
  <Provider store={store}>
    <App />
  </Provider>
),document.getElementById('root'));

第二个： -

ReactDOM.render(
  <Provider store={createStoreWithMiddleware(reducers)}>
    <App />
  </Provider>,
  document.querySelector(".container")
);

我想知道的是，document.querySelector(".container")和document.getElementById('root')的具体差异是什么？

Answer 1

client_secret.JSON使用document.getElementById('root')从您的HTML获取DOM元素，而id root使用document.querySelector(".container")获取HTML中的第一个元素

根据MDN文档：

<强> document.querySelector（）

返回文档中与第一个元素匹配的元素   指定的选择器或选择器组，如果没有匹配则为null   找到。

<强>的document.getElementById（）

通过其ID返回对元素的引用; ID是一个字符串   可用于唯一标识HTML ID中的元素   属性。

所以，

在第一种情况中，您的React App将在class container的DOM元素中呈现，而在第二种情况中，它将在第一个DOM元素中呈现班id root

Answer 2

如果你的意思是在做document.querySelector（“。container”）和document.querySelector（“。root”）之间的差异，

然后

document.querySelector(".root") - ＆gt;使用类“root”

在所有元素中呈现您的反应代码

document.querySelector(".container") - ＆gt;使用类“container”

在所有元素中呈现您的反应代码

如果你的意思是在处理document.querySelector（“。container”）和document.getElementById（'root'）之间的区别。

然后

document.getElementById('root') - ＆gt;使用id“root”

在元素中呈现您的反应代码

document.querySelector(".container") - ＆gt;使用类“container”

在所有元素中呈现您的反应代码

下面的React代码有什么区别？

2 个答案: