zoukankan      html  css  js  c++  java
  • JQuery的第一个例子

    在页面加载时弹出提示框

    效果:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
        <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
    </head>
    <body>
        <script>
            // 标准写法
            // $(document).ready(()=>{
            //     alert('hello, jQuery!')
            // })
            // 简写
            $(()=>{
                alert('hello, JQuery!')
            })
            
        </script>
    </body>
    </html>
    

    dom对象转换为Jquery对象

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
        <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
    </head>
    <body>
        <input type="button" onclick="btnClick()" id="btn" value="我是按钮" />
        <script>
              const btnClick = ()=>{
                // dom对象转JQuery对象
                var btnEl = document.getElementById('btn')
                var $btn = $(btnEl)
                console.log($btn.val())
                
                // JQuery对象转dom对象
                // var $btn = $('#btn')[0]
                // console.log($btn.value)
            }    
        </script>
    </body>
    </html>
    
  • 相关阅读:
    CSS学习1
    三个和尚没水喝阅读笔记
    Javascript学习1

    mv 批量
    emacs 大小写转换
    too many open files
    成都定房
    有关重定向
    postgresql 数据库
  • 原文地址:https://www.cnblogs.com/pangqianjin/p/14872200.html
Copyright © 2011-2022 走看看