jQuery之html（）、text（）、val（）、attr（）、prop（）的简单比较
发表：紫石头原创模板堂 发表时间：2019-07-18 10:35:27 阅读：84次
搞后台开发的前端不熟悉，经常遇到一些前端的方法，但是理解的不是很深刻希望通过总结一下这方面的知识。来弥补这方面的不足！
<body>
<div id="box">
年龄:<input type="text" name="age" id="x1" value="18"/>
<p>文本内容</p>
</div>
<div id="box1">
<a href="#" id="link1" action="delete">删除</a>
</div>
<script>
$(function(){
/*val()获取value的值*/
var str1=$("#x1").val();
console.log("使用val()方法获取的是属性value的值:"+str1);
var str2= $("#x1").attr("name");
console.log("使用attr()获取的是元素任意属性的值:"+str2);
var str3= $("#x1").attr("value");
console.log("使用attr()获取的是元素属性的值:"+str3);
var str4 =$("#box").html();
console.log("使用html()获取的是div中所有内容包含标签:"+str4);
var str5=$("#box").text();
console.log("使用text()方法获取的是div中内部的所有文本值:"+str5);
/*attr()和prop()的区别：主要在于自定义属性和固有属性的区别*/
var str6 = $("#link1").attr("action");
console.log("使用attr()获取自定义属性的值："+str6);
var str7 = $("#link1").prop("action");
console.log("使用prop()获取自定属性的值:"+str7);
});
</script>
十六年网站建设相关经验
一站式为您提供网站相关服务
欢迎扫码咨询
