5-jQuery-捕获

jQuery 捕获

DOM 操作

获取内容和属性，jQuery 拥有可操作 HTML 元素和属性的强大方法。

DOM = Document Object Model（文档对象模型） DOM 定义访问 HTML 和 XML 文档的标准："W3C 文档对象模型独立于平台和语言的界面，允许程序和脚本动态访问和更新文档的内容、结构以及样式。

获取内容 text() html() val()

text()、html() 以及 val()，同样拥有回调函数。回调函数有两个参数：被选元素列表中当前元素的下标，以及原始（旧的）值。然后以函数新值返回您希望使用的字符串。

$("#btn1").click(function(){
    $("#test1").text(function(i,origText){
        return "旧文本: " + origText + " 新文本: Hello world! (index: " + i + ")"; 
    });
});
 
$("#btn2").click(function(){
    $("#test2").html(function(i,origText){
        return "旧 html: " + origText + " 新 html: Hello <b>world!</b> (index: " + i + ")"; 
    });
});

设置属性 attr()

用于设置/改变属性值。

$("button").click(function(){
  $("#runoob").attr("href","http://www.baidu.com");
});

当然也可以同时设置多个属性。

$("button").click(function(){
  $("#runoob").attr({
      "href" : "http://www.baidu.com",
      "title" : "jQuery 学习"
  });
});

attr() 的回调函数

回调函数有两个参数：被选元素列表中当前元素的下标，以及原始（旧的）值。然后以函数新值返回您希望使用的字符串

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