document.write()及其输出内容的样式、位置控制


Posted in Javascript onAugust 12, 2013

JS中的最基本的命令之一:document.write(),用于简单的打印内容到页面上,可以逐字打印你需要的内容——document.write("content"),这里content就是需要输出的内容;当然还有一种情况,需要输出JS之中比如变量等等变化的东西,那么就需要用document.write(+variable);当然variable就是你想要输出的变量。

既然可以输出变量,肯定会想要去控制下变量的显示,比如位置以及样式。第一种控制方法是应用内部添加样式的方法,比如

document.write("<font style>=font-size:20px;font-family= Helvetica;"content"</font>"这样,不过如果里面需要添加的样式太多,那么不仅显得臃肿,而且修改起来也不会方便。

这种情况下肯定用选择器肯定会感觉爽一些。不过由于用选择器的时候要用到各种双引号单引号,所以在使用的时候应该注意防止双引号和单引号的提早匹配,我避免的方法是用 \" 去提醒浏览器不要过早的匹配,例子如下:

document.write("<div id=\"ok\">"+percentage+"</div>");

这里定义了一个名叫ok的ID选择器去控制样式,因id名需要用双引号括起来,所以为了避免和前面的双引号匹配,就用 \" 给它声明一下,然后在CSS文件里面

#ok{style;}

就可以去定义自己想要的样式和位置了。

Javascript 相关文章推荐
Extjs ajax同步请求时post方式参数发送方式
Aug 05 Javascript
js 刷新页面的代码小结 推荐
Apr 02 Javascript
JavaScript的new date等日期函数在safari中遇到的坑
Oct 24 Javascript
基于jquery实现二级联动效果
Mar 30 jQuery
bootstrap如何让dropdown menu按钮式下拉框长度一致
Apr 10 Javascript
Javascript中八种遍历方法的执行速度深度对比
Apr 25 Javascript
JS+Ajax实现百度智能搜索框
Aug 04 Javascript
实例详解vue.js浅度监听和深度监听及watch用法
Aug 16 Javascript
24行JavaScript代码实现Redux的方法实例
Nov 17 Javascript
利用JavaScript为句子加标题的3种方法示例
Jan 05 Javascript
原生js实现无缝轮播图效果
Jan 28 Javascript
JS获取一个字符串中指定字符串第n次出现的位置
Feb 10 Javascript
兼容ie、firefox的图片自动缩放的css跟js代码分享
Aug 12 #Javascript
Js点击弹出下拉菜单效果实例
Aug 12 #Javascript
jQuery自动切换/点击切换选项卡效果的小例子
Aug 12 #Javascript
jquery 按钮状态效果 正常、移上、按下
Aug 12 #Javascript
checkbox设置复选框的只读效果不让用户勾选
Aug 12 #Javascript
Jquery easyui 下loaing效果示例代码
Aug 12 #Javascript
多次注册事件会导致一个事件被触发多次的解决方法
Aug 12 #Javascript
You might like
php文件操作之小型留言本实例
2015/06/20 PHP
php单链表实现代码分享
2016/07/04 PHP
Yii CGridView用法实例详解
2016/07/12 PHP
PHP排序算法之简单选择排序(Simple Selection Sort)实例分析
2018/04/20 PHP
神奇的7个jQuery 3D插件整理
2011/01/06 Javascript
ajax 同步请求和异步请求的差异分析
2011/07/04 Javascript
javascript实现原生ajax的几种方法介绍
2013/09/21 Javascript
JQUERY 设置SELECT选中项代码
2014/02/07 Javascript
JQuery对表格进行操作的常用技巧总结
2014/04/23 Javascript
js实现iframe框架取值的方法(兼容IE,firefox,chrome等)
2015/11/26 Javascript
jQuery自定义组件(导入组件)
2016/11/08 Javascript
js实现带三角符的手风琴效果
2017/03/01 Javascript
jQuery实现拼图小游戏(实例讲解)
2017/07/24 jQuery
Django与Vue语法的冲突问题完美解决方法
2017/12/14 Javascript
多线程爬虫批量下载pcgame图片url 保存为xml的实现代码
2013/01/17 Python
Python设计模式之外观模式实例详解
2019/01/17 Python
python根据多个文件名批量查找文件
2019/08/13 Python
对django layer弹窗组件的使用详解
2019/08/31 Python
python虚拟环境模块venv使用及示例
2020/03/04 Python
PyTorch实现重写/改写Dataset并载入Dataloader
2020/07/14 Python
python实现测试工具(二)——简单的ui测试工具
2020/10/19 Python
CSS中越界问题的经典解决方案【推荐】
2016/04/19 HTML / CSS
匡威俄罗斯官网:Converse俄罗斯
2020/05/09 全球购物
什么造成了Java里面的异常
2016/04/24 面试题
给排水工程师岗位职责
2013/11/21 职场文书
冰淇淋店的创业计划书
2014/02/07 职场文书
2015年幼儿园毕业感言
2014/02/12 职场文书
10的分与合教学反思
2014/04/30 职场文书
售后服务承诺书模板
2014/05/21 职场文书
创先争优一句话承诺
2014/05/29 职场文书
课外小组活动总结
2014/08/27 职场文书
法务专员岗位职责
2015/02/14 职场文书
2015年七一建党节演讲稿
2015/03/19 职场文书
遗失证明范文
2015/06/19 职场文书
2015国庆节放假通知范文
2015/07/30 职场文书
Java生成日期时间存入Mysql数据库的实现方法
2022/03/03 Java/Android