'a [href^= "/"]' có nghĩa là gì?

Question

Trong mã bên dưới, có phải là a[href^="/"] cụm từ thông dụng không?

Tại sao biểu tượng này có biểu tượng ^ và nó hoạt động như thế nào?

Sự kiện nhấp chuột nào sẽ không phản hồi?

$(document).on('click', 'a[href^="/"]', function(e) { 
    e.preventDefault(); 
    var href = $(e.currentTarget).attr('href'); 
    console.log('click ' + href); 
    Backbone.history.navigate(href, { trigger: true }); 
}); 

(code source)

Answer 1

Q. Trong đoạn mã dưới đây, là a[href^="/"] một biểu thức chính quy?

R. Không, đó không phải là cụm từ thông dụng. Đó là (CSS dựa) jQuery selector.

Q. Tại sao biểu tượng này có biểu tượng^và nó làm gì?

Biểu tượng này có biểu tượng này vì nó có nghĩa là startsWith.

H. Sự kiện nhấp chuột nào sẽ không phản hồi?

R. Nó sẽ trả lời bất kỳ thẻ a nào có thuộc tính href bắt đầu bằng /.

---

Lưu ý: mã Backbone có lẽ sử dụng selector rằng để có được tất cả các liên kết nội bộ của trang web và thay đổi hành vi của họ để làm chuyển hướng khách hàng, trong khi các liên kết bên ngoài sẽ bắt đầu với http/https.

Answer 2

Các^biểu tượng chỉ ra rằng sự kiện này sẽ thực hiện bất kỳ liên kết bắt đầu với/

Answer 3

a[href^="/"] là một selector:

Selectors là mô hình phù hợp chống lại các yếu tố trong một cây, và theo mẫu như một một số công nghệ có thể được sử dụng để chọn các nút trong một tài liệu XML. Các bộ chọn đã được tối ưu hóa để sử dụng với HTML và XML và được thiết kế để có thể sử dụng được trong mã quan trọng về hiệu suất.

Biểu tượng ^ tương tự với lệnh regex ^, mặc dù đây không phải là biểu thức chính quy. Nó đang được sử dụng làm công cụ chọn thuộc tính cụ thể:

6.3.2. thuộc tính phù hợp với chuỗi selectors

Ba selectors thuộc tính bổ sung được cung cấp cho phù hợp với chuỗi con trong giá trị của một thuộc tính:

[att^= val]

Đại diện cho một yếu tố với các thuộc tính att có giá trị bắt đầu với tiền tố "val". Nếu "val" là chuỗi rỗng thì bộ chọn không đại diện cho bất kỳ thứ gì.

[att $ = val]

Đại diện cho phần tử có thuộc tính att có giá trị kết thúc bằng hậu tố "val". Nếu "val" là chuỗi rỗng thì bộ chọn không đại diện cho bất kỳ thứ gì.

[att * = val]

Đại diện cho một yếu tố với các thuộc tính att có giá trị chứa ít nhất một thể hiện của các xâu "val". Nếu "val" là chuỗi rỗng thì bộ chọn không đại diện cho bất kỳ thứ gì.

Đây là các bộ chọn cho thuộc tính phần tử (href là một thuộc tính).

W3C spec: Selectors Level 3