如何通过父元素ID结合name在jQuery中获取输入框并设置placeholder文本？

方法1：结合父元素ID与name选择器直接定位 #

通过CSS选择器的层级关系，限定在指定父div范围内查找目标输入框，精准获取单个或多个元素：

• 单独获取并设置每个输入框：

// 收货区电话输入框
const shippingTel = document.querySelector('#shipping input[name="telephone"]');
shippingTel.placeholder = '请填写收货联系电话';

// 账单区电话输入框
const billingTel = document.querySelector('#billing input[name="telephone"]');
billingTel.placeholder = '请填写账单联系电话';

• 批量获取两个输入框并统一/差异化设置：

const telephoneInputs = document.querySelectorAll('#shipping input[name="telephone"], #billing input[name="telephone"]');
telephoneInputs.forEach(input => {
  // 根据父元素ID设置不同提示文本
  input.placeholder = input.closest('#shipping') ? '收货电话' : '账单电话';
});

方法2：先获取父元素，再在父范围内查找子元素 #

先定位到父div，再在其内部查找目标输入框，逻辑更直观，适合父元素有其他操作需求的场景：

// 处理收货区输入框
const shippingDiv = document.getElementById('shipping');
const shippingTel = shippingDiv.querySelector('input[name="telephone"]');
shippingTel.placeholder = '收货联系电话';

// 处理账单区输入框
const billingDiv = document.getElementById('billing');
const billingTel = billingDiv.querySelector('input[name="telephone"]');
billingTel.placeholder = '账单联系电话';

内容的提问来源于stack exchange，提问作者Mujahidh