วิธีการ attr

วิธีการ attr ช่วยให้รับและเปลี่ยน แอตทริบิวต์ใดๆ ขององค์ประกอบ

สิ่งสำคัญคืออย่าสับสนระหว่างคุณสมบัติ (properties) และแอตทริบิวต์ (attributes) ขององค์ประกอบ เมื่อสร้าง DOM tree แอตทริบิวต์จะถูกแปลง เป็น DOM properties ที่สอดคล้องกันขององค์ประกอบ ชื่อ ของพวกเขาอาจไม่ตรงกันเสมอไป เช่นเดียวกับค่าของพวกเขา คุณสมบัติบางอย่างอาจไม่มี แอตทริบิวต์ที่สอดคล้องกัน พวกมันสามารถ รับและตั้งค่าได้เฉพาะเมื่อใช้วิธีการ prop เท่านั้น ตัวอย่างเช่น คุณสมบัติ tagName

ไวยากรณ์

การรับค่าแอตทริบิวต์:

$(เซเลกเตอร์).attr(ชื่อแอตทริบิวต์);

การเปลี่ยนค่าแอตทริบิวต์:

$(เซเลกเตอร์).attr(ชื่อแอตทริบิวต์, ค่าใหม่);

การเปลี่ยนค่าหลายแอตทริบิวต์:

$(เซเลกเตอร์).attr({แอตทริบิวต์แรก: ค่าใหม่, แอตทริบิวต์ที่สอง: ค่าใหม่, ...});

การใช้ฟังก์ชันกับแต่ละองค์ประกอบในเซ็ต:

$(เซเลกเตอร์).attr(ชื่อแอตทริบิวต์, function(ลำดับในเซ็ต, ค่าปัจจุบันของแอตทริบิวต์));

ตัวอย่าง

ในตัวอย่างต่อไปนี้ เราจะได้รับอินพุตผ่าน id ของมัน และแสดงค่าของแอตทริบิวต์ value ของมันบนหน้าจอ:

<input type="text" value="!!!" id="test">

let value = $('#test').attr('value');
console.log(value);

ตัวอย่าง

และตอนนี้ให้เขียนค่าใหม่ 'www' ลงในแอตทริบิวต์เดียวกันนี้:

<input type="text" value="!!!" id="test"> $('#test').attr('value', 'www');

โค้ด HTML จะกลายเป็นดังนี้:

<input type="text" value="www" id="test">

ตัวอย่าง

ลองเปลี่ยนแอตทริบิวต์ type และ value พร้อมกัน:

<input type="text" value="!!!" id="test"> $('#test').attr({value: 'www', type: 'password'});

โค้ด HTML จะกลายเป็นดังนี้:

<input type="password" value="www" id="test">

ตัวอย่าง

ลองเปลี่ยนแอตทริบิวต์ value สำหรับแต่ละอินพุต - โดยเพิ่มลำดับขององค์ประกอบในเซ็ตลงใน value ปัจจุบัน:

<input type="text" value="aaa">
<input type="text" value="bbb">
<input type="text" value="ccc">

$('input').attr('value', function(index, value) {
	return value + ' ' + index;
});

โค้ด HTML จะกลายเป็นดังนี้:

<input type="text" value="aaa 1">
<input type="text" value="bbb 2">
<input type="text" value="ccc 3">

ดูเพิ่มเติม

วิธีการ removeAttr,
ซึ่งช่วยให้ลบแอตทริบิวต์ขององค์ประกอบได้
วิธีการ prop,
ซึ่งช่วยให้ทำงานกับคุณสมบัติขององค์ประกอบได้
วิธีการ val,
ซึ่งช่วยให้รับและเปลี่ยนค่าปัจจุบันขององค์ประกอบได้