HTML Get

来源:互联网 发布:标致pp2000软件 编辑:程序博客网 时间:2024/05/21 12:50

jQuery库包含了很多用来改变和操作HTML元素及其属性的方法。

其中一个非常重要的部分就是jQuery可以用来操作DOM。

本篇介绍使用jQuery来取得DOM节点元素的值或属性。

其中三个简单而有用的方法如下:

 

text() – 设置或取得指定元素的文本内容。

html() – 设置或取得指定元素的内容(包括HTML标记)

val() – 设置或取得表单某个输入域的值。

例如,下面代码使用html()和text()方法取得HTML元素的内容:

 

 

[javascript] 

$("#btn1").click(function(){  

  alert("Text: " + $("#test").text());  

});  

$("#btn2").click(function(){  

  alert("HTML: " + $("#test").html());  

});  

 

$("#btn1").click(function(){

  alert("Text: " + $("#test").text());

});

$("#btn2").click(function(){

  alert("HTML: " + $("#test").html());

});

 

下面的代码取得Form中Input 的内容:

 

 

 

[javascript]  

$("#btn1").click(function(){  

  alert("Value: " + $("#test").val());  

});  

 

$("#btn1").click(function(){

  alert("Value: " + $("#test").val());

});

 

除了上面的方法外,attr()方法用来取得某个元素的属性:

下面代码用来取得链接的href属性:

 

 

 

[html] 

<!DOCTYPE html>  

<html>  

<head>  

<meta charset="utf-8">  

<title>JQuery Demo</title>  

<script src="scripts/jquery-1.9.1.js"></script>  

</script>  

<script>  

    $(document).ready(function () {  

        $("button").click(function () {  

            alert($("#guidebee").attr("href"));  

        });  

    });  

</script>  

</head>  

  

<body>  

<p><a  

    href="http://www.imobilebbs.com"  

    id="guidebee">  

    imobilebbs.com  

   </a></p>  

<button>Show href Value</button>  

</body>  

</html>  

 

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>JQuery Demo</title>

<script src="scripts/jquery-1.9.1.js"></script>

</script>

<script>

    $(document).ready(function () {

        $("button").click(function () {

            alert($("#guidebee").attr("href"));

        });

    });

</script>

</head>

 

<body>

<p><a

    href="http://www.imobilebbs.com"

    id="guidebee">

    imobilebbs.com

   </a></p>

<button>Show href Value</button>

</body>

</html>

 

20130308001

原文链接:http://www.2cto.com/kf/201303/195084.html
0 0