Truyện Cười BlogTaPhiet KC

Chat Box


--------------:Search

Thứ Năm, 29 tháng 12, 2011

[Thủ Thuật] javascript: Thay đổi văn bản

- Với 1 chút từ khóa theo phong cách chơi blog, mình tìm được blogger có bài đăng những mã javascript khá hay. Nhưng mình chỉ đăng code, còn việc thực thi và áp dụng thủ thuật tuỳ thuộc ở người ứng dụng. Các bạn có thể tự tìm hiểu theo link nguồn ở cuối bài đăng:
- Các bạn có thể xem demo bằng cách copy code vào Notepad.exe và lưu lại với tên.html !

1.Changing text with javascript after clicking a link
<script language="javascript">
function changeTextToAAA()
{
document.getElementById("divA").innerHTML = 'Text changed to AAA';
}

function changeTextToBBB()
{
document.getElementById("divA").innerHTML = 'Text changed to BBB';
}
</script>

<a href="javascript:changeTextToAAA();">Change text to AAA</a>
<a href="javascript:changeTextToBBB();">Change text to BBB</a>

<div id="divA"><h4>This text will be changed</h4></div>


2.Changing text with only one jscript function called from two links
<script language="javascript">
function changeText(newText)
{
document.getElementById("divB").innerHTML = newText;
}
</script>

<a href="javascript:changeText('First');">Change text to First</a>
<a href="javascript:changeText('Second');">Change text to Second</a>

<div id="divB"><h4>This text will be changed</h4></div>

3.One link changing text to pressed or unpressed
<script language="javascript">
function changeTextOfLink()
{
var link = document.getElementById("linkClick");

if (link.innerHTML == "Unpressed")
{
link.innerHTML = 'Pressed';
}
else
{
link.innerHTML = 'Unpressed';
}
}
</script>

<a href="javascript:changeTextOfLink();" id="linkClick">Unpressed</a>

4.Hide or show text in div and changing link text to "Hide" or "Show"
<script language="javascript">
function divToHide(divToHideOrShow) {
var link = document.getElementById("linkId1");
var div = document.getElementById(divToHideOrShow);

if (div.style.display == "block")
{
div.style.display = "none";
link.innerHTML = 'Show'
}
else
{
div.style.display = "block";
link.innerHTML = 'Hide';
}
}
</script>

<a href="javascript:divToHide('divShowHide');" id="linkId1">Hide</a>
<div id="divShowHide" style="position:absolute; display: block"><h4>This div will be hidden</h4></div>
NGUỒN:
http://interestingwebs.blogspot.com/2011/05/javascript-changing-text.html
sitemap:
http://choiblog-lienketlogo.blogspot.com/2011/12/sitemap-interestingwebsblogspotcom.html
Share/Save/Bookmark

Đăng nhận xét

More →
Chữ đậm Chữ nghiêng Chữ nghiêng 2 Chèn Link Chèn Link Mã hóa code Help ?Nhấn vào biểu tượng hoặc kiểu chữ hoặc chèn link sau đó nhấn nút Chọn rồi copy (Ctrl + C) để paste (Ctrl + V) vào khung viết bình luận. Mã hóa code nếu bạn muốn đưa code vào bình luận.

Chọn Xóa
Top