快速提问。
我目前正在做一些 js(预/前端验证),我的问题是哪一行代码更好用。我自己一直使用这种方法。
document.formname.forminput.value
而不是
$('formelement').val()
你会推荐我使用哪个,我认为第一种方法更好,因为它不依赖外部库来提交函数?
谢谢,托尼。
快速提问。
我目前正在做一些 js(预/前端验证),我的问题是哪一行代码更好用。我自己一直使用这种方法。
document.formname.forminput.value
而不是
$('formelement').val()
你会推荐我使用哪个,我认为第一种方法更好,因为它不依赖外部库来提交函数?
谢谢,托尼。
这对你有用。
如果您只想使用纯 JavaScript,请使用:
document.formname.forminput.value
或者
document.getElementById('formelement').value
如果你想使用 jQuery 框架:
$('formelement').val()
就我个人而言,我喜欢 jQuery 方式,因为它更干净,但如果你使用它,总是知道纯 JavaScript 方式。
查看 stackexchange 上的这篇文章,了解关于纯 JavaScript 与 jQuery 的更详细讨论: https ://softwareengineering.stackexchange.com/questions/122191/what-benefits-are-there-to-native-javascript-development
“更好”很难定义。“更快”可能是第一个,尽管在输入字段中添加一个 ID 并$('#inputid')
在 jQuery 中调用可能会更快。但是差异是如此之小,以至于任何人甚至考虑对这样的选择器进行微优化都是没有意义的。
在简单地从已知输入字段中获取值时,它们也是相等的,但是如果找不到 DOM 元素,jQuery 不会抛出异常,而document.formname.forminput.value
如果 DOM 中不存在则将抛出异常formname
。如果找不到 DOM 元素,jQuery.val()
将简单地返回。undefined
不用补充,jQuery 的 API 包括val()
在不同的输入元素和浏览器之间更加一致,也可以用作 setter。
两个都很好
如果您使用的是 document.formname.forminput.value,这意味着您使用的是纯 javascript
但是如果你使用 $('formelement').val() 它来自 jquery,它是 javascript 的框架之一。为了使用,您应该下载 jquery.js 并将其包含在您的网页中。
实际上没有正确的答案...答案取决于使用它的人..
第一个是普通的javascript,所以你说不需要外部库文件..
然而
第二个是使用jquery ....
我会选择第二个原因,它简短、易读且更干净
实际上在纯 JavaScript 中你有
document.formname.fieldName.value
document.getElementsByName("fieldName")[0].value
document.getElementById("fieldID")[0].value
而 jQuery 中的类似访问将是
$("input[name='fieldName'"].val();
或者
$("#fieldID"].val();
一定要知道区别
如果页面中没有 jQuery 而不是为了获取表单字段的值,那么我认为 jQuery 是不必要的。但是,如果您正在做任何稍微复杂且跨浏览器的事情,例如 Ajax 或事件处理,请使用 jQuery 来满足您在页面上的所有需求
根据 JS Perf,本机 DOM 方法document.querySelector()
最快,而您在问题中发布的本机 DOM 方法最慢。据推测,“快速”与高效相关,那么,选择方式id
(正如 jQuery 和document.querySelector()
方法都使用的那样)似乎是最快的选择方法。
JS Perf 链接如下,基于以下 HTML:
<form action="#" method="post" name="trek">
<fieldset>
<label for="input1">
Input One:
</label>
<input id="input1" value="An input, Jim; but just as we know it..." />
</fieldset>
<fieldset>
<label for="input2">
Input Two:
</label>
<input id="input2" value="'Beam me up, Scotty!' attributed to, but never said, in Star Trek."
/>
</fieldset>
</form>
原生 DOM:
var input1 = document.trek.input1.value,
input2 = document.trek.input2.value;
console.log(input1, input2);
更多 DOM:
var input1 = document.getElementById('input1').value,
input2 = document.getElementById('input2').value;
console.log(input1, input2);
还有更多 DOM,d.qS:
var input1 = document.querySelector('#input1').value,
input2 = document.querySelector('#input2').value;
console.log(input1, input2);
和 jQuery:
var input1 = $('#input1').val(),
input2 = $('#input2').val();
console.log(input1, input2);
参考:
在这种情况下,没有理由使用 jQuery 而不是 javascript。