Published
Edited
May 9, 2019
4 stars
viewof teststring = html`<input type="text" value="A bookmarklet is a bookmark stored in a web browser that contains JavaScript commands that add new features to the browser. Bookmarklets are unobtrusive JavaScripts stored as the URL of a bookmark in a web browser or as a hyperlink on a web page. Bookmarklets are usually JavaScript programs. Regardless of whether bookmarklet utilities are stored as bookmarks or hyperlinks, they add one-click functions to a browser or web page. When clicked, a bookmarklet performs one of a wide variety of operations, such as running a search query or extracting data from a table. For example, clicking on a bookmarklet after selecting text on a webpage could run an Internet search on the selected text and display a search engine results page.">`
viewof find = html`<input type="text" placeholder="Bookmarklet" value="Bookmarklet">`
viewof replace = html`<input type="text" placeholder="Pupsmarklet" value="Pupsmarklet">`
viewof modifiers = html`<input type="text" placeholder="gi" value="gi">`
findandreplace = function(f,r,s) {
var regex = new RegExp(f, modifiers); // greedy & case-insenstive
var result = s.replace(regex, r);
return result;
}
md `${ findandreplace(find, replace, teststring) }`
function htmlreplace(find,replace,element) {
if(typeof element === "undefined") { element = document.body; }
var regEx = new RegExp(find, 'gi');
var nodes = element.childNodes;
for(var n=0; n<nodes.length; n++) {
if(nodes[n].nodeType == Node.TEXT_NODE) {
nodes[n].textContent = nodes[n].textContent.replace(regEx, replace);
} else {
htmlreplace(find,replace,nodes[n]);
}
}
}
htmlreplace("Bookmarklet", "Pupsmarklet");
md`javascript:function htmlreplace(e,t,o){void 0===o&&(o=document.body);for(var l=new RegExp(e,"gi"),n=o.childNodes,r=0;r<n.length;r++)n[r].nodeType==Node.TEXT_NODE?n[r].textContent=n[r].textContent.replace(l,t):htmlreplace(e,t,n[r])}htmlreplace("${find}","${replace}")`
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
