javascript 提供了读取网页元素文本和属性的方法，包括：读取文本：innertext、textcontent、value获取属性：getattribute、dataset、style
JavaScript 读取网页元素中的文本和属性
简介
JavaScript 提供了多种方法来读取和操作网页元素中的文本和属性。本文将探讨不同的方法并提供实战案例来说明它们的用法。
读取文本内容
innerText：获取元素中可见文本，包括子元素。
立即学习“Java免费学习笔记（深入）”；
let text = document.getElementById("element").innerText;textContent：与 innerText 类似，但也会获取隐藏文本。
let text = document.getElementById("element").textContent;value：获取表单元素（如输入框和文本区域）的当前值。
let value = document.querySelector("input[type=text]").value;获取属性
getAttribute(name)：获取指定属性的值。
let href = document.getElementById("link").getAttribute("href");dataset：访问带有 data- 前缀的数据属性。
let username = document.querySelector("user-profile").dataset.username;style：访问 CSS 样式属性。
let color = document.getElementById("element").style.color;实战案例
获取页面标题
const title = document.querySelector("head title").innerText;
console.log(title); // 输出：我的网站设置表单输入值
document.querySelector("input[name=name]").value = "John Doe";读取按钮的 data 属性
const button = document.querySelector("button");
const action = button.dataset.action;
console.log(action); // 输出：show-details基于 CSS 类获取元素
const elements = document.querySelectorAll(".error");
elements.forEach((element) => {
console.log(element.innerText);
});结论
JavaScript 提供了强大的工具来读取和操作网页元素的文本和属性。了解这些方法对于动态操作和操纵 DOM 内容至关重要。利用上面提供的实战案例，您可以轻松地将这些技术应用到自己的项目中。
