document.querySelectorAll(“ a”)返回带有#url的空白节点列表

用户名

我有一些JavaScript,它将变量(c)的文本添加到由querySelectorAll(“ a”)标识的所有链接的href中。

这通常可以正常工作。

问题是,当我转到此页面的URL,并在其后添加任何带有井号/磅符号的字符时,例如“ #something”,querySelectorAll(“ a”)返回一个空的节点列表。这是我的代码:

$(document).ready(function() {
   m = document.querySelectorAll("a");

   m.forEach(function(item){
        v = item.getAttribute("href");      
        item.setAttribute( "href", v.concat(window.c) );
   });

})

这是我发现节点列表返回空白的方式:

<p id="p1"></p>

<script type="text/javascript">
$(document).ready(function() {
   m = document.querySelectorAll("a");

   m.forEach(function(item){
        v = item.getAttribute("href");      
        document.getElementById("p1").innerHTML = v + " ";
        item.setAttribute( "href", v.concat(window.c) );
   });

})
</script>

这将在id =“ p1”段落中返回“ null”。

至少在Chrome中,当加载带有“#”的网址时,为什么至少在Chrome中querySelectorAll似乎不起作用?

更新:

certainPerformance希望我发布依赖于#的所有其他脚本,因此这里是:

/* This code adds or removes #_numbers to the end of the URL if the user clicks a accordion link */

if(window.location.href.indexOf("#") > -1) {
  h = window.location.href.indexOf("#");
  i = window.location.href.length;
  j = window.location.href.substring(h, i);
  x = j
}else{
  x = "#_"
}

$(document).ready(function(){
  $("#heading1").click(function(){

    //when heading link is clicked, it toggles the section
    $("#section1").toggle();

    if(window.x.includes("1")){
      //if x has a 1 in it, get rid of the 1
        window.x = window.x.replace("1", ""); 
    }
    else{
        window.x = window.x.concat("1"); //if x doesn't have a 1 in it, add a 1
    }    

    window.x = window.x.replace("#_", ""); //remove multiple instances of #_ if there are any

    y = "#_"

    window.x = y.concat(window.x) // add #_ to the beginning of x

    $('a[href]').each(function(){

        var oldUrl = $(this).attr("href"); // set oldUrl to link above

        if(oldUrl.includes("#_")){
            oldUrl = oldUrl.replace("#_", ""); 
        }
        if(oldUrl.includes("1")){
            oldUrl = oldUrl.replace("1", ""); 
        }

        var newUrl = oldUrl.concat(window.x); // for each link, concatenate it with x 

        $(this).attr("href", newUrl); // Set herf value

            document.getElementById("heading1").href = window.x;
    });  
  });
});
用户名

Gabriele Petrioli在评论中对其进行了修复。他说:

可能有些标签没有href。尝试使用m = document.querySelectorAll(“ a [href]”);

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

带有 document.querySelectorAll 的多个选择器

来自分类Dev

使用querySelectorAll选择与document.URL匹配的所有href?

来自分类Javascript

QuerySelectorAll返回带有OOP的空节点列表

来自分类Javascript

jQuery与document.querySelectorAll

来自分类Dev

javascript document.querySelectorAll

来自分类Dev

替换 document.querySelectorAll

来自分类Javascript

为什么document.querySelectorAll返回StaticNodeList而不是真正的Array?

来自分类Dev

document.querySelectorAll仅在检查DOM之后返回值

来自分类Dev

React.js document.querySelectorAll()不返回任何内容

来自分类Dev

Sizzle和document.querySelectorAll有什么区别

来自分类Dev

document.querySelectorAll('')如何运作?

来自分类Dev

带有条件的 document.querySelectorAll ":not" 不起作用

来自分类Dev

使用 document.querySelectorAll 根据其类和内部文本查找特定节点

来自分类Dev

哪个具有更好的性能jQuery类选择器或document.querySelectorAll?

来自分类Dev

document.querySelectorAll()函数不适用于所有元素

来自分类Dev

document.querySelectorAll立即获取所有选定元素的innerText纯javascript

来自分类Dev

111 是有效的 HTML id 属性还是 document.querySelector() 和 document.querySelectorAll() 正确抛出语法错误?

来自分类Dev

表单提交后的document.querySelectorAll

来自分类Dev

如何document.querySelectorAll()仅检查项目

来自分类Dev

querySelectorAll返回的节点存在问题

来自分类Dev

document.querySelectorAll和document.getElementsByClassName事件处理

来自分类Dev

Javascript querySelectorAll('*')返回格式

来自分类Dev

QuerySelectorAll 返回超过预期

来自分类Dev

如何使用document.querySelectorAll选择除锚点以外的所有标签(两个元素内均不锚定)?

来自分类Dev

從 document.querySelectorAll 獲取兩個項目

来自分类Javascript

为document.querySelectorAll做一个简短的别名

来自分类Dev

在Linekdin.com。document.querySelectorAll(“ .className”)不起作用

来自分类Javascript

如何使用document.querySelectorAll遍历选定的元素

来自分类Dev

为什么“document.querySelectorAll”只针对直系孩子?

Related 相关文章

  1. 1

    带有 document.querySelectorAll 的多个选择器

  2. 2

    使用querySelectorAll选择与document.URL匹配的所有href?

  3. 3

    QuerySelectorAll返回带有OOP的空节点列表

  4. 4

    jQuery与document.querySelectorAll

  5. 5

    javascript document.querySelectorAll

  6. 6

    替换 document.querySelectorAll

  7. 7

    为什么document.querySelectorAll返回StaticNodeList而不是真正的Array?

  8. 8

    document.querySelectorAll仅在检查DOM之后返回值

  9. 9

    React.js document.querySelectorAll()不返回任何内容

  10. 10

    Sizzle和document.querySelectorAll有什么区别

  11. 11

    document.querySelectorAll('')如何运作?

  12. 12

    带有条件的 document.querySelectorAll ":not" 不起作用

  13. 13

    使用 document.querySelectorAll 根据其类和内部文本查找特定节点

  14. 14

    哪个具有更好的性能jQuery类选择器或document.querySelectorAll?

  15. 15

    document.querySelectorAll()函数不适用于所有元素

  16. 16

    document.querySelectorAll立即获取所有选定元素的innerText纯javascript

  17. 17

    111 是有效的 HTML id 属性还是 document.querySelector() 和 document.querySelectorAll() 正确抛出语法错误?

  18. 18

    表单提交后的document.querySelectorAll

  19. 19

    如何document.querySelectorAll()仅检查项目

  20. 20

    querySelectorAll返回的节点存在问题

  21. 21

    document.querySelectorAll和document.getElementsByClassName事件处理

  22. 22

    Javascript querySelectorAll('*')返回格式

  23. 23

    QuerySelectorAll 返回超过预期

  24. 24

    如何使用document.querySelectorAll选择除锚点以外的所有标签(两个元素内均不锚定)?

  25. 25

    從 document.querySelectorAll 獲取兩個項目

  26. 26

    为document.querySelectorAll做一个简短的别名

  27. 27

    在Linekdin.com。document.querySelectorAll(“ .className”)不起作用

  28. 28

    如何使用document.querySelectorAll遍历选定的元素

  29. 29

    为什么“document.querySelectorAll”只针对直系孩子?

热门标签

归档