jQuery 處理網(wǎng)頁(yè)內(nèi)容的實(shí)現(xiàn)代碼
更新時(shí)間:2010年02月15日 14:55:53 作者:
改變頁(yè)面內(nèi)容應(yīng)該算是Javascript最常用的功能,這包括更改已經(jīng)存在的頁(yè)面元素或者添加新的HTML元素。
jQuery提供兩種實(shí)現(xiàn)這種功能的方法 – text()和html()。text()是對(duì)純文本的處理;html()和text()相似,不同的是它還支持HTML代碼。
//設(shè)置ID為"b5_a"段落的內(nèi)容為"這是新加入的文本信息";
$('#b5_a").text("這是新加入的文本信息");
//在ID為"b5_b"的div里加入一段html代碼;
$("#b5_b").html("<p>新加入一個(gè)html段落</p>");
有時(shí)我們要讀取頁(yè)面的內(nèi)容,這也可以用text()和html()來(lái)實(shí)現(xiàn)。同樣,使用text()得到的是純文本;使用html()得到的是html代碼。
//點(diǎn)擊第二個(gè)按鈕查看相關(guān)元素的文本內(nèi)容
$("button:eq(1)").click(function(){
alert($('#b5_a').text());
});
//點(diǎn)擊第四個(gè)按鈕查看相關(guān)元素的HTML內(nèi)容
$("button:eq(3)").click(function(){
alert($('#b5_a').html());
});
注意:text()和html()返回值得類型都是字符串型(string)。如果我們要對(duì)返回值進(jìn)行算術(shù)運(yùn)算,我們可以使用原始的JavaScript 函數(shù):parseInt 或者 parseFloat 先把字符串轉(zhuǎn)換成整形或者浮點(diǎn)型。
<ul id="u2">
<li>12.3</li>
<li>1.5</li>
</ul>
//通過(guò)下面的jQuery代碼,可以對(duì)上述列表求和
$("button:eq(4)").click(function(){
var sum = 0;
$('li').each(function(index){
sum += parseFloat($(this).text());
});
alert(sum);
});
復(fù)制代碼 代碼如下:
//設(shè)置ID為"b5_a"段落的內(nèi)容為"這是新加入的文本信息";
$('#b5_a").text("這是新加入的文本信息");
//在ID為"b5_b"的div里加入一段html代碼;
$("#b5_b").html("<p>新加入一個(gè)html段落</p>");
有時(shí)我們要讀取頁(yè)面的內(nèi)容,這也可以用text()和html()來(lái)實(shí)現(xiàn)。同樣,使用text()得到的是純文本;使用html()得到的是html代碼。
復(fù)制代碼 代碼如下:
//點(diǎn)擊第二個(gè)按鈕查看相關(guān)元素的文本內(nèi)容
$("button:eq(1)").click(function(){
alert($('#b5_a').text());
});
//點(diǎn)擊第四個(gè)按鈕查看相關(guān)元素的HTML內(nèi)容
$("button:eq(3)").click(function(){
alert($('#b5_a').html());
});
注意:text()和html()返回值得類型都是字符串型(string)。如果我們要對(duì)返回值進(jìn)行算術(shù)運(yùn)算,我們可以使用原始的JavaScript 函數(shù):parseInt 或者 parseFloat 先把字符串轉(zhuǎn)換成整形或者浮點(diǎn)型。
復(fù)制代碼 代碼如下:
<ul id="u2">
<li>12.3</li>
<li>1.5</li>
</ul>
//通過(guò)下面的jQuery代碼,可以對(duì)上述列表求和
$("button:eq(4)").click(function(){
var sum = 0;
$('li').each(function(index){
sum += parseFloat($(this).text());
});
alert(sum);
});
相關(guān)文章
jQuery在ie6下無(wú)法設(shè)置select選中的解決方法詳解
這篇文章主要介紹了jQuery在ie6下無(wú)法設(shè)置select選中的解決方法,結(jié)合實(shí)例分析了jQuery在ie6下無(wú)法設(shè)置select選中的原因與相關(guān)處理技巧,需要的朋友可以參考下2016-09-09jQuery根據(jù)name屬性進(jìn)行查找的用法分析
這篇文章主要介紹了jQuery根據(jù)name屬性進(jìn)行查找的用法,結(jié)合實(shí)例形式分析了jQuery各種常見(jiàn)name屬性獲取元素的相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2016-06-06Jquery增加鼠標(biāo)中間功能mousewheel的實(shí)例代碼
這篇文章介紹了Jquery增加鼠標(biāo)中間功能mousewheel的實(shí)例代碼,有需要的朋友可以參考一下2013-09-09jquery入門必備的基本認(rèn)識(shí)及實(shí)例(整理)
本文整理了一些jquery入門必備的基本知識(shí)及相關(guān)實(shí)例,適合初學(xué)者學(xué)習(xí),另附一些jquery的常用事件,感興趣的各位可不要錯(cuò)過(guò)了哈2013-06-06jQuery中extend()和fn.extend()方法詳解
jQuery自定義了jQuery.extend()和jQuery.fn.extend()方法.其中jQuery.extend()方法能夠創(chuàng)建全局函數(shù)或者選擇器,而jQuery.fn.extend()方法能夠創(chuàng)建jQuery對(duì)象方法.2015-06-06jquery向.ashx文件post中文亂碼問(wèn)題的解決方法
jquery向.ashx文件post中文亂碼問(wèn)題的解決方法,需要的朋友可以參考下。2011-03-03jquery.bgiframe.js在IE9下提示INVALID_CHARACTER_ERR錯(cuò)誤
今天測(cè)試偶然發(fā)現(xiàn)jquery.bgiframe.js在IE9環(huán)境下提示錯(cuò)誤,于是很是好奇,想辦法知道究竟,于是搜索了一下,現(xiàn)在與大家分享希望可以幫助你們2013-01-01