executing link.click() event doesn't open the link - javascript

I'm writing a Google Chrome extension.
In it I'm trying to run the following simple Javascript code:
document.querySelector("link[rel~=next]").click();
But doesn't seem to work for some sites.
For example, running it on here to open the next page doesn't work.
I've reviewed the existing SO questions on the subject but couldn't find an answer that I understand.
Some claim this has to do with security, is it true? if so, why does it work on some sites?

I am not sure how you can click on a <link> element in the document's head tag.
Shouldn't you be clicking on the actual next link?
document.querySelector(".next a").click()

Related

getElementById returning null when trying to build Chrome Extension

I'm trying to build a chrome extension which allows you to play an mp3 file (pre-selected) by clicking a button- very simple for now I know! However, when I am trying to access the button in my js file my function only returns null. I have moved the script tag to the end of my body and included a 'DOMContentLoaded' event listener, as shown below, but I still can't shake this error- and this is after trying to incorporate practically every suggestion I've found on other similar questions! Any help greatly appreciated.
my javascript
my html file
I should note I ran this code through another IDE (the one provided by the CS50x course) and everything worked fine.

Adding target="_blank" causes link to stop working

Up to my elbows in what is surprisingly the most elusive bug I've encountered thus far.
I've got a site I'm working on that has issues with links opening in Safari. The issue is isolated to the target appendage. To be clear, this issue is not that links do not open in a new tab, it's that they don't open at all.
For example, this will open just fine:
blaaaahh link
This, however, will do 'nothing':
blaaaahh link
Note that this is specific to PDF files. Links to any other type of resources work fine, even with the target appendage.
Note note: There is a ton of event tracking happening on this site. And the issue is resolved when JS is disabled. I've excluded all site-specific JS for testing, so that's not the issue. Anyone aware of anything with GTM or HotJar in Safari that could cause this?

HTML & jQuery get href

I'm new to this website so I'm sorry if I do something wrong, please tell me if I do so.
Problem: I'm trying to get a href from the current page I'm on with a button like "Get Href" and when it manages to get a href it will display text Href gotten or if it fails it says Href not found. If it does find it a new button appears which says Goto Href and that takes the user to the href. I've been searching the whole week for a solution but so far I have no luck. Also this is a chrome extension.
Useful Links Found So Far:
Need to link directly to a Chrome internal page, from within a page of a Chrome Extension
Select which href ends with some string - Can be used to find href starts with ^=
Content Scripts
I am new to HTML & jQuery & CSS & Javascript so I apologize for my lack of knowledge in advance. If you are able please explain your answers in detail. If answer is found please comment the functions out so I could manually research them further.
I don't know where to start, what I have so far is what the Getting Started: Building a Chrome Extension has.
----UPDATE .1----
I thank you for your replies and what I've gathered so far from them is this code
<script>
$(document).ready(function(){
$("button").click(function(){
alert($('a').attr('href'));
});
});
</script>
</head>
<body>
<button>Find Href</button>
</body>
but nothing seems to happen. Also instead of alert($('a').attr('href')); I'm trying to put $('a[href^="magnet"]') This code is gathered from different websites so I don't know if it is legit (still working) or not.
try this javascript:
document.location.href
I type it in the console and it returns:
http://stackoverflow.com/questions/24225281/html-jquery-get-href
, which is current link.
Before you start, you should read some javascript tutorials. Go search the internet for "javascript tutorial" (...please... do it). If you fail on this task, you will fail on others. This is not helpfull for you or others.
What do you want to do with "href" and why do you search only for chrome answers rather than search for a javascript answer.
Anyway, if you open the console you can test this by yourself.
alert(location) <-- shows you the current location of the browser
or every href of every a tag (in jquery).
alert($('a').attr('href')); <-- a lot of links ;)

HTML5 embed tag - event attributes not firing (onended, onpause etc)

I've searched for many hours trying to find a solution to this problem. I have a HTML5 web page with a background sound file that plays automatically when the page loads, and I'm trying to get a function to run when the sound file finishes playing. I've isolated the code I'm using into a test file to ensure nothing else is causing the problem. The sound plays fine in Firefox (which I'm using to test). From the many solutions I've tried, it seems as though the event attributes in the embed tag simply aren't firing at all.
Here is the test HTML page I'm using (tried putting HTML in here but it wouldn't show up properly, I know it's probably a noob error but I'm in a hurry with this):
Testpage
As you can see the message function works fine, as the "TEST" link indicates when clicked. But the messages for the media events don't appear.
If anyone can help me with this, I'd be most grateful as it's for a time-critical company project. I'd be happy to try alternative solutions to the event attributes, as long as I can get my own Javascript function to run on the sound file reaching its end, I'll be happy!!
Thanks!
Billy
Since you're using HTML5, it would be better to use the <audio> tag rather than <embed>. This works fine in my example:
http://jsfiddle.net/u6dbV/
You can include HTML here, but it has to be marked up as code or it'll get stripped out.

Tumblr JS Embed CSS/HTML Tags for Styling?

I used tumblr's javascript embed code to embed my posts into an external website. Now I want to style the posts. Where can I find the full list of tags, classes, and all of that in order to do this? I see people posting some of the tags, for exampe ol.tumblr_posts, but no one has said how or where they actually found out that's the tag tumblr is using for that particular element.
Someone mentioned using the web developer extension in Firefox to pull out the HTML associated with the javascript file but I can't use Firefox so I need another suggestion? I did go to tumblr's docs but the tags and everything used for customizing themes WITHIN tumblr seem to be different from the ones used to display posts outside of tumblr.
I also looked around in the api section and didn't see anything that lists all of the tags. Thanks!
UPDATE: Here's a post that discusses what I'm talking about but none of the people giving answers that show what tags to use to format the script's output say how or where they got the tags.
tumblr javascript embed with css skin
This website is the one that said to use the FF add on but again, the person who figures out how to find the tags using it doesn't say HOW, they just say it worked. I'm finally in a place where I can use Firefox so I installed this web developer thing and I still don't see where I would go to see the info that shows the actual html with all the styles instead of just showing the link to the js code.
http://forums.macrumors.com/showthread.php?t=745299
Chrome and Opera's developer console is CTRL + SHIFT + I... try looking in the source there
IE's dev tools is f12 if you can't use Chrome
Also: I'm not sure if this is what you're talking about but I'll throw in this link for good measure:
http://www.tumblr.com/docs/en/custom_themes
I figured it out! Unfortunately, the only way I could do this was to use the Firefox Web Developer Toolbar Add-On. Once you have that installed, you go to the webpage where you've embedded your blog's javascript code.
Then, in the Firefox toolbar, there should be a tab that says "Miscellaneous". Click on that, then click on "Edit HTML". A new pane opens up towards the bottom of the browser. Inside, it will show the source of the webpage INCLUDING the information that the javascript code generates, which shows the classes, html, and all of that.
It's still not a ton that you can customize compared to using the api (which I don't know how to do) but it's a start. Thanks everyone!

Categories

Resources