我不能在JavaScript中使用.src和.pathname

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了我不能在JavaScript中使用.src和.pathname相关的知识,希望对你有一定的参考价值。

我正在尝试使用代码将显示的图像路径与独立于url的相对路径进行比较,但.pathname不起作用

 <html>
    <head>
        <title>change images</title>
        <script>
            var img=document.getElementById('img').src;
            function change(){
                if(img.pathname='img1.png'){
                    var next='img2.png';
                    document.getElementById('btn').innerHTML='img2.png';
                }else if(img.pathname='img2.png'){
                    var next='img1.png';
                    document.getElementById('btn').innerHTML='img1.png';
                }else{
                    document.getElementById('btn').innerHTML='error';
                }

                document.getElementById('img').src=next;
            }
        </script>
    </head>
    <body>
        <img id='img' src="img1.png">
        <button id='btn' onclick="change()">change</button>
    </body>
<html>

在控制台上它'说'img不是一个对象

我试图寻找img.pathname返回的内容并返回undefined

答案

路径名不是图像元素的属性。从查看代码可以清楚地看到,您只需要图像的文件名,而不需要路径。这将为你做到这一点......

function change() {
    // get everything after the last / in the image src attribute
    var current = document.getElementById('img').src.split("/").slice(-1);

    if (current == 'img1.png') {
        var next = 'img2.png';
        document.getElementById('btn').innerHTML = 'img2.png';
    }
    else if (current == 'img2.png') {
        var next = 'img1.png';
        document.getElementById('btn').innerHTML = 'img1.png';
    }
    else {
        document.getElementById('btn').innerHTML = 'error';
    }

    document.getElementById('img').src = next;
}

它将/的每个实例的图像src属性分割成一个数组,然后slice将它剪切到特定的索引,在这种情况下是最后一个元素,这就是你得到的全部。

另外,请注意在比较值时使用==。如果你有...

if (current = "something)

然后它实际上将当前设置为值“某事”(因为单个=)并且if语句的计算结果为true。

另一答案

我找到了另一种解决方案,使用indexOf().src字符串中搜索图像名称。

<script>

    function change(){
        var img=document.getElementById('img').src;
        if (img.indexOf('img1.png')!= -1){
            var next='img2.png';
        } else if (img.indexOf('img2.png')!= -1) {
            var next='img1.png';
        } else {
            document.getElementById('btn').innerHTML='else';
        }


        document.getElementById('img').src=next;
        document.getElementById('btn').innerHTML=next;
    }
</script>

以上是关于我不能在JavaScript中使用.src和.pathname的主要内容,如果未能解决你的问题,请参考以下文章

在javascript上更改src iframe无法正常工作

如何从 ES6 JavaScript 类实例中获取源代码位置?

Javascript时钟

为什么我不能使用webpack和awesome typescript loader将这个应用程序文件编译成javascript?

ID3 - base64 不能设置为 img 的 src

我不能使聚类工作