JavaScript字符串对象(string)基本用法示例


Posted in Javascript onJanuary 18, 2017

本文实例讲述了JavaScript字符串对象(string)基本用法。分享给大家供大家参考,具体如下:

1.获取字符串的长度:

var s = "Hello world";
document.write("length:"+s.length);

2.为字符串添加各种样式,如:

var txt = "Some words";
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>Link: " + txt.link("https://3water.com") + "</p>")

3.获取字符串中部分内容首次出现的位置:

var hw_text = "Hello world";
document.write(hw_text.indexOf("Hello")+"<br/>");
document.write(hw_text.indexOf("world")+"<br/>");
document.write(hw_text.indexOf("abc")+"<br/>");

4.内容替换:

var str="Visit Microsoft!"
document.write(str.replace(/Microsoft/,"W3School"))

效果图:

JavaScript字符串对象(string)基本用法示例

示例代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="zh-cn" />
<title>Javascript 字符串对象</title>
<head>
 <style>
  body {background-color:#e6e6e6}
 </style>
</head>
<body>
 <h3>(一)length属性:获取字符串的长度</h3>
 <p id="hw">Hello world, Hello javascript!</p>
 <script>
  var s = document.getElementById("hw").innerHTML;
  document.write("length:"+s.length);
 </script>
 <h3>(二)为字符串添加样式</h3>
 <p>对字符串调用样式的相关方法时,会自动拼接相应的html标签</p>
 <p id = "hw_02">some words</p>
 <button onclick="alertBig()">Call txt.big()</button>
 <script>
  var txt = document.getElementById("hw_02").innerHTML;
  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>Link: " + txt.link("https://3water.com") + "</p>")
  function alertBig(){
   alert(txt.big());
  }
 </script>
 <h3>(三)indexOf方法:定位字符串中某一个指定的字符首次出现的位置</h3>
 <script>
  var hw_text = "Hello world";
  document.write(hw_text.indexOf("Hello")+"<br/>");
  document.write(hw_text.indexOf("world")+"<br/>");
  document.write(hw_text.indexOf("abc")+"<br/>");
 </script>
 <h3>(四)replace()方法:替换字符串中的部分内容</h3>
 <script>
  var str="Visit Microsoft!"
  document.write(str.replace(/Microsoft/,"3water"))
 </script>
</body>
</html>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
jquery 插件实现图片延迟加载效果代码
Feb 06 Javascript
javascript使用eval或者new Function进行语法检查
Oct 16 Javascript
JavaScript link方法入门实例(给字符串加上超链接)
Oct 17 Javascript
javascript实现表格增删改操作实例详解
May 15 Javascript
javascript文本模板用法实例
Jul 31 Javascript
jQuery实现固定在网页顶部的菜单效果代码
Sep 02 Javascript
Node.js重新刷新session过期时间的方法
Feb 04 Javascript
再谈javascript注入 黑客必备!
Sep 14 Javascript
Webpack性能优化 DLL 用法详解
Aug 10 Javascript
详解Javascript 中的 class、构造函数、工厂函数
Dec 20 Javascript
vue-router 组件复用问题详解
Jan 22 Javascript
Vue.js中Line第三方登录api的实现代码
Jun 29 Javascript
Vue.js自定义指令的用法与实例解析
Jan 18 #Javascript
vue.js+Element实现表格里的增删改查
Jan 18 #Javascript
JS中Array数组学习总结
Jan 18 #Javascript
原生javascript实现图片放大镜效果
Jan 18 #Javascript
jQuery Validation Engine验证控件调用外部函数验证的方法
Jan 18 #Javascript
原生js实现回复评论功能
Jan 18 #Javascript
js实现表格筛选功能
Jan 18 #Javascript
You might like
PHP CodeIgniter框架的工作原理研究
2015/03/30 PHP
PHP自定义多进制的方法
2016/11/03 PHP
php语法检查的方法总结
2019/01/21 PHP
JS将表单导出成EXCEL的实例代码
2013/11/11 Javascript
jquery遍历checkbox的注意事项说明
2014/02/21 Javascript
jQuery实现的多屏图像图层切换效果实例
2015/05/07 Javascript
快速解决js中window.location.href不工作的问题
2016/11/02 Javascript
JS+Canvas实现的俄罗斯方块游戏完整实例
2016/12/12 Javascript
Underscore之Array_动力节点Java学院整理
2017/07/10 Javascript
浅析Vue 生命周期
2018/06/21 Javascript
vue-cli3+typescript初体验小结
2019/02/28 Javascript
小程序实现分类页
2019/07/12 Javascript
JS数组splice操作实例分析
2019/10/12 Javascript
Vue使用screenfull实现全屏效果
2020/09/17 Javascript
[00:32]DOTA2上海特级锦标赛 Ehome战队宣传片
2016/03/03 DOTA
在漏洞利用Python代码真的很爽
2007/08/26 Python
python实现矩阵乘法的方法
2015/06/28 Python
Python cookbook(数据结构与算法)从任意长度的可迭代对象中分解元素操作示例
2018/02/13 Python
Python实现定时精度可调节的定时器
2018/04/15 Python
python中for用来遍历range函数的方法
2018/06/08 Python
OpenCV-Python 摄像头实时检测人脸代码实例
2019/04/30 Python
jupyter notebook 中输出pyecharts图实例
2020/04/23 Python
利用python实现AR教程
2019/11/20 Python
python如何使用socketserver模块实现并发聊天
2019/12/14 Python
window环境pip切换国内源(pip安装异常缓慢的问题)
2019/12/31 Python
Python文件操作基础流程解析
2020/03/19 Python
全面介绍python中很常用的单元测试框架unitest
2020/12/14 Python
详解基于Facecognition+Opencv快速搭建人脸识别及跟踪应用
2021/01/21 Python
python使用scapy模块实现ARP扫描的过程
2021/01/21 Python
详解python的xlwings库读写excel操作总结
2021/02/26 Python
业务主管岗位职责范本
2013/12/25 职场文书
生物科学专业自荐书
2014/06/20 职场文书
群众路线个人剖析材料及整改措施
2014/11/04 职场文书
大学生助学金感谢信
2015/01/21 职场文书
2015年六一儿童节活动总结
2015/02/11 职场文书
2015年药店店长工作总结
2015/04/29 职场文书