Jquery中获取节点内容的html、text和val对比

这几天学了点ajax 对Jquery中获取节点文本内容函数html()、text()和val()用途区别有点混乱,索性就写出来顺便学习一下:
为了对比特意写了一点代码测试:

<input type="button" id="button" value="点击"></br>
<input type="text" id="text">
<div id="div">
<div>1</div>
<div>2</div>
<div>3</div>
</div>
$(document).ready(function(){
    var button=$("#button");
    button.click(function(){
        alert("VAL提示:"+button.val());
        alert("HTML提示:"+button.html());
        alert("TEXT提示:"+button.text());
    });
    var input=$("#text");
    input.keyup(function(event){
        var myEvent=event||window.event;
        var keyCode=myEvent.keyCode;
        if(keyCode==13){
        alert("VAL文本框内容为:"+input.val());
        alert("HTML文本框内容为:"+input.html());
        alert("TEXT文本框内容为:"+input.text());
        }
    });
    var div=$("#div");
    div.click(function(){
        alert("DIV(VAL)文本内容为:"+div.val());
        alert("DIV(HTML)文本内容为:"+div.html());
        alert("DIV(TEXT)文本内容为:"+div.text());

    });
});

运行结果依次(由于图比较多就不贴了):
按钮:
VAL提示:点击
HTML提示:
TEXT提示:
文本框:
VAL文本框内容为:a
HTML文本框内容为:
TEXT文本框内容为:
Div元素:
DIV(VAL)文本内容为:
DIV(HTML)文本内容为:

                            <div>1</div>
                            <div>2</div>
                            <div>3</div>

DIV(TEXT)文本内容为:
1
2
3

val():从上面可以看出是对button input可以获取其文本值。经过查资料发现val()主要应用于表单元素 如select 等。
html():显示该元素所有节点和文本内容。
text():只显示该元素所有元素的文本内容。

同理就可以通过上述三个函数为某个节点设置文本内容或节点!

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值