iis服务器助手广告广告
返回顶部
首页 > 资讯 > 精选 >好程序员web前端教程分享js文件引用编码方式
  • 926
分享到

好程序员web前端教程分享js文件引用编码方式

2023-06-03 13:06:08 926人浏览 独家记忆
摘要

好程序员web前端教程分享js文件引用编码方式,js外部文件编码由这些因素决定:1.如果Apache有DefaultCharset,则js文件解析用服务器指定的编码;2.如果PHP header声明charset为编码utf-8,则文件编码

好程序员web前端教程分享js文件引用编码方式,js外部文件编码由这些因素决定:1.如果Apache有DefaultCharset,则js文件解析用服务器指定的编码;2.如果PHP header声明charset为编码utf-8,则文件编码用utf-8来解析。3.如果以上两个都为空,页面编码由meta标签决定。4.如果以上声明都没有,则会使用utf-8来解析。5.如果页面编码为gbk,而js文件编码为utf-8,则可以在js属性中定义charset='utf-8'。

 

昨天帮同事解决的一个问题,GBK的页面(不要问我为什么GBK,因为GBK,所以GBK),引用了Google map的api, 但是由于GoogleMap API返回的js脚本是utf-8的,所以导致在IE下, 浏览器无法正确解析.

 

也就是, 由于服务器中生成的html是基于gbk编码的, 并且由于Apache的DefaultCharset(后叙), 所以导致IE会以gbk编码去解析从外部引入的GoogleMap js,那肯定是不能正确解释的.

 

浏览器判断一个页面的编码有俩个途径, 一种是通过Http响应头,

 

HTTP/1.x 200 OK

Date: Sat, 18 Oct 2008 21:53:51 GMT

Server: Apache/2.0.52 (Red Hat)

X-Powered-By: php/5.3.0alpha2

Connection: close

Transfer-Encoding: chunked

Content-Type: text/html; charset=GB2312

注意最后一行, 这个是由HTTP头部指明的页面编码格式.

 

另外一种就是我们常见的, 也会另很多初学者困惑的meta:

 

问题就在于,没有一个统一的标准,来指明这俩中方式的优先级, 不同的浏览器有着不同的优先级策略.这也就是为什么,我们在FF下正常浏览的页面,在IE下会乱码的原因.

 

我之前的文章Apache的Charset设置中已经介绍过了在Apache下设置DefaultCharset以后产生的影响,

 

这个问题已经遇到过俩次了,就是页面中明确指明了编码是UTF8,但是显示是乱码。

 

虽然知道解决方法,也知道是Apache的原因,但是一直没有去找其所以然,今天趁机,就研究了一下。

 

页面没有指定charset , Apache配置defaultcharst gbk , 页面文件编码是utf-8

 

结果: 乱码,使用wireshark抓包,发现服务器返回的header中指明了:

 

Content-Type:text/html;charset=GBK

结论:当页面没有指明charset的时候,Apache的defaultcharset起作用

 

页面指定charset为utf-8, Apache配置defaultcharset gbk. 页面文件是utf-8

 

<head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

</head>

<body>

        <div id="page-header">

         测试Apache DefaultCharset

        </div>

</body>

</html>

结果还是出现乱码。

 

结论:当Apache配置了DefaultCharset, 将忽略页面的charset申明。

 

3 PHP header申明charset为utf8, Apache配置defaultcharst gbk,页面文件编码是utf8

 

header("Content-Type:text/html; charset=utf-8");

结果 : 页面显示正常。

 

4 Apache设置DefaultCharset off

 

结果,页面显示正常。

 

翻阅了下Apache2的手册:

 

ADDDefaultCharset指令

说明当应答内容是text/plain或text/html时,在HTTP应答头中加入的默认字符集

语法AddDefaultCharsetOn|Off|charset

默认值AddDefaultCharsetOff

作用域serverconfig,virtualhost,directory,.htaccess

覆盖项FileInfo

状态核心(C)

模块core

 

当且仅当应答内容是text/plain或text/html时,此指令将会在HTTP应答头中加入的

默认字符集。理论上这将覆盖在文档体中通过<meta>标 签指定的字符集,但是实际

的行为通常取决于用户浏览器的设置。AddDefaultCharsetOff将会禁用此功能。

 

AddDefaultCharsetOn将启用Apache内部的默认字符集iso-8859-1。您

也可以指定使用在IANA注册过的字符集名字 中的另外一个charset。

比如说:

AddDefaultCharsetutf-8

也就是说,当Apache不指定defaultcharset的时候,页面编码由页面自己的meta标签指定。

 

当Apache指定的时候,将忽略页面中的meta标签指定的编码. 但是容许脚本直接header编码方式给客户端

 

最后,还有一个问题没有得出结果:

 

当Apache和页面都没有指定的时候, 又如何?

 

我在自己的机器上,如果都不指定, 默认还是utf8

 

在服务器端生成response内容以后, 如果脚本没有显示的调用header发送编码申明,那么Apache就会根据DefaultCharset生成响应HTTP头部的Content-type中的charset字段;

 

反之如果脚本显示申明了,那么就会按照脚本header申明中的charset设置.

 

这样到了浏览器端以后, 浏览器就可以根据HTTP头的charset申明来按照特定的编码格式解析获取到的HTML代码,但现在的问题是, 页面是GBK的,但是引用的外部js文件是utf8编码的,这样的情况, 我们可以使用一个script的属性来解决:

 

  <script language='javascript' src='....'  charset='utf-8'></script>

--结束END--

本文标题: 好程序员web前端教程分享js文件引用编码方式

本文链接: https://www.lsjlt.com/news/234373.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 好程序员web前端教程分享js文件引用编码方式
    好程序员web前端教程分享js文件引用编码方式,js外部文件编码由这些因素决定:1.如果Apache有DefaultCharset,则js文件解析用服务器指定的编码;2.如果PHP header声明charset为编码utf-8,则文件编码...
    99+
    2023-06-03
  • 好程序员web前端分享CSS文件引用的最优方法
    好程序员web前端分享CSS文件引用的最优方法,在html总引入css文件的方法:   1链接式:   2导入式:   区别:   使用链接式时,会在加载页面主体部分之前加载css文件,这样现实出来的...
    99+
    2023-06-03
  • 好程序员web前端分享JS引擎的执行机制
      好程序员web前端分享JS引擎的执行机制,请先着重牢记两点!JS是单线程语言。   JS的EventLoop是JS的执行机制。深入了解JS的执行,就等于深入了解JS里的eventloop。   1、灵魂三问:JS为什...
    99+
    2023-06-03
  • 好程序员web前端分享WebSocket协议
         好程序员web前端分享WebSocket协议,WebSocket协议简介WebSocket协议简介WebSocket是html5规范新引入的功能,用于解决浏览器与后台服务器双向通讯的问题,使用WebS...
    99+
    2023-06-03
  • 好程序员web前端分享如何理解JS的单线程
    好程序员web前端分享如何理解JS单线程,JS本质是单线程的。也就是说,它并不能像JAVA语言那样,两个线程并发执行。 但我们平时看到的JS,分明是可以同时运作很多任务的,这又是怎么回事呢? 首先,JS的代码,大致分为两...
    99+
    2023-06-03
  • 好程序员web前端分享web测试之Js中的变量
      好程序员web前端分享web测试之Js中的变量,JavaScript的变量与其他语言的变量有很大区别。JavaScript变量是松散型的(不强制类型)本质,决定了它只是在特定时间用于保存特定值的一个名字而已。由于不存在定义某个变量必须要...
    99+
    2023-06-03
  • 好程序员web前端学习教程之Node Js流程
      好程序员web前端学习教程之Node Js流程1,项目前期准备:   以express框架为例   npmiexpress-generator-g//全局安装express框架   express-e//生...
    99+
    2023-06-03
  • 好程序员分享Web前端知识之HTML
      今天好程序员分享Web前端知识之HTML。Web前端技术由HTML、CSS和Javascript三大部分构成,而我们在学习它的时候往往是先从某一个点切入,然后不断地接触和学习新的知识点,因此对于初学者很难理清楚整个体系的脉络结构。  1...
    99+
    2023-06-03
  • 好程序员web前端教程分享CSS预编译器的再次理解
      好程序员web前端教程分享CSS预编译器的再次理解:我所理解的css预编译器   基于css的,能让css也有一种编程语言范。解决了css的诸多问题,如css模块化、无法嵌套书写、没有变量。   css模块化&nbs...
    99+
    2023-06-03
  • 好程序员web前端分享CSS3颜色值HSLA表示方式
    说明:本文档兼容性测试基础环境为:windows系统;IE6-IE10, Firefox6.0, Chrome13.0, Safari5.1, Opera11.51说明:HSLA(H,S,L,A)取值:H:Hue(色调)。0(或360)表示...
    99+
    2023-06-03
  • 好程序员web前端教程分享JavaScript学习笔记之Event事件二
      好程序员web前端教程分享JavaScript学习笔记之Event事件二,今天来聊一聊事件的执行机制。  什么是事件的执行机制呢?  思考一个问题?  当一个大盒子嵌套一个小盒子的时候,并且两个盒子都有点击事件你点击里面的小盒子,外面的...
    99+
    2023-06-03
  • 好程序员web前端分享高度自适应
    好程序员web前端分享高度自适应一、宽高自适应网页布局中经常要定义元素的宽和高。但很多时候我们希望元素的大小能够根据窗口或子元素自动调整,这就是自适应。它能够使网页显示更灵活,可以适应在不同设备、不同窗口和不同分辨率下显示。(1)宽度自适应...
    99+
    2023-06-03
  • 好程序员web前端培训分享学习JavaScript
    好程序员web前端教程分享学习JavaScript,我试着总结自己学习JavaScript的方法 JavaScript给人那种感觉的原因多半是因为它如下的特点: 本身知识很抽象、晦涩难懂,如:闭包、内置对象、DOM。本身...
    99+
    2023-06-03
  • 好程序员web前端分享CSS学习:HSLA颜色模式
    好程序员web前端分享CSS学习:HSLA颜色模式一、理论:1.HSLA颜色模式a.HSLA在HSL基础上增加了不透明度,值越大透明度越低b.HSLA颜色模式的浏览器兼容性和HSL一样,只有较新版本的主流浏览器才支持2.RGBA和HSLA颜...
    99+
    2023-06-03
  • 好程序员web前端培训分享怎样学好css?
      好程序员web前端培训分享怎样学好css?我推荐题主的学习方法就是:善用调试工具。  使用谷歌浏览器进行调试,在属性不理解时可以直接在浏览器里进行数值调节  css在书写时由于选择器权重问题经常出现样式覆盖的问题  如果你的选择器书写正...
    99+
    2023-06-03
  • 好程序员web前端教程分享默认行为和拖拽思路
    好程序员web前端分享默认行为和拖拽思路,默认行为:什么是默认行为:默认行为就是浏览器自己触发的事件。比如:a链接的跳转,form提交时的跳转,鼠标右键跳转;oncontexmenu当点击右键菜单的时候; return ...
    99+
    2023-06-03
  • 好程序员web前端技术分享css盒模型
    web前端技术分享css盒模型学习目标1、认识盒子模型2、盒子模型的组成部分3、学习盒子模型的相关元素 margin padding一、css盒模型的概念及组成概念:盒模型是css布局的基石,它规定了网页元素如何显示以及元素间相互关系。cs...
    99+
    2023-06-03
  • 好程序员web前端分享HTML表单和输入
     好程序员web前端分享HTML表单用于搜集不同类型的用户输入。   表单   表单是一个包含表单元素的区域。   表单元素是允许用户在表单中(比如:文本域、下拉列表、单选框、复选框等等)输入信息的元素。&nb...
    99+
    2023-06-03
  • 好程序员web前端培训分享kbone高级-事件系统
      好程序员web前端培训分享kbone高级-事件系统:1、用法,对于多页面的应用,在 Web 端可以直接通过 a 标签或者 location 对象进行跳转,但是在小程序中则行不通...
    99+
    2023-06-03
  • 好程序员web前端分享使用JavaScript正则表达式如何去掉双引号
      好程序员web前端分享使用JavaScript正则表达式如何去掉双引号,最近接了一个项目,项目需求需要用js正则表达式过滤掉页面文本域中值得双引号,其实解决办法很简单,下面把我写的代码分享给大家,有同样需求的朋友可以参考下。 ...
    99+
    2023-06-03
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作