Question

我知道有点 jQuery ，即使它仍然是javascript，我也不知道如何将以下代码转换为纯Javascript：

$('#breadcrumbs .category[href="http://asksomeone.co.za/category/products"]')
    .attr('href','http://myurl.com/803-2');

我该怎么做？

我这样做的原因是因为我使用的是Wordpress主题...每当我加入 jQuery 库时，它都会在我的网站上打破很多东西，当我不包含jquery库，没有jquery代码运行...

Answer 1

如果您愿意放弃对Internet Explorer 7的支持，您可以

var i, elems = document.querySelectorAll('#breadcrumbs .category[href="http://asksomeone.co.za/category/products"]');

for (i = 0; i < elems.length; i++) {
   elems[i].href = 'http://myurl.com/803-2';
}

否则，我担心你最好不要使用图书馆。

Answer 2

正如其他人所提到的，您可能只想尝试解决库冲突。

要回答您的问题，可以采用以下方式：

var elements = document
    .getElementById('breadcrumbs')
    .getElementsByClassName('category'); //Not supported below IE9 :-(

for (var i = 0; i < elements.length; i++) {
    if (elements[i].href == "http://asksomeone.co.za/category/products") {
        elements[i].setAttribute('href', "http://myurl.com/803-2");
    }
}

Answer 3

jQuery的选择器基于嘶嘶声：http://sizzlejs.com/也许你可以包含那个库？如果没有，问题的第一部分就很难了。

第二部分很简单：

myElement.setAttribute('href','http://myurl.com/803-2');

Answer 4

$只是jQuery的别名。你可以使用：

jQuery('#breadcrumbs .category[href="http://asksomeone.co.za/category/products"]').attr('href','http://myurl.com/803-2');

或者将代码包装在传递jQuery的自执行函数中，如：

(function($){
     $('#breadcrumbs .category[href="http://asksomeone.co.za/category/products"]').attr('href','http://myurl.com/803-2');
})(jQuery);

如果你真的想沿着纯粹的js路线走下去，请看看：

document.getElementById()

和

element.setAttribute()

Answer 5

如果您不想包含用于更改网址的jQuery库。我们需要以下功能

function getByClassName( className , selector ) {
    selector = selector || document;

    if( selector.getElementsByClassName ) {
        return selector.getElementsByClassName( className );
    }

    var els = [];

    var childs = selector.getElementsByTagName( '*' );

    for( var i = 0, j = childs.length; i < j; i++ ) {
        if( childs[i].className.indexOf( className ) > -1 ) {
            els.push( childs[i] );
        }
    }
    return els;
};

function changeUrl( els ,  url , newUrl  ){

    for( var i = 0; i < els.length ; i++ ){

        if ( els[i].href == url ) {
                els[i].href = newUrl ;
        }
    }

}

并调用函数

changeUrl ( 
  getByClassName( 'category' , document.getElementById('breadcrumbs')  ) , 
  "http://asksomeone.co.za/category/products" , 
  "http://myurl.com/803-2"
);

或者如果您正在使用jQuery库..请使用此

(function( JQ ){

    JQ('#breadcrumbs .category[href="'
        + 'http://asksomeone.co.za/category/products"]')
       .attr('href',"http://myurl.com/803-2");

})( jQuery );

用等效的Javascript替换jQuery代码

5 个答案: