JavaScript sup方法入门实例(把字符串显示为上标)


Posted in Javascript onOctober 20, 2014

sup 方法返回使用 HTML sup 标签属性定义的上标字符串。其语法如下:

str_object.sup()

提示:该方法不符合 ECMA 标准,不建议使用。

sup 方法实例:

<script language="JavaScript">

document.write( '三水点靠木' + '每一点进步,都是我们通往成功道路上的坚实脚印'.sup() );

</script>

运行该例子,输出:

三水点靠木每一点进步,都是我们通往成功道路上的坚实脚印

提示:该方法返回使用 HTML sup 标签定义的上标字符串,即使用该方法并不能直接将字符串变更为上标样式。如果想动态改变元素字体为上标样式,可参考下面的实例:

改变字体文本上下对齐方式(上标/下标)

<html>
<script language="JavaScript">
function changFont( x ){

    document.getElementById("sub_title").style.verticalAlign = x;

}
</script>
<body>

<p>

<a onClick="changFont('sub');">下标样式</a> <a onClick="changFont('super');">上标样式</a>

</p>

<p>

三水点靠木<span id="sub_title">每一点进步,都是我们通往成功道路上的坚实脚印</span>

</p>

</body>

</html>

在该例子中,通过 JavaScript 控制文本 CSS vertical-align 样式的方式,来动态改变字体文本的上下对齐方式(上标/下标)。

Javascript 相关文章推荐
更换select下拉菜单背景样式的实现代码
Dec 20 Javascript
js实现运动logo图片效果及运动元素对象sportBox使用方法
Dec 25 Javascript
js中for in的用法示例解析
Dec 25 Javascript
javascript操作excel生成报表示例
May 08 Javascript
JS实现点击表头表格自动排序(含数字、字符串、日期)
Jan 22 Javascript
jQuery Validate 相关参数及常用的自定义验证规则
Mar 06 Javascript
AngularJS改变元素显示状态
Apr 20 Javascript
node结合swig渲染摸板的方法
Apr 11 Javascript
三分钟学会用ES7中的Async/Await进行异步编程
Jun 14 Javascript
vue.js 实现评价五角星组件的实例代码
Aug 13 Javascript
Vue利用History记录上一页面的数据方法实例
Nov 02 Javascript
Vue CLI3中使用compass normalize的方法
May 30 Javascript
iframe里面的元素触发父窗口元素事件的jquery代码
Oct 19 #Javascript
js添加select下默认的option的value和text的方法
Oct 19 #Javascript
使用变量动态设置js的属性名
Oct 19 #Javascript
js控制鼠标事件移动及移出效果显示
Oct 19 #Javascript
js读取json的两种常用方法示例介绍
Oct 19 #Javascript
Jquery解析Json格式数据过程代码
Oct 17 #Javascript
jQuery实现点击该行即可删除HTML表格行
Oct 17 #Javascript
You might like
PHP大小写问题:函数名和类名不区分,变量名区分
2013/06/17 PHP
解析获取优酷视频真实下载地址的PHP源代码
2013/06/26 PHP
php封装db类连接sqlite3数据库的方法实例
2017/12/19 PHP
javascript 日历提醒系统( 兼容所有浏览器 )
2009/04/07 Javascript
JavaScript与Div对层定位和移动获得坐标的实现代码
2010/09/08 Javascript
利用js读取动态网站从服务器端返回的数据
2014/02/10 Javascript
单元选择合并变色示例代码
2014/05/26 Javascript
node.js应用后台守护进程管理器Forever安装和使用实例
2014/06/01 Javascript
深入理解JavaScript系列(33):设计模式之策略模式详解
2015/03/03 Javascript
全系IE支持Bootstrap的解决方法
2015/10/19 Javascript
RequireJS简易绘图程序开发
2016/10/28 Javascript
读Javascript高性能编程重点笔记
2016/12/21 Javascript
php输出全部gb2312编码内的汉字方法
2017/03/04 Javascript
Vue自定义事件(详解)
2017/08/19 Javascript
AngularJS中scope的绑定策略实例分析
2017/10/30 Javascript
axios的拦截请求与响应方法
2018/08/11 Javascript
vue+element加入签名效果(移动端可用)
2019/06/17 Javascript
Python文件与文件夹常见基本操作总结
2016/09/19 Python
Python 2.x如何设置命令执行的超时时间实例
2017/10/19 Python
python实战教程之自动扫雷
2018/07/13 Python
Python使用monkey.patch_all()解决协程阻塞问题
2020/04/15 Python
Python3爬虫带上cookie的实例代码
2020/07/28 Python
用Python进行websocket接口测试
2020/10/16 Python
CSS3用@font-face实现自定义英文字体
2013/09/23 HTML / CSS
用HTML5 Canvas API中的clearRect()方法实现橡皮擦功能
2016/03/15 HTML / CSS
英国最大的百货公司:Harrods
2016/08/18 全球购物
澳大利亚相机之家:Camera House
2017/11/30 全球购物
德国大型和小型家用电器网上商店:Energeto
2019/05/15 全球购物
澳大利亚头发和美容产品购物网站:OZ Hair & Beauty
2020/03/27 全球购物
营销与策划应届生求职信
2013/11/04 职场文书
机械制造专业大学生自我鉴定
2014/09/19 职场文书
开展党的群众路线教育实践活动情况汇报
2014/11/05 职场文书
2014年质检员工作总结
2014/11/18 职场文书
亮剑观后感
2015/06/05 职场文书
羊脂球读书笔记
2015/06/30 职场文书
2019请假条的基本格式及范文!
2019/07/05 职场文书