Web开发基础学习——HTML中\<div>元素的理解

Web开发基础学习系列文章目录

第一章 基础知识学习之HTML中<div>元素的理解


文章目录


前言

<div> 元素

  • 定义:<div> 是一个块级元素,用于将内容分组或容器化。它没有特定的语义含义,通常用于布局和样式目的。
  • 全称:<div> 是 "division" 的缩写,表示一个分区或部分。
  • 用途:<div> 元素通常用于创建页面布局、包裹其他元素、应用 CSS 样式或 JavaScript 行为。

一、在 React 中的使用

在 React 应用中,
元素通常用于包裹组件或元素。例如,在你的 index.html 文件中,有一个 div 元素作为 React 应用的挂载点:

html 复制代码
<div id="root"></div>

在 index.js 文件中,React 会将组件渲染到这个 div 元素中:

javascript 复制代码
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

二、React组件中,index.js的挂载点为什么没有 <script src="index.js">?

在现代的 React 项目中,通常使用构建工具(如 Create React App、Webpack、Vite 等)来处理 JavaScript 文件的打包和注入。这些工具会自动处理 JavaScript 文件的引用,因此你不需要手动在 HTML 文件中添加<script src="index.js"></script>。


总结

  • <div> 元素 是一个块级元素,用于将内容分组或容器化。它没有特定的语义含义,通常用于布局和样式目的。
  • 用途:
    元素通常用于创建页面布局、包裹其他元素、应用 CSS 样式或 JavaScript 行为。
  • 在 React 中的使用:
    元素常用于包裹组件或元素,并作为 React 应用的挂载点。
相关推荐
qq_386322691 小时前
华为网路设备学习-32(BGP协议 七)路由反射器与联邦
网络·学习
萘柰奈1 小时前
Unity学习----【进阶】Addressables(二)--加载资源与打包及更新
学习·unity
liliangcsdn4 小时前
Leiden社区发现算法的学习和示例
学习·数据分析·知识图谱
gnip5 小时前
Jst执行上下文栈和变量对象
前端·javascript
excel5 小时前
🐣 最简单的卷积与激活函数指南(带示例)
前端
DKPT5 小时前
JVM中如何调优新生代和老生代?
java·jvm·笔记·学习·spring
phltxy5 小时前
JVM——Java虚拟机学习
java·jvm·学习
醉方休6 小时前
npm/pnpm软链接的优点和使用场景
前端·npm·node.js
拉不动的猪6 小时前
简单回顾下Weakmap在vue中为何不能去作为循环数据源,以及替代方案
前端·javascript·vue.js
How_doyou_do6 小时前
数据传输优化-异步不阻塞处理增强首屏体验
开发语言·前端·javascript