Javascript: Đặt vị trí.href so với vị trí


311

Khi nào bạn sẽ đặt locationthành một chuỗi URL so với cài đặt location.href?

location = "http://www.stackoverflow.com";

đấu với

location.href = "http://www.stackoverflow.com";

Tham chiếu mạng của nhà phát triển Mozilla


6
cài đặt location.hrefthư thất bại vì chính sách cùng nguồn gốc: javascript.info/tutorial/,
Taha Jahangir


1
Tôi có một ứng dụng Angular 4 sử dụng TypeScript 2.6.2. window.location chỉ được đọc và tôi chỉ có thể gán bằng window.location.href (trong ngữ cảnh gọi lại từ đăng ký góc), không có lỗi trình biên dịch - có thể đó là một loại điều tương thích JavaScript 1.0 hoặc liên quan đến xử lý không đồng bộ . Về cơ bản window.location.href dường như là thứ duy nhất luôn hoạt động.
Chris Halcrow

Câu trả lời:


261

Bạn có thể đặt locationtrực tiếp vì nó ngắn hơn một chút. Nếu bạn đang cố gắng để được ngắn gọn, bạn cũng có thể bỏ qua window.quá.

Việc gán URL cho cả hai location.hreflocationđược xác định để hoạt động trong JavaScript 1.0, trở lại trong Netscape 2 và đã được triển khai trong mọi trình duyệt kể từ đó. Vì vậy, hãy lựa chọn và sử dụng bất cứ điều gì bạn thấy rõ ràng nhất.


9
Giống như được đề cập bởi @SwissMister trong câu trả lời dưới đây, có vẻ như window.location.href được xử lý phần nào giống như một yêu cầu XHR. Nếu được kích hoạt từ trong cuộc gọi lại thành công của XHR, window.location.href sẽ được coi là XHR trong khi window.location mô phỏng nhấp vào liên kết.
Akshay Raje

147

Ngay cả khi cả hai làm việc, tôi sẽ sử dụng sau này. locationlà một đối tượng và việc gán một chuỗi cho một đối tượng không mang lại hiệu quả tốt cho khả năng đọc hoặc bảo trì.


60
Trong khi thực hiện tích hợp PayPal phức tạp, tôi đã gặp phải một lý do rất hấp dẫn để sử dụng window.location: nó không yêu cầuSAME ORIGIN .
Thụy Sĩ

4
Có lẽ đó chỉ là tôi nhưng location = 'http://www.example.com'dường như siêu dễ đọc. Mặc dù, như một trường hợp đặc biệt. Đó là tương thích ngược và sẽ vẫn tương thích trong tương lai gần.
Alex W

10
Nếu window.location là một đối tượng, việc gán một chuỗi cho nó sẽ ghi đè lên nó bằng một chuỗi. Trong thực tế window.location là một thuộc tính có các phương thức getter và setter. Khi bạn đặt nó, một chuỗi được mong đợi và đối tượng Vị trí toàn cầu được bộ setter cập nhật. Khi bạn nhận được nó, đối tượng Vị trí toàn cầu được trả về.
JukkaP

64

Giống như đã nói, locationlà một đối tượng . Nhưng người đó đề nghị sử dụng một trong hai. Nhưng, bạn sẽ làm tốt hơn để sử dụng .hrefphiên bản.

Các đối tượng có các thuộc tính mặc định, nếu không có gì khác được chỉ định, chúng được giả sử. Trong trường hợp của locationđối tượng, nó có một thuộc tính được gọi .href. Và bằng cách không chỉ định BẤT K property thuộc tính nào trong khi gán, nó sẽ mặc định "href".

Đây là tất cả tốt và tốt cho đến khi một phiên bản mô hình đối tượng sau này thay đổi và không còn thuộc tính mặc định, hoặc thuộc tính mặc định được thay đổi. Sau đó, chương trình của bạn bị phá vỡ bất ngờ.

Nếu bạn có ý nghĩa href, bạn nên chỉ định href.


13
Giải thích tốt, tốt hơn là chỉ nhận xét chung về khả năng đọc hoặc bảo trì. Trong thực tế trong trường hợp cụ thể này, mô hình đối tượng sẽ không bị thay đổi, vì một nửa web sẽ dừng lại - do đó sử dụng ... nó không thành vấn đề
Neromancer

71
Điều này nghe có vẻ tốt nhưng không thực sự đúng. Không có khái niệm về một thuộc tính mặc định trong DOM hoặc JavaScript nói chung. Việc chỉ định một chuỗi locationhoạt động vì thuộc tính được xác định để có hành vi gán đặc biệt này trở lại trong JavaScript 1.0 và mọi trình duyệt đã thực hiện điều đó. HTML5 bây giờ yêu cầu nó. Vì vậy, trong khi nó có thể đẹp hơn hoặc phù hợp hơn để gán cho .href, không có lợi thế tương thích ngược hoặc tiến để làm như vậy.
bobince

6
tính đẹp
Tom Andersen

4
window.location = urlđẹp hơn
Eric Muyser

21
location = urllà dễ thương hơn
fregante

20

Một vài năm trước, tôi locationđã không làm việc với IE và location.hrefđã làm (và cả hai đều hoạt động trong các trình duyệt khác). Kể từ đó tôi luôn luôn sử dụng location.hrefvà không bao giờ gặp rắc rối nữa. Tôi không thể nhớ phiên bản IE đó là gì.


42
Có lẽ một phiên bản IE đã bị lỗi và mọi trình duyệt khác đều làm đúng. ;-)
Shawn D.

9
trong strict modechrome sẽ đưa ra một ngoại lệ nếu bạn cố gắng gán trực tiếp cho locationquá, vì vậy tôi luôn sử dụnglocation.href
Hashbrown

9
Phiên bản "một" của IE?
Lpc_dark

@Shawn D. Một trình duyệt làm mọi thứ chính xác? Khi nào thì điều đó xảy ra! : D
user2173353

15

Chỉ cần làm rõ, bạn không thể làm location.split('#'), locationlà một đối tượng, không phải là một chuỗi. Nhưng bạn có thể làm location.href.split('#');location.hreflà một chuỗi.


3
Nhận xét của bạn là đúng, nhưng bạn đang nói về việc lấy thuộc tính href, một chuỗi, của đối tượng vị trí. Tất cả các cuộc thảo luận khác đang xử lý việc gán một giá trị, không đọc giá trị. Nhưng quan điểm của bạn là chính xác. Sự khác biệt là href là một chuỗi trong khi vị trí là một đối tượng.
Phil DD

15

Một sự khác biệt cần ghi nhớ, mặc dù.

Giả sử bạn muốn xây dựng một số URL bằng URL hiện tại. Đoạn mã sau trên thực tế sẽ chuyển hướng bạn, bởi vì nó không gọi String.replacenhưng Location.replace:

nextUrl = window.location.replace('/step1', '/step2');

Các mã sau hoạt động:

// cast to string
nextUrl = (window.location+'').replace('/step1', '/step2');

// href property
nextUrl = window.location.href.replace('/step1', '/step2');

3

Với TypeScript sử dụng window.location.href như window.locationlà một đối tượng về mặt kỹ thuật bao gồm:

Properties
hash 
host 
hostname
href    <--- you need this
pathname (relative to the host)
port 
protocol 
search 

Cài đặt window.location sẽ tạo ra lỗi loại, trong khi đó window.location.hreflà kiểu chuỗi.

Nguồn

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.