根据条件使用 jQuery 更改“href”和“src”属性答案

【问题标题】：Change the "href" and "src" attributes using jQuery based on condition根据条件使用 jQuery 更改“href”和“src”属性
【发布时间】：2014-10-07 18:33:16
【问题描述】：

我有以下链接：

<script src="/WebResource.php?d=FViz" type="text/javascript"></script>
<script src="WebResource.php?d=FViz" type="text/javascript"></script>

<img src="/Images/top.png">
<img src="Images/top.png">

<link href="/Skins/style.css" rel="stylesheet" type="text/css">

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>

如果链接没有开始，我如何在链接开头插入属于“script”、“link”和“img”标签的所有“src”和“href”属性“http://example.com/”使用“http://”或“www.”。

所以最终的结果应该是这样的

<script src="http://example.com/WebResource.php?d=FViz" type="text/javascript"></script>
<script src="http://example.com/WebResource.php?d=FViz" type="text/javascript"></script>

<img src="http://example.com/Images/top.png">
<img src="http://example.com/Images/top.png">

<link href="http://example.com/Skins/style.css" rel="stylesheet" type="text/css">

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>

我必须强调，它必须在页面加载后在用户浏览器中使用 jQuery 完成，而不是在服务器端。

抱歉，我没有任何基本示例。

【问题讨论】：

标签： jquery

【解决方案1】：

仅供参考，此类 URL 修复通常在服务器端完成，因为客户端无法完全控制此类内容。

您不能使用客户端 javascript/jQuery 修改页面中现有的 <script> 标记。在您尝试修改它们时，它们已经被解析和加载。如果需要，您可以使用适当的 src 值插入新的 <script> 标记。

您可以使用 jQuery 修改图像 src 的值，但我想知道是否有更好的方法来解决您遇到的问题。

如果您真正想做的是更改页面中相对 URI 的默认路径，那么您可以使用 <head> 部分中的 <base> 标记来更改要使用的所有非绝对 URI不同的默认路径。

<base href="http://example.com">

使用 jQuery，<img> src 属性可以这样修改：

$(document).ready(function() {
    $("img").each(function() {
        // get raw .src attribute
        var src = this.getAttribute("src");
        if (src.slice(0, 7) !== "http://") {
            // make sure there's a leading "/"
            if (src.charAt(0) !== "/") {
                src = "/" + src;
            }
            // add domain
            src = "http://example.com" + src;
        }
        this.src = src;
    });
});

由于脚本标签已经加载（或尝试加载），然后您才能使用自己的脚本访问它们，您可以对脚本标签做的唯一事情就是创建具有所需路径的新脚本标签，然后重新插入它们。这可能会导致加载顺序问题，因为新的脚本标签将异步加载。

【讨论】：

我不知道中有“ 标签”之类的东西，不需要 jq。现在我可以在服务器端执行此操作了 :) 非常感谢@jfriend00 的建议

【解决方案2】：

jQuery.each($("[src]"),function()
{
    if(($(this).attr("src").indexOf("http")>-1) || ($(this).attr("src").indexOf("www")>-1))
    { }
    else {
        $(this).attr('src',"http://www.example.com"+$(this).attr('src'));
    }
});

【讨论】：

最好添加一些注释，而不是随便乱扔代码。