分别使用 HTML 方式和 JavaScript 脚本方式在页面显示信息。

HTML 和 JavaScript 都是网页开发的基础技术，它们可以协同工作来在网页上显示信息。

1. **HTML方式**：HTML (HyperText Markup Language) 是负责网页内容结构和基本样式的标记语言。要在HTML中显示信息，你可以使用`<p>`标签来创建段落，`<h1>`到`<h6>`来设置标题，或者直接写入文本如 `<div id="info">这是一条信息</div>`。通过定义HTML元素的位置、颜色等属性，可以控制信息的呈现形式。

2. **JavaScript脚本方式**：JavaScript则是一种用于网页交互的客户端脚本语言。你可以通过`document.write()`或`innerHTML`属性动态修改HTML元素的内容。例如，可以编写这样的JavaScript代码：

   var element = document.getElementById("info");
   element.innerHTML = "这是由JavaScript更新的信息";

或者使用更现代的方式：

   let infoElement = document.querySelector("#info");
   infoElement.textContent = "动态加载内容";

通过结合HTML结构和JavaScript处理，可以实现动态、响应式的页面内容展示。

相关问题

使用js脚本方式在页面显示个人信息表格

在页面上使用JavaScript脚本显示个人信息表格涉及到HTML结构的创建和JavaScript的DOM操作。以下是创建一个简单的个人信息表格并使用JavaScript动态添加内容到这个表格的基本步骤：

1. 首先，你需要在HTML中创建一个表格的基本结构。这可以通过一个`<table>`元素来实现，并定义表头（`<thead>`）和表格体（`<tbody>`）。

<table id="personTable">
    <thead>
        <tr>
            <th>姓名</th>
            <th>年龄</th>
            <th>职业</th>
        </tr>
    </thead>
    <tbody>
        <!-- JavaScript将会在这里插入行 -->
    </tbody>
</table>

2. 接下来，你可以使用JavaScript来填充这个表格。你可以创建一个函数，这个函数将创建新的`<tr>`元素，并为每个个人信息创建`<td>`元素，然后将这些信息添加到表格的`<tbody>`中。

function displayPersonInfo(name, age, job) {
    var table = document.getElementById('personTable').getElementsByTagName('tbody')[0];
    var newRow = table.insertRow(); // 创建新的表格行
    var cellName = newRow.insertCell(0); // 第一列插入单元格
    var cellAge = newRow.insertCell(1); // 第二列插入单元格
    var cellJob = newRow.insertCell(2); // 第三列插入单元格

    // 添加数据到单元格
    cellName.innerHTML = name;
    cellAge.innerHTML = age;
    cellJob.innerHTML = job;
}

// 使用函数来显示个人信息
displayPersonInfo("张三", 30, "前端开发");
displayPersonInfo("李四", 25, "后端开发");

在这个例子中，`displayPersonInfo`函数接受三个参数：`name`（姓名）、`age`（年龄）和`job`（职业）。函数通过`insertRow`和`insertCell`方法创建新的行和单元格，然后使用`innerHTML`属性来填充每个单元格的数据。

可以使用哪些方式将JavaScript脚本引入HTML脚本中？

在HTML中引入JavaScript脚本通常有以下几种方式：

1. 直接在HTML标签中使用`onclick`、`onmouseover`等事件属性嵌入JavaScript代码。例如：

   <button onclick="alert('Hello, world!')">Click me</button>

2. 使用`<script>`标签将JavaScript代码直接写在HTML页面中。可以直接在`<script>`标签内编写代码，或者通过`src`属性引入外部的JavaScript文件。例如：

   <!-- 内联JavaScript代码 -->
   <script>
       document.getElementById("demo").innerHTML = "Hello, world!";
   </script>
   
   <!-- 引入外部JavaScript文件 -->
   <script src="example.js"></script>

3. 将JavaScript代码放置在外部`.js`文件中，并通过`<script>`标签的`src`属性引入。这种方法可以使得HTML文件和JavaScript代码分离，便于管理和维护。例如：

   <script src="scripts/example.js"></script>

4. 使用事件监听函数的方式在HTML文档加载完毕后执行JavaScript代码，例如使用`DOMContentLoaded`事件或者`window.onload`事件。这种方式可以确保在执行JavaScript代码之前，相关的HTML元素已经被加载到DOM中。例如：

   document.addEventListener('DOMContentLoaded', function() {
       // 这里的代码会在文档加载完成后执行
       var element = document.getElementById("demo");
       element.innerHTML = "Hello, world!";
   });