jQuery DOM

89463661 2020-05-03

jQuery HTML

捕获

  • test() 设置或者返回所选元素的文本内容

  • html() 所选元素的内容

  • val() 返回表单字段的值

  • attr() 设置/改变属性值(可以允许访问多个属性值)

  • attr()的回调函数:回调函数有两个参数:被选元素列表中当前元素的下标,以及原始(旧的)值。然后以函数新值返回您希望使用的字符串。

    $("button").click(function(){
      $("#runoob").attr("href", function(i,origValue){
        return origValue + "/jquery"; 
      });
    });

添加元素

  • append() 被选元素结尾插入内容

  • predend()被选元素开头插入内容

  • after() 被选元素之后插入内容

  • before() 在被选元素之前插入内容

    //例子
    $("p").prepend("在开头追加文本");

删除元素

  • remove() 删除被选元素

    $(‘#divone‘).remove();
  • empty() 从被选元素中删除子元素

  • 过滤被删除元素

    $(‘p‘).remove(‘.italic‘) //删除p标签中class=‘italic‘

操作css

  • addClass() 向被选元素添加一个或多个类

  • removeClass()向被选的元素删除一个或多个类

  • toggleClass() 对被选元素进行添加/删除类的切换操作

  • css() 设置或返回样式属性

    $("button").click(function(){
      $("h1,h2,p").addClass("blue");
      $("div").addClass("important");
    });
    $("p").css("background-color");

尺寸方法

  • width()
  • height()
  • innerWidth()
  • innerheight()
  • outerWidth()
  • outerheight()

相关推荐