A. 在js中如何实现改变字体的功能
document.getElementById("p1").style.fontSize="13px";
document.getElementById("p1").style.fontFamily="your font";
B. js如何修改button上的文字
<inputname="s1"type="submit"id="s1"value="下一步"onclick="changeValue();"/>
<scriptlanguage="javascript">
functionchangeValue(){
varbtnVal=document.getElementById("s1");
if(btnVal.value=="下一步")
{
btnVal.value="处理中…";
}
else
alert("正在处理中,请您稍等。");
}
</script>
C. 如何用javascript编写一个可以改变字体大小的程序
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
<input type="button" value="变大" onclick="change(5)" />
<input type="button" value="变小" onclick="change(-5)"/>
<div id="my_text">文字文字文字</div>
<script type="text/javascript">
textSize = 12;
textDiv = document.getElementById("my_text");
textDiv.style.fontSize = textSize + "px";
function change(i){
textSize+=i;
textDiv.style.fontSize = textSize + "px";
}
</script>
</body>
</html>
D. js源代码 如何定时更换页面文字
<body>
<SCRIPT language=javascript>
<!--
var timer1;
var i=0;
timer1 = setInterval("myval()",2000);
function myval()
{
i+=1;
if(i>3)
{
i=1;
}
var show;
if (i==1)
{show = "hello";}
else if(i==2)
{show="ABC";}
else
{show="EDFEEEW";}
label1.innerText = show;
}
-->
</SCRIPT>
<DIV id=label1 title=hello style="DISPLAY: inline; WIDTH: 70px; HEIGHT: 15px" ms_positioning="FlowLayout">Label</DIV>
</body>
这段脚本可以每隔2秒钟依次在Label上显示“Hello”,“Bye”,“OK”文字。主要原理就是利用了setInterval函数,该函数的用法如下:
setInterval(expression,msec,[language])
expression-要执行的过程;msec时间间隔;language可选项,为指定的语言。
E. js实现动态改变字体大小代码
在很多大网站上为了提高用户方便阅读文字,都提供有字体大小选择功能,以适应不同年龄段人群的阅读需求,其实这种功能实现起来也很简单,修改起来也方便,字体大号由你来定,默认字体大小可以CSS页面中定义,一般网页的标准字体是9pt,也就是12px;
实例代码一:
<!DOCTYPE
html>
<html>
<head>
<title>修改字体大小.html</title>
<meta
http-equiv="keywords"
content="keyword1,keyword2,keyword3">
<meta
http-equiv="description"
content="this
is
my
page">
<meta
http-equiv="content-type"
content="text/html;
charset=UTF-8">
<!--<link
rel="stylesheet"
type="text/css"
href="./styles.css">-->
<style
type="text/css">
div{
border:1px
red
solid;
width:455px;
font-size:16px;
}
.max{
font-size:20px;
}
.moren{
font-size:16px;
}
.min{
font-size:12px;
}
</style>
<script
type="text/javascript">
//此种方式降低了js和CSS的耦合性
function
changeFontSize(fontStyle){
//
获取节点对象
var
divNode
=
document.getElementsByTagName("div")[0];
//
设置该节点的Name属性以及属性值
divNode.className=fontSize;
}
/*
function
changeFontSize2(fontSize){
//
获取节点对象
var
divNode
=
document.getElementsByTagName("div")[0];
divNode.style.fontSize=fontSize;
}
*/
</script>
</head>
<body>
<a
href="javascript:void(0)"
onclick="changeFontSize2('20px')"
class="max">大号</a>
<a
href="javascript:void(0)"
onclick="changeFontSize2('16px')"
class="moren">中号</a>
<a
href="javascript:void(0)"
onclick="changeFontSize2('12px')"
class="min">小号</a>
<div>
这里呢就是显示的文字,通过点击上面的超链接改变此字体大小<br/>
这里呢就是显示的文字,通过点击上面的超链接改变此字体大小<br/>
这里呢就是显示的文字,通过点击上面的超链接改变此字体大小<br/>
这里呢就是显示的文字,通过点击上面的超链接改变此字体大小<br/>
这里呢就是显示的文字,通过点击上面的超链接改变此字体大小<br/>
这里呢就是显示的文字,通过点击上面的超链接改变此字体大小<br/>
这里呢就是显示的文字,通过点击上面的超链接改变此字体大小<br/>
这里呢就是显示的文字,通过点击上面的超链接改变此字体大小<br/>
这里呢就是显示的文字,通过点击上面的超链接改变此字体大小<br/>
这里呢就是显示的文字,通过点击上面的超链接改变此字体大小<br/>
这里呢就是显示的文字,通过点击上面的超链接改变此字体大小<br/>
</div>
</body>
</html>
实例方法二:
<html>
<head>
<title>JavaScript设置网页字体</title>
<style>
body{
font-size:9pt;
}
</style>
</head>
<body>
<div
id=zoom>这是一段示例文字,你可以点击下边选择不同字号的字体,这段文字会随即改变大小。脚本之家。</div>
<SCRIPT
language=JavaScript>
function
doZoom(size){
document.getElementById('zoom').style.fontSize=size+'pt'
}
</SCRIPT>
<P
align=right>选择字号:[
<A
href="javascript:doZoom(13)">13pt(超大)</A>
<A
href="javascript:doZoom(10.5)">10.5pt(中型)</A>
<A
href="javascript:doZoom(9)">9pt(标准)</A>
]
</body>
</html>
F. 如何用js改变字体的颜色
用js获取当前的color的值,然后判断是否等于红色,如果等于则赋值为黑色,不等于则赋值为红色
js的写法:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
.redColor{
color: red;
}
.blackColor{
color: black;
}
</style>
</head>
<body>
<span id="showZi" class="redColor">测试测试测试</span>
<button id="btn">按钮</button>
<script type="text/javascript">
var obj = document.getElementById("showZi");
document.getElementById("btn").onclick = function(){
if(obj.className=="redColor"){
obj.className = "blackColor";
}else{
obj.className = "redColor";
}
}
</script>
</body>
</html>
jQuery的写法:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="../common/js/jquery-2.1.3.min.js" type="text/javascript"></script>
<style>
.redColor{
color: red;
}
.blackColor{
color: black;
}
</style>
</head>
<body>
<span id="showZi" class="redColor">测试测试测试</span>
<button id="btn">按钮</button>
<script type="text/javascript">
var obj = $("#showZi");
$("#btn").click(function(){
if(obj.hasClass("redColor")){
obj.removeClass("redColor").addClass("blackColor");
}else{
obj.removeClass("blackColor").addClass("redColor");
}
});
</script>
</body>
</html>