- HTML 教程
- HTML - 首页
- HTML - 路线图
- HTML - 简介
- HTML - 历史与演变
- HTML - 编辑器
- HTML - 基本标签
- HTML - 元素
- HTML - 属性
- HTML - 标题
- HTML - 段落
- HTML - 字体
- HTML - 块
- HTML - 样式表
- HTML - 格式化
- HTML - 引号
- HTML - 注释
- HTML - 颜色
- HTML - 图像
- HTML - 图像地图
- HTML - Iframes
- HTML - 短语元素
- HTML - 元标签
- HTML - 类
- HTML - ID
- HTML - 背景
- HTML 表格
- HTML - 表格
- HTML - 表头和标题
- HTML - 表格样式
- HTML - 表格 Colgroup
- HTML - 嵌套表格
- HTML 列表
- HTML - 列表
- HTML - 无序列表
- HTML - 有序列表
- HTML - 定义列表
- HTML 链接
- HTML - 文本链接
- HTML - 图像链接
- HTML - 邮件链接
- HTML 颜色名称和值
- HTML - 颜色名称
- HTML - RGB
- HTML - HEX
- HTML - HSL
- HTML 表单
- HTML - 表单
- HTML - 表单属性
- HTML - 表单控件
- HTML - 输入属性
- HTML 媒体
- HTML - 视频元素
- HTML - 音频元素
- HTML - 嵌入多媒体
- HTML 头部
- HTML - Head 元素
- HTML - 添加 Favicon
- HTML - Javascript
- HTML 布局
- HTML - 布局
- HTML - 布局元素
- HTML - 使用 CSS 进行布局
- HTML - 响应式
- HTML - 符号
- HTML - 表情符号
- HTML - 样式指南
- HTML 图形
- HTML - SVG
- HTML - Canvas
- HTML API
- HTML - Geolocation API
- HTML - 拖放 API
- HTML - Web Workers API
- HTML - WebSocket
- HTML - Web 存储
- HTML - 服务器发送事件
- HTML 杂项
- HTML - 文档对象模型 (DOM)
- HTML - MathML
- HTML - 微数据
- HTML - IndexedDB
- HTML - Web 消息传递
- HTML - Web CORS
- HTML - Web RTC
- HTML 演示
- HTML - 音频播放器
- HTML - 视频播放器
- HTML - 网页幻灯片
- HTML 工具
- HTML - Velocity Draw
- HTML - 二维码
- HTML - Modernizer
- HTML - 验证
- HTML - 颜色拾取器
- HTML 参考
- HTML - 速查表
- HTML - 标签参考
- HTML - 属性参考
- HTML - 事件参考
- HTML - 字体参考
- HTML - ASCII 码
- ASCII 表格查找
- HTML - 颜色名称
- HTML - 实体
- MIME 媒体类型
- HTML - URL 编码
- 语言 ISO 代码
- HTML - 字符编码
- HTML - 已弃用标签
- HTML 资源
- HTML - 快速指南
- HTML - 有用资源
- HTML - 颜色代码生成器
- HTML - 在线编辑器
HTML - DOM isSameNode() 方法
**isSameNode()** 方法检查两个节点引用是否指向 HTML 文档中的同一个节点对象。如果两个引用都指向完全相同的节点,则返回 true;否则,返回 false。
语法
node.isEqualNode(otherNode);
参数
| 参数 | 描述 |
|---|---|
| otherNode | 指定要与当前节点进行比较的节点。 |
返回值
此方法返回一个布尔值:如果当前节点与提供的节点相同,则返回“true”;否则返回“false”。
HTML DOM 元素“isSameNode()”方法示例
以下是一些 isSameNode() 方法的示例,这些示例在各种场景中比较节点以检查它们是否指向 HTML DOM 中的同一个节点。
检查相同的节点
此示例使用 isSameNode() 方法检查相似节点。在这种情况下,node1 和 node2 不是同一个节点对象,因为它们引用的是 HTML 文档中不同的**<p>** 元素。isSameNode() 方法返回 false。
<!DOCTYPE html>
<html lang="en">
<head>
<title>isSameNode() Method Example</title>
</head>
<body>
<h1>HTML - DOM Element</h1>
<h2>isSameNode() Method</h2>
<p>Checking for same nodes....</p>
<div id="container">
<p id="node1">Paragraph 1</p>
<p id="node2">Paragraph 2</p>
</div>
<script>
document.addEventListener('DOMContentLoaded',
function() {
var node1 = document.getElementById('node1');
var node2 = document.getElementById('node2');
// Compare if node1 is the same as node2
var isSame = node1.isSameNode(node2);
// Display the result
var resultElement = document.createElement('p');
resultElement.textContent =
'Are node1 and node2 the same node? ' + isSame;
document.body.appendChild(resultElement);
});
</script>
</body>
</html>
节点内容比较
此示例说明了如何比较两个节点的内容,这里我们使用“textContent”属性来检查每个节点内部的实际文本。通过比较这些文本,我们可以看到它们是相同还是不同。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Node Content Comparison</title>
</head>
<body>
<h1>HTML - DOM Element</h1>
<h2>isSameNode() Method</h2>
<p>Compare node content by clicking the button!</p>
<div id="container">
<p id="node1">Paragraph 1</p>
<p id="node2">Paragraph 1</p>
<p id="node3">Paragraph 2</p>
</div>
<button onclick="compareContent()">
Compare Content
</button>
<script>
function compareContent() {
var node1 = document.getElementById('node1');
var node2 = document.getElementById('node2');
var node3 = document.getElementById('node3');
// Compare content of node1 with node2 and node3
var isSameContent1 =
node1.textContent === node2.textContent;
var isSameContent2 =
node1.textContent === node3.textContent;
alert('Is the content of node1 the same as node2? '
+ isSameContent1 + '\n' +
'Is the content of node1 the same as node3? '
+ isSameContent2);
}
</script>
</body>
</html>
支持的浏览器
| 方法 | ![]() |
![]() |
![]() |
![]() |
![]() |
|---|---|---|---|---|---|
| isSameNode() | 是 | 是 | 否 | 是 | 是 |
html_dom_element_reference.htm
广告




