jQuery操作基本操作一学习笔记

基本选择

用法描述
$(“#elementID”) #表示根据id查找；查找id为elementID的元素；建议的用法。所以一般推荐给标签设置ID。
类似：
document.getElementById("elementID") 但两者之间返回类型不同

成都创新互联公司是一家专注网站建设、网络营销策划、微信平台小程序开发、电子商务建设、网络推广、移动互联开发、研究、服务为一体的技术型公司。公司成立十余年以来，已经为数千家展览展示各业的企业公司提供互联网服务。现在，服务的数千家客户与我们一路同行，见证我们的成长；未来，我们一起分享成功的喜悦。

$(“.className”) .表示根据class样式名称查找；查找样式名称为className的所有标签

$(“input”) 查找所有input标签

基本取/设值

用法描述
$(“#elementID”).val()
$(“#elementID”).val(“新值”)
分别表示取值和设置值
$(“#elementID”).html()
$(“#elementID”).html(“新值”)
分别表示获取标签内部的html文本内容和设置html文本内容。类似innerHTML
$(“#elementID”).text()
$(“#elementID”).text(“新值”)
分别表示获取标签内部的纯文本内容和设置纯文本内容。
$(“#elementID”).attr(“name”)
$(“#elementID”).attr(“name”,”itcast”)
attr为获取对应属性的值或设置对应属性的值。如果遇上具有 true 和 false 两个属性的属性，如 checked, selected 或者 disabled 则使用prop()

<meta charset="UTF-8">
    <title>01_basic.html</title>
    <!--<script type="text/javascript" th:src=@{"js/jquery-3.3.1.js}"></script>-->
    <script src="../../static/js/jquery-3.3.1.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("#btn1").click(function(){
                alert($("#div1").html());
            });
            $("#btn2").click(function(){
                alert($(".divClass").text());
                });
            $("#btn3").click(function(){
                alert($("#div1").attr("title"));
            });
            $("#btn4").click(function(){
                alert($("input").length);
            });
            $("#btn5").click(function(){
                $("#div1").html("div内容修改！！");
            });
            $("#btn6").click(function(){
                alert("div的内容："+$("#div1").text() + "，span的内容:" + $("span").text())
            });

        });
    </script>
    <style>
    .divClass{
        text-align: center;
        width: 100%;
    }
    </style>
</head>

<body>
<div id="div1" class="divClass" title="div 的 title属性值">
    <p>div 的内容</p>
</div>
        <br><br>
        <input type="text" value="输入框1"><br>
        <input type="text" value="输入框2"><br><br>
        <span>这是span的信息</span><br>

        <input type="button" value="1#获取div里面的Html内容" id="btn1">
        <br><br>
        <input type="button" value="2.获取div里面的纯文本内容" id="btn2">
        <br><br>
        <input type="button" value="3#获取div里面的title属性的值" id="btn3">
        <br><br>
        <input type="button" value="4获取input的个数" id="btn4">
        <br><br>
        <input type="button" value="5改变div里面的值" id="btn5">
        <br><br>
<input type="button" value="同时获取div和span" id="btn6">
<br><br>

文章题目：jQuery操作基本操作一学习笔记
URL分享：https://www.cdcxhl.com/article42/iipjec.html

成都网站建设公司_创新互联，为您提供App设计、、静态网站、App开发、网站导航、网站排名

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容