ipsum ip...">
All geek questions in one place

Replacing an element with a specific attribute and its value

<p>
lorem ipsum lorem ipsums <font style="background-color:yellow">ipsum</font> ipsume lorem
</p>

how to replace the tag <font>with <abbr>, so the output will be like that.

 <p>
    lorem ipsum lorem ipsums <abbr style="background-color:yellow">ipsum</abbr> ipsume lorem
    </p>
+3
source share
5 answers

Finds all font tags inside any p and replaces it with an abbreviation with the style attribute and the text copied.

$("p font").each(function() {
    var font = $(this);

    var abbr = $("<abbr>", {
        style: font.attr("style"),
        text: font.text()
    });

    font.replaceWith(abbr);
});
​
+2
source

This will replace all <fontand </fonton <abbrand </abbr.

var p = document.getElementsByTagName("p")[0]; // assume this is the first P in the document
var p.innerHTML = p.innerHTML.replace(/(<|<\/)font/g, "$1abbr")
+2
source

, getAttributes plugin :

var attributes =$.getAttributes($(YOURTAG));
$(YOURTAG).replaceWith($('<abbr>' + YOURTAG.innerHTML + '</abbr>');
$(YOURTAG).attr(attributes);

: , ...

+1

.

$('p').each(
     function(){
          $(this).html($(this).html().replace(/(<|<\/)font/g, "$1abbr"));
     }
);
+1

:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title></title>
<style type="text/css"><!--
--></style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript"><!--
$(function(){
    $("font").replaceWith(function(){
        var font = $(this);
        return $("<abbr></abbr>")
            .attr("style", font.attr("style") )
            .append( font.contents() );
    });
});
//--></script>
</head>
<body>

<p>
lorem ipsum lorem ipsums <font style="background-color:yellow">ipsum</font> ipsume lorem
</p>

</body>
</html>

, , , .

+1

Source: https://habr.com/ru/post/1746840/

More articles:


All Articles