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

Node values和Element Attributes是html标记的不同部分。因此，您必须使用element.value。

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

HTML输入字段。

<input type="text" id="foo" data-something="something" value="bar">

和javascript。

var el = document.getElementById("foo"); 

console.log(el.value) // bar
console.log(el.getAttribute("id")) // foo
console.log(el.dataset.something) //something

Answer 2

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

此外，元素的value属性仅为synchronized one way - 从标记到对象，反之亦然。

因此，如果您想获得以编程方式设置的值，则需要编写

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

两者都会这样做。

此致

如何在Javascript中获取属性的值

3 个答案: