JavaScript toUpperCase() 方法和 toLowerCase() 方法


1,toUpperCase() 方法用於把字符串轉換為大寫。

一個新的字符串,在其中 stringObject 的所有小寫字符全部被轉換為了大寫字符。

 語法為:

stringObject.toUpperCase()

 

2,toLowerCase() 方法用於把字符串轉換為小寫。

一個新的字符串,在其中 stringObject 的所有大寫字符全部被轉換為了小寫字符。

 語法為:
stringObject.toLowerCase()

在本例中,"Hello world!" 將以大寫字母來顯示:

<script type="text/javascript">

var str="Hello World!"
document.write(str.toUpperCase())

</script>

效果如下;

 

相關方法舉例如下:

<html>
<body>

<script type="text/javascript">

var txt="Hello World!"

document.write("<p>Big: " + txt.big() + "</p>")
document.write("<p>Small: " + txt.small() + "</p>")

document.write("<p>Bold: " + txt.bold() + "</p>")
document.write("<p>Italic: " + txt.italics() + "</p>")

document.write("<p>Blink: " + txt.blink() + " (does not work in IE)</p>")
document.write("<p>Fixed: " + txt.fixed() + "</p>")
document.write("<p>Strike: " + txt.strike() + "</p>")

document.write("<p>Fontcolor: " + txt.fontcolor("Red") + "</p>")
document.write("<p>Fontsize: " + txt.fontsize(16) + "</p>")

document.write("<p>Lowercase: " + txt.toLowerCase() + "</p>")
document.write("<p>Uppercase: " + txt.toUpperCase() + "</p>")

document.write("<p>Subscript: " + txt.sub() + "</p>")
document.write("<p>Superscript: " + txt.sup() + "</p>")

document.write("<p>Link: " + txt.link("http://www.w3school.com.cn") + "</p>")
</script>

</body>
</html>

 效果如下:

 

 

最后補充下,CSS text-transform 屬性

text-transform 屬性控制文本的大小寫。

說明

這個屬性會改變元素中的字母大小寫,而不論源文檔中文本的大小寫。如果值為 capitalize,則要對某些字母大寫,但是並沒有明確定義如何確定哪些字母要大寫,這取決於用戶代理如何識別出各個“詞”。(不同的用戶代理可能會用不同的方法來確定單詞從哪里開始,相應地確定哪些字母要大寫。例如,文本 "w3-school" 可以用兩種方式顯示:"W3-school" 和 "W3-School"。CSS 並沒有規定哪一種是正確的,所以這兩種都是可以的。)

默認值: none
繼承性: yes
版本: CSS1
JavaScript 語法: object.style.textTransform="uppercase"

可能的值

描述
none 默認。定義帶有小寫字母和大寫字母的標准的文本。
capitalize 文本中的每個單詞以大寫字母開頭。
uppercase 定義僅有大寫字母。
lowercase 定義無大寫字母,僅有小寫字母。
inherit

規定應該從父元素繼承 text-transform 屬性的值。

實例:

<html>

<head>
<style type="text/css">
  h1 {text-transform: uppercase}
  p.uppercase {text-transform: uppercase}
  p.lowercase {text-transform: lowercase}
  p.capitalize {text-transform: capitalize}
</style>
</head>

<body>
<h1>This Is An H1 Element</h1>
<p class="uppercase">This is some text in a paragraph.</p>
<p class="lowercase">This is some text in a paragraph.</p>
<p class="capitalize">This is some text in a paragraph.</p>
</body>

</html>

效果如下:

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM