Có phải "xóa" một từ khóa được dành riêng trong Google Chrome không?

Question

Tôi có một vấn đề thú vị, và tôi nghĩ rằng tôi đã đến gốc của nó, nhưng tôi muốn chắc chắn. Tôi có một liên kết gọi một hàm gọi là remove(). Tất cả các trình duyệt ngoại trừ Chrome không có vấn đề với chức năng. Tuy nhiên, liên kết được nhấp vào biến mất trong Chrome, ngay cả khi tôi đã đơn giản hóa chức năng như trong ví dụ bên dưới. Tôi đã thấy câu hỏi này: Can't use "download" as a function name in javascript. Tuy nhiên, trong các liên kết, tôi không thấy bất kỳ điều gì về "xóa" dưới dạng từ khóa dành riêng. Câu hỏi của tôi là điều này, tôi chính xác về việc này là một từ khóa? Nếu có, tôi có thể tìm thấy danh sách từ khóa của Google ở ​​bất kỳ đâu không? Tôi đã tìm kiếm và không thấy điều này là một vấn đề ở bất cứ nơi nào khác.

<a href="javascript:void(0)" onclick="remove()">Remove</a> 

Javascript:

function remove(){ 
alert("Hi"); 
} 

Answer 1

Các phần tử trong Chrome có phương thức .remove() cho phép tự xóa phần tử thay vì phải thực hiện phần tử đó từ cha mẹ.

Vấn đề là khi sử dụng trình xử lý thuộc tính, bạn sẽ nhận được một chuỗi phạm vi khác. Chuỗi phạm vi đó bao gồm chính phần tử, cũng như document. Điều này có nghĩa là tất cả các thuộc tính của phần tử và document hiển thị dưới dạng biến.

Bởi vì bạn tên là chức năng của bạn remove(), và bởi vì nó là một hàm/biến toàn cầu, nó đang được lu mờ bởi các .remove tài sản (nay là biến) trên các yếu tố riêng của mình. Điều này có thể được nhìn thấy với một cảnh báo. Nếu bạn thay đổi xử lý của bạn để:

onclick="alert(remove)" 

... bạn sẽ nhận được một cái gì đó như:

function remove() { [native code] } 

Vì vậy, nó không phải là nó dành riêng, nhưng đúng hơn là nó được sử dụng như một tài sản mà kết thúc shadowing toàn cầu.

---

Để khắc phục nó, hoặc là sử dụng toàn cầu trực tiếp:

onclick="window.remove()" 

Hoặc thay đổi tên hàm.

Answer 2

Tôi không có vấn đề trong crom sử dụng nó, cũng không theo cách này

<a href="#" id="remove">Remove</a> 

function remove() { 
    alert("Hi"); 
} 

document.getElementById("remove").addEventListener("click", remove, false); 

trên jsfiddle

Inline javascript được coi là xấu thực hành.

Nếu bạn có nhiều yếu tố bằng cách sử dụng chức năng tương tự, chỉ cần thêm hàng khác, như thế này

document.getElementById("remove1").addEventListener("click", remove, false); 
document.getElementById("remove2").addEventListener("click", remove, false); 
document.getElementById("remove3").addEventListener("click", remove, false); 
document.getElementById("remove4").addEventListener("click", remove, false); 

hoặc bạn có thể nhận được một NodeList và vòng lặp thông qua đó

var nodelist = document.querySelectorAll("[id^=remove]"); 

Array.prototype.forEach.call(nodelist, function (element) { 
    element.addEventListener("click", remove, false); 
} 

Bạn có thể có một cái nhìn ở một số khác answer here on SO để tìm hiểu thêm về sự khác biệt giữa các phương thức ràng buộc sự kiện, cũng làm một chút G tìm kiếm về chủ đề sẽ cung cấp cho bạn thêm thông tin. Và tất nhiên, bạn sẽ tránh được vấn đề mà bạn đang gặp phải bằng cách làm theo cách này.

Answer 3

Tôi không thể tìm thấy bất kỳ tài liệu nào trên đó, nhưng các phần tử DOM trong Chrome có phương thức gốc remove dường như xóa chúng. Trong onclick, this thực sự đề cập đến phần tử chính nó để nó kết thúc bằng cách gọi this.remove() loại bỏ phần tử đó. Để giải quyết vấn đề này, bạn chỉ có thể gọi số window.remove().

http://jsfiddle.net/3YkZH/1/

Nó cũng sẽ được tốt hơn để sử dụng sự kiện tiêu chuẩn ràng buộc qua addEventListener mà không có vấn đề này khi chỉ đơn giản là gọi remove:

http://jsfiddle.net/3YkZH/2/