jQuery学习笔记之jQuery常用方法

$(document).ready(function() {
    // 1. 创建元素
    var newElement = $("<p>这是新创建的段落</p>");
    // 2. 添加元素到DOM
    $("body").append(newElement);
 
    // 3. 获取和设置元素属性
    $("#myImage").attr({
        src: "images/wall.jpg",
        alt: "Wall"
    });
 
    // 4. 获取和设置元素CSS属性
    $("#myImage").css("border", "3px solid red");
 
    // 5. 事件绑定
    $("#myButton").click(function() {
        alert("按钮被点击了！");
    });
 
    // 6. 隐藏和显示元素
    $("#myButton").click(function() {
        $("p").toggle();
    });
 
    // 7. 获取元素内容
    var content = $("#myImage").html();
    console.log(content);
 
    // 8. 获取和设置表单元素值
    var value = $("#myInput").val();
    console.log(value);
    $("#myInput").val("新的值");
});

这段代码展示了如何使用jQuery库来进行常见的DOM操作，包括创建元素、添加元素到DOM、获取和设置元素属性、CSS样式、事件绑定、隐藏和显示元素、获取元素内容、以及获取和设置表单元素值。