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 相关文章推荐
javascript取消文本选定的实现代码
Nov 14 Javascript
javascript中的继承实例代码
Apr 27 Javascript
Javascript绝句欣赏 一些经典的js代码
Feb 22 Javascript
js substring从右边获取指定长度字符串(示例代码)
Dec 23 Javascript
DOM节点删除函数removeChild()用法实例
Jan 12 Javascript
Bootstrap基本插件学习笔记之Popover提示框(19)
Dec 08 Javascript
jquery插件锦集【推荐】
Dec 16 Javascript
es7学习教程之Decorators(修饰器)详解
Jul 21 Javascript
vue-cli开发时,关于ajax跨域的解决方法(推荐)
Feb 03 Javascript
vue 点击展开显示更多(点击收起部分隐藏)
Apr 09 Javascript
JS箭头函数和常规函数之间的区别实例分析【 5 个区别】
May 27 Javascript
解决Vue-Router升级导致的Uncaught (in promise)问题
Aug 07 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 adodb分页实现代码
2009/03/19 PHP
详解HTTP Cookie状态管理机制
2016/01/14 PHP
PHP闭包函数详解
2016/02/13 PHP
php实现文章置顶功能的方法
2016/10/20 PHP
PHP使用DOM和simplexml读取xml文档的方法示例
2017/02/08 PHP
PHP+Ajax实现的博客文章添加类别功能示例
2018/03/29 PHP
laravel中短信发送验证码的实现方法
2018/04/25 PHP
PHP常见过waf webshell以及最简单的检测方法
2019/05/21 PHP
用jQuery模拟页面加载进度条的实现代码
2011/12/19 Javascript
ASP.NET MVC中EasyUI的datagrid跨域调用实现代码
2012/03/14 Javascript
瀑布流布局代码一例
2014/04/11 Javascript
一个简单的实现下拉框多选的插件可移植性比较好
2014/05/05 Javascript
Bootstrap轮播加上css3动画,炫酷到底!
2015/12/22 Javascript
基于jquery编写的放大镜插件
2016/03/23 Javascript
jQuery绑定事件的几种实现方式
2016/05/09 Javascript
微信小程序 template模板详解及实例
2017/02/21 Javascript
AngularJS 异步解决实现方法
2017/06/12 Javascript
Vue组件实例间的直接访问实现代码
2017/08/20 Javascript
JavaScript代码实现txt文件的上传预览功能
2018/03/27 Javascript
vue中rem的配置的方法示例
2018/08/30 Javascript
javascript自定义日期比较函数用法示例
2019/07/22 Javascript
[06:44]2018DOTA2亚洲邀请赛4.5 SOLO赛 MidOne vs Sumail
2018/04/06 DOTA
简单的连接MySQL与Python的Bottle框架的方法
2015/04/30 Python
python实现飞机大战小游戏
2019/11/08 Python
python使用bs4爬取boss直聘静态页面
2020/10/10 Python
Python基于callable函数检测对象是否可被调用
2020/10/16 Python
python批量检查两个对应的txt文件的行数是否一致的实例代码
2020/10/31 Python
Python爬虫之Selenium下拉框处理的实现
2020/12/04 Python
scrapy-splash简单使用详解
2021/02/21 Python
英国领先的珍珠首饰品牌:Orchira
2016/09/11 全球购物
暑期培训随笔感言
2014/03/10 职场文书
借款协议书范本
2014/04/22 职场文书
党员个人对照检查材料思想汇报
2014/09/16 职场文书
党员教师个人对照检查材料范文
2014/09/25 职场文书
用python删除文件夹中的重复图片(图片去重)
2021/05/12 Python
mysql sock 文件解析及作用讲解
2022/07/15 MySQL