JS变量写到HTML页面中并修改变量值(前台处理数据序号问题)
有时候我们在前台需要对序号进行处理,我们需要将JS变量写到页面中进行显示。
第一种方式:后台处理
第二种方式:JS中定义全局变量,然后进行显示,可以书写一个JS函数对不同的需要进行不同的替换,也就可以根据不同的序号显示不同的内容。如果是ajax请求数据后拼接的页面可以直接调用函数返回值进行拼接(或者在循环中利用遍历的次数 i )。
思路:
定义一个JS全局变量,然后在JS中书写改变变量的方法,可以在每次调用函数的时候改变变量的值。可以结合 document.write();向HTML页面中书写变量
例如:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery-1.11.js"></script>
<script>
var bigNum = 1;//全局变量
//修改全局变量的值
function replace(num) {
if (num == 1) {
return "一";
}
if (num == 2) {
return "二";
}
if (num == 3) {
return "三";
}
} </script>
</head>
<body>
//书写全局变量
<script>
document.write(replace(bigNum++));
</script>
<br/>
<script>
document.write(replace(bigNum++));
</script>
<br/>
<script>
document.write(replace(bigNum++));
</script>
</body>
</html>
结果:

第三种:(重要)
用一个带指定class属性的span包住,根据span出现的顺序设置顺序。
<span class="bigNum"></span>
JS方法:(i从0开始,代表遍历序号)
/**
* 大题顺序
*/
function replaceBigNum(){
$(".bigNum").each(function(i){
if(i==0){
$(this).text("一");
}
if(i==1){
$(this).text("二");
}
if(i==3){
$(this).text("三");
}
})
}
JS变量写到HTML页面中并修改变量值(前台处理数据序号问题)的更多相关文章
- JS(基础)_总结获取页面中元素和节点的方式
一.前言 1.元素和节点的区别 2.总结获取元素的方式 3.总结获取节点的方式 二.主要内容 1.结点和元素的区别 (1)一些常见基本概念: 文档:document 元素:页面中所有的标签 结点:页面 ...
- HTML、jsp页面中radio,checkbox,select数据回显功能,默认被选中问题
最近常常遇到各种复选框.单选框.下拉框的默认被选中的问题,开始也是绞尽脑汁的想办法,今天写一篇学习总结的博文来写一下学习总结. 单选框(radio)默认被选中: 一.jstl技术进行回显 <in ...
- 修改JS文件不能及时在页面中体现,需重启浏览器?
对JS文件做个小小的改动,哪怕是加一句简单的ALERT语句,都要重启浏览器才能看到.你有这样的烦恼吗?怎样不用重启浏览器就能及时体现JS的变化呢? 对浏览器(IE)做如下设置即可:1.点击 工具栏 - ...
- C# 与 JS 之间传值在 cshtml页面中
@{ string It = "sss"; ; } @functions{ string Mod = "ajssaioi"; public string Itm ...
- IOS HTML5页面中数字自动变蓝并识别为手机号
开发HTML5的项目时发现页面元素为一串数字时,IOS手机会默认显示成蓝色字体,并且添加下划线,点击数字时会提示是否识别为手机号. 解决此问题的方法很简单,在head标签中添加下面的meta标记即可解 ...
- 不同页面获取同一cookie变量值不同的问题及解决方法
在使用cookie时发现不同页面获取到的同一个cookie变量的值不同,本篇博客介绍其中一种情况的解决方法,通过设置path的方法可使得在同一个网站下获取的cookie变量一致. 问题描述 在www. ...
- eclipse打断点调试进入到class文件中,不显示变量值的解决办法汇总
每天学习一点点 编程PDF电子书免费下载: http://www.shitanlife.com/code 问题描述:eclipse打断点调试进入到class文件中,而且监视区不显示变量结果 是由于对应 ...
- springboot(整合多数据源demo,aop,定时任务,异步方法调用,以及获取properties中自定义的变量值)
有这么一个需求 每个部门,需要操作的数据库不同,A部门要将数据放test数据库,B 部门数据 要放在test1数据库 同一个项目 需要整合 多个数据源 上传个demo 方便自己以后回看!!!!!!!! ...
- 页面中引入js的几种方法
通常大家最为熟悉的是一下两种方法: 在页面中直接写入<script type="text/javascript">js代码</script>. 在页面中引入 ...
随机推荐
- 解决Android Studio安装过程中“SDK tools directory is missing”的问题
"SDK tools directory is missing",这是因为安装时你的计算机无法连接到google的服务器(对google服务器的域名地址解析出问题了),无法从goo ...
- 【学习笔记】深入理解js原型和闭包(14)——从【自由变量】到【作用域链】
先解释一下什么是“自由变量”. 在A作用域中使用的变量x,却没有在A作用域中声明(即在其他作用域中声明的),对于A作用域来说,x就是一个自由变量.如下图 如上程序中,在调用fn()函数时,函数体中第6 ...
- 原创:shell两个整数的比较 思想版
思想是学的 代码创作是自己的 很喜欢前几行的逻辑严谨 #!/bin/bash#判断两个整数的大小read -p "请输入两个整数a b :" a b #或者使用a=$1[ -z & ...
- Oracle错误 1053: 该服务没有响应启动或控制请求
在服务中,启动oracleDBConsolenewdb服务时,出现了 错误 1053: 该服务没有响应启动或控制请求 在网上查了以后你会发现这是一个非常宽泛的错误,然而我们的建议是去看传说中的orac ...
- 怎么用eclipse生成jar文件?eclipse导出jar介绍
1 .我们先要增加jar需要的配置文件,选中项目的src目录,鼠标右键,选择 [New] -选择 [Folder] . 2. 输入META-INF 作为目录名称,点击[Finish] . 3. 选中刚 ...
- (转)SpringMVC学习(八)——SpringMVC中的异常处理器
http://blog.csdn.net/yerenyuan_pku/article/details/72511891 SpringMVC在处理请求过程中出现异常信息交由异常处理器进行处理,自定义异常 ...
- HashMap Hashtable TreeMap LinkedHashMap 分析
首先对hash的了解:就是关键字,和数据建立关系的映射. hash常用算法:假设我们中的字符有相应的内部编码,当然在实际过程中,我们不可能将所有的编码当做hash值. 平方取中法,将所得的内部编码平方 ...
- DoveCLL and Resistance(湖北省赛)
题目 构造一个由串联和并联构成的纯电阻电路,使得该电路的等效电阻为p/q,其中(p,q) = 1.要求输出n,表示节点数,m表示电阻个数,m行每行ui,vi,wi,表示ui和vi之间要连上一个电阻为w ...
- dumpkeys - 转储显示键盘翻译表
总览 (SYNOPSIS) dumpkeys [ -hilfn1 -Sshape -ccharset --help --short-info --long-info --numeric --full- ...
- HTML基础(四)表格
定义和用法 <table> 标签定义 HTML 表格. 简单的 HTML 表格由 table 元素以及一个或多个 tr.th 或 td 元素组成. tr 元素定义表格行,th 元素定义表头 ...