Tôi có một trang HTML.Làm thế nào để có được tất cả các yếu tố mà tên bắt đầu bằng một số chuỗi?
Tôi muốn trích xuất tất cả các phần tử bắt đầu bằng "q1_".
Làm cách nào để có thể đạt được điều này trong JavaScript?
Cảm ơn!
Một cách nhanh chóng và dễ dàng là sử dụng jQuery và làm điều này:
var $eles = $(":input[name^='q1_']").css("font-color","yellow");
Điều đó sẽ lấy tất cả các yếu tố mà tên thuộc tính bắt đầu với 'q1_'. Để chuyển đổi bộ sưu tập kết quả của các đối tượng jQuery để một bộ sưu tập DOM, làm điều này:
var DOMeles = $eles.get();
thấy http://api.jquery.com/attribute-starts-with-selector/
Trong tinh khiết DOM, bạn có thể sử dụng getElementsByTagName để lấy tất cả các yếu tố đầu vào, và lặp qua mảng kết quả. Elements với name bắt đầu bằng 'q1_' được đẩy lên mảng khác:
var eles = [];
var inputs = document.getElementsByTagName("input");
for(var i = 0; i < inputs.length; i++) {
if(inputs[i].name.indexOf('q1_') == 0) {
eles.push(inputs[i]);
}
}
mọi thứ không có jQuery ?? – Varun
Varun, mã thứ hai được đọc trong câu trả lời của karim79 là javascript đơn giản, anh ấy không sử dụng jQuery. – cleberz
Câu trả lời hay, ngoại trừ bạn cần '.css (" color "," yellow ");', như 'font-color' không tồn tại trong css. Tôi cũng mắc lỗi này rất thường xuyên.: P –
Bạn có thể thử sử dụng jQuery với Attribute Contains Prefix Selector.
$('[id|=q1_]')
Chưa thử nghiệm.
Bộ chọn '[attr | = value]' được cho là được sử dụng cho các định danh ngôn ngữ. – Gumbo
Bạn có thể sử dụng getElementsByName ("đầu vào") để nhận tập hợp tất cả các yếu tố đầu vào trên trang. Sau đó lặp qua bộ sưu tập, kiểm tra tên trên đường đi. Một cái gì đó như thế này:
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<input name="q1_a" type="text" value="1A"/>
<input name="q1_b" type="text" value="1B"/>
<input name="q1_c" type="text" value="1C"/>
<input name="q2_d" type="text" value="2D"/>
<script type="text/javascript">
var inputs = document.getElementsByTagName("input");
for (x = 0 ; x < inputs.length ; x++){
myname = inputs[x].getAttribute("name");
if(myname.indexOf("q1_")==0){
alert(myname);
// do more stuff here
}
}
</script>
</body>
</html>
Cảm ơn ví dụ về mã! –
có hiệu quả hơn không? – Varun
@Varun điều gì không hiệu quả về điều này? – graphicdivine
HTML DOM querySelectorAll() phương pháp dường như apt đây.
W3School Liên kết trao here
Cú pháp (Như được đưa ra trong W3School)
document.querySelectorAll(CSS selectors)
Vì vậy, câu trả lời.
document.querySelectorAll("[name^=q1_]")
Edit:
Xét đề nghị của FLX thêm liên kết đến MDN here
Anwer của bạn là hợp lệ, nhưng W3School được coi là một nguồn xấu (tài liệu lỗi thời ở khắp mọi nơi). Sử dụng MDN tốt hơn, tốt hơn nhiều. – FLX
Bạn có nghĩa là tên thẻ hoặc giá trị của a 'name' thuộc tính? – Gumbo
Có phải tất cả các phần tử được đề cập đến cùng một loại thẻ không? Tất cả họ đều là DIV hay LI chẳng hạn? – graphicdivine
Có, tất cả các yếu tố thuộc loại "đầu vào". –