如何在Javascript中获取属性的值

Question

我有这个输入行，我试图提取 value 属性的文本：

    <input type="text" class="card-input small-font" 
ng-value="paymentVia.typeDisplay" readonly="" value="Credit card">

函数getAttribute("class")工作正常，它返回card-input small-font但函数getAttribute("value")返回null 。 我也试过 .value ，但这会返回一个空字符串。

有谁知道为什么会这样？

这是我的JS：

function() {
   var x = document.getElementsByClassName("card-input small-font");
   var payment =x[18].value;

   return payment;
}

Answer 1

节点值和元素属性是 html 标签的不同部分。 因此，您必须改用element.value 。

这是一个示例，向您展示如何从输入字段中获取value 、 data 、 attribute 。

HTML 输入字段。

<input type="text" id="profile" data-nationality="Eritrean" value="Simon">

和 javascript。

var el = document.getElementById("user-profile"); 

console.log(el.value) // Simon
console.log(el.getAttribute("id")) // profile
console.log(el.dataset.nationality) // Eritrean

Answer 2

element.getAttribute("value")返回在标记中设置的值，它不一定与element.value相同。

此外，元素的 value 属性仅以一种方式同步- 从标记到对象，反之亦然不会发生。

所以，如果要获取以编程方式设置的值，则需要编写

element.value

否则，如果您需要获取在标记中定义的值

<input value="abc">

你需要做element.getAttribute("value")

Answer 3

或者使用 jQuery，您可以从文本框中获取价值，例如

var val1 = $(".class name").val();//to get value by class name
var val1 = $("#id").val();//to get value by id

两者都会做同样的事情。

问候