• 技术文章 >web前端 >前端问答

    jquery怎么判断form元素是否存在

    青灯夜游青灯夜游2022-09-07 17:19:21原创238

    判断步骤:1、利用jQuery选择器选取form元素,语法“$("form")”或“$("#id属性值")”,会返回一个包含form元素的jQuery对象;2、利用length属性判断该jQuery对象是否为空,语法“jQuery对象.length!=0”,如果返回值为true则form元素存在,如果返回值为false则form元素不存在。

    大前端成长进阶课程:进入学习

    本教程操作环境:windows7系统、jquery3.6.1版本、Dell G3电脑。

    在jquery中,可以利用jQuery选择器和length属性来判断form元素是否存在。

    实现步骤:

    步骤1、利用jQuery选择器选取form元素

    1)jQuery 元素选择器基于元素名选取元素。

    $("标签名")

    例如$("form") 就是选取 <form> 标签元素。

    2)jQuery id选择器基于id属性选取元素。

    $("#id属性值")
    
    <form id="属性值">
    //表单元素
    </form>

    会返回一个包含form元素的jQuery对象。

    步骤2、利用length属性判断jQuery对象是否为空

    length属性可以获取jQuery对象的长度;然后可以通过检查该长度是否为0,即可判断对象是否为空。

    jQuery对象.length!=0

    实现示例:判断form元素标签和input元素标签是否存在

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<script src="js/jquery-3.6.1.min.js"></script>
    		<script type="text/javascript">
    			$(document).ready(function() {
    				$("button").click(function() {
    					var len1=$("form").length;
    					var len2=$("input").length;
    					if(len1!=0){
    						console.log("form元素存在")
    					}else{
    						console.log("form元素不存在")
    					}
    					if(len2!=0){
    						console.log("input元素存在")
    					}else{
    						console.log("input元素不存在")
    					}
    				});
    			});
    		</script>
    	</head>
    	<body>
    		<form action="demo-form.php">
    		  E-mail: <input type="email" name="userid"><br><br>
    		  <textarea></textarea><br><br>
    		</form>
    		<button>检查form元素和input元素是否存在</button>
    	</body>
    </html>

    1.gif

    可以看出,上例中,form元素和input元素都存在。

    【推荐学习:jQuery视频教程web前端视频

    以上就是jquery怎么判断form元素是否存在的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。

    前端(VUE)零基础到就业课程:点击学习

    清晰的学习路线+老师随时辅导答疑

    自己动手写 PHP MVC 框架:点击学习

    快速了解MVC架构、了解框架底层运行原理

    专题推荐:jquery
    上一篇:jquery能对数组使用函数吗 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

    相关文章推荐

    • ❤️‍🔥共22门课程,总价3725元,会员免费学• ❤️‍🔥接口自动化测试不想写代码?• jquery class选择器怎么用• jquery的validate是标签吗• jquery中有eval执行函数吗• jQuery发布 3.6.1 新版本,看看有哪些改进!• 浅析怎么使用JQuery的turn.js库来实现翻书效果• 移动端能使用jquery吗
    1/1

    PHP中文网