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() + "</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>

效果如下：

 

JavaScript toUpperCase() 方法和 toLowerCase() 方法的更多相关文章

  1. JavaScript indexOf() 方法和 lastIndexOf() 方法

    一,定义和用法 indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置. lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索 ...

  2. 关于JAVASCRIPT call 方法和 apply 方法性能对比

    JavaScript 关于call 方法和 apply 方法常用形式 call obj.call(object, args , ....); apply obj.apply(object, [args ...

  3. 彻底理解了call()方法，apply()方法和bind()方法

    javascript中的每一个作用域中都有一个this对象,它代表的是调用函数的对象.在全局作用域中,this代表的是全局对象(在web浏览器中指的是window).如果包含this的函数是一个对象的 ...

  4. call()方法和apply()方法用法总结

    1. 每个函数都包含两个非继承而来的方法:call()方法和apply()方法. 2. 相同点:这两个方法的作用是一样的. 都是在特定的作用域中调用函数,等于设置函数体内this对象的值,以扩充函数赖 ...

  5. js进阶 14-4 $.get()方法和$.post()方法如何使用

    js进阶 14-4 $.get()方法和$.post()方法如何使用 一.总结 一句话总结:$.get(URL,callback); $.post(URL,data,callback); callba ...

  6. js进阶 12-13 jquery中one方法和trigger方法如何使用

    js进阶 12-13 jquery中one方法和trigger方法如何使用 一.总结 一句话总结: 1.one()方法和on()方法的区别是什么? 除了one()只执行一次,其它和on()一模一样,包 ...

  7. ASP.NET Core 中文文档 第二章 指南（4.10）检查自动生成的Detail方法和Delete方法

    原文 Examining the Details and Delete methods 作者 Rick Anderson 翻译 谢炀(Kiler) 校对 许登洋(Seay).姚阿勇(Mr.Yao) 打 ...

  8. ThinkPHP的D方法和M方法的区别

    M方法和D方法的区别 ThinkPHP 中M方法和D方法都用于实例化一个模型类,M方法 用于高效实例化一个基础模型类,而 D方法 用于实例化一个用户定义模型类. 使用M方法 如果是如下情况,请考虑使用 ...

  9. Hibernate中evict方法和clear方法说明

    Hibernate中evict方法和clear方法说明 先创建一个对象,然后调用session.save方法,然后调用evict方法把该对象清除出缓存,最后提交事务.结果报错: Exception i ...

随机推荐

  1. Java内部类的定义和使用

    为什么要用到内部类: 在java开发学习中我们经常会碰到内部类.内部类又有很多的优势:首先举一个简单的例子,如果你想实现一个接口,但是这个接口中的一个方法和你构想的这个类中的一个方法名称参数相同,你应 ...

  2. JSDeferred 源码分析

    不经意看到了一个构思非常惊人的异步流程控制库,发出来分享下 http://cho45.stfuawsc.com/jsdeferred/ 关于CommonJS Promises请看另一个异步库 http ...

  3. sizzle分析记录：分解流程

    <form> <label>Name:</label> <input name="name" /> <fieldset> ...

  4. Qt on Android：创建可伸缩界面

    使用 Qt 来开发 Android 应用,也需要适配不同移动设备,适配多种多样的屏幕和分辨率.这次我们大概来讲一下如何使用 Qt 提供的机制来创建可伸缩的界面. DPI 必须要解释一下 DPI . D ...

  5. 【资源】108个大数据文档PDF开放下载-整理后打包下载

                  本博客所有文章分类的总目录:http://www.cnblogs.com/asxinyu/p/4288836.html        本博客其他.NET开源项目文章目录:h ...

  6. FragmentPagerAdapter+ViewPager实现Tab切换效果

    1.Activity  加载布局文件,获取Viewpager控件   给ViewPager填充适配器. import android.app.ActionBar; import android.app ...

  7. ES6 - Note2：解构赋值

    ES6的解构赋值就是利用模式匹配从按照一定模式的数组或者对象中提取值赋值给变量. 1.数组的解构赋值 在ES6以前,变量的赋值是直接指定的,以后可以这么来写,如下所示 let [a,b,c] = [1 ...

  8. II7.0 发布 MVC 4.0 三个小问题记录

    1,403.14-Forbidden Web 服务器被配置为不列出此目录的内容 根据提示更改:使用 IIS 管理器启用目录浏览. 打开 IIS 管理器. 在“功能”视图中,双击“目录浏览”. 在“目录 ...

  9. 你所不知道的15个Axure使用技巧

    你有用原型开发工具吗?如果有,那你用的是Axure还是别的? 从以前就喜欢使用Axure,主要是觉得它能清楚的表达设计的思路,还有交互的真实再现,能让看的人一目了然,昨天看了这篇博文,便更加确定Axu ...

  10. Ubuntu下搭建ryu环境

    RYU环境搭建总共四步: step1:首先下载相应的python套件,并且更新pip $ sudo apt-get install python-pip python-dev build-essent ...