浅谈document.write()输出样式


Posted in Javascript onMay 07, 2015

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

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

document.write("<font size="+0">=font-size:20px;font-family= Helvetica;"content"</font>"

果里面需要添加的样式太多,那么不仅显得臃肿,而且修改起来也不会方便。

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

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

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

#ok{style;}

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

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
js Event对象的5种坐标
Sep 12 Javascript
jQuery使用动态渲染表单功能完成ajax文件下载
Jan 15 Javascript
jquery实现的一个文章自定义分段显示功能
May 23 Javascript
json+jQuery实现的无限级树形菜单效果代码
Aug 27 Javascript
jQuery中animate的几种用法与注意事项
Dec 12 Javascript
微信小程序滚动Tab实现左右可滑动切换
Aug 17 Javascript
vue keep-alive请求数据的方法示例
May 16 Javascript
关于vue v-for 循环问题(一行显示四个,每一行的最右边那个计算属性)
Sep 04 Javascript
微信小程序实现的一键拨号功能示例
Apr 24 Javascript
js常见遍历操作小结
Jun 06 Javascript
layui默认选中table的CheckBox复选框方法
Sep 19 Javascript
vue 开发企业微信整合案例分析
Dec 02 Javascript
js库Modernizr的介绍和使用
May 07 #Javascript
详谈LABJS按需动态加载js文件
May 07 #Javascript
JavaScript改变CSS样式的方法汇总
May 07 #Javascript
js实现非常简单的焦点图切换特效实例
May 07 #Javascript
jQuery中closest和parents的区别分析
May 07 #Javascript
js实现键盘上下左右键选择文字并显示在文本框的方法
May 07 #Javascript
基于jQuery.Hz2Py.js插件实现的汉字转拼音特效
May 07 #Javascript
You might like
功能强大的PHP发邮件类
2016/08/29 PHP
学习YUI.Ext 第二天
2007/03/10 Javascript
firefo xml 读写实现js代码
2009/06/11 Javascript
基于jquery的复制网页内容到WORD的实现代码
2011/02/16 Javascript
理解JavaScript的prototype属性
2012/02/11 Javascript
js实现浮动在网页右侧的简洁QQ在线客服代码
2015/09/04 Javascript
jquery悬浮提示框完整实例
2016/01/13 Javascript
js接收并转化Java中的数组对象的方法
2016/08/11 Javascript
对js中回调函数的一些看法
2016/08/29 Javascript
使用BootStrap进行轮播图的制作
2017/01/06 Javascript
JS使用ActiveXObject实现用户提交表单时屏蔽敏感词功能
2017/06/20 Javascript
js 显示日期时间的实例(时间过一秒加1)
2017/10/25 Javascript
vue 运用mock数据的示例代码
2017/11/07 Javascript
JavaScript面向对象的程序设计(犯迷糊的小羊)
2018/05/27 Javascript
使用layui 渲染table数据表格的实例代码
2018/08/19 Javascript
Vue.js图片预览插件使用详解
2018/08/27 Javascript
微信小程序基于高德地图API实现天气组件(动态效果)
2020/10/22 Javascript
antd 表格列宽自适应方法以及错误处理操作
2020/10/27 Javascript
JS如何调用WebAssembly编译出来的.wasm文件
2020/11/05 Javascript
Python中使用SAX解析xml实例
2014/11/21 Python
python监控网站运行异常并发送邮件的方法
2015/03/13 Python
Python基于identicon库创建类似Github上用的头像功能
2017/09/25 Python
解决Python3中的中文字符编码的问题
2018/07/18 Python
Python3实现定时任务的四种方式
2019/06/03 Python
如何清空python的变量
2020/07/05 Python
Python生成器generator原理及用法解析
2020/07/20 Python
HTML中meta标签及Keywords
2020/04/15 HTML / CSS
代码中finally中的代码会不会执行
2012/02/06 面试题
制冷与电控专业应届生求职信
2013/11/11 职场文书
物理教师自荐信范文
2013/12/28 职场文书
学生安全承诺书
2014/05/22 职场文书
抗洪救灾先进集体事迹材料
2014/05/26 职场文书
市级青年文明号申报材料
2014/05/26 职场文书
一百条裙子读书笔记
2015/07/01 职场文书
《角的度量》教学反思
2016/02/18 职场文书
股东合作协议书模板2篇
2019/11/05 职场文书