`
zhangyaochun
  • 浏览: 2615234 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

关于动态修改script标签的src的值引发的一些思考

阅读更多

前言

 

最近在逛各家UED博客的时候,在w3ctech上看到的这个Topic的文章,个人感觉还是不错的,决定转换为自己的实践知识

 

正文

 

首先我这边先抛出几个结论性的东东

 

    来自w3c的HTML4标准

 

  • 如果src属性没有被设置,就执行script标签内的脚本内容;如果src有一个URL的值,则忽略script标签的脚本内容,而是去请求指定的URL的内容
  
    来自w3c的HTML5标准

  • 动态地修改src、type、charset、async和defer属性没有直接的效果,这些属性在特定的时候使用

下面我们从几种常见出发结合上面的结论

1、script标签没有指定src的值


<script id="test" type="text/javascript">
</script>
<script type="text/javasript">
    document.getElementById("test").src = "*****";
</script>
 
浏览器反应
  • Chrome |  FF  没有请求新的URL
  • IE9 请求新的URL 但是没有执行对应URL的脚本
  • IE6-8 请求并执行对应URL的脚本
  注意一下第一个script标签内部其实是有内容的,有一个回车的符号  

  所以测试改为下面这样:


<script id="test" type="text/javascript">
  alert("内部脚本");
</script>
<script type="text/javasript">
    document.getElementById("test").src = "*****";
</script>
 
浏览器反应
  • Chrome |  FF 会执行内部的那个alert脚本,但是没有请求新的URL
  • IE9 会执行内部的那个alert脚本,并请求新的URL,但不执行里面的脚本
  • IE6-8 会执行内部的那个alert脚本,并请求新的URL和执行里面的脚本
   所以这个是符合第一个HTML4的那个结论的前半部分


  再改一下:

   Tip:一般很少人会同时指定src又在script标签内部写脚本,这边只是测试用

<script id="test" type="text/javascript" src="*****">
  alert("内部脚本");
</script>
<script type="text/javasript">
    document.getElementById("test").src = "*****";
</script>
 
浏览器反应
  • Chrome |  FF 不会执行内部的那个alert脚本,而是执行对应开始设置的URL的脚本,但是没有请求新的URL
  • IE9  不会执行内部的那个alert脚本,而是执行对应开始设置的URL的脚本,并请求新的URL,但不执行里面的脚本
  • IE6-8  不会执行内部的那个alert脚本,而是执行对应开始设置的URL的脚本,并请求新的URL和执行里面的脚本
  所以这个是符合第一个HTML4的那个结论的后半部分



部分内容来源于:

 

分享到:
评论

相关推荐

    MyBatis拦截器分页与动态修改SQL及其参数值

    在这个主题中,我们将深入探讨如何利用MyBatis拦截器实现分页以及动态地修改SQL语句和参数值。 首先,我们关注的是"PaginationInterceptor.java",这是一个常见的分页拦截器实现。在MyBatis中,我们可以创建自定义...

    IE8中动态创建script标签onload无效的解决方法

    本文实例讲述了IE8中动态创建script标签onload无效的解决方法。分享给大家供大家参考。具体分析如下: 今天做项目,发现一个奇怪的问题,动态创建的script标签在IE8下无法触发onload事件。 代码如下: 代码如下:var...

    jQuery修改标签内容实例

    &lt;script src="jquery-1.8.3.min.js"&gt;&lt;/script&gt; ``` 一旦引入了jQuery,我们就可以使用其丰富的API来操作DOM。下面我们将逐一讲解如何修改四种标签的内容: 1. **修改超链接`&lt;a&gt;`标签内容**: 要修改超链接的文本...

    jquery得到iframe src属性值的方法

    通过以上知识点,可以看到,在实际开发中,若需要从一个iframe中获取src属性值,可以利用jQuery的选择器、attr()方法,以及$(document).ready()等,这些是进行DOM操作和动态获取内容时常用的方法。同时,也需要考虑...

    Spring @Scheduled定时任务动态修改cron参数

    当然,这种方法需要处理一些边界情况,比如并发修改和错误处理。在实际应用中,可能还需要使用线程安全的方式来存储和更新cron表达式,以及确保任务的幂等性,以防止同一任务被多次执行。 总的来说,Spring的`@...

    动态创建script标签实现跨域资源访问的方法介绍

    动态创建`&lt;script&gt;`标签是一种常见的跨域资源共享(CORS)方法,特别是在JavaScript中进行异步数据请求时。由于浏览器的同源策略限制,JavaScript通常只能访问与当前页面同源的资源,但通过动态创建`&lt;script&gt;`标签,...

    javascript修改IMG标签的src问题

    关于JavaScript修改img标签的src属性的问题,涉及到浏览器缓存机制和动态更新图片源的需求。在IE6浏览器中图片可以正常刷新,但在IE7和Firefox浏览器中遇到刷新不出现的情况,主要的原因可能和浏览器对静态资源的...

    vue动态加载js.zip

    2. 设置src属性:将需要加载的JavaScript文件的URL设置为`&lt;script&gt;`元素的`src`属性。例如,如果文件名为`/path/to/myScript.js`,则设置`script.src = '/path/to/myScript.js'`。 3. 添加到DOM:将这个`&lt;script&gt;`...

    js 修改 fck 编辑器的值

    #### 使用 FCKeditor API 进行动态修改编辑器的值 在 FCKeditor 的官方文档中提供了丰富的 API 接口,这些接口可以让我们方便地与编辑器进行交互。其中一个常用的方法是 `SetHTML()`,它可以用来设置编辑器的内容。...

    how-to-load-dynamic-script, 加载动态脚本的正确方法.zip

    &lt;script src="path/to/script.js"&gt;&lt;/script&gt; ``` 然而,这种方式是静态加载,所有脚本会在页面解析时立即加载。 3. 动态创建`&lt;script&gt;`元素: 要实现动态加载,可以使用JavaScript动态创建`&lt;script&gt;`元素并将其...

    duilib 做的Demo ,支持进度条,以及动态修改xml 的内容

    这样的功能在很多实际场景中都非常实用,例如网络下载、文件解压、游戏加载等过程中,可以通过动态修改XML中的进度条值来反映任务状态。此外,也可以用于自定义设置页面,用户更改设置后,实时更新界面元素。 通过...

    js动态引入外部js脚本并获取里面的变量值.pdf

    "js动态引入外部js脚本并获取里面的变量值"这个主题就是关于如何在JavaScript中实现这种功能的讨论。 首先,`jQuery`库提供了一个非常方便的方法来实现动态加载外部脚本:`$.getScript()`。这是一个异步方法,它...

    javascript中的用法与意思

    3. **自定义事件触发**:可以使用`&lt;script&gt;`标签配合DOM事件来动态加载脚本。 ```html ('Button clicked!')"&gt;Click me ``` 4. **Google Analytics示例**: ```html &lt;script src=...

    动态改变li标签样式

    &lt;script&gt; function change(obj){ var arrayli = obj.parentNode.getElementsByTagName("li"); //获取li数组 for(i=0;i;i++) { arrayli[i].className=""; if(obj==arrayli[i]) { obj.className="test"; ...

    javascript 获取url参数和script标签中获取url参数函数代码

    在JavaScript编程中,有时我们需要获取URL中的参数或者脚本(script)标签中的参数。这些参数在Web应用中常用于传递动态数据或者配置信息。本文将详细介绍如何通过JavaScript获取URL参数和script标签中的参数,并...

    android动态改变shape的颜色值

    如果我们想要动态地改变这些颜色,我们需要在Java代码中获取Shape的引用,并修改其属性。 以下是如何在运行时动态改变Shape颜色的基本步骤: 1. **定义Shape资源**:在`res/drawable`目录下创建XML文件,例如`...

Global site tag (gtag.js) - Google Analytics