I have one problem. On my website, I have <div id="alpha_bravo">, with links inside. It looks like this:
<div id="alpha_bravo">
<p>text text text link</p>
</div>
I want change every <a href...> to funny text like suprise, as an example.
How can I do it?
Since you tagged the question with PHP and from the comments below the question it seems that you may want to use server-side functionality, I'm going to give an example using PHP.
One way is to replace only links. You are looking for preg_replace() function that will replace all substrings in the string based on a regex pattern.
$input = "<div id='alpha_bravo'><p>text text text <a href='...'>link</a> and <a href='...'>another link</a></p></div>";
$output = preg_replace("/<a (.*?)>(.*?)<\/a>/i", "surprise", $input);
You can also just remove all HTML tags in the string using strip_tags() function.
$input = "<div id='alpha_bravo'><p>text text text <a href='...'>link</a> and <a href='...'>another link</a></p></div>";
$output = strip_tags($input);
Given that this is coming from a database, first word of advice is that you filter your input before saving it in database.
Secondly, if you don't want those links to render and replace them with some other value then use PHP's function preg_replace() as already mentioned by PetrHejda..
PHP docs: http://php.net/manual/en/function.preg-replace.php
Your <a ...>...</a> pattern may differ if users insert styling and classes.
Try using this pattern as your solution: preg_replace("/<a(.+?)href=\"(.+?)\"/", "<a$1href=\"your_value_here\"", $yourStringHere);
You may use g or i flags. Start here with regular expressions: http://www.regular-expressions.info/.
Related
I have a large string of valid HTML code that will be inserted into the DOM, the string also contains PHP code. I want the php code to be displayed as plain text, Chrome automatically comments out the PHP code. Obviously the PHP code is wrapped in <?php ... ?> so my question is:
How can I replace the open <?php with a <span> tag, and replace the ?> with a </span> to close the open <span> tag so that the PHP code is within the <span> tags and therefor visible as plain text?
EDIT: I will be wrapping the PHP code back in <?php ?> by replacing the span, so escaping the characters will make that more difficult.
You could escape it.
From:
https://css-tricks.com/snippets/javascript/htmlentities-for-javascript/
function htmlEntities(str) {
return String(str).replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>').replace(/"/g, '"');
}
As you say that the HTML is a string, you can easily just use the replace() function.
var html = // your html
var sanitized = html.replace(/<\?php/g, "<span>").replace(/\?>/g, "</span>");
Use Regular Expressions!
RegExp101 is a great playground.
Remember to change the flavor on the left menu to JavaScript.
The easiest way is using the .replace() function.
var str = str.replace(/(<\?php)|(<\?)|(<\?=)/g, '<span>').replace(/(\?>)/g, '</span>');
Edit: As requested by Get Off My Lawn, I've added support to <?= nd <? tags. The pipe | represents an or in Regular Expressions.
I am having trouble in displaying text with double quotes through javascript. I want to display a text with double quotes in a modal. But in order to do this, I have to use javascript. The code is like this:
HTML code:
<button id="info" class="btn btn-link" data-toggle="modal" data-target="#infoDetails" data-name="<?php echo $name;?>" data-detail="<?php echo $details;?>" >Click Here</button>
HTML code (inside modal):
<p align="justify" id="detaiLInfo" style="font-size: 14px"> </p>
javascript code to display modal:
<script>
$('#infoDetails').on('show.bs.modal', function (event) {
var button = $(event.relatedTarget) // Button that triggered the modal
var name = button.data('name') // Extract info from data-* attributes
var details = button.data('detail')
var modal = $(this)
modal.find('.modal-header #name').text(name)
modal.find('.modal-body #detaiLInfo').text(details)
});
Everything's working properly BUT when the value of $details ="The term biology is derived from the Greek word βίος, bios, \"life\" and the suffix -λογία, -logia, \"study of.\"";
It only gives this OUTPUT (inside the modal):
The term biology is derived from the Greek word βίος, bios,
But when I try to echo it inside html code (but not inside the code for modal) like this: echo $details; , the result is:
The term biology is derived from the Greek word βίος, bios, "life" and the suffix -λογία, -logia, "study of."
Can anyone help me to solve this? Please..
If you examine what's happening, the HTML code generated by the server, as seen literally by the browser client, will get the " that opens "life" and be interpreted as the closing quote of the data-detail attribute, followed by trailing garbage which is then forgiven and ignored by the browser's HTML parser. I suggest using UTF-8 curly quotes in your explanatory text, side-stepping the issue and looking nicer! Otherwise, you could entity-encode the offending internal quotes. In general, packing long and/or formatted text into data fields is sort of a mis-use of the idea. Perhaps such data could instead be packed into the HTML content of a carefully id'd display: none storage area to be extracted dynamically with JS.
Scanning again it looks like a capp-o in detaiLInfo
I am trying to create a pattern to prevent user inputs from HTML mark up. I created this patten
var htmlTagRegex = /^<+[a-z]+>/;
which only works when the input starts with html tag for example:
<br /> Test
<p> Test
<div> Test
but in case of having an input like below
Test <br />
Test <p>
Test <div>
the pattern not working (probably because of /^). How can I write the pattern to consider any html tag contains?
^(?=.*(?:<[^>]+>)).*$
You can use this to detect html markers.See demo.
http://regex101.com/r/lZ5mN8/43
now my question is can you please let me know how to power the pattern to consider any html tag contains?
<\w+\b[^<>]*>
For matching custom tags,
<[^<>]+>
To match the whole line which contains the tag. You don't need to go for lookaround assertions.
^.*?<[^<>]+>.*$
DEMO
Just for your information
In jQuery, If you want extract text alone without html markup , then you can use pattern like this
$("<div/>").html("#elementId").text()
<span class='st_twitter_large' displayText='Tweet'></span>
<span class='st_linkedin_large' displayText='LinkedIn'></span>
<span class='st_facebook_large' displayText='Facebook'></span>
when ever I copy and paste the above code, I need to remove space between them i.e., ('/n' tag between them) by doing validations........ and it shouls look like this
<span class='st_twitter_large' displayText='Tweet'></span><span class='st_linkedin_large' displayText='LinkedIn'</span><span class='st_facebook_large' displayText='Facebook'></span>
How can I get it.....Any help would be greatly appreciated
Thanks in Advance
you don't need to use jQuery for that, you can to that by native replace method:
var myStr = "..."; //whatever string you have
myStr = myStr.replace(/\r?\n/g, "");
but I am not sure if this is really solves your problem, it looks like you trying to do something different, anyway the above code will remove all "carriage return" and "new line" characters from the string
How do I include a newline in an HTML tag attribute?
For example:
<a href="somepage.html" onclick="javascript: foo('This is a multiline string.
This is the part after the newline.')">some link</a>
Edit: Sorry, bad example, what if the tag happened to not be in javascript, say:
<sometag someattr="This is a multiline string.
This is the part after the newline." />
Edit 2: Turns out the newline in the string wasn't my problem, it was the javascript function I was calling. FWIW, "
" can be used for newline in an HTML attribute.
From what I remember about the HTML standard, character entities work in attributes, so this might work:
<sometag someattr="This is a multiline string.
This is the part after the newline." />
I'm not sure if the "newline" you want ought to be
(\n) or
(\r\n), and I'm not sure if browsers will interpret it the way you want.
Why do you need it? What specific problem are you trying to solve by adding a newline in an HTML tag attribute?
To include a multiline value, just continue the text of the html attribute on the next line in your editor e.g.
<input type="submit" value="hallo
hallo">
will put the second hallo under the first
As a general rule newlines in attributes are preserved so your second example would work fine. Did you try it? Can you give a specific example where you are having problems with it?
As test take a look at this:-
<a href="somepage3.html" onclick="javascript: alert(this.getAttribute('thing'))" thing="This is a multiline string.
This is the part after the newline.">some link</a>
The alert include the newline in the attribute.
<a href="somepage.html" onclick="javascript: foo('This is a multiline string. \
This is the part after the newline.')">some link</a>
Javascript needs a backslash at the end of the new line in a string.
i'm not certain, but you can try \r or \n
javascript: foo('This is a multiline string.\rThis is the part after the newline.')
or
javascript: foo('This is a multiline string.\nThis is the part after the newline.')
Usually, line breaks in HTML source code display what you intended in the result.
(Depends on the editor of course)
Since it's in Javascript, you would use "\n" if inside double-quotes (not positive about single-quotes, I've been in PHP a lot lately.
Honestly, it's worth mentioning that you should use Events and a delegator instead of placing a javascript event directly on the element.