I need to locate an element and grab an entire block of HTML.
I tried this:
$(this).find('h1').html();
But only was able to capture the text withing h1 tag... What am I missing?
Here's a simple plugin. Use it as follows:
$(this).find('h1').outerHtml();
If you don't want to depend on the plugin, here's a solution with less code, but not as efficient:
var html = $('<div />').html( $(this).find('h1').clone() ).html();
Here's the fiddle: http://jsfiddle.net/nxfTf/
You could try this.
$(this).find('h1')[0].outerHTML
I did this fiddle, if you need something a little more visual: http://jsfiddle.net/aPGGS/
Related
This is my try.
tinymce.init({
...
});
var frame2 = '<p><div>some text<div/></p>';
tinymce.execCommand('mceInsertContent',false,frame2);
out put view on preview
<div>some text</div>
As you can see the output is wrong. The desired output is below, which is p tag wraps div which wraps the text.
<p><div>some text<div></p>
What am I missing here?
Try this:
var frame2 = '<p><div>some text</div></p>';
You are not closing the div tag properly. I think that's the problem which is giving you wrong output.
Also, it's good to wrap 'p' tag inside 'div' instead of 'div' inside 'p'. So if its suits your need in this case, use following:
var frame2 = '<div><p>some text</p></div>';
Using jQuery to manipulate the final view seems to be a more elegant solution and easier. Better give up dealing with the editors.
I have an HTML structure that looks like this:
<li class="thing">Something</li>
My goal is to put a span that looks like this in front of the link tag:
<span class="my-span"></span>
What's the best way to go about doing this? Is it a CSS :before or a jQuery/Zepto .before method? Also, proper syntax as to how to do this would be helpful. I've been struggling with this.
Thanks!
$('<span class="my-span"></span>').insertBefore('.my-link');
Check more details from .insertBefore
If you need that <span> to be generated dynamically you may go for Jquery .before()
You may find for information in the following link with exaples
http://api.jquery.com/before/
Here's how to do it with Javascript. (Tried on FireBug for Firefox)
a = document.getElementsByClassName("my-link")
//Now a[0] will have your first link
b = document.createElement("span") //Your new span element
b.setAttribute("class","my-span")
a[0].parentElement.insertBefore(b,a[0])
Does this help? Or did you want to do it in jQuery?
Information source here.
When the DOM is loaded, i want to check all my textareas and change their height depending on the text contained.
It should look something like that:
$().ready(function (){
//my check textares code
});
Can anyone give me advice how to do that? Thanks.
Since you use jquery, you might as well use plugin jgrow for that
you should use jquery plugin Autosize.
you can download this:
http://www.jacklmoore.com/autosize
just declare like this:
$(document).ready(function(){
$('textarea').autosize();
});
So here's my problem. I have a little third-party service on my site that generates a bunch of HTML from an RSS feed and sticks it in my webpage when the page is loaded. However, when it generates the HTML, it inserts a bunch of totally unnecessary break tags. Unfortunately, the source file that generates this code is on the third party's server and not mine, so I can't tweak it.
Thus, I'm trying to tweak the HTML right before the page is loaded by using a little jQuery inside the onLoad="" property in the body tag. However, I can't simply use something like $('br').remove(); because then there aren't ANY break tags, and I need one per each spot where there are currently three.
So ultimately, what I need to do is come up with a jQuery statement that replaces
<br><br clear=all><br>
with
<br />
I'm rather new to jQuery, but I couldn't seem to find anything that would help me do this. Any ideas?
Thanks in advance for any help!
Use the Next Adjacent Selector (+):
$("br+br").remove(); //Removes all <br> tags in front of another
jsFiddle demo
Assuming they are in the exact format you gave, you can do this:
var br = $('br[clear="all"]');
br.attr('clear', '');
br.prev('br').remove();
br.next('br').remove();
You can play with selector attributes, not inside the onload but inside the jquery ready (http://api.jquery.com/ready/)
$('br[clear=all]').remove();
more details on selector attribute:http://api.jquery.com/attribute-equals-selector/
Why donn`t just replace the html of the RSS HTML container:
yourContainerElem.innerHTML = yourContainerElem.innerHTML.replace(/<br><br clear=all><br>/gi, '<br />');
To remove all but one:
$('br,[clear!="all"]').remove()
Then to remove the 'clear=all':
$('br').removeAttribute('clear')
You better do this with regexps not with jquery. Simplest example:
string.replace('<br><br clear=all><br>', '<br />')
Using a ajax request I want to change content of my div.
<div id="d1">202</div>
So I want to change the content to a different number.
$('d1').InnerText???
Also, say I wanted to increment the number, how could I do that? Do I have to convert to int?
$("#di").html('My New Text');
Check out the jQuery documentation.
If you wanted to increment the number, you would do
var theint = parseInt($("#di").html(),10)
theint++;
$("#di").html(theint);
P.S. Not sure if it was a typo or not, but you need to include the # in your selector to let jQuery know you are looking for an element with an ID of di. Maybe if you come from prototype you do not expect this, just letting you know.
This would changed the inner text of your HTML element.
$('#d1').text(parseInt(requestResponse)++);
Unless you're embedding html like <b>blah</b> I'd suggest using $("#di").text() as it'll automatically escape things like <, > and &, whereas .html() will not.
Use the text function:
$("#d1").text($("#d1").text() + 1);
$('#d1').html("Html here");
jQuery('#d1').html("Hello World");
if your value is a pure text (like 'test') you could use the text() method as well. like this:
$('#d1').text('test'); Or $('#d1').html('test');
anyway, about the problem you are sharing, I think you might be calling the JavaScript code before the HTML code for the DIV is being sent to the browser. make sure you are calling the jQuery line in a <script> tag after the <div>, or in a statement like this:
$(document).ready(
function() {
$('#d1').text('test');
}
);
this way the script executes after the HTML of the div is parsed by the browser.
$("#div1").innerHTML="your text goes here..";