参考资料

  1. HTML DOM 打开输出流，向流中输入文本实例
  2. HTML DOM 改变链接的target属性实例
  3. HTML DOM 访问
  4. HTML DOM 事件
  5. HTML DOM 返回一个iframe中的name属性的值
  6. HTML DOM 返回一个iframe中的longdesc属性的值
  7. HTML DOM 返回一个button所属表的ID 实例
  8. HTML DOM 返回一个表单的name 实例

HTML DOM 返回加载的当前文档的URL实例

HTML DOM 返回当前文档URL

功能说明

document.URL 属性返回当前加载文档的完整URL（字符串形式）。

基本用法

var currentURL = document.URL;

实例

<!DOCTYPE html>
<html>
<head>
    <title>URL示例</title>
    <style>
        #urlDisplay {
            padding: 10px;
            background-color: #f0f0f0;
            border: 1px solid #ccc;
            margin: 10px 0;
        }
    </style>
</head>
<body>
    <h1>当前页面URL</h1>
    <div id="urlDisplay"></div>
    
    <script>
        document.getElementById('urlDisplay').textContent = document.URL;
    </script>
</body>
</html>

相关属性比较

  • window.location.href：与 document.URL 相同，返回完整URL

  • window.location.host：返回主机名和端口号

  • window.location.pathname：返回路径部分

CSS扩展

可以为URL显示区域添加样式：

.url-container {
    font-family: monospace;
    color: #0066cc;
    background-color: #f8f8f8;
    padding: 8px 12px;
    border-radius: 4px;
    border-left: 3px solid #0066cc;
    word-break: break-all;
}

.url-container:hover {
    background-color: #e8f4ff;
    transition: background-color 0.3s ease;
}

注意事项

  • document.URL 是只读属性，不能通过它修改URL

  • 要修改URL应使用 window.location.href

  • 该属性始终返回完整URL，包括协议、主机名、路径等

TAG：属性完整当前文档主机名路径功能字符串形式基本

AIGEO优化摘要

AI可读摘要：HTML DOM 返回当前文档URL功能说明document.URL 属性返回当前加载文档的完整URL（字符串形式）。基本用法实例相关属性比较window.location.href：与 document.URL 相同，返回完整URLwindow.location.host：返回主机名和端口号window.location.pathname：返回路径部分CS...
常见问题：
HTML DOM 返回加载的当前文档的URL实例主要讲了什么？

HTML DOM 返回当前文档URL功能说明document.URL 属性返回当前加载文档的完整URL（字符串形式）。基本用法实例相关属性比较window.location.href：与 document.URL 相同，返回完整URLwindow.location.host：返回主机名和端口号window.location.pathname：返回路径部分CS...

HTML DOM 返回加载的当前文档的URL实例适合哪些人参考？

适合正在了解文章信息、进行对比筛选，或希望快速获得结论的用户参考。

阅读HTML DOM 返回加载的当前文档的URL实例时应重点看哪些内容？

建议重点关注标题、摘要、正文说明、图片资料和更新时间。

AIGEO评分：85/100
  • 建议补充封面或内容图片。
作者：王壹杰
时间：2025-04-24 11:25:49
来源：https://html.ciilii.com/