jQuery html text val 方法 的异同

text（） 

    jquery的具体的函数功能就不介绍了，其实text是调用jquery中getText()，而getText是一个从DOM数组中取得text value的工具函数（记得是Dom数组），具体实现就是遍历Dom数组的每一个Dom元素，然后判断他的节点类型（if ( elem.nodeType === 3 || elem.nodeType === 4 )）这句代码的意思就是判断此节点是否是文本节点或者是CDATA，若是的话就直接去elem的nodevalue。若不是则判断节点是不是注释节点如不是，则递归遍历此节点的子节点（getText( elem.childNodes )）。如此遍历最后得到text value。 

有上面分析可得到jquery对象的text就是取此节点的nodevalue或是此节点的子节点的nodevalue。所以即使嵌套的再深，也会取得文本节点的值。 

注意：通过选择器返回的jquery对象其实是一个数组。 

<div id=”div1”><div id=”div2”>Find Me</div></div> 

jquery代码 $(“#div1”).text() 返回Find Me 



val（） 

    val（）的具体实现是根据jquery对象包装的Dom元素的value属性来的。并不是所有的Dom都有value属性，详细的各Dom元素具有的属性 

DOm中有value属性的是Button ImageButton（设置或返回在按钮上显示的文本） CheckBox（设置或返回 checkbox 的 value 属性的值） File（返回由用户输入设置的文本后，FileUpload 对象的文件名。） Hidden（设置或返回隐藏域的 value 属性的值。），Password ，Radio ， Reset (设置或返回按钮上显示的文本),Submit Text Option textarea 

注意select虽然没有value属性，但是val在取得元素的value属性之前还有一个判断，子啊valhooks中也好像只针对了select和option 

hooks = jQuery.valHooks[ elem.nodeName.toLowerCase() ] || jQuery.valHooks[ elem.type ]; 

if ( hooks && "get" in hooks && (ret = hooks.get( elem, "value" )) !== undefined ) { 

return ret; 

其实本人对其中的代码就不是很清楚了（有兴趣自己研究啊）。但他保证了select正确取得val（）； 

而其他jquery对象取得Val，好像只是一个“”； 



html 

    不用我说你也已经猜到，这个方法调用的是哪个Dom属性，bingo！就是innerhtnl，其实本人对innerhtml不是很熟 

看起来跟text很像啊，其实不然，前面我们说过，text其实取得一致都是text节点的值，而innerhtml却是只取包裹的元素，像上面的那个例子就会返回<div di=”div2 

“>Find ME</div> ，其实我还试过取得select的html，如你所愿确实是很多option，但值得注意的是并不是所有的html标签都可以包裹元素，比如像input就不可以