浅谈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中cookie的使用详细分析
May 28 Javascript
jquery之Document元素选择器篇
Aug 14 Javascript
js 获取当前web应用的上下文路径实现方法
Aug 19 Javascript
详解微信小程序 页面跳转 传递参数
Dec 08 Javascript
javascript实现文字无缝滚动
Dec 27 Javascript
BootStrap表单时间选择器详解
May 09 Javascript
Taro集成Redux快速上手的方法示例
Jun 21 Javascript
vue实现pdf导出解决生成canvas模糊等问题(推荐)
Oct 18 Javascript
Javascript实现html转pdf高清版(提高分辨率)
Feb 19 Javascript
JavaScript进阶(三)闭包原理与用法详解
May 09 Javascript
JavaScript经典案例之简易计算器
Aug 24 Javascript
基于Vue2实现移动端图片上传、压缩、拖拽排序、拖拽删除功能
Jan 05 Vue.js
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使用filter过滤器验证邮箱 ipv6地址 url验证
2013/12/25 PHP
使用PHP+Redis实现延迟任务,实现自动取消订单功能
2019/11/21 PHP
jscript之Open an Excel Spreadsheet
2007/06/13 Javascript
[原创]来自ImageSee官方 JavaScript图片浏览器
2008/01/16 Javascript
关于IE浏览器以及Firefox下的javascript冒泡事件的响应层级
2010/10/14 Javascript
js中switch case循环实例代码
2013/12/30 Javascript
javascript进行数组追加方法小结
2014/06/16 Javascript
jQuery表单验证功能实例
2015/08/28 Javascript
Jquery中map函数的用法
2016/06/03 Javascript
JavaScript类的写法
2016/09/17 Javascript
js中创建对象的几种方式
2017/02/05 Javascript
AngularJS监听路由变化的方法
2017/03/07 Javascript
深入理解jquery的$.extend()、$.fn和$.fn.extend()
2017/07/08 jQuery
深入理解vue中slot与slot-scope的具体使用
2018/01/26 Javascript
基于vue.js中关于下拉框的值默认及绑定问题
2018/08/22 Javascript
vue拖拽组件使用方法详解
2018/12/01 Javascript
vue自定义表单生成器form-create使用详解
2019/07/19 Javascript
js实现图片无缝循环轮播
2019/10/28 Javascript
JS手写一个自定义Promise操作示例
2020/03/16 Javascript
pymssql ntext字段调用问题解决方法
2008/12/17 Python
python读写文件操作示例程序
2013/12/02 Python
跟老齐学Python之Python安装
2014/09/12 Python
详解Django中Request对象的相关用法
2015/07/17 Python
python点击鼠标获取坐标(Graphics)
2019/08/10 Python
python基于event实现线程间通信控制
2020/01/13 Python
keras 简单 lstm实例(基于one-hot编码)
2020/07/02 Python
python 实现关联规则算法Apriori的示例
2020/09/30 Python
HTML5单页面手势滑屏切换原理分析
2017/07/10 HTML / CSS
基于MUI框架使用HTML5实现的二维码扫描功能
2018/03/01 HTML / CSS
学前班教师的自我鉴定
2013/12/05 职场文书
尽职尽责村干部自我鉴定
2014/01/23 职场文书
给学校的建议书
2014/03/12 职场文书
党员反对四风思想汇报范文
2014/10/25 职场文书
Python实现文字pdf转换图片pdf效果
2022/04/03 Python
微信小程序APP的事件绑定以及传递参数时的冒泡和捕获
2022/04/19 Javascript
MutationObserver在页面水印实现起到的作用详解
2022/07/07 Javascript