欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

《JQuery 能干点啥~》第四讲 html() 与 text()的赋值比较

程序员文章站 2022-03-01 20:33:21
...

这里 我要说一下~ 由于 JQ 并不是很难,而且 我也讲几节了~ 所以 我会 慢慢的 省略到一些 可有可无的说明,如果有童鞋 看不懂了,请及时留言~

-------------------------------------------------- 开讲了--------------------------------------------------

其实,在 将 val() 的时候 我已经说过了,JQ 中 很多 关于 取值赋值的方法,都有个通用原则,那就是:

没有参数为取值,有参数为赋值,而且参数值为所要赋得值

这个原则 在 text 和html 中也同样适用,但有点区别,接下来 我来具体的解释下~

先说 html 吧!

第三讲 说了 html  取值 ,取得是 html内容 那么,在这里,赋值赋得 也是 html内容 !这也就说明,当用html 赋值以后,原对象的 标签内的 html 结构 就会发生改变!
举个例子吧

<div id="m_div">
<p>
原来是这个!
</p>
</div>
 



现在我们来用 html 赋值 

$("#m_div").html("<button>变成button了</button>")
 



其 结果将变为

<div id="m_div">
<button>变成button了</button>
</div>
 



html 结构 从原来的 段落 变成了 现在的 按钮了~ 这样应该比较好理解了~

现在 来说 text 方法吧

如果 第三讲  中 html内容 和 内容  那么 接下来就应该比较好理解了~

上面 html  赋值 是改变 html内容 

那么 text 赋值 自然是改变 内容了~
根据上一讲的 内容, text 改变的就是 第一个 选择器 中 各标签的文本内容~
接着举例子吧
还是以 第一段 代码为例子

$("#m_div").text("<button>变成button了</button>")
 



其结果为

<div id="m_div">
<p>
&#60;button&#62; 变成button了&#60; /button&#62; 
</p>
</div>
 



其中的 尖括号 < 会被变为 <  而 >会 变为>
这样以来,页面中 显示标签 将不会 浏览器 解释成 按钮了

说的再浅显点,就是 text 的参数为什么样的,那么在页面中 显示的就是什么

照例~ 下面是 附件内容:有兴趣的童鞋 就下载把!
里面有一些 东西 是明天要讲,可以先看下