JQ和Js获取span标签的内容

最新推荐文章于 2023-09-07 15:57:46 发布

转载最新推荐文章于 2023-09-07 15:57:46 发布 · 1.2k 阅读

2 ·

CC 4.0 BY-SA版权

原文链接：https://www.cnblogs.com/anniey/p/6439021.html

文章标签：

#js #jquery #css #span

前端专栏收录该内容

4 篇文章

订阅专栏

本文详细介绍了如何使用JavaScript和jQuery从HTML的span标签中提取文本内容。通过比较JS的innerText, innerHTML方法和JQ的text(), html(), val()方法，揭示了不同方法在span元素上的适用性。

JQ和Js获取span标签的内容

html:

1 <span id="content">‘我是span标签的内容’</span>

javascript获取:

1 var cont=document.getElementById("content");
2 console.log('innerText cont= '+ cont.innerText); 
3 console.log('innerHtml cont= '+ cont.innerHTML); 
4 //以上两条都能输出span标签的值‘我是span标签的内容’；

jquery获取:

1 var cont=$("#content");
2 console.log(cont.val()); //输出  (无值);
3 console.log(cont.text()); //输出 ‘我是span标签的内容’;
4 console.log(cont.html()); //输出 ‘我是span标签的内容’;

小知识：

***在JS中使用innerHTML时希望自己注意，不要写成了cont.innerHtml ，这样输出结果就是 undefined ；
**在表单中习惯性的选用val()来获取值，但是在span标签继续想用val()方法的时候打印空值；
*无奈想了一下，span这个容器需要用text()来获取的呀，我泪奔了，逃走~~·

转载自：https://www.cnblogs.com/anniey/p/6439021.html