- HTML 教程
- HTML - 首页
- HTML - 路线图
- HTML - 简介
- HTML - 历史与演变
- HTML - 编辑器
- HTML - 基本标签
- HTML - 元素
- HTML - 属性
- HTML - 标题
- HTML - 段落
- HTML - 字体
- HTML - 块
- HTML - 样式表
- HTML - 格式化
- HTML - 引用
- HTML - 注释
- HTML - 颜色
- HTML - 图片
- HTML - 图像地图
- HTML - 内嵌框架
- 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 - 头元素
- 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 HTMLCollection namedItem() 方法
HTML DOM HTMLCollection **namedItem()** 方法用于获取集合中第一个 ID 或名称与 namedItem() 方法参数中提到的名称匹配的元素。
语法
HTMLCollection[name]; Or HTMLCollection.namedItem(name);
参数
它接受一个必需参数,如下所示。
参数 | 描述 |
---|---|
name | 它表示您想要返回的元素的 ID 或名称属性。 |
返回值
它返回与参数中提到的 ID 或名称属性对应的元素。
HTML DOM HTMLCollection 'namedItem()' 方法示例
以下示例说明了 namedItem() 方法的使用。
获取 script 元素的内容
以下示例返回 ID 为 "s3" 的 script 元素的内容
<!DOCTYPE html> <html lang="en"> <head> <title>HTMLCollection namedItem() Method</title> </head> <body> <script>document.getElementById("s1").innerHTML = "This is first Script."</script> <script>document.getElementById("s2").innerHTML = "This is second Script."</script> <script id="last">document.getElementById("s3").innerHTML = "This is third Script."</script> <p>Click to get content of script element with id= 's3'.</p> <button onclick="fun()">Click me</button> <p id="s1"></p> <p id="s2"></p> <p id="s3"></p> <p id="scripts"></p> <script> function fun() { let x = document.scripts.namedItem("last").text; document.getElementById("scripts").innerHTML = x; } </script> </body> </html>
获取元素内容的另一种方法。
以下示例说明了获取 ID 为 "alt" 的 <h1> 元素内容的另一种方法
<!DOCTYPE html> <html lang="en"> <head> <title>HTMLCollection namedItem() Method</title> </head> <body> <h1 id="alt">I am h1 with alt id</h1> <h2>I am random text</h2> <p>Click to get content of h1 element with id= 'alt'.</p> <button onclick="fun()">Click me</button> <p id="display"></p> <script> function fun() { let x = document.getElementsByTagName("h1"); let y = x["alt"]; document.getElementById("display").innerHTML = y.innerHTML; } </script> </body> </html>
获取 button 元素的内容
以下示例返回 **name="fun"** 的 button 元素的内容。
<!DOCTYPE html> <html lang="en"> <head> <title>HTMLCollection namedItem() Method</title> </head> <body> <p>Click on "click me" to get content of button element with name= 'fun'.</p> <button onclick="fun()">Click me</button> <button name="fun">Button 1</button> <p id="display"></p> <script> function fun() { let x = document.getElementsByTagName("button").namedItem("fun").innerHTML; //let y=x["alt"]; document.getElementById("display").innerHTML = x; } </script> </body> </html>
支持的浏览器
方法 | |||||
---|---|---|---|---|---|
namedItem() | 是 1 | 是 12 | 是 1 | 是 1 | 是 12.1 |
广告