更改所有标签的HTML元素的属性


Change attribute of HTML elements of all tag?

是否有一种方法可以使用javascript或php(或其他任何东西)更改特定标记的所有HTML元素的特定属性?例如,我想使用javascript更改页面上的所有""元素,使其具有"target='_blank'"属性。有什么建议吗?

getElementsByTagName将抓取所有锚,然后您可以遍历它们:

var list = document.getElementsByTagName("a"), len = list.length;
while( len-- ) {
    list[len].target = "_blank";
}

JSFiddle: http://jsfiddle.net/zwbCS/

下面的jQuery代码将为页面上的所有锚(a)元素添加target="_blank"属性:

$(function() {
    $('a').attr('target', '_blank');
});

在执行上述脚本之前,您需要在HTML的head元素中包含jQuery的副本。所以你的head元素看起来像这样:

<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(function() {
            $('a').attr('target', '_blank');
        });
    </script>
</head>

首先,您似乎没有区分服务器端语言(如PHP)和客户端语言(如Javascript)之间的区别。在这里阅读它们的区别。

回答你的问题。对您来说,最好的选择(也是最简单的)是获得jQuery并使用以下脚本:

$(document).ready(function() {
  $('a').attr('target', '_blank');
});

看看使用jquery你应该能够做一些像

$("a").attr("target", "_blank");

这里是一个JQuery的例子,如果你想在新窗中只打开外部链接:

var myHosts = [ // just in case you are using full abs paths
    'www.mydomain.com'
];
jQuery(function()
{
    jQuery( 'a[href^="http"]' ).each( function()
    {
        if ( jQuery.inArray( this.hostname, myHosts ) == -1 && this.href.indexOf( location.hostname ) == -1 )
            jQuery( this ).attr('target','_blank');
    });
});

恕我直言,强迫访问者按照你的方式去做并不是一个好主意。现代浏览器很容易使用快捷键来打开新窗口/选项卡中的链接。因此,如果访问者发现你的网站非常有用,他会回到你的网站,即使他离开你的网站点击外部链接。

如果你想给你的访问者一个关于你网站上的外部链接的提示,我建议你在链接中放一个图标(例如通过CSS),并修改和使用上面的脚本来添加所需的CSS类到这些链接。如:

jQuery(function()
{
    jQuery( 'a[href^="http"]' ).each( function()
    {
        if ( jQuery.inArray( this.hostname, myHosts ) == -1 && this.href.indexOf( location.hostname ) == -1 )
            jQuery( this ).addClass('external_link ');
    });
});
CSS:

.external_link { padding-right: 20px; background: url(path/to/the/image) no-repeat right top; }