Dom是什么? $(function() )是什么 ?什么时候执行?

1. 什么时候执行呢?

(function() {}),即 $(document).ready(function(),什么时候执行?

$(function() {
	//执行操作
});

$(function() {}) 是$(document).ready(function()的简写, 这个函数什么时候执行的呢?

答案:DOM 加载完毕之后执行

2. 分析

DOM 是什么?DOM 就是一个 html 页面的标签树:

在这里插入图片描述

那么什么时候,DOM 加载完成了呢?即页面所有的 html 标签(包括图片等)都加载完了,即浏览器已经响应完了,加载完了,全部展现到浏览器界面上了。

代码分析
总结
DOM 在第一次页面加载完毕后,就在内存里了,无论后面怎么通过 ajax 的方式去局部修改 html 页面,都只是对内存中的 DOM 树进行修改,而 DOM在第一次页面加载完毕后就已经加载完毕了。

所以后面 js文件(动态加载或者 head 中加载)再使用到 $(function() {}) 函数肯定会执行的。

 

 


————————————————
版权声明:本文为CSDN博主「怪伽先森」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/u011033906/article/details/98043369

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在React中,useEffect和useLayoutEffect都是用于处理组件副作用的Hook。它们都可以在组件渲染后执行一些操作,比如获取数据、修改DOM等。它们的主要区别在于执行时机和阻塞UI渲染的能力。具体来说,useEffect会在浏览器渲染完成后异步执行,而useLayoutEffect会在浏览器渲染前同步执行,有阻塞UI渲染的能力。因此,如果要修改DOM并且希望能够同步更新UI,则应该使用useLayoutEffect;否则,使用useEffect即可。 举个例子,假设你需要在组件渲染后通过API获取数据并更新组件状态。则你可以这样使用useEffect: ```javascript import { useState, useEffect } from 'react'; function MyComponent() { const [data, setData] = useState(null); useEffect(() => { fetchData().then((res) => setData(res)); }, []); return ( <div> {data ? ( <ul> {data.map((item) => ( <li key={item.id}>{item.name}</li> ))} </ul> ) : ( <p>Loading...</p> )} </div> ); } ``` 这里的useEffect会在组件渲染后异步执行fetchData函数并更新组件状态。而如果你需要在DOM更新之前计算一些值并更新组件状态,则可以使用useLayoutEffect: ```javascript import { useState, useLayoutEffect } from 'react'; function MyComponent() { const [width, setWidth] = useState(null); useLayoutEffect(() => { function updateWidth() { setWidth(window.innerWidth); } window.addEventListener('resize', updateWidth); updateWidth(); return () => window.removeEventListener('resize', updateWidth); }, []); return <p>Window width: {width}px</p>; } ``` 这里的useLayoutEffect会在组件渲染前同步执行updateWidth函数并更新组件状态,因此可以实时获取窗口宽度并渲染到UI中。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值