在 JavaScript 中获取 href
本文将介绍如何在 JavaScript 中获取 href/location。JavaScript 组件提供两种选择;第一个使用 location 属性,第二个使用 open 方法。
在 JavaScript 中获取 href 或位置
location
接口表示它所链接的对象的位置 (URL)。Document
和 Windows
界面有一个关联的位置,可以通过 document.location
或 window.location
访问。
它们之间最大的区别是它们的浏览器兼容性。window.location
被所有支持的浏览器读取/写入。
document.location
在 IE 中是只读的,但在基于 Gecko 的浏览器(如 Firefox)中是读/写的。
为了与浏览器通信,JavaScript 提供了主窗口对象。表示浏览器窗口。
所有全局变量和函数都成为组件的成员。窗口位置对象用于获取当前页面的 URL 并更改重定向 URL。
在 JavaScript 中使用 getAttribute()
获取 Href
Element
接口的 getAttribute()
方法返回元素的指定属性的值。如果指定的属性不存在,则返回值为 null
或" "
(空字符串)。
语法:
const attributeOutput = element.getAttribute(attributeName);
attributeName
是你要检索其值的属性名称。它返回包含 attributeName
值的字符串。
关于 getAttribute
函数的更多信息可以在 getAttribute
的文档中找到。
<a id="google" href="https://www.google.com"></a>
<a id="local" href="aboutUs"></a>
const value1 = document.getElementById("google").getAttribute("href");
const value2 = document.getElementById("local").getAttribute("href");
console.log(value1);
console.log(value2);
在上面的代码中,我们使用元素的 getAttribute
方法来获取与请求元素关联的 select
属性的值。在任何浏览器中运行上述代码后,它会打印出类似这样的内容。
输出:
"https://www.google.com"
"aboutUs"
在 JavaScript 中使用 href
属性获取 Href
HTMLAnchorElement.href
属性是一个字符串化器,它返回一个包含完整 URL 的 USVString
并允许更新 href。
getAttribute()
和 href
属性之间的唯一区别是先验返回 anchor
元素的值。相反,后者返回 anchor
元素指向的完整路径。
语法:
// Getting href
string = anchorElement.href;
// Setting href
anchorElement.href = string;
例子:
<a id="google" href="https://www.google.com"></a>
<a id="local" href="aboutUs"></a>
const value1 = document.getElementById("google").href;
const value2 = document.getElementById("local").href;
console.log(value1);
console.log(value2);
在上面的代码中,我们使用了 anchor
元素的 href
属性,它将给出 anchor
元素指向的完整路径。在任何浏览器中运行上述代码后,它会打印出类似这样的内容。
输出:
"https://www.google.com/"
"https://fiddle.jshell.net/_display/aboutUs"
Shraddha is a JavaScript nerd that utilises it for everything from experimenting to assisting individuals and businesses with day-to-day operations and business growth. She is a writer, chef, and computer programmer. As a senior MEAN/MERN stack developer and project manager with more than 4 years of experience in this sector, she now handles multiple projects. She has been producing technical writing for at least a year and a half. She enjoys coming up with fresh, innovative ideas.
LinkedIn