js 初次进入页面 修改dom 页面不显示

当JS初次进入页面并修改DOM时，页面不会立即显示修改后的结果。这是因为浏览器先执行完整个JS脚本，然后才会重新渲染页面，将修改后的DOM内容显示出来。

在脚本执行期间，浏览器会将DOM的修改操作记录下来，但不会立即更新到页面上。这是为了优化性能，避免频繁地重绘和回流。

如果想要确保修改后的DOM在页面中正确显示，可以使用定时器、事件监听器或异步函数等方法来延迟更新DOM。

例如，可以使用setTimeout函数来延迟更新DOM：

setTimeout(function() {
  // 修改DOM的代码
}, 0);

这样，当浏览器执行到setTimeout时，会先将其放入任务队列中，待JS脚本执行完毕后，再执行队列中的任务，从而更新DOM并呈现在页面上。

另外，还可以通过事件监听器来触发DOM的修改，确保在合适的时机进行更新。

总之，当JS初次进入页面并修改DOM时，页面不会立即显示，需要等JS脚本执行完毕后再进行更新。通过延迟更新、事件触发等方式可以确保DOM的修改能够正确地显示在页面上。

相关问题

js 获取当前页面的dom数量

作为AI语言模型，我无法获取当前页面的DOM数量，因为我没有浏览器环境。但是，你可以使用JavaScript来获取当前页面的DOM数量。

方法一：使用document.getElementsByTagName("*")获取所有DOM元素，然后取其length属性。

var domCount = document.getElementsByTagName("*").length;
console.log("当前页面DOM数量为：" + domCount);

方法二：使用document.querySelectorAll("*")获取所有DOM元素，然后取其length属性。

var domCount = document.querySelectorAll("*").length;
console.log("当前页面DOM数量为：" + domCount);

这两种方法都会获取页面中所有的DOM元素，包括标签、属性、文本内容等。但是，获取DOM数量可能会受到浏览器的限制，因为浏览器可能会限制最大的DOM数量。

js操作控制iframe页面的dom元素

要操作控制iframe页面的dom元素，需要先获取到iframe元素，然后通过iframe元素的contentWindow属性获取到iframe内部的window对象，最后通过window对象就可以访问到iframe内部的dom元素。以下是一个简单的示例代码：

// 获取iframe元素
var iframe = document.getElementById('myIframe');

// 获取iframe内部的window对象
var iframeWindow = iframe.contentWindow;

// 访问iframe内部的dom元素
var iframeDocument = iframeWindow.document;
var iframeBody = iframeDocument.body;
var iframeDiv = iframeDocument.getElementById('myDiv');

// 修改iframe内部的dom元素
iframeDiv.innerHTML = 'Hello World!';

需要注意的是，由于同源策略的限制，如果iframe和主页面不是同一个域名、协议、端口号，那么无法直接访问iframe内部的dom元素。解决方法一般是在iframe内部设置一个跨域代理页面，主页面通过代理页面来操作iframe内部的dom元素。