领先的免费Web技术教程，涵盖HTML到ASP.NET

网站首页 > 知识剖析 正文

web开发之-jquery的基本使用(4) jquery基本用法

nixiaole 2024-11-10 12:33:58 知识剖析 17 ℃

jquery表单元素的操作

在jquery中，操作表单的情况会更多一些，这里我们来操作表单元素，form表单中的input框，select，checkbox等元素的值。

index.html:

<html>
    <head>
        <title>js</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    </head>
    <body>
        <input id="username_id" type="text" value="我是初始值" >
        <button id="submit_btn">点击更改</button>
    </body>
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script type="text/javascript" src="./index.js">
    </script>
</html>

index.js:

$(function(){
    var dom = $("#username_id");
    console.log(dom.val());
    $("#submit_btn").click(function(){
        dom.val("我是更改后的值");
        console.log(dom.val());
    });
});


注：

元素值的获取使用 $("选择的元素").val();同样的内容设置在val()里写上想要设置的值就可以了。

jquery操作元素的属性

$(function(){
    var dom = $("#username_id");
    dom.attr("mydate","我是自定义的属性的值");
    console.log(dom.attr("mydate"));
});


注：

使用$("选择的元素").attr("想要获取的属性")来获取某一元素的属性的值；

同样的使用attr("属性","属性的值")来设置某一元素属性的值。

Tags：

猜你喜欢

最近发表
标签列表